html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
::selection{background:#B11226;color:#F6F3EE}

/* Hero entrance */
.hero-fade{opacity:0;transform:translateY(20px);animation:heroIn .8s cubic-bezier(.16,1,.3,1) forwards}
.hero-d1{animation-delay:.12s}.hero-d2{animation-delay:.26s}.hero-d3{animation-delay:.4s}
@keyframes heroIn{to{opacity:1;transform:none}}

/* Nav base + scrolled state */
#nav{background:rgba(26,22,19,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(246,243,238,.08);transition:box-shadow .3s}
.nav-scrolled{box-shadow:0 10px 30px -18px rgba(26,22,19,.7)}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal.visible{opacity:1;transform:none}
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}.reveal-d4{transition-delay:.4s}

/* FAQ accordion */
.faq-answer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s cubic-bezier(.16,1,.3,1)}
.faq-item.active .faq-answer{grid-template-rows:1fr}
.faq-answer>div{overflow:hidden}
.faq-icon{transition:transform .3s cubic-bezier(.16,1,.3,1)}
.faq-item.active .faq-icon{transform:rotate(45deg)}

@media(prefers-reduced-motion:reduce){
.hero-fade,.reveal{animation:none!important;opacity:1!important;transform:none!important;transition:none!important}
.faq-answer,.faq-icon{transition:none}
html{scroll-behavior:auto}
}