/* Wide screens and the BIR badge (owner request, 2026-10-23; docs/wide-screens.md).
   Loaded last on every page with the site footer (28 pages, including the legal archive).
   - The BIR Registration Seal Badge sits in the footer on every page (BIR asks online businesses
     to show it where the public can see and scan it). Phones get it stacked.
   - From 1280px wide: the footer runs edge to edge, and the home page and listings page grow with
     the screen (about 3% side space, content up to 2560px) instead of stopping at 1180px.
   Phones and tablets keep their current layout. */

/* BIR badge strip, all screen sizes. */
.footer-bir-wrap { display: flex; justify-content: center; margin-top: 36px; padding: 0 16px; box-sizing: border-box; }
.footer-bir { display: flex; align-items: center; gap: 22px; padding: 14px 18px 14px 14px; border-radius: 16px; background: #fff; box-shadow: 0 0 0 3px rgba(43, 179, 163, .55), 0 14px 34px rgba(0, 0, 0, .35); color: #1c2430; text-align: left; }
.footer-bir-seal { width: 96px; height: auto; border-radius: 8px; }
.footer-bir-mark { width: 136px; height: auto; }
.footer-bir-text { display: flex; flex-direction: column; gap: 4px; max-width: 290px; }
.footer-bir-text strong { color: #0b3d6e; font-size: 16px; font-weight: 700; }
.footer-bir-text span { color: #3b4552; font-size: 13.5px; line-height: 1.35; }
.footer-bir-text span + span { color: #5a6472; font-size: 12.5px; }
.footer-bir-qr { display: flex; flex-direction: column; align-items: center; gap: 4px; color: #3b3f6b; text-decoration: none; }
.footer-bir-qr img { width: 112px; height: 112px; }
.footer-bir-qr small { font-size: 10px; font-weight: 600; letter-spacing: .1px; }
.footer-bir-qr:focus-visible { outline: 3px solid #75a6a0; outline-offset: 3px; border-radius: 6px; }
.tp-site-footer .footer-bir-wrap { margin-top: 36px; }

/* Phones (owner choice "Option C", 2026-10-23): a compact badge (seal, BIR mark and QR in one row,
   the words under them), the link groups in 2 columns, and the © line centred. */
@media (max-width: 760px) {
  .footer-bir { flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 8px; width: 100%; max-width: 380px; box-sizing: border-box; padding: 14px; }
  .footer-bir-seal { order: 1; width: 62px; border-radius: 6px; }
  .footer-bir-mark { order: 2; width: 90px; }
  .footer-bir-qr { order: 3; width: 104px; }
  .footer-bir-qr img { width: 104px; height: 104px; }
  .footer-bir-qr small { font-size: 8.5px; letter-spacing: -.1px; text-align: center; }
  .footer-bir-text { order: 4; flex: 1 0 100%; max-width: none; align-items: center; text-align: center; gap: 3px; }
  .footer-bir-text strong { font-size: 15px; }
  /* Team-style footers already space their contents from the edges. */
  .tp-site-footer .footer-bir-wrap { padding: 0; }
}
/* Small phones (about 320px): smaller pieces so the seal, mark and QR stay in one row. */
@media (max-width: 360px) {
  .footer-bir { gap: 8px 6px; padding: 12px; }
  .footer-bir-seal { width: 52px; }
  .footer-bir-mark { width: 72px; }
  .footer-bir-qr, .footer-bir-qr img { width: 88px; height: auto; }
  .footer-bir-text span + span { font-size: 11px; }
}
@media (max-width: 620px) {
  .site-footer .footer-grid-expanded, .tp-site-footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 28px 16px !important; }
  .site-footer .footer-brand-block, .tp-site-footer .footer-brand-block { grid-column: 1 / -1; }
  .site-footer .footer-bottom, .tp-site-footer .footer-bottom { flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; }
}

@media (min-width: 1280px) {
  /* Footer: edge to edge, contents as wide as the page. */
  .site-footer, .tp-site-footer { width: 100% !important; margin: 72px 0 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
  .site-footer > .container, .site-footer > .footer-bir-wrap { width: min(calc(100% - 2 * clamp(20px, 3vw, 80px)), 2560px); margin-left: auto; margin-right: auto; }
  .site-footer > .footer-bir-wrap { padding: 0; }
  .tp-site-footer > * { width: min(calc(100% - 2 * clamp(20px, 3vw, 80px)), 2560px); margin-left: auto !important; margin-right: auto !important; box-sizing: border-box; }

  /* Home page and listings page: the page grows with the screen. */
  body.home-v2 #exploreView .container, body.catalog-body .container { width: min(calc(100% - 2 * clamp(20px, 3vw, 80px)), 2560px); }
  body.home-v2 .site-header, body.catalog-body .site-header { width: min(calc(100% - 2 * clamp(20px, 3vw, 80px) + 60px), calc(100% - 24px), 2620px); }

  /* Home: the dark Featured box keeps its 50px overhang on each side of the page. */
  body.home-v2 #exploreView #featuredSection.featured-full-bleed { width: min(calc(100% - 2 * clamp(20px, 3vw, 80px) + 100px), calc(100% - 24px), 2660px); }
  body.home-v2 #exploreView #featuredSection.featured-full-bleed > .section-heading { width: calc(100% - 100px); }
  body.home-v2 #exploreView #featuredSection .featured-carousel { width: calc(100% - 60px); }
  body.home-v2 #exploreView #featuredSection .featured-dock-rail-wrap { width: calc(100% - 40px) !important; }
  body.home-v2 #exploreView #featuredSection .featured-carousel-foot { width: calc(100% - 40px); }

  /* Listings: a bigger map (about 772 × 864 at 1920px) and 3 columns of cards beside it. */
  body.catalog-body .catalog-results-panel.has-split-map { grid-template-columns: minmax(0, 1fr) clamp(420px, calc(60vw - 380px), 1200px) !important; column-gap: 22px; }
  body.catalog-body .catalog-results-panel.has-split-map > #catalogGrid:not(.catalog-list-mode) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 20px; }
  body.catalog-body .catalog-results-panel.has-split-map .zprm-frame { height: min(clamp(560px, 45vw, 1300px), calc(100vh - 120px)); }
  body.catalog-body .catalog-results-panel.has-split-map .zprm-locked { min-height: min(clamp(560px, 45vw, 1300px), calc(100vh - 120px)); }
}

/* Home rows show more cards side by side as the screen gets wider, keeping the half card at the
   end that says the row scrolls (home-rows.css: 4½ cards and 5 towns below 1700px). */
@media (min-width: 1700px) {
  body.home-v2 #exploreView .home-row-track { grid-auto-columns: calc((100% - 80px) / 5.5) !important; }
  body.home-v2 #exploreView .home-area-grid { grid-auto-columns: calc((100% - 70px) / 6) !important; }
  body.home-v2 #exploreView #featuredSection .featured-spotlight, body.home-v2 #exploreView #featuredSection .featured-spotlight-media { min-height: clamp(520px, 30vw, 760px); }
}
@media (min-width: 2040px) {
  body.home-v2 #exploreView .home-row-track { grid-auto-columns: calc((100% - 96px) / 6.5) !important; }
  body.home-v2 #exploreView .home-area-grid { grid-auto-columns: calc((100% - 84px) / 7) !important; }
}
@media (min-width: 2240px) {
  body.catalog-body .catalog-results-panel.has-split-map > #catalogGrid:not(.catalog-list-mode) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (min-width: 2380px) {
  body.home-v2 #exploreView .home-row-track { grid-auto-columns: calc((100% - 112px) / 7.5) !important; }
  body.home-v2 #exploreView .home-area-grid { grid-auto-columns: calc((100% - 98px) / 8) !important; }
  body.home-v2 #exploreView #listingGrid { grid-template-columns: repeat(8, minmax(0, 1fr)) !important; }
}
@media (min-width: 2700px) {
  body.home-v2 #exploreView .home-row-track { grid-auto-columns: calc((100% - 128px) / 8.5) !important; }
  body.home-v2 #exploreView .home-area-grid { grid-auto-columns: calc((100% - 112px) / 9) !important; }
  body.catalog-body .catalog-results-panel.has-split-map > #catalogGrid:not(.catalog-list-mode) { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}
