/* Responsive — mobile-first breakpoints.
   Nav collapses to a drawer at 980px so it can never overflow or clip. */
@media (max-width:1180px){
  .utility .u-hide{display:none}
  .foot-top{grid-template-columns:1fr 1fr 1fr;gap:28px}
  .foot-top .foot-about{grid-column:1/-1}
}
@media (max-width:1080px){
  .cap-row{grid-template-columns:50px 1fr 40px}
  .cap-row p{display:none}
  .num-row{grid-template-columns:60px 1fr 40px}
  .num-row p{display:none}
  .quote-row{grid-template-columns:60px 1fr}
  .quote-row .who{grid-column:1/-1;padding-left:60px}
  .news-row{grid-template-columns:110px 90px 1fr auto;gap:18px}
}
@media (max-width:980px){
  :root{--hdr:64px}
  .utility{display:none}
  .menu-toggle{display:grid;place-items:center}
  .nav-links{position:fixed;inset:64px 0 0 auto;width:min(380px,88vw);background:#0b1117;flex-direction:column;align-items:stretch;gap:0;padding:24px;overflow-y:auto;transform:translateX(100%);transition:transform .35s var(--ease);margin-left:0;border-left:1px solid var(--line-dark)}
  body.menu-open .nav-links{transform:none}
  .nav-links>a,.nav-more>button{padding:14px 8px;font-size:1rem;border-bottom:1px solid var(--line-dark);text-align:left;width:100%;display:flex;justify-content:space-between;align-items:center}
  .nav-links>a::after{display:none}
  .nav-more .mega{position:static;width:100%;opacity:1;visibility:visible;transform:none;border:0;box-shadow:none;background:none;padding:6px 0 6px 14px;display:grid;grid-template-columns:1fr;gap:0}
  .nav-more .mega a{padding:10px 8px;border-bottom:1px solid rgba(255,255,255,.05)}
  .nav-more .mega .mega-foot{display:none}
  .nav-cta{margin:18px 0 0;width:100%;justify-content:center}
  .hero .hero-grid{grid-template-columns:1fr;gap:32px;padding:36px 0 24px}
  .hero-copy{padding-left:0}
  .hero .v-label{display:none}
  .hero-visual{min-height:340px;order:2}
  .hero-frame{aspect-ratio:4/3;max-height:none}
  .hero-badge{right:10px;bottom:10px;transform:rotate(-2deg)}
  .split,.feat-split,.contact-split,.team-ed,.proj-feature,.post-feature{grid-template-columns:1fr}
  .feat-split.reverse .fs-media,.brand-row:nth-child(even) .br-media{order:0}
  .team-ed .fe{position:static}
  .brand-row{gap:24px}
  .proj-feature .pf-img{min-height:240px}
  .ph-grid{grid-template-columns:1fr;gap:24px}
  .ph-meta{flex-direction:row;align-items:end;border-right:0;border-bottom:1px solid var(--line-dark);padding-right:0;padding-bottom:18px}
  .ph-vertical{display:none}
  .stats{grid-template-columns:1fr 1fr}
  .stat:nth-child(2){border-right:0}
  .stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line-dark)}
  .mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:150px}
  .mosaic .m.wide{grid-column:span 2}
  .team-grid{grid-template-columns:1fr}
  .proj-item{grid-template-columns:1fr auto;gap:12px}
  .proj-item .pi-year,.proj-item .pi-tags{display:none}
}
@media (max-width:620px){
  .container{width:min(100% - 28px,1240px)}
  .head-row{flex-direction:column;align-items:flex-start}
  .hero h1{font-size:clamp(2.4rem,11vw,3.6rem)}
  .hero-meta{gap:18px}
  .hero-meta strong{font-size:1.3rem}
  .split .principles{grid-template-columns:1fr}
  .split .principles article+article{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:18px}
  .stats{grid-template-columns:1fr}
  .stat{border-right:0;border-bottom:1px solid var(--line-dark)}
  .stat:last-child{border-bottom:0}
  .quote-row{grid-template-columns:1fr;gap:14px}
  .quote-row .who{padding-left:0}
  .news-row{grid-template-columns:1fr;gap:6px}
  .news-row .arr{display:none}
  .mosaic{grid-template-columns:1fr;grid-auto-rows:200px}
  .mosaic .m.wide,.mosaic .m.tall{grid-column:auto;grid-row:auto}
  .form{grid-template-columns:1fr}
  .form .field.full{grid-column:auto}
  .role-row{grid-template-columns:1fr;gap:10px}
  .role-row .btn{justify-self:start}
  .cap-row,.num-row{grid-template-columns:40px 1fr 30px;gap:14px}
  .float-social{left:12px;bottom:14px;gap:6px}
  .float-social a{width:36px;height:36px;font-size:.85rem}
  #backTop{right:12px;bottom:14px;width:42px;height:42px}
  .scroll-cue{display:none}
  .foot-top{grid-template-columns:1fr 1fr}
  .foot-bottom{flex-direction:column;align-items:flex-start}
  .cursor-glow{display:none}
  .ph-main h1{font-size:clamp(2.1rem,10vw,3.2rem)}
  .ticker .item{font-size:.95rem;padding:0 18px}
}
@media (max-width:380px){
  .hero h1{font-size:2.2rem}
  .actions .btn{flex:1;justify-content:center}
  .foot-top{grid-template-columns:1fr}
}
