/* ============================================================
   ABOUT SPACES — responsive.css
   Breakpoints: 1180 / 1024 / 860 / 640 / 480 / 360
   ============================================================ */

@media (max-width:1180px){
  .main-nav ul{gap:1.3rem}
}

@media (max-width:1024px){
  .main-nav{display:none}
  .header-cta{margin-left:auto}
  .burger{display:block}
  .hero-grid,.intro-grid,.viz-grid,.story-grid,.chapter-grid,.ph-grid{grid-template-columns:1fr;gap:3rem}
  .chapter-grid.reverse .chapter-media{order:0}
  .hero-right{max-width:560px}
  .hero-mini{left:auto;right:-6%}
  .svc-block{grid-template-columns:1fr}
  .svc-block.rev .svc-media{order:0}
  .ba-grid{grid-template-columns:1fr 1fr}
  .j-grid{grid-template-columns:1fr 1fr}
  .j-feature{grid-column:span 2}
  .j-feature a{grid-template-columns:1fr}
  .cm-grid{grid-template-columns:repeat(3,1fr);row-gap:1.4rem}
  .stack-card{grid-template-columns:90px 1fr;gap:1.4rem}
  .sc-tag{display:none}
  .m-cols{grid-template-columns:1fr 1fr}
  .why-grid,.why-grid.three{grid-template-columns:1fr 1fr}
  .plan-block{grid-template-columns:1fr}
  .studio-notes{grid-template-columns:1fr 1fr}
}

@media (max-width:860px){
  .pgrid{grid-template-columns:1fr 1fr}
  .span-5,.span-7{grid-column:span 1}
  .offset{margin-top:0}
  .stats-grid{grid-template-columns:1fr 1fr;gap:3rem 1rem}
  .val-list{grid-template-columns:1fr 1fr}
  .svc-duo{grid-template-columns:1fr}
  .masonry{columns:2}
  .cp-grid{grid-template-columns:1fr}
  .cs-grid{grid-template-columns:1fr;gap:2.4rem}
  .foot-grid{grid-template-columns:1fr 1fr}
  .serv-index a{grid-template-columns:54px 1fr 34px}
  .si-tag{display:none}
  .hero-right .badge{right:6px;bottom:-24px}
  .hero-chip{right:8px}
  .est-grid{grid-template-columns:1fr}
  .est-result{position:static}
  .studio-collage{grid-template-columns:1fr 1fr}
  .sc-1{grid-column:span 2}
  .sc-2,.sc-3{grid-column:span 1}
}

@media (max-width:640px){
  body{font-size:15px}
  .hero{padding-top:7rem}
  .hero-meta{gap:1.2rem}
  .hero-ctas .btn{width:100%;justify-content:center}
  .hero-mini{display:none}
  .ba-grid{grid-template-columns:1fr}
  .j-grid{grid-template-columns:1fr}
  .j-feature{grid-column:span 1}
  .case-duo,.case-duo-img{grid-template-columns:1fr}
  .f-row{grid-template-columns:1fr}
  .cm-grid{grid-template-columns:1fr 1fr}
  .m-cols{grid-template-columns:1fr}
  .sec-head.split{flex-direction:column;align-items:flex-start}
  .stack-card{position:static;grid-template-columns:1fr;gap:.8rem}
  .stack{gap:1rem}
  .mat-card{flex-basis:70vw}
  .cta-band .badge{display:none}
  .why-grid,.why-grid.three{grid-template-columns:1fr}
  .studio-notes{grid-template-columns:1fr}
  .sc-chip{position:static;transform:none;margin-top:1.3rem;white-space:normal}
  .est-finish{grid-template-columns:1fr}
}

@media (max-width:480px){
  .pgrid{grid-template-columns:1fr}
  .masonry{columns:1}
  .val-list{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .hero-title{font-size:clamp(2.5rem,11vw,3.2rem)}
  .mn-list a{padding:.8rem 0}
  .whatsapp{right:1rem;bottom:1rem;width:52px;height:52px}
  .whatsapp:hover{width:52px}
  .whatsapp:hover .wa-label{max-width:0;margin:0}
  .to-top{left:1rem;bottom:1rem;width:46px;height:46px}
  .t-btn{width:46px;height:46px}
  .lb-prev{left:.7rem}.lb-next{right:.7rem}
  .nb-inner{flex-direction:column;align-items:flex-start}
  .intro-facts{grid-template-columns:repeat(3,1fr);gap:.6rem}
  .est-actions .btn{width:100%;justify-content:center}
  .f-checkboxes{grid-template-columns:1fr}
}

@media (max-width:360px){
  :root{--pad:1rem}
  .logo-word{letter-spacing:.18em}
  .header-cta{font-size:.56rem;padding:.65rem 1rem}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html.preloading *,html.preloading *::before,html.preloading *::after{animation-play-state:running !important}
  [data-reveal],.rl>span,.mask .rl>span{opacity:1 !important;transform:none !important}
  .preloader,.page-curtain,.cursor-dot,.cursor-ring{display:none !important}
  html.has-cursor *{cursor:auto !important}
  .ticker-track,.badge svg,.foot-ghost{animation:none !important}
  .shimmer{animation:none;background:none;color:var(--em-2)}
  .stack-card{position:static}
  .plan-svg :is(path,circle){stroke-dashoffset:0 !important}
  .plan-svg .pl,.plan-svg .pfade{opacity:.75 !important}
  .hero-media img,.ph-media img{animation:none !important}
}