/* ============================================================ ANIMATIONS */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}
.reveal[data-d="4"]{transition-delay:.32s}
.stagger>*{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.stagger.in>*{opacity:1;transform:none}
.stagger.in>*:nth-child(1){transition-delay:.05s}
.stagger.in>*:nth-child(2){transition-delay:.12s}
.stagger.in>*:nth-child(3){transition-delay:.19s}
.stagger.in>*:nth-child(4){transition-delay:.26s}
.stagger.in>*:nth-child(5){transition-delay:.33s}
.stagger.in>*:nth-child(6){transition-delay:.40s}

@keyframes pulse{0%{box-shadow:0 0 0 0 var(--signal-glow)}70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
@keyframes floatDown{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(6px);opacity:1}}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .reveal,.stagger>*{opacity:1;transform:none}
}

/* ============================================================ RESPONSIVE */
@media (max-width:980px){
  .metrics{grid-template-columns:repeat(2,1fr)}
  .quotes{grid-template-columns:1fr}
  .about__grid{grid-template-columns:1fr;gap:2rem}
  .about__photo{max-width:340px}
  .foot__grid{grid-template-columns:1fr 1fr}
  .case-block{grid-template-columns:1fr;gap:.8rem}
  .case-impact .metrics{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:860px){
  .nav__links{display:none}
  .nav__toggle{display:flex}
  .nav.open .nav__links{display:flex;flex-direction:column;gap:1.2rem;position:absolute;top:100%;left:0;right:0;
    background:var(--obsidian-2);border-bottom:1px solid var(--line);padding:1.4rem var(--gutter)}
  .nav.open .nav__toggle span:first-child{transform:translateY(4px) rotate(45deg)}
  .nav.open .nav__toggle span:last-child{transform:translateY(-4px) rotate(-45deg)}
  .nav__name{display:none}
  .work-grid{grid-template-columns:1fr}
  .shots{grid-template-columns:1fr}
  .sticky-cta{display:block}
  body{padding-bottom:64px}
}
@media (max-width:560px){
  .metrics,.case-impact .metrics{grid-template-columns:1fr 1fr}
  .foot__grid{grid-template-columns:1fr}
  .hero__cta{flex-direction:column;align-items:stretch}
  .hero__cta .btn{justify-content:center}
  .case-hero__meta{gap:1rem}
  .nav__right .status{display:none}
}