@media (max-width: 1180px) {
  :root { --page-pad: clamp(25px, 4vw, 48px); }
  .hero { grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: 36px; }
  .hero h1 { font-size: clamp(4.5rem, 8vw, 6.75rem); }
  .hero__foot { grid-template-columns: 1fr; gap: 17px; }
  .hero__foot > p { max-width: 380px; }
  .hero-study { margin-top: 180px; }
  .project { gap: 48px; }
  .project__copy h3 { font-size: clamp(35px, 4.2vw, 50px); }
}

@media (max-width: 900px) {
  .site-header { grid-template-columns: 1fr auto; }
  .desktop-nav, .site-header > .nav-cta { display: none; }
  .mobile-nav { position: static; display: block; justify-self: end; }
  .menu-toggle { position: relative; z-index: 62; display: flex; width: 48px; height: 48px; align-items: center; justify-content: center; margin: -3px -10px -3px 0; list-style: none; cursor: pointer; }
  .menu-toggle::-webkit-details-marker { display: none; }
  .menu-toggle::marker { display: none; content: ""; }
  .menu-toggle__close { display: none; }
  .mobile-nav[open] .menu-toggle__open { display: none; }
  .mobile-nav[open] .menu-toggle__close { display: block; }
  .mobile-menu { position: fixed; z-index: 61; inset: 0; display: flex; visibility: hidden; flex-direction: column; padding: 105px var(--page-pad) 28px; background: rgba(11,13,11,.985); opacity: 0; transform: translateY(-8px); transition: opacity .3s ease, transform .3s ease, visibility .3s ease; }
  .mobile-nav[open] .mobile-menu { visibility: visible; opacity: 1; transform: translateY(0); }
  .mobile-menu__top, .mobile-menu__bottom { display: flex; justify-content: space-between; gap: 18px; color: var(--subtle); font-size: 9px; letter-spacing: .12em; }
  .mobile-menu__top { margin-bottom: 31px; }
  .mobile-menu > a { display: grid; min-height: 82px; grid-template-columns: 42px 1fr 28px; align-items: center; gap: 13px; border-bottom: 1px solid var(--rule); font-size: clamp(40px, 9vw, 66px); font-weight: 480; letter-spacing: -.07em; line-height: 1; }
  .mobile-menu > a > span { align-self: center; color: var(--green); font-size: 9px; letter-spacing: .08em; }
  .mobile-menu > a > .icon { width: 22px; height: 22px; color: var(--green); }
  .mobile-menu .mobile-menu__project { display: flex; min-height: 60px; justify-content: space-between; margin-top: auto; padding-top: 15px; padding-bottom: 15px; border-block: 1px solid rgba(182,243,106,.4); color: var(--green); font-size: 16px; letter-spacing: 0; }
  .mobile-menu .mobile-menu__bottom { margin-top: 21px; }

  .hero { display: block; min-height: auto; padding-top: 145px; padding-bottom: 88px; }
  .hero__copy { width: 100%; }
  .hero__eyebrow { margin-bottom: 40px; }
  .hero h1 { font-size: clamp(4.55rem, 10.6vw, 7.4rem); }
  .hero__foot { max-width: 650px; grid-template-columns: minmax(170px, .8fr) 1fr; margin-top: 36px; }
  .hero-study { width: min(64%, 520px); margin: 48px 0 0 auto; }
  .hero-study__canvas { min-height: 285px; }
  .hero-study__scene { min-height: 222px; }
  .hero__side-note { right: 12px; top: auto; bottom: 190px; }
  .scroll-cue { bottom: 38px; }

  .statement__body { grid-template-columns: 1fr; gap: 35px; }
  .statement__right { display: grid; grid-template-columns: minmax(0,1fr) minmax(230px,.85fr); align-items: end; gap: 24px; }
  .statement__right p { margin-bottom: 5px; }
  .section-heading { margin-bottom: 60px; }
  .section-heading h2 { font-size: clamp(56px, 8vw, 82px); }
  .section-heading__note { max-width: 290px; font-size: 14px; }
  .project, .project--sere, .project--happy, .project--rituals { grid-template-columns: minmax(0,1.08fr) minmax(245px,.92fr); gap: 34px; }
  .project--sere, .project--happy { grid-template-columns: minmax(245px,.92fr) minmax(0,1.08fr); }
  .project__copy h3 { font-size: clamp(32px, 4vw, 43px); }
  .project__description { font-size: 14px; }
  .project__meta { gap: 6px 9px; }
  .project__meta li + li::before { margin-right: 9px; }
  .complex-build { align-items: start; flex-direction: column; }
  .complex-build .text-link { margin-top: 5px; }

  .ai__intro { grid-template-columns: 1fr; row-gap: 28px; }
  .ai__intro .eyebrow, .ai h2, .ai__summary { grid-column: 1; }
  .ai h2 { max-width: 750px; }
  .principles { grid-template-columns: repeat(2,1fr); row-gap: 38px; }
  .process-track { grid-template-columns: 1fr; gap: 28px; padding-left: 67px; }
  .process-track__line { display: none; }
  .process-track::before { position: absolute; top: 5px; bottom: 10px; left: 20px; width: 1px; background: var(--rule); content: ""; transform: scaleY(.15); transform-origin: top; transition: transform 1.4s var(--ease), background-color .3s ease; }
  .process-track.is-visible::before { background: linear-gradient(var(--green) 0 65%, var(--rule) 100%); transform: scaleY(1); }
  .process-step { position: relative; min-height: 63px; }
  .process-step__node { position: absolute; top: 0; left: -67px; width: 42px; height: 42px; margin: 0; }
  .process-step p { max-width: 360px; }

  .about { grid-template-columns: 1fr; gap: 55px; }
  .about__principles { max-width: 720px; }
  .final-cta { min-height: 610px; }
  .final-cta h2 { font-size: clamp(66px, 10.8vw, 98px); }
  .final-cta__bottom { align-items: start; flex-direction: column; }
  .footer__top { grid-template-columns: 1fr .7fr 1.1fr; gap: 25px; }
}

