@media (max-width: 900px) {
  :root { --section-space: 40px; }
  .nav__links { display: none; }
  .nav__actions > a:first-child { display: none; }
  .menu { display: block; }
  .nav__links.open { position: fixed; top: 72px; right: 0; left: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 26px max(var(--page-gutter), calc((100vw - 1140px) / 2)); background: rgba(255, 255, 255, .98); box-shadow: 0 18px 30px #0002; animation: mobile-nav-enter .35s cubic-bezier(.16, 1, .3, 1) both; }
  .hero { min-height: 800px; padding-top: 40px; }
  .hero__visual { transform: translateX(-50%) scale(.78); transform-origin: bottom; }
  .hero__bg-shape { width: 560px; }
  .hero__bg-mark { left: calc(50% - 370px); width: 150px; }
  .decision-grid, .diagnostic__grid, .why__grid, .section-head, .research > .wrap, .step, .faq__wrap { grid-template-columns: 1fr; }
  .decision-grid { gap: 16px; }
  .trust { padding: calc(40px + var(--skyline-height)) 0 40px; }
  .decisions { padding: 40px 0 calc(40px + var(--skyline-height)); }
  .diagnostic { padding: 60px 0 40px; }
  .diagnostic__intro { margin-top: 20px; }
  .why { padding: 40px 0 calc(40px + var(--skyline-height)); }
  .what { padding: calc(40px + var(--skyline-height)) 0 40px; }
  .why__grid { gap: 38px; }
  .founder { height: 500px; }
  .section-head, .research > .wrap { gap: 24px; }
  .research { padding-block: 40px; }
  .research h2 { font-size: clamp(38px, 7vw, 48px); }
  .research__intro { max-width: 620px; }
  .steps { padding-bottom: 0; }
  .step { position: relative; top: auto !important; min-height: 0; }
  .step__art { height: min(550px, 72vw); }
  .research .cards { grid-column: auto; grid-template-columns: 1fr; gap: 16px; }
  .gallery-strip { padding: 40px 0 calc(40px + var(--skyline-height)); }
  .proof { padding: calc(40px + var(--skyline-height)) 0 40px; }
  .testimonial-grid { grid-template-columns: 1fr; }
  .faq { padding: 40px 0 calc(40px + var(--skyline-tall-height)); }
  .cta { padding: calc(40px + var(--skyline-tall-height)) 0 40px; }
  .faq__wrap { gap: 40px; }
  .faq__heading { position: static; }
  .decisions h2, .diagnostic h2, .maturity h3, .why h2, .section-head h2, .step h3, .research h2, .proof h2, .faq h2, .cta h2 { font-size: 42px; line-height: 1.12; letter-spacing: -.025em; }
  footer { padding: 40px 0; }
  .footer__top, .credits { align-items: flex-start; flex-direction: column; gap: 30px; }
  .credits { margin-top: 40px; }
  .proof h2{ margin-bottom: 20px; }
  .testimonial-column { gap: 16px; }
}

@media (max-width: 600px) {
  :root { --page-gutter: 16px; --section-space: 40px; }
  .nav__actions > .button { display: none; }
  /* Enough room for stacked CTAs while keeping the collage visually connected. */
  .hero { min-height: 800px; padding-top: 40px; }
  .hero h1 br { display: none; }
  .hero__lede { font-size: 16px; }
  .hero .actions { flex-direction: column; height: auto; margin-top: 26px; }
  /* Reframe the desktop collage so its two data cards and portrait fit at 320px. */
  .hero__visual { bottom: 0; width: 600px; transform: translateX(-50%) scale(.56); }
  .hero__person { left: 58%; }
  .hero__bg-shape { width: 80vw; }
  .hero__bg-pattern, .hero__bg-mark { display: none; }
  /* Keep the upper portrait clear; anchor the supporting panels below her face. */
  .role-card { top: 240px; left: 24px; }
  .adoption { top: 230px; right: 28px; }
  .logos { justify-content: flex-start; }
  .logos img { height: 34px; max-width: 155px; }
  .logos img.company-logo--medium { height: 46px; }
  .logos img.company-logo--tall { height: 56px; }
  .decision-grid { margin-top: 24px; }
  .decision-grid article { display: grid; grid-template-columns: 54px 1fr; align-items: start; gap: 16px; min-height: 0; padding: 20px; border-radius: 16px; }
  .decision-grid b { width: 54px; margin-bottom: 0; font-size: 34px; line-height: 1; }
  .decision-grid p { font-size: 16px; line-height: 1.45; }
  .diagnostic h2 { font-size: 38px; }
  .maturity { min-height: 0; padding: 24px; border-radius: 24px; }
  .maturity > #maturity-copy { position: static; margin-top: 22px; font-size: 16px; line-height: 1.55; }
  .maturity__link { right: 24px; left: 24px; }
  .why h2 { font-size: 26px; line-height: 1.33; }
  .founder { justify-self: center; max-width: 100%; }
  .founder img { max-width: 100%; object-fit: contain; }
  .research .cards { gap: 12px; }
  .paper { min-height: 0; padding: 20px; }
  .paper__art { width: min(76%, 150px); height: 150px; flex-basis: 150px; margin-bottom: 20px; }
  .paper h3 { font-size: 18px; line-height: 1.4; }
  .paper p { font-size: 16px; line-height: 1.45; }
  .faq__mark { width: 190px; height: auto; margin-bottom: 18px; }
  .faq h2 { font-size: 38px; line-height: 1.12; }
  .accordion summary { min-height: 76px; font-size: 17px; line-height: 1.35; }
  .steps { margin-top: 20px; }
  .step { gap: 32px; padding: 22px; }
  .step h3 { font-size: 34px; }
  .step .actions { align-items: flex-start; flex-direction: column; margin-top: 0; padding-top: 36px; }
  .step__art { width: 100%; height: auto; max-height: none; padding: 24px; justify-self: stretch; border-radius: 24px; }
  .step__art img { max-width: min(100%, 280px); max-height: none; }
  .score { position: relative; top: auto; left: auto; width: 220px; height: 220px; margin: 28px auto 0; transform: none; }
  .score b { width: 132px; height: 132px; font-size: 50px; }
  .score small { font-size: 25px; }
  .trust > p, .gallery-strip h2 { padding-inline: var(--page-gutter); font-size: 17px; }
  .gallery-photo { height: 160px; }
  .gallery-photo--square { width: 160px; }
  .gallery-photo--wide { width: 264px; }
  .gallery-photo--middle { width: 241px; }
  .gallery-photo--presentation { width: 248px; }
  .decisions h2, .diagnostic h2, .maturity h3, .why h2, .section-head h2, .step h3, .research h2, .proof h2, .faq h2, .cta h2 { font-size: 34px; line-height: 1.12; }
  .footer__top nav, .credits nav { flex-wrap: wrap; gap: 18px; }
}

@media (max-width: 375px) {
  /* 320px needs one extra row of breathing room before the portrait begins. */
  .hero { min-height: 900px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .gallery-strip__track { animation-play-state: paused; }
  .logos__track { animation-play-state: paused; }
  .paper, .paper__art, .paper__link i { transition: none; }
  .nav, .nav__links.open, footer.is-visible .logo--white img { animation: none; }
  footer .footer__top, footer .credits { opacity: 1; transform: none; transition: none; }
}

@keyframes mobile-nav-enter { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
