/* ==========================================================================
   Responsive refinements (Bootstrap breakpoints: sm 576, md 768, lg 992,
   xl 1200, xxl 1400). Component-level breakpoints live with components;
   this file holds cross-cutting adjustments verified at 360/390/768/1024/
   1366/1440+ widths.
   ========================================================================== */

/* ≤ 1199px — navigation collapses to off-canvas */
@media (max-width: 1199.98px) {
  :root { --header-h: 76px; }
  .brand-logo img { width: 56px; }
}

/* ≤ 991px — tablets */
@media (max-width: 991.98px) {
  .hero { min-height: auto; }
  .hero__content { padding-block: 7rem 2.5rem; }
  .split-media__caption { right: 1rem; }
  .inquiry-panel { margin-top: var(--space-5); }
  .article-featured .article-card__media { aspect-ratio: 3 / 2; }
}

/* ≤ 767px — large phones */
@media (max-width: 767.98px) {
  .section-head { margin-bottom: var(--space-5); }
  .dest-tile, .dest-tile--wide { aspect-ratio: 4 / 3.4; }
  .fact-list li { grid-template-columns: 1fr; gap: .25rem; }
  .cta-band::after { width: 26rem; height: 26rem; right: -14rem; }
  .footer-bottom { text-align: left; }
  .discovery { padding: var(--space-3) var(--space-3) var(--space-3); }
  .filter-bar { padding: var(--space-3); }
}

/* ≤ 400px — small phones (360/390) */
@media (max-width: 400px) {
  /* keep the name for assistive tech; hide it visually on the narrowest screens */
  .brand-logo__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .btn { --bs-btn-padding-x: 1.25rem; letter-spacing: .1em; }
  .property-card__body { padding: var(--space-3) 1.1rem; }
  .property-card__footer { flex-direction: column; align-items: flex-start; }
  .gallery-thumb { width: 76px; }
  .contact-item a, .contact-item span.value { font-size: 1.15rem; }
  .accordion-brand .accordion-button { font-size: 1.2rem; }
}

/* ≥ 1440px — wide desktop */
@media (min-width: 1440px) {
  :root { --container-max: 1320px; }
}

/* Print: strip chrome, keep content */
@media print {
  #site-header, .site-footer, .cta-band, .newsletter, .inquiry-panel, .share-links, .skip-link { display: none !important; }
  .page-hero, .hero { color: #000; background: none !important; padding: 1rem 0; min-height: 0; }
  .page-hero h1, .hero h1 { color: #000; }
  .page-hero::before, .hero::before, .page-hero__media, .hero__media { display: none; }
  .js .reveal { opacity: 1; transform: none; }
}