@media (max-width: 620px) {
  :root { --page-pad: 22px; }
  body { font-size: 15px; }
  html { scroll-padding-top: 72px; }
  .site-header { padding-block: 14px; }
  .site-header.is-scrolled { padding-block: 10px; }
  .wordmark { gap: 7px; font-size: 14px; }
  .wordmark__mark { width: 23px; height: 23px; }
  .menu-toggle { width: 48px; height: 48px; margin-right: -8px; }
  .hero { padding-top: 127px; padding-bottom: 100px; }
  .hero__eyebrow { gap: 10px; margin-bottom: 32px; font-size: 9px; letter-spacing: .09em; }
  .hero__eyebrow .eyebrow__index { width: 23px; height: 23px; }
  .hero h1 { font-size: clamp(3.35rem, 13.2vw, 5.2rem); letter-spacing: -.085em; line-height: .84; }
  .hero__line { padding-block: .03em .08em; }
  .hero__foot { grid-template-columns: 1fr; gap: 20px; margin-top: 29px; }
  .hero__foot > p { max-width: 350px; font-size: 16px; }
  .hero__actions { gap: 12px 19px; }
  .button { min-height: 50px; gap: 18px; padding-inline: 15px; }
  .hero-study { width: 100%; max-width: none; margin-top: 45px; }
  .hero-study__top, .hero-study__caption { font-size: 7px; }
  .hero-study__canvas { min-height: 286px; }
  .hero-study__scene { min-height: 218px; }
  .hero-study__object { left: 39%; }
  .hero-study__object--small { left: 60%; }
  .hero__side-note { display: none; }
  .scroll-cue { bottom: 35px; left: var(--page-pad); }

  .eyebrow { gap: 10px; font-size: 9px; letter-spacing: .1em; }
  .statement { padding-top: 93px; padding-bottom: 89px; }
  .statement__body { gap: 30px; margin-top: 28px; }
  .statement h2, .section-heading h2, .problems h2, .ai h2, .about h2 { font-size: clamp(43px, 11.3vw, 64px); }
  .statement__right { grid-template-columns: 1fr; gap: 8px; }
  .word-run { gap: 1px 9px; margin-bottom: 12px; font-size: 16px; }
  .statement__right p { max-width: 390px; font-size: 15px; }

  .work { padding-top: 92px; padding-bottom: 80px; }
  .section-heading { align-items: start; flex-direction: column; gap: 19px; margin-bottom: 46px; }
  .section-heading .eyebrow { margin-bottom: 22px; }
  .section-heading h2 { font-size: clamp(48px, 12.4vw, 70px); }
  .section-heading__note { max-width: 360px; margin: 0; font-size: 15px; }
  .project-list { gap: 75px; }
  .project, .project--sere, .project--happy, .project--rituals { grid-template-columns: 1fr; gap: 25px; }
  .project__visual, .project--sere .project__visual, .project--happy .project__visual { order: 0; }
  .project__copy, .project--sere .project__copy, .project--happy .project__copy { order: 1; gap: 16px; }
  .project__number { margin: 0; }
  .project__visual--anti { aspect-ratio: 1.2 / 1; }
  .project__visual--sere { aspect-ratio: 1.3 / 1; }
  .project__visual--rituals { aspect-ratio: 1.15 / 1; }
  .project__visual--happy { aspect-ratio: 1.25 / 1; }
  .project__visual-tag { bottom: 12px; left: 12px; font-size: 7px; }
  .project__view { width: 70px; height: 70px; }
  .project__copy h3 { margin-bottom: 12px; font-size: 38px; }
  .project__description { max-width: 420px; font-size: 15px; }
  .project__meta { margin: 16px 0 10px; }
  .project__cta { min-height: 43px; }
  .complex-build { margin-top: 77px; padding-block: 23px; }
  .complex-build h3 { font-size: 26px; }
  .complex-build p:not(.eyebrow) { font-size: 14px; }
  .marquee { padding-block: 15px; }
  .marquee__track { gap: 24px; }
  .marquee__track span { font-size: 18px; }
  .marquee__track i { width: 5px; height: 5px; }

  .services { padding-top: 95px; padding-bottom: 95px; }
  .services .section-heading { margin-bottom: 42px; }
  .service__trigger { min-height: 79px; grid-template-columns: 31px minmax(0,1fr) 38px; gap: 10px; padding-right: 0; }
  .service__title { font-size: clamp(20px, 5.3vw, 27px); }
  .service__index { font-size: 9px; }
  .service__arrow { width: 36px; height: 36px; }
  .service__detail p { margin-inline: 41px 35px; font-size: 14px; }
  .service.is-open .service__detail p { padding-bottom: 20px; }

  .problems { padding-top: 95px; padding-bottom: 100px; }
  .section-heading--single { margin-bottom: 43px; }
  .problem { min-height: 0; grid-template-columns: 35px minmax(0,1fr); gap: 13px; padding-block: 24px; }
  .problem__number { padding-top: 4px; font-size: 9px; }
  .problem h3 { margin-bottom: 9px; font-size: 23px; }
  .problem p { font-size: 15px; line-height: 1.6; }
  .problem__rule { display: none; }

  .ai { padding-top: 98px; padding-bottom: 100px; }
  .ai__intro { row-gap: 25px; }
  .ai h2 { font-size: clamp(38px, 10vw, 53px); line-height: 1.02; }
  .ai__summary { font-size: 14px; }
  .ai-flow { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 25px 16px; margin-top: 65px; padding-top: 0; }
  .ai-flow__line { display: none; }
  .ai-flow__step::before { position: static; display: block; margin-bottom: 9px; }
  .ai-flow__step { gap: 0; }
  .ai-flow__step span { margin-bottom: 4px; }
  .ai-flow__step strong { font-size: 16px; }
  .principles { grid-template-columns: 1fr; gap: 25px; margin-top: 65px; padding-top: 21px; }
  .principles article { display: grid; grid-template-columns: 100px 1fr; column-gap: 10px; padding-right: 0; }
  .principles article > span { grid-row: 1 / span 2; padding-top: 4px; }
  .principles h3 { margin: 0 0 6px; font-size: 16px; }
  .principles p { max-width: none; font-size: 14px; }

  .process { padding-top: 96px; padding-bottom: 105px; }
  .process-track { gap: 25px; padding-left: 59px; }
  .process-track::before { left: 19px; }
  .process-step { min-height: 65px; }
  .process-step__node { left: -59px; width: 39px; height: 39px; font-size: 9px; }
  .process-step h3 { margin-bottom: 6px; font-size: 16px; }
  .process-step p { font-size: 14px; }

  .about { gap: 42px; padding-top: 104px; padding-bottom: 104px; }
  .about__main .eyebrow { margin-bottom: 25px; }
  .about h2 { margin-bottom: 20px; font-size: clamp(45px, 11.5vw, 66px); }
  .about__main > p:last-child { font-size: 15px; }
  .about__principles article { grid-template-columns: 26px 1fr; gap: 12px; padding-block: 16px; }
  .about__principles h3 { font-size: 13px; }
  .about__principles p { font-size: 12px; }

  .final-cta { min-height: 570px; padding-top: 44px; padding-bottom: 74px; }
  .final-cta__eyebrow { align-items: flex-start; flex-direction: column; gap: 15px; }
  .availability { font-size: 8px; }
  .final-cta h2 { margin: 85px 0 34px; font-size: clamp(39px, 10.2vw, 63px); line-height: .9; }
  .final-cta h2 span:last-child { margin-left: 4%; }
  .final-cta__bottom { gap: 24px; }
  .final-cta__bottom > p { max-width: 360px; font-size: 15px; }
  .final-cta__actions { align-items: flex-start; flex-direction: column; gap: 7px; }
  .final-cta__marquee { bottom: 1px; font-size: 74px; }

  .site-footer { padding-top: 50px; padding-bottom: 18px; }
  .footer__top { grid-template-columns: 1fr 1fr; gap: 38px 20px; padding-bottom: 50px; }
  .footer__top > div:first-child { grid-column: 1 / -1; }
  .footer__contact { align-items: flex-start; grid-column: 1 / -1; }
  .footer__contact .eyebrow { align-self: flex-start; }
  .footer__email { font-size: 22px; }
  .footer__bottom { align-items: flex-start; flex-wrap: wrap; justify-content: space-between; padding-top: 15px; font-size: 8px; }
  .footer__bottom > span:nth-child(2) { display: none; }
}

