/* Mobile composition: retain the desktop art direction at a readable scale. */
@media(max-width:760px){
 html{scroll-padding-top:24px}
 .hero-header{top:22px;padding:0 5vw;justify-content:space-between;gap:10px}
 .top-pill{flex:1;justify-content:space-between;padding:9px 14px 9px 9px;gap:12px}
 .top-pill nav{gap:15px}.top-pill nav a{font-size:11px}.top-pill nav a:nth-child(n+2){display:none}
 .hero-header .brand{font-size:21px;padding:7px 11px}.hero-header .top-contact{font-size:11px;padding:17px 18px;white-space:nowrap}
 .hero{height:125svh;min-height:850px}.hero-sticky{height:100svh;min-height:760px;padding:0}
 .hero-composition{top:145px;left:5vw;right:5vw;height:500px}
 .hero h1{inset:30px 0 auto;font-size:18.4vw;line-height:1.08;letter-spacing:-.035em}
 .hero h1 .line{max-width:100%;transform:none!important}
 .hero-word{display:block}.hero .one{line-height:1.08}.hero .two{font-size:.89em;line-height:1.22;margin:0 0 0 auto}
 .hero .three{font-size:1em;line-height:1.08;width:100%!important}.hero .three .hero-word:last-child{text-align:right}
 .hero-badge{font-size:10px}.badge-burst{width:78px;height:78px;left:0;top:-23px}
 .badge-lime{left:auto;right:0;top:83px;padding:12px 14px;font-size:10px}
 .badge-red{width:65px;height:65px;top:177px;left:0;right:auto}
 .badge-blue{left:0;top:278px;min-width:112px;min-height:48px;padding:10px}
 .badge-white{width:75px;height:75px;left:auto;right:0;bottom:38px}
 .badge-violet{left:6%;right:auto;bottom:-6px;padding:13px 16px;font-size:10px}
 .orbit-layer{inset:0 -15%;opacity:.55}.you-cursor{display:none}
 .hero-bottom{bottom:88px;left:5vw;right:5vw}.hero-bottom p{max-width:none;font-size:10px}
 .dock{width:calc(100% - 28px);max-width:450px;bottom:calc(12px + env(safe-area-inset-bottom));gap:3px;padding:8px;justify-content:space-between}
 .dock button,.dock a{min-height:44px;font-size:12px;padding:12px 10px;text-align:center}.dock .dock-cta{flex:1}.dock .menu-icon{margin-right:4px}
 #menu-panel{width:min(360px,calc(100% - 28px));bottom:calc(86px + env(safe-area-inset-bottom));max-height:calc(100svh - 110px);overflow:auto}
 #menu-panel a{min-height:52px;font-size:21px}
 .services{height:auto;padding:50px 5vw 70px}.services-sticky{position:relative;top:auto;height:auto;min-height:0;padding:0;overflow:visible;perspective:none}
 .services .service-heading{position:relative;inset:auto;font-size:16vw;margin:65px 0 50px;transform:none!important;opacity:1!important;line-height:1.05}
 .service-grid{position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1fr);gap:22px;height:auto;perspective:none}
 .service{position:relative;inset:auto;width:100%;height:auto;min-height:570px;padding:30px 25px 34px;border-radius:34px;text-align:center;align-items:center;transform:var(--mobile-reveal,none)!important;opacity:1!important}
 .service .card-number{order:0;font-size:11px;align-self:flex-start;opacity:.7}
 .service h3{order:1;font-family:'DM Sans',Arial,sans-serif;font-weight:800;text-transform:none;letter-spacing:-1.5px;font-size:38px;line-height:1.1;margin:30px 0 18px}
 .service p{order:2;font-size:16px;line-height:1.7;max-width:340px;margin:0}
 .service .card-mark{order:3;font-size:100px;line-height:1.3;margin:28px 0;letter-spacing:-5px}.service .card-mark span{font-size:70px}
 .service .card-footer{order:4;margin-top:auto;border:0;display:flex;gap:22px;align-items:center;justify-content:center;border-radius:50px;padding:16px 24px;background:#111;color:#f4f0e9;min-height:50px;font-size:12px;width:auto}
 .services-cue{display:none}.about-bottom p{width:100%;font-size:20px}.about{min-height:0;padding-bottom:55px}
 .portfolio-sticky{min-height:740px}.portfolio-window{top:185px;bottom:190px}.portfolio h2{margin:25px 0;font-size:12vw}
 .project-card{grid-template-rows:56% 44%}.project-screen{max-height:none;min-height:90px}.project-info h4{font-size:25px}.project-info p{font-size:12px}.project-open{font-size:12px;min-height:44px;padding:10px 20px}.portfolio-controls{bottom:100px}.portfolio-controls button{width:44px;height:44px}
 .contact{padding-bottom:calc(125px + env(safe-area-inset-bottom))}.contact h2{line-height:1.02}.founder{margin-top:60px}.founder h3{font-size:16vw}
 dialog{max-height:85svh;padding:38px 22px 25px}dialog h2{font-size:42px}
}
@media(min-width:481px) and (max-width:760px){
 .hero-sticky{min-height:980px}.hero{min-height:1100px}.hero-composition{height:680px;top:155px}.hero h1{font-size:min(18.4vw,120px)}
 .badge-lime{top:135px}.badge-red{top:290px}.badge-blue{top:430px}.badge-white{bottom:10px}.badge-violet{bottom:-40px}
}
@media(max-width:360px){
 .hero-header{padding:0 4vw}.top-pill nav{display:none}.hero-header .top-contact{padding:16px}.hero-composition{height:440px;top:140px}.hero-sticky{min-height:700px}.hero{min-height:790px}
 .badge-lime{top:70px}.badge-red{top:145px}.badge-blue{top:231px}.badge-white{bottom:48px}.badge-violet{bottom:0}.hero-badge{font-size:9px}
 .dock button,.dock a{font-size:10px;padding:12px 8px}.service{padding:25px 22px 30px;min-height:540px}.service h3{font-size:33px}
}
@media(max-width:760px) and (prefers-reduced-motion:reduce){
 .hero{height:auto;min-height:760px}.hero-sticky{position:relative}.service{transform:none!important}.portfolio-sticky{min-height:0}.portfolio-window{inset:auto}.portfolio-track{height:540px}
}
