/* Open campaign composition: fragrance bottles, soft light, and room for the headline. */
.hero.hero--open{height:clamp(460px,42vw,725px);min-height:0;background:#08101c}
.hero.hero--open>img{object-position:center;filter:none;opacity:1}
.hero.hero--open:hover>img{transform:none;filter:none}
.hero.hero--open .heroShade{right:auto;width:53%;background:linear-gradient(90deg,rgba(5,12,23,.58),rgba(5,12,23,.16) 78%,transparent);pointer-events:none}
.hero--open .heroText{left:6%;right:auto;max-width:45%;margin:0}
.hero--open h1{font-size:clamp(48px,5.15vw,84px);line-height:1.02;letter-spacing:-.045em;margin-bottom:26px}
.hero--open .heroText>p:not(.eyebrow){font-size:16px;line-height:1.7;max-width:380px;color:#e2ded5}
.hero--open .heroText .eyebrow{font-size:11px;color:#d6b879}
.hero--open .actions{gap:22px;flex-wrap:wrap}
.hero--open .button,.hero--open .textButton{font-size:11px}
.hero--open:before{display:none}
.hero.hero--open h1:has(.hero-title-line){font-size:clamp(40px,5.7vw,92px);line-height:1.02}
.hero-title-line{display:block;white-space:nowrap}
.hero.hero--open .hero-campaign-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;background:transparent;z-index:4;opacity:0;pointer-events:none;transition:opacity .7s ease}
.hero.hero--open .heroText,.hero.hero--open .heroShade{transition:opacity .55s ease}
.hero.hero--open.hero-film-playing .hero-campaign-film{opacity:1}
.hero.hero--open .heroText{z-index:6;opacity:1;pointer-events:auto}
.hero.hero--open .heroShade{z-index:5}
.hero.hero--open.hero-film-playing .heroShade{opacity:1;background:linear-gradient(90deg,rgba(5,12,23,.82),rgba(5,12,23,.45) 70%,transparent)}
.hero-film-watermark{position:absolute;right:24px;bottom:20px;z-index:7;pointer-events:none;font:500 11px/1.4 'DM Sans',sans-serif;letter-spacing:.2em;color:rgba(255,248,232,.65);text-shadow:0 1px 4px rgba(0,0,0,.7);opacity:0;transition:opacity .7s ease}
.hero-film-playing .hero-film-watermark{opacity:1}
@media(max-width:700px){
 .hero.hero--open{height:auto;display:flex;flex-direction:column;overflow:hidden}
 .hero--open>img{height:370px;width:100%;object-fit:cover;object-position:right center}
 .hero--open .heroShade{display:none}
 .hero--open .heroText{position:relative;inset:auto;transform:none;max-width:none;margin:0;padding:34px 26px 44px}
 .hero--open h1{font-size:clamp(40px,10.8vw,66px);max-width:none;margin-bottom:22px}
 .hero.hero--open h1:has(.hero-title-line){font-size:clamp(32px,9.8vw,64px)}
 .hero--open .heroText .eyebrow{margin-bottom:18px}
 .hero--open .actions{margin-top:26px;gap:20px}
 .hero.hero--open .hero-campaign-film{height:auto;aspect-ratio:1024/548}
 .hero.hero--open.hero-film-playing .heroText{opacity:1;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){.hero.hero--open .hero-campaign-film,.hero.hero--open .heroText,.hero.hero--open .heroShade{transition:none}}

/* A shorter desktop campaign keeps the complete product framing visible. */
@media(min-width:701px){
 .hero.hero--open>img{object-fit:contain;object-position:right center}
 #home>.intro{padding-top:clamp(64px,7vw,100px);padding-bottom:clamp(48px,5vw,72px)}
 #home>.intro h2{font-size:clamp(57.2px,7.15vw,97.5px);line-height:1.05;margin-bottom:22px}
}

/* Extend the moving scene behind the full, uncropped film instead of letterboxing. */
.hero.hero--open .hero-campaign-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform:scale(1.1);filter:blur(24px) brightness(.8);z-index:3;opacity:0;pointer-events:none;transition:opacity .7s ease}
.hero.hero--open.hero-film-playing .hero-campaign-backdrop{opacity:1}
@media(prefers-reduced-motion:reduce){.hero.hero--open .hero-campaign-backdrop{transition:none}}
