/* ==========================================================================
   Responsive layer
   Breakpoints: 1180 (laptop) · 960 (tablet) · 720 (large phone) · 480 (phone)
   ========================================================================== */

@media (max-width: 1180px) {
  .nav__link { padding-inline: 9px; font-size: .9rem; }
  .nav__link::after { left: 9px; right: 9px; }
  .site-header__inner { gap: var(--s5); }
  .hero__content { grid-column: 1 / span 7; }
  .hero__media { grid-column: 8 / -1; }
  .footer-brand { grid-column: 1 / span 12; }
  .footer-col, .footer-col--wide { grid-column: span 3; }
  .footer-col--first { grid-column-start: auto; }
}

/* Tablet ------------------------------------------------------------------- */
@media (max-width: 960px) {
  :root { --header-h: 64px; }

  .nav, .header-cta { display: none; }
  .menu-toggle { display: inline-flex; }

  .mobile-nav {
    display: block; position: fixed; inset: calc(var(--header-h)) 0 0 0; z-index: 49;
    background: var(--surface); overflow-y: auto; overscroll-behavior: contain;
    visibility: hidden; opacity: 0; transform: translateY(-8px);
    transition: opacity .22s var(--ease), transform .22s var(--ease), visibility 0s linear .22s;
  }
  .mobile-nav.is-open { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
  .mobile-nav__inner { padding: var(--s5) var(--gutter) var(--s8); display: flex; flex-direction: column; min-height: 100%; }
  .mobile-nav__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ink); }
  .mobile-nav__list a {
    display: flex; justify-content: space-between; align-items: center; padding: var(--s4) 0;
    border-bottom: 1px solid var(--line); text-decoration: none;
    font-family: var(--font-display); font-stretch: 92%; font-weight: 600; font-size: 1.375rem; letter-spacing: -0.01em;
  }
  .mobile-nav__list a[aria-current="page"] { color: var(--accent); }
  .mobile-nav__list .icon { font-size: 20px; color: var(--muted); }
  .mobile-nav__cta { margin-top: var(--s6); }
  .mobile-nav__cta .btn { width: 100%; }
  .mobile-nav__meta { margin-top: auto; padding-top: var(--s7); display: grid; gap: var(--s2); font-size: var(--fs-sm); color: var(--muted); }
  .mobile-nav__meta a { text-decoration: none; color: var(--text); }
  .mobile-nav .lang-switch { margin-top: var(--s4); }
  .mobile-nav .lang-switch button { color: var(--muted); border: 1px solid var(--line); padding: 8px 12px; }
  .mobile-nav .lang-switch button[aria-pressed="true"] { color: var(--ink); border-color: var(--ink); box-shadow: none; }

  .topbar__item--hours { display: none; }

  .hero__grid { grid-template-columns: 1fr; }
  .hero__content { grid-column: 1; padding-block: var(--s8) var(--s7); }
  .hero__media { grid-column: 1; justify-self: center; margin-block: 0 var(--s7); }
  .hero__bg::after { background: color-mix(in srgb, var(--ink) 76%, transparent); }

  .hero-index__list { grid-template-columns: 1fr; }
  .hero-index__item + .hero-index__item { border-left: 0; border-top: 1px solid var(--line); }
  .hero-index__item + .hero-index__item .hero-index__link { padding-left: 0; }
  .hero-index__link { padding-block: var(--s4); }

  .section-head { margin-bottom: var(--s7); row-gap: var(--s4); }
  .section-head__title, .section-head__aside { grid-column: 1 / -1; }

  .page-header__title, .page-header__aside { grid-column: 1 / -1; }
  .page-header__aside { margin-top: var(--s5); }

  .split__lead, .split__body { grid-column: 1 / -1; }
  .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fact:nth-child(3) { padding-left: 0; border-left: 0; }
  .fact:nth-child(n+3) { border-top: 1px solid var(--line); margin-top: var(--s5); }

  .vm { grid-template-columns: 1fr; }
  .vm__item { padding-right: 0; }
  .vm__item + .vm__item { padding-left: 0; border-left: 0; border-top: 1px solid var(--line-on-ink); margin-top: var(--s7); }

  .values { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--s6); }
  .value:nth-child(odd) { padding-left: 0; border-left: 0; }

  .process__intro { grid-column: 1 / -1; position: static; }
  .process__main { grid-column: 1 / -1; }

  .mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 180px; }
  .mosaic__item:first-child { grid-column: span 2; grid-row: span 1; }
  .mosaic__item:nth-child(n+6) { display: none; }

  .cta-band__text, .cta-band__actions { grid-column: 1 / -1; }
  .cta-band__actions { justify-self: start; flex-direction: row; flex-wrap: wrap; margin-top: var(--s6); }

  .contact-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-strip__item:nth-child(3) { padding-left: 0; border-left: 0; }
  .contact-strip__item:nth-child(n+3) { margin-top: var(--s5); border-top: 1px solid var(--line); }

  .about-layout__aside, .about-layout__main { grid-column: 1 / -1; }
  .blocks { grid-template-columns: 1fr; }
  .block + .block { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); }

  .feature__media { grid-column: 1 / -1; min-height: 240px; }
  .feature__body { grid-column: 1 / -1; padding: var(--s6) var(--gutter); }

  .board__link { grid-template-columns: 110px minmax(0, 1fr) 24px; row-gap: var(--s2); }
  .board__date { grid-column: 1; }
  .board__tag { grid-column: 2; }
  .board__main { grid-column: 1 / 3; }
  .board__link .icon { grid-column: 3; grid-row: 1 / span 2; }
  .board__row--skeleton { grid-template-columns: 1fr; }

  .article__main, .article__aside { grid-column: 1 / -1; }
  .article__aside { order: -1; }
  .meta-list { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s5); }

  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .people { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .contact-layout__info, .contact-layout__map { grid-column: 1 / -1; }
  .form-layout__aside, .form-layout__main { grid-column: 1 / -1; }

  .footer-col, .footer-col--wide { grid-column: span 6; }

  .error-page__code, .error-page__body { grid-column: 1 / -1; }
  .error-page__body { margin-top: var(--s6); }

  .lightbox__stage { padding: 0 var(--s2); }
  .lightbox__nav { top: auto; bottom: calc(-1 * var(--s2)); transform: translateY(100%); }
}

