@media(max-width:1100px){
  .header-inner{grid-template-columns:1fr auto}
  .site-nav,.header-cta{display:none}
  .menu-toggle{display:block}
  .menu-open .site-nav{display:flex;position:fixed;inset:0;z-index:40;background:rgba(18,17,16,.98);flex-direction:column;align-items:center;justify-content:center;gap:30px;font-size:1.35rem}
  .portfolio-grid{grid-template-columns:1fr;gap:30px}
  .case-meta{grid-template-columns:1fr}
  .portfolio-cta{align-items:flex-start;flex-direction:column}
  .site-footer{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .container{width:min(calc(100% - 24px),var(--max-width))}
  .header-inner{height:74px}
  .brand-subline{display:none}
  .portfolio-hero{padding:45px 0 80px}
  .portfolio-topline{gap:12px;align-items:flex-start;flex-direction:column}
  .portfolio-hero h1{font-size:clamp(4.5rem,21vw,7rem)}
  .project-nav-row{grid-template-columns:44px 1fr auto}
  .project-nav-row small{display:none}
  .project-nav-row strong{font-size:1.35rem}
  .case-study{padding:90px 0}
  .case-header h2{font-size:clamp(3.8rem,17vw,6rem)}
  .comparison-toolbar{grid-template-columns:1fr 1fr}
  .comparison-toolbar span:nth-child(2){display:none}
  .comparison-canvas{aspect-ratio:4/3}
  .new-image{width:calc(100vw - 24px)}
  .comparison-handle{width:46px;height:46px;border-width:4px}
  .case-actions .button{width:100%}
  .portfolio-cta{padding:90px 0}
  .portfolio-cta h2{font-size:clamp(4rem,18vw,6rem)}
  .site-footer{grid-template-columns:1fr;gap:16px}
}