/* Responsive states: reflow, never squeeze */
@media (max-width:1100px){
  .act-nav{display:none}
  .work-intro{flex-basis:38vw}
  .project{flex-basis:70vw}
}
@media (max-width:900px){
  :root{--hud-h:58px;--pad:4.5vw}
  html,body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
    position:relative;
  }
  .grain{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
  }
  .hero-bottom::before{
    inset:-22px 0 -16px !important;
  }
  .act, .hud, .work-pin, .work-track, .project, .panels, .contact-grid, .footer-grid, .inquiry-container{
    max-width:100% !important;
    box-sizing:border-box !important;
  }
  .hud{grid-template-columns:1fr auto;min-height:var(--hud-h);padding:8px 16px}
  .hud__act{display:none}
  .hud__brand span{display:none}
  .hud__telemetry{gap:10px}
  .hud__fps,.hud__time{display:none}
  .hud__wave{width:52px}
  .mobile-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:var(--bg);border-top:1px solid var(--line);
    padding:5px 8px calc(5px + env(safe-area-inset-bottom));
  }
  .mobile-nav a{
    flex:1;min-height:44px;display:grid;place-items:center;
    font:400 9px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);
  }
  .mobile-nav a.is-active{color:var(--accent)}
  .act-1{min-height:100svh;padding-top:calc(var(--hud-h) + 5vh);padding-bottom:10vh}
  .hero-top{flex-direction:column;gap:6px}
  .hero-name{padding:5vh 0}
  .hero-name h1{font-size:clamp(54px,17.5vw,140px);line-height:.82}
  .hero-name .line--2{padding-right:0;text-align:left;padding-left:7vw}
  .hero-name__aside{color:color-mix(in srgb,var(--ink) 80%,transparent);text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 14px rgba(0,0,0,.8)}
  .hero-copy,.scroll-cue{text-shadow:0 1px 2px rgba(0,0,0,.9),0 0 18px rgba(0,0,0,.75)}
  .hero-bottom{grid-template-columns:1fr;gap:22px;position:relative;isolation:isolate}
  .hero-bottom::before{
    content:"";position:absolute;z-index:-1;pointer-events:none;
    inset:-22px calc(var(--pad) * -1) -16px;
    background:linear-gradient(180deg,
      transparent 0%,
      color-mix(in srgb,var(--bg) 76%,transparent) 24%,
      color-mix(in srgb,var(--bg) 92%,transparent) 100%);
  }
  .hero-facts{justify-content:flex-start;gap:16px}
  .capabilities li{padding:8px 10px;font-size:8px}
  .act-2{min-height:0}
  .work-pin{height:auto;display:block;overflow:visible}
  .work-track{
    display:flex;flex-direction:column;width:100%;
    padding:12vh var(--pad) 8vh;gap:28px;transform:none!important;
  }
  .work-intro{flex:none;min-height:0;padding:0 0 14px}
  .work-intro h2{font-size:clamp(46px,13vw,84px)}
  .project{flex:none;width:100%;height:auto;min-height:0;grid-template-columns:1fr}
  .project__body{border-right:0;border-bottom:1px solid var(--line);padding:20px}
  .project__media{min-height:260px;aspect-ratio:4/3}
  body.gl-ready .project__img{opacity:.92}
  .project h3{font-size:clamp(32px,10vw,54px)}
  .act-3{min-height:0;padding:12vh var(--pad) 10vh;gap:5vh}
  .act-3__head{grid-template-columns:1fr;gap:18px}
  .act-3 h2{font-size:clamp(42px,12.5vw,84px)}
  .act-3__head p{justify-self:start}
  .panels{grid-template-columns:1fr;align-items:stretch}
  .glass{padding:18px}
  .act-4{min-height:0;padding:12vh var(--pad) 8vh;gap:5vh}
  .contact-title{font-size:clamp(58px,18vw,120px);line-height:.8}
  .contact-grid{grid-template-columns:1fr;gap:26px}
  .contact-actions{width:100%}
  .cta{width:100%;justify-content:space-between}
  .contact-note{font-size:10px;line-height:1.55}
  .email-copy{grid-template-columns:1fr auto;gap:6px 12px}
  .email-copy__label{grid-column:1/-1}
  .email-copy__value{grid-column:1;font-size:13px}
  .email-copy__action{grid-column:2;grid-row:2;font-size:10px}
  .domain-status{font-size:9px}
  .footer-grid{grid-template-columns:1fr;gap:26px}
  .footer-meta{font-size:9px}
  .site-footer{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
  .grain{opacity:.18}
  .cursor,.cursor-dot{display:none}
  .readout{display:none}
  body.has-cursor,body.has-cursor a,body.has-cursor button{ cursor:auto}
}
@media (max-width:480px){
  .cluster-grid{grid-template-columns:1fr}
  .project__media{min-height:220px}
  .hero-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .hero-facts span{font-size:7.5px}
}
@media (max-width:360px){
  .project h3{font-size:clamp(28px,9vw,48px)}
}
@media (max-width:900px){
  html[dir="rtl"] .hero-name .line:first-child{text-align:right}
  html[dir="rtl"] .hero-name .line--2{text-align:right;padding-right:7vw;padding-left:0}
}
@media (max-width:860px){
  .lang-gate{padding:14px 18px 18px}
  .lang-gate__center{grid-template-columns:1fr;gap:32px;padding:5vh 0 3vh;align-content:center}
  .lang-gate h1{font-size:clamp(40px,11vw,72px)}
  .lang-gate__note{max-width:38ch;margin-top:2.2vh}
  .lang-options{justify-self:stretch;width:100%}
  .lang-option{min-height:84px;padding:14px 16px;grid-template-columns:44px 1fr auto;gap:14px}
  .lang-option[data-lang-choice="ar"]{grid-template-columns:auto 1fr 44px}
  .lang-gate__bottom{flex-direction:column;gap:4px}
}
@media (max-width:480px){
  .hud{padding:8px 12px;gap:8px}
  .hud__telemetry{gap:8px}
  .hud__wave{display:none}
  .motion-toggle{font-size:8.5px;padding:0 8px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;
  }
}
