/* The film is the opening screen; the shop follows in normal scroll flow. */
.hero-takeover{position:relative;width:100%;height:100vh;height:100svh;min-height:480px;overflow:hidden;isolation:isolate;background:#08271e url('/assets/film-poster-branded-wide.webp') center/cover no-repeat;color:#fff9eb}
.hero-film{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;pointer-events:none}
.hero-film-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(3,21,14,.68),transparent 25%,transparent 57%,rgba(3,21,14,.78))}
.hero-film-copy{position:absolute;left:max(48px,env(safe-area-inset-left));bottom:max(62px,env(safe-area-inset-bottom));max-width:440px;text-shadow:0 2px 24px #08271e80}
.hero-film-eyebrow{display:block;font-size:9px;line-height:1.5;letter-spacing:.19em;margin-bottom:14px}
.hero-film-copy h1{font-size:clamp(35px,4.4vw,64px);line-height:1.05;letter-spacing:-.035em;margin:0}
.hero-film-copy h1 em{color:#f5dba6}
.hero-scroll{position:absolute;right:max(48px,env(safe-area-inset-right));bottom:max(62px,env(safe-area-inset-bottom));display:flex;align-items:center;gap:19px;min-height:48px;font-size:11px;letter-spacing:.055em;text-shadow:0 1px 12px #08271e}
.hero-scroll-arrow{display:grid;place-items:center;width:44px;height:44px;border:1px solid #fff9eb80;border-radius:50%;font-size:22px;transition:transform .2s}
.hero-scroll:hover .hero-scroll-arrow{transform:translateY(4px)}
.takeover-nav{position:fixed;inset:0 0 auto;width:100%;transition:background .25s,color .25s,border-color .25s}
.takeover-nav.over-film{background:transparent;border-color:#fff9eb26;backdrop-filter:none;color:#fff9eb}
.takeover-nav.over-film .brand-lockup{filter:brightness(0) invert(1)}
.takeover-nav.over-film .nav-order{border-color:#fff9eb80;color:#fff9eb;background:#08271e22}
.takeover-nav.over-film .bag-count{background:#fff9eb;color:#103f2b}
.takeover-nav.over-film .nav-links>a:after{background:#fff9eb}
.hero-film::-webkit-media-controls,.hero-film::-webkit-media-controls-enclosure,.hero-film::-webkit-media-controls-start-playback-button{display:none!important}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-aspect-ratio:1/1){
  .hero-takeover{background-image:url('/assets/film-poster-branded-portrait.webp')}
  .hero-film-copy{left:24px;right:24px;bottom:110px;max-width:none;text-align:center}
  .hero-film-copy h1{font-size:clamp(29px,6vw,44px)}
  .hero-film-eyebrow{font-size:8px;margin-bottom:10px}
  .hero-scroll{left:0;right:0;bottom:max(26px,env(safe-area-inset-bottom));justify-content:center;gap:13px;font-size:10px}
  .hero-scroll-arrow{width:36px;height:36px;font-size:20px}
}
@media(max-width:760px) and (min-aspect-ratio:1/1){
  .hero-takeover{min-height:360px}
  .hero-film-copy{left:24px;bottom:30px}
  .hero-film-copy h1{font-size:32px}
  .hero-film-eyebrow{font-size:7px;margin-bottom:8px}
  .hero-scroll{right:24px;bottom:30px;font-size:10px}
}
