/* Responsive styles */

@media (max-width: 900px) {
  .site-main { padding-top: 104px; }
}

@media (max-width: 680px) {`n  .branding { position: static; transform: none; }
  /* Header + mobile menu */
  .header-row { height: 72px; flex-direction: row; align-items: center; position: relative; 
  /* Mobile dropdown link alignment & styling */
  .site-nav ul { align-items: stretch; }
  .site-nav li { width: 100%; }
  .site-nav a, .site-nav a.active { display: block; width: 100%; padding: 10px 4%; text-align: left; border-bottom: 0 !important; }
}
  
  .site-logo { height: 56px; }
  .nav-toggle-label { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 28px; cursor: pointer; margin-left: auto; margin-right: 4%; }
  .nav-toggle-label span, .nav-toggle-label span::before, .nav-toggle-label span::after {
    content: ""; display: block; width: 24px; height: 2px; background: var(--text); position: relative;
  }
  .nav-toggle-label span::before { position: absolute; top: -7px; }
  .nav-toggle-label span::after { position: absolute; top: 7px; }
  .site-nav { position: absolute; top: 72px; left: 0; right: 0; width: 100%; overflow: hidden; max-height: 0; transition: max-height .2s ease; background: #fff; border-bottom: 1px solid var(--border); z-index: 999; }
  .site-nav ul { flex-direction: column; align-items: flex-start; gap: 8px; padding: 10px 4%; }
  .nav-toggle:checked ~ .site-nav { max-height: 240px; }
  .site-main { padding-top: 96px; }

  /* Hero */
  .hero-cover { text-align: center; padding: 96px 0 72px; }
  .hero h1, .hero p { display: none; }
  .zone-banner { display: inline-flex; justify-content: center; }

  /* Other blocks */
  .ba-item img, .gallery-item img { height: 260px; }
  .footer-row { flex-direction: column; align-items: flex-start; }
  .ba-pair { grid-template-columns: 1fr; }
  .site-nav ul { gap: 12px; }
  .btn { width: 100%; text-align: center; }
}