/* =========================================================
   RESPONSIVE.CSS — sitewide breakpoint overrides
   Global mobile/tablet layout changes, touch/reduced-motion
   handling for the custom cursor, and small layout fixes that
   apply across multiple components (e.g. the scrollable
   mobile filter bar). Component-scoped responsive rules stay
   in components.css, next to the component they adjust.
========================================================= */
/* ─── RESPONSIVE ─────────────────────────────────────────────────────────── */
@media(max-width:1000px){
  nav{padding:22px 24px;}
  .nav-links{display:none;}
  .nav-burger{display:block;}
  #hero{padding:128px 24px 56px;}
  .hero-headline{font-size:clamp(2.6rem,10vw,4.6rem);}
  .hero-bottom{flex-direction:column;align-items:flex-start;gap:32px;}
  #studio,#philosophy,#cta,#page-studio,#page-services,#page-lab,#page-contact{
    padding-left:24px;padding-right:24px;}
  #disciplines,#capabilities{padding-left:24px;padding-right:24px;}
  .studio-grid,.studio-page-grid,.proj-cols,
  .cta-grid,.contact-grid,.services-clients{
    grid-template-columns:minmax(0,1fr);gap:48px;}
  .page-pad{padding-left:24px!important;padding-right:24px!important;}
  .disc-grid{grid-template-columns:1fr;}
  .disc-card:nth-child(odd){border-right:none;border-bottom:1px solid rgba(255,255,255,.06);}
  .cap-grid,.services-grid{grid-template-columns:repeat(2,1fr);}
  .filter-bar,.all-grid{padding-left:24px;padding-right:24px;}
  .proj-body{padding:0 24px;}
  .proj-hero-content{padding:0 24px 40px;}
  .proj-related-grid{grid-template-columns:1fr;}
  .proj-nav{padding:24px;}
  .proj-cols{grid-template-columns:1fr;}
  footer{flex-direction:column;gap:20px;text-align:center;}
  .footer-links{flex-wrap:wrap;justify-content:center;}
  .studio-stats-row,.process-row{grid-template-columns:1fr;}
}


/* ══════════════════════════════════════════════════════
   ACCESSIBILITY / INPUT-MODE OVERRIDES
══════════════════════════════════════════════════════ */
@media(hover:none),(pointer:coarse){
  body{cursor:auto;}
  #cur,#cur-ring{display:none;}
  a,button,.proj-card,.disc-card{cursor:pointer;}
}
@media(prefers-reduced-motion:reduce){
  #cur,#cur-ring{display:none;}
  body{cursor:auto;}
  html{scroll-behavior:auto;}
  .hero-slide{transition:none!important;}
}
body.no-hover-cursor #cur,body.no-hover-cursor #cur-ring{display:none;}
body.no-hover-cursor{cursor:auto;}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--y);outline-offset:3px;
}
.skip-link{
  position:absolute;left:-999px;top:0;background:var(--y);color:var(--bk);
  padding:12px 20px;z-index:9999;font-family:'Space Mono',monospace;font-size:.75rem;
  text-decoration:none;
}
.skip-link:focus{left:12px;top:12px;}


/* ══════════════════════════════════════════════════════
   MISC: filter bar horizontal scroll on small screens
══════════════════════════════════════════════════════ */
@media(max-width:700px){
  .filter-bar{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;padding-bottom:6px;}
  .filter-bar::-webkit-scrollbar{display:none;}
  .filter-bar .filter-btn{flex:0 0 auto;white-space:nowrap;}
}

/* ══════════════════════════════════════════════════════
   MOBILE OPTIMISATION PASS
══════════════════════════════════════════════════════ */
@media(max-width:1000px){
  html,body{overflow-x:hidden;}
  .hero-cta{flex-wrap:wrap;}
}
@media(max-width:600px){
  /* stacked full-width buttons instead of overflowing rows */
  .hero-cta,.cta-btns{flex-direction:column;align-items:stretch;width:100%;}
  .hero-cta .btn-y,.hero-cta .btn-g,
  .cta-btns .btn-y,.cta-btns .btn-g{
    width:100%;text-align:center;box-sizing:border-box;padding:16px 20px;}
  /* single-column grids on phones */
  .cap-grid,.services-grid{grid-template-columns:1fr;}
  .work-grid,.all-grid{grid-template-columns:1fr;}
  /* tighter section padding */
  #studio,#philosophy,#cta{padding-top:88px;padding-bottom:88px;}
  .studio-headline,.cap-headline,.cta-headline{font-size:clamp(1.6rem,7.5vw,2.4rem);}
  /* project pages */
  .proj-meta-bar{flex-wrap:wrap;gap:18px;}
  .proj-hero-title{font-size:clamp(2rem,9vw,3rem);}
  /* comfortable tap targets in the nav */
  .nav-burger{padding:10px;margin:-6px;}
}