/* Owner-selected Spotlight / centred real Supreme Whey / original Doorman photograph.
   Isolated homepage rules; Sora, acid lime, photographic shading and local GSAP. */
.spotlight-hero{--spotlight-ink:#131209;--spotlight-paper:#fffbee;--spotlight-lime:#e1ff20;position:relative;isolation:isolate;overflow:hidden;height:100svh;min-height:calc(var(--header) + 720px);background:#181818;color:var(--spotlight-paper);font-family:var(--sans);margin:0;padding:0}
.spotlight-backdrop{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}.spotlight-photo{width:100%;height:100%;max-width:none;object-fit:cover;object-position:center 53%;transform:scale(1.035);filter:brightness(.9) contrast(1.12) saturate(1.5)}.spotlight-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,5,.88) 0%,rgba(8,9,5,.38) 47%,rgba(8,9,5,.86) 100%),linear-gradient(90deg,rgba(8,9,5,.85),rgba(8,9,5,.15) 40%,rgba(8,9,5,.15) 60%,rgba(8,9,5,.85))}.spotlight-stage{position:absolute;top:var(--header);bottom:0;left:0;right:0;width:min(1440px,100%);margin-inline:auto}
.spotlight-copy{position:relative;z-index:3;text-align:center;padding:40px 24px 0}.spotlight-eyebrow{font-size:12px;font-weight:600;line-height:16px;letter-spacing:.1em;text-transform:uppercase;color:var(--spotlight-lime);margin:0 0 16px}.spotlight-copy h1{font-family:var(--sans);font-size:60px;font-weight:700;line-height:1;letter-spacing:-.04em;max-width:none;margin:0;text-wrap:balance}.spotlight-copy h1 span{color:var(--spotlight-lime)}.spotlight-subtitle{font-size:16px;line-height:24px;letter-spacing:0;margin:16px 0 0;text-wrap:pretty}
.spotlight-scene{position:absolute;width:440px;height:440px;left:calc(50% - 220px);top:208px;transform:rotate(-3deg);z-index:2}.spotlight-depth{position:absolute;inset:0;z-index:3}.spotlight-pouch{width:100%;height:100%;object-fit:contain;filter:drop-shadow(16px 32px 24px #0008)}.spotlight-shadow{position:absolute;bottom:0;left:22%;width:60%;height:8%;border-radius:50%;filter:blur(16px);background:#000;opacity:.55}.spotlight-ingredient{position:absolute;width:104px;height:160px;object-fit:contain;right:-16px;bottom:-4px;z-index:4;transform:rotate(18deg)}.spotlight-sheen{position:absolute;inset:0;mask:url('../assets/images/dnc-whey-1kg-new-pic-Photoroom.webp') center/contain no-repeat;-webkit-mask:url('../assets/images/dnc-whey-1kg-new-pic-Photoroom.webp') center/contain no-repeat;overflow:hidden;pointer-events:none}.spotlight-shine{position:absolute;top:-50%;bottom:-50%;width:24%;left:-50%;background:white;transform:rotate(25deg);opacity:0}.spotlight-lettering{position:absolute;top:256px;left:50%;transform:translateX(-50%);font-size:128px;font-weight:700;line-height:1;letter-spacing:.08em;color:transparent;-webkit-text-stroke:1px rgba(225,255,32,.38);z-index:1;pointer-events:none;user-select:none}
.spotlight-facts{position:absolute;top:336px;left:64px;z-index:3;display:flex;flex-direction:column;gap:32px}.spotlight-facts p{font-size:12px;line-height:20px;letter-spacing:0;margin:0}.spotlight-facts strong{display:block;font-size:60px;font-weight:600;line-height:1;letter-spacing:-.04em;color:var(--spotlight-lime);margin:0 0 8px}.spotlight-facts span{display:block}.spotlight-purchase{position:absolute;right:64px;top:376px;z-index:3;max-width:288px}.spotlight-product-label{font-size:12px;line-height:24px;letter-spacing:0;text-transform:uppercase;color:#d7dac2;margin:0}.spotlight-product-label strong{font-size:16px;font-weight:500;text-transform:none;color:var(--spotlight-paper)}
.spotlight-cta{display:flex;align-items:center;justify-content:space-between;gap:32px;width:max-content;max-width:100%;padding:12px 24px;min-height:52px;margin:24px 0 0;background:var(--spotlight-lime);color:var(--spotlight-ink);border-radius:8px;font-size:16px;font-weight:600;line-height:24px;letter-spacing:0;transition:transform 160ms cubic-bezier(.23,1,.32,1),background-color 180ms cubic-bezier(.23,1,.32,1)}.spotlight-cta span{font-size:24px;line-height:24px}.spotlight-cta:focus-visible{outline:3px solid var(--spotlight-paper);outline-offset:4px}.spotlight-cta:active{transform:scale(.97)}.spotlight-bottom-line{position:absolute;bottom:0;left:64px;right:64px;min-height:64px;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:12px;line-height:20px;letter-spacing:.08em;text-transform:uppercase;color:#d6dac1;z-index:3}
@media(hover:hover) and (pointer:fine){.spotlight-cta:hover{transform:translateY(-2px);background:#edff74}}
@media(min-width:1500px){.spotlight-hero{min-height:calc(var(--header) + 792px)}.spotlight-copy{padding-top:48px}.spotlight-copy h1{font-size:72px}.spotlight-scene{width:480px;height:480px;left:calc(50% - 240px);top:216px}.spotlight-facts{left:96px}.spotlight-purchase{right:96px}}
@media(max-width:1100px) and (min-width:701px){.spotlight-copy h1{font-size:48px}.spotlight-scene{width:360px;height:360px;left:calc(50% - 180px);top:248px}.spotlight-facts{left:32px;top:328px}.spotlight-facts strong{font-size:48px}.spotlight-purchase{right:32px;max-width:220px}.spotlight-cta{padding:12px 16px;gap:16px;font-size:14px}.spotlight-lettering{font-size:96px}.spotlight-bottom-line{left:32px;right:32px}}
@media(max-width:700px){.spotlight-hero{min-height:calc(var(--header) + 800px)}.spotlight-copy{padding:40px 24px 0}.spotlight-copy h1{font-size:36px;max-width:342px;margin-inline:auto}.spotlight-eyebrow{font-size:10px;line-height:16px;letter-spacing:.04em;margin-bottom:16px;max-width:320px;margin-inline:auto;text-wrap:balance}.spotlight-subtitle{font-size:14px;line-height:24px;max-width:240px;margin:16px auto 0}.spotlight-scene{width:320px;height:320px;left:calc(50% - 160px);top:320px}.spotlight-ingredient{width:96px;height:144px;right:-8px;bottom:0}.spotlight-photo{object-position:60% 50%;filter:brightness(.8) contrast(1.15) saturate(1.5)}.spotlight-shade{background:linear-gradient(180deg,rgba(8,9,5,.94),rgba(8,9,5,.85) 31%,rgba(8,9,5,.3) 54%,rgba(8,9,5,.50) 79%,rgba(8,9,5,.97))}.spotlight-lettering{top:372px;font-size:72px;letter-spacing:.04em}.spotlight-purchase{top:216px;left:24px;right:24px;max-width:none;display:flex;justify-content:center}.spotlight-product-label{display:none}.spotlight-cta{margin-top:0;font-size:14px;min-height:48px;padding:8px 16px;gap:24px}.spotlight-facts{top:672px;left:24px;right:24px;flex-direction:row;justify-content:space-between;gap:24px}.spotlight-facts strong{font-size:30px;line-height:36px;margin-bottom:0}.spotlight-facts p{font-size:12px;line-height:20px}.spotlight-bottom-line{left:24px;right:24px;min-height:40px;font-size:10px;line-height:16px;letter-spacing:0}.spotlight-bottom-line>span:last-child{display:none}}
@media(max-width:360px){.spotlight-hero{min-height:calc(var(--header) + 760px)}.spotlight-copy h1{font-size:30px}.spotlight-copy{padding-inline:16px}.spotlight-eyebrow{font-size:10px;max-width:272px}.spotlight-scene{width:284px;height:284px;left:calc(50% - 142px);top:312px}.spotlight-facts{top:636px;left:16px;right:16px}.spotlight-bottom-line{left:16px;right:16px}}
@media(prefers-reduced-motion:reduce){.spotlight-cta{transition:none}.spotlight-cta:active{transform:none}.spotlight-depth{transform:none!important}.spotlight-shine{opacity:0!important}}
/* Keep the existing support widget and shop action clear of the product at narrow tablet widths. */
@media(min-width:641px) and (max-width:700px){.spotlight-facts{right:104px}}
@media(min-width:701px) and (max-width:850px){.spotlight-scene{width:320px;height:320px;left:calc(50% - 160px)}.spotlight-ingredient{width:80px;height:128px;left:-8px;right:auto}}

/* Fill the visible viewport; retain a safe content floor on short screens. */
@media(min-width:701px){
  .spotlight-hero{--spotlight-pack-size:440px}
  .spotlight-scene{top:calc(50% - var(--spotlight-pack-size) / 2 + 64px)}
  .spotlight-lettering{top:calc(50% - var(--spotlight-pack-size) / 2 + 112px)}
  .spotlight-facts{top:calc(50% - 24px)}
  .spotlight-purchase{top:calc(50% + 16px)}
}
@media(min-width:1500px){.spotlight-hero{--spotlight-pack-size:480px}}
@media(min-width:851px) and (max-width:1100px){.spotlight-hero{--spotlight-pack-size:360px}}
@media(min-width:701px) and (max-width:850px){.spotlight-hero{--spotlight-pack-size:320px}}
/* Full-height hero shares the viewport edge with the existing fixed support control. */
@media(min-width:701px){.spotlight-bottom-line{right:104px}}

/* Start at first paint. Late JavaScript must never rewind visible content. */
@media(prefers-reduced-motion:no-preference){
  .spotlight-backdrop{animation:spotlight-backdrop-arrive 1800ms cubic-bezier(.22,1,.36,1) both}
  .spotlight-pouch{animation:spotlight-pouch-arrive 1300ms cubic-bezier(.22,1,.36,1) 100ms backwards}
  .spotlight-ingredient{animation:spotlight-ingredient-arrive 800ms cubic-bezier(.22,1,.36,1) 400ms backwards}
  .spotlight-arrival{animation:spotlight-copy-arrive 700ms cubic-bezier(.22,1,.36,1) 20ms backwards}
  #spotlight-title{animation-delay:80ms}
  .spotlight-subtitle{animation-delay:140ms}
  .spotlight-facts{animation-delay:200ms}
  .spotlight-product-label{animation-delay:260ms}
  .spotlight-cta{animation-delay:320ms}
}
@keyframes spotlight-backdrop-arrive{from{transform:scale(1.053)}to{transform:scale(1)}}
@keyframes spotlight-pouch-arrive{from{transform:translateY(56px) rotate(10deg) scale(.92)}to{transform:none}}
@keyframes spotlight-ingredient-arrive{from{transform:translateY(24px) rotate(18deg);opacity:.2}to{transform:rotate(18deg);opacity:1}}
@keyframes spotlight-copy-arrive{from{transform:translateY(20px);opacity:.2}to{transform:none;opacity:1}}