/* Large phone ---------------------------------------------------------------- */
@media (max-width: 720px) {
  .topbar__item--email { display: none; }

  .brand__logo { height: 32px; max-width: 150px; }

  .hero__content .btn-row .btn { flex: 1 1 auto; }

  .facts { grid-template-columns: 1fr 1fr; }

  .checklist { grid-template-columns: 1fr; }
  .step { grid-template-columns: 48px 1fr; gap: var(--s3); }

  .values { grid-template-columns: 1fr; }
  .value, .value + .value { padding-left: 0; border-left: 0; }
  .value + .value { border-top: 1px solid var(--line-on-ink); padding-top: var(--s5); }
  .values--light .value + .value { border-top-color: var(--line); }

  .contact-strip { grid-template-columns: 1fr; }
  .contact-strip__item, .contact-strip__item + .contact-strip__item { padding-left: 0; border-left: 0; }
  .contact-strip__item + .contact-strip__item { margin-top: var(--s4); border-top: 1px solid var(--line); }

  .figure-row { grid-template-columns: 1fr; }
  .figure-row figure:first-child { aspect-ratio: 4 / 3; }

  .people { grid-template-columns: 1fr; gap: var(--s6); }
  .fields { grid-template-columns: 1fr; }

  .filters { gap: var(--s2); }
  .filters__spacer { display: none; }
  .search, .search input { width: 100%; }

  .meta-list { grid-template-columns: 1fr; }

  .footer-col, .footer-col--wide { grid-column: 1 / -1; }
  .site-footer__top { padding-block: var(--s8) var(--s7); }

  .empty { grid-template-columns: 1fr; gap: var(--s4); }
  .cta-band__actions .btn { flex: 1 1 auto; }
}

/* Phone ---------------------------------------------------------------------- */
@media (max-width: 480px) {
  .topbar__info { gap: var(--s4); }
  .gallery-grid { grid-template-columns: 1fr; }
  .mosaic { grid-template-columns: 1fr 1fr; grid-auto-rows: 130px; }
  .board__link { grid-template-columns: 1fr 24px; }
  .board__date, .board__tag { grid-column: 1; }
  .board__tag { grid-row: 1; justify-self: end; grid-column: 1; }
  .board__main { grid-column: 1; }
  .board__link .icon { grid-column: 2; }
  .person { grid-template-columns: 80px 1fr; }
  .person__photo, .person__initials { width: 80px; height: 100px; }
  .form-actions .btn { width: 100%; }
  .error-page__code { font-size: 6.5rem; }
}

@media (min-width: 961px) {
  .mobile-nav { display: none !important; }
}

@media print {
  .topbar, .site-header, .site-footer, .cta-band, .lightbox, .notify-bar { display: none !important; }
  body { background: #fff; }
}