.cinematic-intro{position:relative;min-height:calc(100svh - 78px);overflow:hidden;display:flex;align-items:center;color:#fff;background:#9f4f5f;isolation:isolate}
.cinematic-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-4;animation:cinematicZoom 16s ease-out both}
.cinematic-shade{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,rgba(50,12,29,.76) 0%,rgba(65,17,36,.52) 35%,rgba(65,17,36,.08) 68%,rgba(38,12,23,.18) 100%)}
.cinematic-shade:after{content:"";position:absolute;inset:auto 0 0;height:32%;background:linear-gradient(transparent,rgba(38,12,23,.4))}
.cinematic-content{width:min(1220px,100%);margin:auto;padding:64px 22px 108px;animation:introReveal 1.15s .15s cubic-bezier(.2,.75,.25,1) both}
.cinematic-logo{width:86px;height:86px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.72);box-shadow:0 16px 38px rgba(34,8,19,.28);animation:logoFloat 5s ease-in-out 1.2s infinite}
.cinematic-kicker{margin:24px 0 12px;font-size:.78rem;font-weight:900;letter-spacing:.2em;text-transform:uppercase;color:#ffe4ed}
.cinematic-content h1{max-width:720px;margin:0;font:700 clamp(3.25rem,7vw,6.8rem)/.9 Georgia,serif;letter-spacing:-.055em;text-wrap:balance;text-shadow:0 8px 35px rgba(45,10,25,.28)}
.cinematic-text{max-width:520px;margin:24px 0 30px;font-size:1.08rem;line-height:1.7;color:rgba(255,255,255,.88)}
.cinematic-actions{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.cinematic-primary{background:#fff;color:var(--wine);box-shadow:0 12px 30px rgba(40,9,22,.2);transition:transform .25s,box-shadow .25s}
.cinematic-primary:hover{transform:translateY(-3px);box-shadow:0 17px 36px rgba(40,9,22,.28)}
.cinematic-link{font-weight:800;border-bottom:1px solid rgba(255,255,255,.6);padding:10px 0}
.cinematic-link span{display:inline-block;margin-left:7px;animation:arrowDrop 1.8s ease-in-out infinite}
.scroll-cue{position:absolute;left:50%;bottom:25px;transform:translateX(-50%);display:grid;place-items:center;gap:7px;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.78);white-space:nowrap}
.scroll-cue span{width:1px;height:30px;background:linear-gradient(#fff,transparent);animation:scrollPulse 1.8s ease-in-out infinite}
.cinematic-mist{position:absolute;z-index:-2;width:44vw;height:44vw;border-radius:50%;filter:blur(55px);opacity:.16;pointer-events:none;background:#fff}
.mist-one{left:-20vw;top:-22vw;animation:mistDrift 10s ease-in-out infinite alternate}
.mist-two{right:20%;bottom:-35vw;animation:mistDrift 13s 1s ease-in-out infinite alternate-reverse}
.hero{animation:sectionRise .8s ease both;animation-timeline:view();animation-range:entry 5% cover 32%}
.product-card{transition:transform .3s ease,box-shadow .3s ease}
.product-card:hover{transform:translateY(-7px);box-shadow:0 24px 58px rgba(75,25,47,.18)}
@keyframes cinematicZoom{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes introReveal{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes arrowDrop{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
@keyframes scrollPulse{0%,100%{opacity:.35;transform:scaleY(.65);transform-origin:top}50%{opacity:1;transform:scaleY(1)}}
@keyframes mistDrift{from{transform:translate3d(0,0,0) scale(.9)}to{transform:translate3d(8vw,5vw,0) scale(1.15)}}
@keyframes sectionRise{from{opacity:.35;transform:translateY(40px)}to{opacity:1;transform:none}}
@media(max-width:760px){.cinematic-intro{min-height:calc(100svh - 78px);align-items:end}.cinematic-backdrop{object-position:64% center}.cinematic-shade{background:linear-gradient(0deg,rgba(43,11,25,.92) 0%,rgba(52,14,30,.67) 48%,rgba(52,14,30,.08) 100%)}.cinematic-content{padding:190px 20px 100px}.cinematic-logo{width:68px;height:68px}.cinematic-content h1{font-size:clamp(3rem,14vw,4.7rem)}.cinematic-text{font-size:1rem;margin:18px 0 24px}.scroll-cue{display:none}}
@media(prefers-reduced-motion:reduce){.cinematic-backdrop,.cinematic-content,.cinematic-logo,.cinematic-link span,.scroll-cue span,.cinematic-mist,.hero{animation:none!important}.product-card,.cinematic-primary{transition:none}}
