/* ══════════════════════════════════════════════
   MOTION v9 — Quiet entrance, no bounce
══════════════════════════════════════════════ */

[data-reveal] {
  opacity: 0;
  transform: translateY(14px);
  transition:
    opacity var(--dur-xl) var(--ease-out),
    transform var(--dur-xl) var(--ease-out);
}

[data-reveal="scale"] {
  opacity: 0;
  transform: translateY(10px);
}

[data-reveal].in-view {
  opacity: 1;
  transform: none;
}

/* Native-scroll immersion. User owns the wheel. */
html.has-scroll-stage {
  --scroll: 0;
  --vel: 0;
}

.has-scroll-stage [data-reveal] {
  opacity: 0;
  transform: translate3d(0, 32px, 0) scale(0.988);
  transition:
    opacity 0.95s var(--ease-out),
    transform 0.95s var(--ease-out);
}

.has-scroll-stage [data-reveal="scale"] {
  transform: translate3d(0, 18px, 0) scale(1.03);
}

.has-scroll-stage [data-reveal].in-view {
  opacity: 1;
  transform: none;
}

.has-scroll-stage [data-reveal] .essay-copy > p,
.has-scroll-stage [data-reveal] .essay-copy > ul {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition:
    opacity 0.85s var(--ease-out),
    transform 0.85s var(--ease-out);
  transition-delay: var(--st, 0ms);
}

.has-scroll-stage [data-reveal].in-view .essay-copy > p,
.has-scroll-stage [data-reveal].in-view .essay-copy > ul {
  opacity: 1;
  transform: none;
}

.has-scroll-stage .hero__content,
.has-scroll-stage .essay-hero .container {
  transform: translate3d(0, calc(var(--out, 0) * 26px), 0);
  opacity: calc(1 - var(--out, 0) * 0.24);
  will-change: transform, opacity;
}

.has-scroll-stage .essay-h1,
.has-scroll-stage .essay-lead,
.has-scroll-stage .section-label,
.has-scroll-stage .essay-kicker,
.has-scroll-stage .faq-chapter__idx,
.has-scroll-stage .giant-h2:not(.contact__h2) {
  transform: translate3d(0, var(--shift, 0px), 0);
}

.has-scroll-stage .photo-frame img,
.has-scroll-stage .uiux-live img,
.has-scroll-stage .seo-live img,
.has-scroll-stage .work-shot img {
  transform: scale(1.07) translate3d(0, var(--img-y, 0px), 0);
  will-change: transform;
}

.has-scroll-stage .pin img,
.has-scroll-stage .pin-hero img {
  transform: none;
  will-change: auto;
}

.has-scroll-stage body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background: radial-gradient(
    ellipse 90% 60% at 50% calc(28% + (var(--scroll) * 36%)),
    rgba(20, 20, 19, 0.028),
    transparent 72%
  );
}

@media (pointer: coarse) {
  .has-scroll-stage [data-reveal] {
    transform: translate3d(0, 18px, 0);
  }
  .has-scroll-stage .hero__content,
  .has-scroll-stage .essay-hero .container {
    transform: none;
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .has-scroll-stage [data-reveal],
  .has-scroll-stage [data-reveal="scale"],
  .has-scroll-stage [data-reveal] .essay-copy > p,
  .has-scroll-stage [data-reveal] .essay-copy > ul {
    opacity: 1;
    transform: none;
    transition: none;
    filter: none;
  }
  .has-scroll-stage .hero__content,
  .has-scroll-stage .essay-hero .container {
    transform: none;
    opacity: 1;
  }
  .has-scroll-stage .essay-h1,
  .has-scroll-stage .essay-lead,
  .has-scroll-stage .section-label,
  .has-scroll-stage .essay-kicker,
  .has-scroll-stage .giant-h2:not(.contact__h2) {
    transform: none;
  }
  .has-scroll-stage .photo-frame img,
  .has-scroll-stage .uiux-live img,
  .has-scroll-stage .seo-live img,
  .has-scroll-stage .pin img,
  .has-scroll-stage .work-shot img {
    transform: none;
  }
  .has-scroll-stage body::after {
    display: none;
  }
}

@media (max-width: 1100px) {
  .reviews__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 900px) {
  .about__layout { grid-template-columns: 1fr; }
  .about__content { text-align: left; }
  .about__lead, .about__body { text-align: left; }
  .photo-wrap { max-width: 280px; }
  .dev-grid { grid-template-columns: 1fr; }
  .dev-card { border-right: 0; border-bottom: 1px solid var(--light-border); }
  .dev-card:last-child { border-bottom: 0; }
  .dev-card__header,
  .dev-card:last-child .dev-card__header { padding: var(--sp-6) 0 var(--sp-4); }
  .dev-card__body,
  .dev-card:last-child .dev-card__body { padding: 0 0 var(--sp-6); }
  .seo-bottom { grid-template-columns: 1fr; }
  .uiux-step {
    grid-template-columns: 2.4rem 1fr;
  }
  .uiux-step__kpi {
    grid-column: 2;
    align-items: flex-start;
    text-align: left;
  }
}

@media (max-width: 768px) {
  .nav__links { display: none; }
  .nav__cta { display: none; }
  .nav__burger { display: flex; }
  .reviews__grid { grid-template-columns: 1fr; }
  .hero__stats {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sp-4);
    width: 100%;
  }
  .seo-metrics { grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
  .seo-metric:not(:last-child) {
    border-right: 0;
    margin-right: 0;
    padding-right: 0;
  }
  .footer__inner { flex-direction: column; }
  .footer__bottom { flex-direction: column; }
  .seo-weeks { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  :root { --page-x: 1.25rem; }
  .hero { padding-bottom: 4.5rem; }
  .hero__ctas { flex-direction: column; align-items: stretch; width: 100%; }
  .hero__ctas .btn-black,
  .hero__ctas .btn-outline { width: 100%; justify-content: center; }
  .seo-weeks { grid-template-columns: 1fr; }
  .scroll-ind { display: none; }
}

html.has-lenis { scroll-behavior: auto; }

html.lenis, html.lenis body { height: auto; }

.lenis.lenis-smooth { scroll-behavior: auto !important; }

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped { overflow: hidden; }