@media (max-width: 380px) {
  :root { --page-pad: 18px; }
  .hero h1 { font-size: 13vw; }
  .hero-study__top { font-size: 6px; letter-spacing: .09em; }
  .hero-study__caption { font-size: 6px; letter-spacing: .08em; }
  .hero-study__scene { min-height: 200px; }
  .hero-study__canvas { min-height: 268px; }
  .project__meta { gap: 6px; }
  .project__meta li { font-size: 9px; }
  .project__meta li + li::before { margin-right: 6px; }
  .footer__email { font-size: 19px; }
}

/* Small-screen layout for the scroll-storytelling pass */
@media (max-width: 900px) {
  .mobile-menu { background: #0b0d0b; }
  .cursor { display: none; }
  html.cursor-ready, html.cursor-ready a, html.cursor-ready button, html.cursor-ready summary { cursor: auto; }
  .work-sequence { margin-top: 38px; }
  .work-sequence__stage { gap: 0; }
  .work-scenes { gap: 78px; }
  .work-scene { grid-template-columns: minmax(0,1.08fr) minmax(240px,.92fr); align-items: center; gap: 28px; }
  .work-scene:nth-child(even) { grid-template-columns: minmax(240px,.92fr) minmax(0,1.08fr); }
  .work-scene:nth-child(even) .work-scene__visual { order: 2; }
  .work-scene__visual { aspect-ratio: 1.48 / 1; }
  .work-scene__details { grid-template-columns: 1fr; gap: 18px; }
  .work-scene__identity h3 { font-size: clamp(34px, 5vw, 50px); }
  .work-scene__description { font-size: 16px; }
  .work-scene__visual .project__view { width: 74px; height: 74px; font-size: 11px; }
  .build-story { margin-top: 48px; }
  .build-step { min-height: 0; padding-block: 21px; }
  .build-step h3 { font-size: 24px; }
  .build-step p { font-size: 16px; }
  .section-heading__note { font-size: 15px; }
  .complex-build p:not(.eyebrow), .service__detail p, .ai__summary, .principles p, .process-step p, .about__main > p:last-child, .final-cta__bottom > p { font-size: 16px; }
  .about__principles p { font-size: 15px; }
}

@media (max-width: 620px) {
  body { font-size: 16px; }
  .mobile-nav { z-index: 61; }
  .menu-toggle { z-index: 63; }
  .mobile-menu { height: 100vh; height: 100dvh; min-height: 100svh; padding: calc(env(safe-area-inset-top, 0px) + 98px) var(--page-pad) calc(env(safe-area-inset-bottom, 0px) + 22px); }
  .mobile-menu__top, .mobile-menu__bottom { font-size: 10px; }
  .mobile-menu__top { margin-bottom: clamp(20px, 5vh, 34px); }
  .mobile-menu > a { min-height: clamp(62px, 9.8vh, 80px); grid-template-columns: 34px minmax(0,1fr) 24px; gap: 9px; font-size: clamp(38px, 10vw, 54px); }
  .mobile-menu .mobile-menu__project { min-height: 56px; font-size: 16px; }
  .hero__foot > p, .statement__right p, .project__description, .problem p, .principles p, .about__main > p:last-child, .final-cta__bottom > p { font-size: 16px; }
  .word-run { gap: 4px; font-size: clamp(24px, 7vw, 29px); }
  .work { padding-top: 90px; }
  .work-sequence { margin-top: 28px; }
  .work-scenes { gap: 68px; }
  .work-scene, .work-scene:nth-child(even) { grid-template-columns: 1fr; gap: 20px; }
  .work-scene:nth-child(even) .work-scene__visual { order: 0; }
  .work-scene__visual { aspect-ratio: 1.45 / 1; }
  .work-scene__visual--paired { aspect-ratio: 1.35 / 1; }
  .work-scene__visual-tag { right: 10px; bottom: 10px; left: 10px; padding: 8px; font-size: 10px; }
  .work-scene__visual .project__view { top: 16px; right: 16px; left: auto; width: 68px; height: 68px; gap: 2px; font-size: 12px; opacity: 1; transform: translate(0,0) scale(1); }
  .work-scene__visual .project__view .icon { width: 15px; height: 15px; }
  .work-scene__details { gap: 13px; }
  .work-scene__number, .work-scene__category { font-size: 12px; }
  .work-scene__number { margin-bottom: 9px; }
  .work-scene__identity h3 { font-size: 40px; }
  .work-scene__description { font-size: 16px; }
  .work-scene__meta { margin: 13px 0; gap: 7px 10px; }
  .work-scene__meta li { font-size: 12px; }
  .work-scene__cta { min-height: 48px; padding: 11px 16px; font-size: 15px; }
  .build-story { margin-top: 35px; }
  .build-step { grid-template-columns: 34px minmax(0,1fr); gap: 12px; padding-block: 20px; }
  .build-step h3 { margin-bottom: 6px; font-size: 22px; }
  .build-step p { font-size: 16px; line-height: 1.55; }
  .service__trigger { min-height: 76px; grid-template-columns: 31px minmax(0,1fr) 38px; gap: 10px; }
  .service__title { font-size: clamp(20px, 5.5vw, 27px); }
  .service__detail p { margin-inline: 41px 35px; font-size: 16px; }
  .ai__summary, .problem p, .about__main > p:last-child, .about__principles p, .final-cta__bottom > p { font-size: 16px; }
}

@media (max-width: 380px) {
  .mobile-menu { padding-top: calc(env(safe-area-inset-top, 0px) + 84px); }
  .mobile-menu__top { margin-bottom: 18px; }
  .mobile-menu > a { min-height: 58px; font-size: 37px; }
  .work-scene__identity h3 { font-size: 36px; }
  .work-scene__visual-tag { max-width: calc(100% - 94px); font-size: 9px; }
}
