@media (max-width: 1220px) {
  :root {
    --sidebar-width: 136px;
    --content-width: 720px;
  }
  .content { padding-right: 1.5rem; }
}
@media (max-width: 960px) {
  :root { --header-height: 130px; }
  .menu-toggle { display: inline-flex; }
  .site-frame { display: block; }
  .side-nav {
    position: fixed;
    inset: var(--header-height) auto 0 0;
    width: min(82vw, 320px);
    min-height: auto;
    transform: translateX(-105%);
    transition: transform .25s ease;
    z-index: 25;
    overflow-y: auto;
    padding-bottom: 3rem;
  }
  body.nav-open .side-nav { transform: translateX(0); }
  body.nav-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    z-index: 20;
  }
  .content { padding: 1.5rem 1.25rem 3rem; }
  .media-copy,
  .two-col,
  .video-block,
  .price-row,
  .product-card { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ghost-row { grid-template-columns: 1fr; gap: .4rem; }
  .price-row__thumb { max-width: 280px; }
  .lang-switch {
    right: 4.5rem;
    top: .85rem;
    font-size: .88rem;
  }
}
@media (max-width: 640px) {
  :root { --header-height: 108px; }
  h1 { font-size: 1.9rem; }
  h2 { font-size: 1.15rem; }
  .gallery-grid { grid-template-columns: 1fr; }
  .portal-stage { padding: 1rem; }
  .portal-actions {
    width: 100%;
    flex-direction: column;
  }
  .portal-button { width: 100%; }
  .lang-switch {
    position: absolute;
    right: 4rem;
    top: .5rem;
    padding: .35rem .6rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}


/* UI/UX optimisation pass */

@media (max-width: 960px) {
  .action-grid,
  .contact-grid {
    grid-template-columns: 1fr;
  }
  .reference-list,
  .sitemap-list {
    columns: 1;
  }
  .side-nav {
    padding-bottom: calc(3rem + env(safe-area-inset-bottom));
  }
}
@media (max-width: 640px) {
  .btn-row {
    flex-direction: column;
    align-items: stretch;
  }
  .btn,
  .btn--gold,
  .btn--ghost {
    width: 100%;
  }
  .side-nav__menu a {
    padding: .45rem 0;
  }
}