/* ============================================================
   responsive.css  ·  breakpoints
   ============================================================ */

@media (max-width:1000px){
  .grid-4{ grid-template-columns:repeat(2,1fr); }
  .site-footer .top{ grid-template-columns:1fr 1fr; }
}

@media (max-width:860px){
  .grid-3{ grid-template-columns:repeat(2,1fr); }
  .gallery{ grid-template-columns:repeat(2,1fr); }

  /* mobile navigation */
  .nav-toggle{ display:block; }
  .nav{
    position:absolute; top:calc(var(--header-h) + 18px); left:0; right:0; margin:0;
    flex-direction:column; align-items:stretch; gap:0;
    background:#fff; border-bottom:1px solid var(--line);
    padding:8px 16px 16px; display:none;
    box-shadow:0 20px 30px -22px rgba(20,51,107,.4);
  }
  .nav.open{ display:flex; }
  .nav a{ padding:13px 12px; border-radius:8px; }
  .nav a.active::after{ display:none; }
}

@media (max-width:640px){
  body{ font-size:16px; }
  .section{ padding:54px 0; }
  .grid-2, .grid-3, .grid-4{ grid-template-columns:1fr; }
  .gallery{ grid-template-columns:1fr 1fr; }
  .cta-band{ padding:34px 22px; }
  .site-footer .top{ grid-template-columns:1fr; gap:26px; }
  .list-row{ flex-direction:column; gap:10px; }
  .list-row .date{ width:auto; text-align:left; display:flex; gap:8px; align-items:baseline; }
  .hero .cta{ flex-direction:column; }
  .hero .cta .btn{ text-align:center; }
}

@media (max-width:400px){
  .wrap{ padding:0 18px; }
  .brand .bt .n1{ font-size:16px; }
}