/* =====================================================================
   CommunityOS — responsive.css
   Mobile-considered for every section. Breakpoints: 1024 / 768 / 540
   ===================================================================== */

@media (max-width: 1024px) {
  .hero__inner { grid-template-columns: 1fr; gap: var(--s-6); }
  .hpanel { max-width: 460px; }
  .split { grid-template-columns: 1fr; gap: var(--s-7); }
  .map-card { grid-template-columns: 1fr; }
  #mapPreview { min-height: 320px; }
  .foot__main { grid-template-columns: 1fr 1fr; }
  .photo-mosaic { grid-template-columns: repeat(4,1fr); }
}

@media (max-width: 768px) {
  :root { --nav-h: 64px; }

  /* Nav collapses to burger */
  .nav__links, .nav__weather { display: none; }
  .nav__burger { display: grid; place-items:center; }
  .nav__links.is-open {
    display: flex; flex-direction: column; align-items: stretch; gap: 2px;
    position: fixed; top: var(--nav-h); left:0; right:0; z-index:49;
    background: rgba(255,255,255,.98); backdrop-filter: blur(16px);
    padding: var(--s-4) var(--gutter); border-bottom:1px solid var(--line); box-shadow: var(--sh-2);
  }
  .nav__links.is-open a { padding: 12px 8px; font-size:1rem; }

  .hero { min-height: auto; }
  .hero__inner { padding-block: var(--s-7); }
  .hsearch__box .btn span { display:none; }     /* icon-only search button */
  .hsearch__box .btn { padding: 12px; }

  .week-grid { grid-template-columns: 1fr 1fr; }
  .explore-grid { grid-template-columns: 1fr 1fr; }
  .feed-grid { grid-template-columns: 1fr; }
  .news-item { grid-template-columns: 80px 1fr; }
  .foot__main { grid-template-columns: 1fr; }
  .foot__cta { grid-template-columns: 1fr 1fr; }
  .photo-mosaic { grid-template-columns: repeat(3,1fr); grid-auto-rows: 110px; }
  .section { padding-block: var(--s-7); }
  .section-head { flex-direction: column; align-items:flex-start; gap: var(--s-2); }
}

@media (max-width: 540px) {
  .week-grid, .explore-grid { grid-template-columns: 1fr; }
  .foot__cta { grid-template-columns: 1fr; }
  .countdown__grid { gap: var(--s-1); }
  .countdown__n { font-size: 1.25rem; }
  .photo-mosaic { grid-template-columns: repeat(2,1fr); }
  .photo.is-big { grid-column: span 2; grid-row: span 1; }
  .hpanel__temp { font-size: 2.1rem; }
  .brand__sub { display:none; }
}