@charset "UTF-8";
/* =========================================================================
   CIRE verticals design system
   -------------------------------------------------------------------------
   Source of truth : mockups/cire-global-home-mockup.html,
                     cire-global-markets-mockup.html, cire-market-mockup.html,
                     cire-market-zero-inventory-mockup.html  (all approved)
   Standards       : BRAND.md palette - FINDINGS-typography.md section 7
                     nine-role scale - ALIGNMENT-SPEC D1 container
   Enqueued by     : themes/cire/functions.php, dependency chain
                     neutrino_styles -> cire-luxury -> style -> cire-header
                     so this file prints LAST on every template.

   WHAT CHANGED BETWEEN THE MOCKUP AND THIS FILE, AND WHY
   -------------------------------------------------------------------------
   The mockups are standalone documents. This file has to live inside
   css/app.css (1.17 MB, compiled), style.css (hand-written), cire-luxury.css
   (218 KB) and cire-header.css. Four deliberate differences:

   1. NO GLOBAL RESET. The mockups open with
        *{margin:0;padding:0;box-sizing:border-box}  and  body{...}  and
        img{display:block}
      Shipping that from a sheet that prints last would restyle the parent's
      masthead, drawer, footer and every plugin widget on EVERY page of the
      site, including the Caribbean pages that pay the bills. The reset here
      is scoped to .cg-page and enumerates only the elements our own markup
      uses.

   2. TOKENS ARE PREFIXED --cg-*. The mockups declare --white/--gold/--charcoal
      on :root. A :root block printing last would redefine any same-named
      custom property the parent reads, sitewide and invisibly. Every token
      here is --cg- prefixed and declared on .cg-page, not :root, so it cannot
      escape a vertical page.

   3. --cg-gray-med is #6d6f72, not the mockups' #76787b. Nick approved
      2026-08-16: #76787b on white is 4.43:1 and misses WCAG AA by 0.07.
      #6d6f72 clears it (4.72:1) at no visual cost. It carries the whole
      secondary layer - eyebrows, card meta, footer links, dt labels.

   4. Brand-audit polish folded in at build time rather than left as debt:
        .cg-btn line-height 1 -> 1.25   (blocker-list item 8: the hero ghost
                                         CTA wrapped to two lines with zero
                                         leading at 375)
        .cg-crumbs / .cg-stats__note off --cg-gray-light (2.2:1 and 2.36:1)
        .cg-foot-legal gets the live site's legal row styling (ship-blocker 1)

   FONT FACES ARE NOT LOADED HERE. header.php:33 already loads the variable
   "Playfair" from Google Fonts sitewide, and Proxima Nova is self-hosted by
   the platform. --cg-serif lists Playfair FIRST (the parent's --cire-serif
   lists "Playfair Display", which is a different family that never loads and
   silently falls through). --cg-sans repeats the parent's exact order so the
   same self-hosted face resolves.

   SANS WEIGHTS: 400 and 500 only. Proxima on this site ships three faces and
   no bold - 600-900 render identically to 500, 300 renders the Thin face.
   Emphasis is case + letterspacing, never weight.
   ========================================================================= */

/* -------------------------------------------------------------------------
   1. TOKENS - declared on the page wrapper, never on :root
   ---------------------------------------------------------------------- */
.cg-page {
  /* palette - BRAND.md exact, except --cg-gray-med (see header note 3) */
  --cg-white: #ffffff;
  --cg-panel: #f6f7f7;
  --cg-black: #000000;
  --cg-charcoal: #384249;
  --cg-gray-med: #6d6f72;
  --cg-gray-light: #a3aaad;
  --cg-gold: #c9ac77;
  --cg-gold-hover: #bda269;
  --cg-hairline: #e3e5e6;
  --cg-ink-on-gold: #2c3338;
  --cg-frame: #2c363d;
  --cg-scrim: 16, 20, 23;

  /* families */
  --cg-serif: "Playfair", Georgia, "Times New Roman", serif;
  --cg-sans: "Proxima Nova", "Proxima Nova W01", "Helvetica Neue", Helvetica, Arial, sans-serif;

  /* the nine roles - FINDINGS-typography.md section 7 */
  --cg-fs-display: clamp(2rem, 1.51rem + 2.10vw, 3.4rem);
  --cg-fs-h1: clamp(1.75rem, 1.49rem + 1.13vw, 2.5rem);
  --cg-fs-h2: clamp(1.5rem, 1.29rem + 0.90vw, 2.1rem);
  --cg-fs-h3: clamp(1.2rem, 1.09rem + 0.45vw, 1.5rem);
  --cg-fs-lead: clamp(1.0625rem, 1.04rem + .09vw, 1.125rem);
  --cg-fs-body: 1rem;
  --cg-fs-small: .875rem;
  --cg-fs-micro: .6875rem;
  --cg-fs-btn: .8125rem;
  --cg-lh-display: 1.08;
  --cg-lh-h1: 1.15;
  --cg-lh-h2: 1.20;
  --cg-lh-h3: 1.25;
  --cg-lh-lead: 1.60;
  --cg-lh-body: 1.65;
  --cg-lh-small: 1.50;
  --cg-lh-micro: 1.40;
  --cg-ls-caps: .16em;
}

/* -------------------------------------------------------------------------
   2. SCOPED RESET
   Only what our own markup contains. app.css sets margins on headings,
   paragraphs and lists from a compiled normalise layer; these rules print
   after it and are specificity 0,2,0 (.cg-page h2) so they beat the
   single-class rules that layer uses.
   ---------------------------------------------------------------------- */
.cg-page {
  background: var(--cg-white);
  color: var(--cg-charcoal);
  font-family: var(--cg-sans);
  font-size: var(--cg-fs-body);
  line-height: var(--cg-lh-body);
  -webkit-font-smoothing: antialiased;
}
.cg-page *,
.cg-page *::before,
.cg-page *::after { box-sizing: border-box; }

.cg-page h1, .cg-page h2, .cg-page h3, .cg-page h4, .cg-page h5, .cg-page h6,
.cg-page p, .cg-page ul, .cg-page ol, .cg-page li, .cg-page dl, .cg-page dt,
.cg-page dd, .cg-page figure, .cg-page blockquote, .cg-page fieldset,
.cg-page legend, .cg-page form {
  margin: 0;
  padding: 0;
}
.cg-page ul, .cg-page ol { list-style: none; }
.cg-page img, .cg-page svg { display: block; max-width: 100%; }
.cg-page a { color: inherit; }
/* app.css gives every <a> a red hover on some templates; ours declare their own */
.cg-page a:hover { text-decoration: none; }
.cg-page input, .cg-page textarea, .cg-page select, .cg-page button {
  font-family: inherit;
}

/* -------------------------------------------------------------------------
   3. D1 CONTAINER - ALIGNMENT-SPEC: ONE container, one scale
   ---------------------------------------------------------------------- */
.cg-page .cg-container {
  width: 100%;
  max-width: 1400px;
  margin-inline: auto;
  padding-inline: 16px;
}
@media (min-width: 729px)  { .cg-page .cg-container { padding-inline: 24px; } }
@media (min-width: 1024px) { .cg-page .cg-container { padding-inline: 40px; } }
@media (min-width: 1366px) { .cg-page .cg-container { padding-inline: 64px; } }

.cg-page .cg-band { padding-block: clamp(48px, 7vw, 104px); }
.cg-page .cg-band--tint { background: var(--cg-panel); }
.cg-page .cg-band--tight { padding-block: clamp(32px, 4.6vw, 64px); }

/* -------------------------------------------------------------------------
   4. TYPE ROLES
   ---------------------------------------------------------------------- */
.cg-page .cg-display {
  font-family: var(--cg-serif); font-weight: 500;
  font-size: var(--cg-fs-display); line-height: var(--cg-lh-display);
  letter-spacing: .005em; text-wrap: balance;
}
.cg-page .cg-h1 {
  font-family: var(--cg-serif); font-weight: 500;
  font-size: var(--cg-fs-h1); line-height: var(--cg-lh-h1);
  letter-spacing: .005em; text-wrap: balance;
}
.cg-page .cg-h2 {
  font-family: var(--cg-serif); font-weight: 500;
  font-size: var(--cg-fs-h2); line-height: var(--cg-lh-h2);
  letter-spacing: .005em; text-wrap: balance;
}
.cg-page .cg-h3 {
  font-family: var(--cg-serif); font-weight: 500;
  font-size: var(--cg-fs-h3); line-height: var(--cg-lh-h3);
}
.cg-page .cg-lead { font-size: var(--cg-fs-lead); line-height: var(--cg-lh-lead); font-weight: 400; }
.cg-page .cg-small { font-size: var(--cg-fs-small); line-height: var(--cg-lh-small); }
.cg-page .cg-micro {
  font-family: var(--cg-sans); font-size: var(--cg-fs-micro);
  line-height: var(--cg-lh-micro); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
}
.cg-page .cg-eyebrow { display: block; color: var(--cg-gray-med); margin-bottom: 10px; }
.cg-page .cg-muted { color: var(--cg-gray-med); }
.cg-page .cg-prose p + p { margin-top: 16px; }
.cg-page .cg-prose h2 { margin-top: clamp(28px, 3.4vw, 44px); }
.cg-page .cg-prose h3 { margin-top: clamp(20px, 2.4vw, 30px); }
.cg-page .cg-prose ul { margin-top: 14px; }
.cg-page .cg-prose li { position: relative; padding-left: 18px; margin-top: 8px; }
.cg-page .cg-prose li::before {
  content: ""; position: absolute; left: 0; top: .72em;
  width: 6px; height: 1px; background: var(--cg-gold);
}
.cg-page .cg-prose a { border-bottom: 1px solid var(--cg-gold); text-decoration: none; }
.cg-page .cg-prose a:hover { color: var(--cg-gold); }

/* -------------------------------------------------------------------------
   5. BUTTONS AND LINKS
   Gold fill is the ratified primary-button standard (Nick, 2026-08-16).
   line-height 1.25, not the mockups' 1: at 375 a long label wraps and 1
   collides the two lines. Padding trimmed 1px to hold the same button height.
   ---------------------------------------------------------------------- */
.cg-page .cg-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--cg-sans); font-size: var(--cg-fs-btn); line-height: 1.25;
  font-weight: 500; letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
  text-decoration: none; text-align: center;
  padding: 16px 30px; border: 1px solid var(--cg-gold);
  background: var(--cg-gold); color: var(--cg-ink-on-gold);
  border-radius: 0; cursor: pointer;
  transition: background 200ms ease, color 200ms ease, border-color 200ms ease;
}
.cg-page .cg-btn:hover,
.cg-page .cg-btn:focus { background: var(--cg-gold-hover); border-color: var(--cg-gold-hover); color: var(--cg-ink-on-gold); }
.cg-page .cg-btn--ghost { background: transparent; color: var(--cg-charcoal); border-color: var(--cg-charcoal); }
.cg-page .cg-btn--ghost:hover { background: transparent; border-color: var(--cg-gold); color: var(--cg-charcoal); }
.cg-page .cg-btn--onphoto { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .8); }
.cg-page .cg-btn--onphoto:hover { background: var(--cg-gold); border-color: var(--cg-gold); color: var(--cg-ink-on-gold); }
.cg-page .cg-btn--block { display: flex; width: 100%; }

.cg-page .cg-link {
  font-family: var(--cg-sans); font-size: var(--cg-fs-btn); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase; text-decoration: none;
  color: var(--cg-charcoal); border-bottom: 1px solid var(--cg-gold);
  padding-bottom: 4px; white-space: nowrap;
}
.cg-page .cg-link:hover { color: var(--cg-gold); }

.cg-page .cg-skip { position: absolute; left: -9999px; }
.cg-page .cg-skip:focus {
  left: 16px; top: 10px; z-index: 20; background: #fff;
  padding: 10px 14px; font-size: var(--cg-fs-btn);
}

/* -------------------------------------------------------------------------
   6. VERTICAL RAIL - the mini-site switcher
   ---------------------------------------------------------------------- */
.cg-page .cg-vrail { border-bottom: 1px solid var(--cg-hairline); background: var(--cg-white); }
.cg-page .cg-vrail__inner {
  display: flex; align-items: center; gap: 22px; overflow-x: auto;
  padding-block: 11px; -ms-overflow-style: none; scrollbar-width: none;
}
.cg-page .cg-vrail__inner::-webkit-scrollbar { display: none; }
.cg-page .cg-vrail a {
  font-size: var(--cg-fs-micro); font-weight: 500; letter-spacing: var(--cg-ls-caps);
  text-transform: uppercase; text-decoration: none; color: var(--cg-gray-med);
  white-space: nowrap; padding-bottom: 3px; border-bottom: 1px solid transparent;
}
.cg-page .cg-vrail a:hover { color: var(--cg-charcoal); }
.cg-page .cg-vrail a[aria-current] { color: var(--cg-charcoal); border-bottom-color: var(--cg-gold); }

/* breadcrumbs - --cg-gray-med, not --cg-gray-light (2.36:1 in the mockup) */
.cg-page .cg-crumbs { margin-bottom: 14px; color: var(--cg-gray-med); font-size: var(--cg-fs-micro);
  letter-spacing: .06em; text-transform: uppercase; }
.cg-page .cg-crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; }
.cg-page .cg-crumbs li + li::before { content: "\203A"; margin-right: 6px; color: var(--cg-gray-light); }
.cg-page .cg-crumbs a { text-decoration: none; color: var(--cg-gray-med); }
.cg-page .cg-crumbs a:hover { color: var(--cg-charcoal); }

/* -------------------------------------------------------------------------
   7. HERO - contrast law (dark ground, every text token white) +
      hero centring law (flex centre, symmetric padding-block)
   ---------------------------------------------------------------------- */
.cg-page .cg-hero {
  position: relative; isolation: isolate;
  min-height: clamp(460px, 72vh, 660px);
  display: flex; align-items: center; justify-content: center; text-align: center;
  background: var(--cg-frame); overflow: hidden;
}
.cg-page .cg-hero--market { min-height: clamp(420px, 64vh, 600px); }
/* zero-inventory: solid charcoal, no photo - the law is satisfied by construction */
.cg-page .cg-hero--plain { min-height: clamp(360px, 52vh, 480px); background: var(--cg-charcoal); }
.cg-page .cg-hero__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0;
}
.cg-page .cg-hero__scrim {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to bottom,
    rgba(var(--cg-scrim), .52) 0,
    rgba(var(--cg-scrim), .42) 42%,
    rgba(var(--cg-scrim), .66) 100%);
}
.cg-page .cg-hero--market .cg-hero__scrim {
  background: linear-gradient(to bottom,
    rgba(var(--cg-scrim), .54) 0,
    rgba(var(--cg-scrim), .44) 45%,
    rgba(var(--cg-scrim), .68) 100%);
}
.cg-page .cg-hero__inner {
  position: relative; z-index: 2;
  padding-block: clamp(56px, 10vw, 96px);
  max-width: 820px; margin-inline: auto;
}
.cg-page .cg-hero__rule {
  position: absolute; left: 50%; transform: translateX(-50%);
  bottom: clamp(28px, 5vw, 44px); width: clamp(80px, 18vw, 180px);
  height: 1px; background: rgba(201, 172, 119, .65);
}
/* EVERY text token on the dark ground, declared white. Nick's absolute law.
   EVERY ONE OF THESE IS SCOPED TO .cg-hero, and that scoping is load-bearing:
   cire_h1() emits the same .cg-hero__title / .cg-hero__kicker classes wherever
   it is called, including the WHITE-ground page head on the markets index and
   the listing grid. An unscoped `.cg-hero__title{color:#fff}` renders those
   h1s white on white - invisible headline, invisible keyword. Caught by the
   cascade audit at 375 before it shipped; do not un-scope these. */
.cg-page .cg-hero .cg-h1,
.cg-page .cg-hero .cg-display,
.cg-page .cg-hero .cg-hero__title { color: #fff; }
.cg-page .cg-hero .cg-hero__lead { color: rgba(255, 255, 255, .92); margin-top: 18px; max-width: 56ch; margin-inline: auto; }
.cg-page .cg-hero .cg-eyebrow,
.cg-page .cg-hero .cg-hero__kicker { color: rgba(255, 255, 255, .78); }
/* the same kicker on a white ground keeps its eyebrow role */
.cg-page .cg-hero__kicker { color: var(--cg-gray-med); }
.cg-page .cg-hero__lead { margin-top: 18px; max-width: 56ch; }
.cg-page .cg-hero__crumbs { color: rgba(255, 255, 255, .78); margin-bottom: 12px; }
.cg-page .cg-hero__crumbs a { color: rgba(255, 255, 255, .92); border-bottom: 1px solid rgba(201, 172, 119, .6); }
.cg-page .cg-hero__crumbs li + li::before { color: rgba(255, 255, 255, .6); }
.cg-page .cg-hero__cta { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.cg-page .cg-hero__credit {
  position: absolute; z-index: 2; right: 16px; bottom: 12px;
  color: rgba(255, 255, 255, .78); font-size: .625rem;
  letter-spacing: .2em; text-transform: uppercase;
}
@media (min-width: 1024px) { .cg-page .cg-hero__credit { right: 40px; bottom: 18px; } }

/* the H1 kicker: keyword inside the heading, eyebrow styling kept */
.cg-page .cg-hero__title .cg-hero__kicker { display: block; margin-bottom: 10px; }
.cg-page .cg-hero__title .cg-hero__line { display: block; }

.cg-page .cg-hero__search {
  margin-top: 26px; display: flex; background: #fff;
  max-width: 560px; margin-inline: auto;
}
.cg-page .cg-hero__search input {
  flex: 1; min-width: 0; border: 0; padding: 16px 18px;
  font: inherit; font-size: var(--cg-fs-small); color: var(--cg-charcoal);
}
.cg-page .cg-hero__search input:focus { outline: 2px solid var(--cg-gold); outline-offset: -2px; }
.cg-page .cg-hero__search button {
  border: 0; background: #fff; padding: 0 18px; cursor: pointer;
  color: var(--cg-charcoal); display: flex; align-items: center;
}

/* -------------------------------------------------------------------------
   8. PAGE HEAD (no-photo templates) AND SECTION HEADS
   ---------------------------------------------------------------------- */
.cg-page .cg-pagehead { padding-block: clamp(34px, 4.6vw, 64px) clamp(24px, 3.2vw, 40px); }
.cg-page .cg-pagehead__inner { max-width: 58ch; }
.cg-page .cg-pagehead .cg-lead { margin-top: 16px; color: var(--cg-gray-med); }

.cg-page .cg-head { margin-bottom: clamp(20px, 3vw, 32px); }
.cg-page .cg-head__row {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: 24px; flex-wrap: wrap;
}
.cg-page .cg-head p { margin-top: 10px; max-width: 62ch; color: var(--cg-gray-med); }

/* -------------------------------------------------------------------------
   9. TILES - the live cire-islands.css language, stop for stop
   Square tiles, px-stop scrim, STATIC plate (position:static is load-bearing:
   a positioned plate shrinks the stretched link's hit area), stretched link.
   ---------------------------------------------------------------------- */
.cg-page .cg-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 729px)  { .cg-page .cg-tiles { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
@media (min-width: 1024px) { .cg-page .cg-tiles { gap: 20px; } }

.cg-page .cg-tile {
  position: relative; display: flex; align-items: flex-end;
  aspect-ratio: 1 / 1; overflow: hidden;
  background: var(--cg-frame); isolation: isolate;
}
.cg-page .cg-tile__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.001);
  transition: transform 900ms cubic-bezier(.2, .6, .2, 1);
}
.cg-page .cg-tile__plate {
  position: static; isolation: isolate; width: 100%;
  padding: clamp(12px, 3.2vw, 18px); padding-top: 56px;
  background: linear-gradient(to bottom,
    rgba(var(--cg-scrim), 0) 0,
    rgba(var(--cg-scrim), .16) 20px,
    rgba(var(--cg-scrim), .46) 38px,
    rgba(var(--cg-scrim), .72) 52px,
    rgba(var(--cg-scrim), .86) 74px,
    rgba(var(--cg-scrim), .93) 100%);
  transition: background 400ms ease; pointer-events: none;
}
@media (min-width: 1024px) { .cg-page .cg-tile__plate { padding-top: 64px; } }
.cg-page .cg-tile__region {
  display: block; font-family: var(--cg-sans);
  font-size: clamp(.58rem, 1.8vw, .62rem); letter-spacing: .24em;
  text-transform: uppercase; color: rgba(255, 255, 255, .72); margin-bottom: 4px;
}
.cg-page .cg-tile__name {
  margin: 0; font-family: var(--cg-serif); font-weight: 500;
  font-size: clamp(.95rem, 3.6vw, 1.3rem); line-height: 1.14;
  letter-spacing: .005em; color: #fff;
}
.cg-page .cg-tile__link { color: inherit; text-decoration: none; pointer-events: auto; }
.cg-page .cg-tile__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.cg-page .cg-tile__cta {
  position: relative; z-index: 2; pointer-events: auto;
  display: inline-flex; align-items: center; gap: 8px; margin-top: 6px;
  font-family: var(--cg-sans); font-size: clamp(.66rem, 2.2vw, .72rem);
  letter-spacing: .18em; text-transform: uppercase; white-space: nowrap;
  color: rgba(255, 255, 255, .86); text-decoration: none;
  transition: color 200ms ease;
}
.cg-page .cg-tile__cta::after {
  content: ""; width: 16px; height: 1px; background: currentColor;
  transition: width 300ms cubic-bezier(.2, .6, .2, 1);
}
@media (hover: hover) and (pointer: fine) {
  .cg-page .cg-tile:hover .cg-tile__img { transform: scale(1.055); }
  .cg-page .cg-tile:hover .cg-tile__plate {
    background: linear-gradient(to bottom,
      rgba(var(--cg-scrim), .10) 0,
      rgba(var(--cg-scrim), .30) 20px,
      rgba(var(--cg-scrim), .60) 38px,
      rgba(var(--cg-scrim), .82) 52px,
      rgba(var(--cg-scrim), .92) 74px,
      rgba(var(--cg-scrim), .96) 100%);
  }
  .cg-page .cg-tile:hover .cg-tile__cta { color: var(--cg-gold); }
  .cg-page .cg-tile:hover .cg-tile__cta::after { width: 26px; }
}
.cg-page .cg-tile__link:focus-visible::after { box-shadow: inset 0 0 0 2px var(--cg-gold); }
@media (prefers-reduced-motion: reduce) {
  .cg-page .cg-tile__img,
  .cg-page .cg-tile__plate,
  .cg-page .cg-tile__cta,
  .cg-page .cg-tile__cta::after { transition: none; }
  .cg-page .cg-tile:hover .cg-tile__img { transform: scale(1.001); }
}

/* index tier: smaller class, own px runway so the first text pixel still
   lands at the same alpha on a shorter plate */
.cg-page .cg-tiles--index { grid-template-columns: repeat(2, 1fr); gap: 10px; }
@media (min-width: 729px)  { .cg-page .cg-tiles--index { grid-template-columns: repeat(4, 1fr); gap: 12px; } }
@media (min-width: 1366px) { .cg-page .cg-tiles--index { grid-template-columns: repeat(7, 1fr); gap: 14px; } }
.cg-page .cg-tiles--index .cg-tile__plate {
  padding: 12px; padding-top: 44px;
  background: linear-gradient(to bottom,
    rgba(var(--cg-scrim), 0) 0,
    rgba(var(--cg-scrim), .18) 14px,
    rgba(var(--cg-scrim), .50) 26px,
    rgba(var(--cg-scrim), .76) 38px,
    rgba(var(--cg-scrim), .88) 56px,
    rgba(var(--cg-scrim), .94) 100%);
}
.cg-page .cg-tiles--index .cg-tile__name { font-size: clamp(.9rem, 3.1vw, 1.05rem); }
.cg-page .cg-tile__count {
  display: block; margin-top: 5px; font-family: var(--cg-sans);
  font-size: clamp(.6rem, 2vw, .64rem); letter-spacing: .18em;
  text-transform: uppercase; color: rgba(255, 255, 255, .82);
}
/* four across at every width - used where a 7-column row would strand a tile */
.cg-page .cg-tiles--quad { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 729px)  { .cg-page .cg-tiles--quad { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1366px) { .cg-page .cg-tiles--quad { grid-template-columns: repeat(4, 1fr); } }

/* typographic fallback tile - a market whose photo host is dead.
   Charcoal ground, white type: 8.6:1. Contrast law by construction. */
.cg-page .cg-tile--type { background: var(--cg-charcoal); }
.cg-page .cg-tile--type::before {
  content: ""; position: absolute; left: 12px; right: 12px; top: 34%;
  height: 1px; background: rgba(201, 172, 119, .5);
}
.cg-page .cg-tile--type .cg-tile__plate { background: none; padding-top: 12px; }

/* wide closing tile */
.cg-page .cg-tile--wide { aspect-ratio: 16 / 9; grid-column: 1 / -1; }
@media (min-width: 729px) { .cg-page .cg-tile--wide { aspect-ratio: 21 / 7; } }
.cg-page .cg-tile--wide .cg-tile__plate {
  padding-top: 96px;
  background: linear-gradient(to bottom,
    rgba(var(--cg-scrim), 0) 0,
    rgba(var(--cg-scrim), .20) 30px,
    rgba(var(--cg-scrim), .52) 58px,
    rgba(var(--cg-scrim), .76) 84px,
    rgba(var(--cg-scrim), .88) 120px,
    rgba(var(--cg-scrim), .93) 100%);
}
.cg-page .cg-tile--wide .cg-tile__name { font-size: clamp(1.2rem, 4vw, 1.9rem); }

/* -------------------------------------------------------------------------
   10. LISTING CARDS
   ---------------------------------------------------------------------- */
.cg-page .cg-cards { display: grid; grid-template-columns: 1fr; gap: 24px; }
@media (min-width: 729px)  { .cg-page .cg-cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .cg-page .cg-cards { grid-template-columns: repeat(3, 1fr); gap: 28px; } }
.cg-page .cg-card {
  position: relative; display: block; text-decoration: none;
  color: var(--cg-charcoal); background: var(--cg-white);
}
.cg-page .cg-card__frame {
  position: relative; aspect-ratio: 3 / 2; overflow: hidden; background: var(--cg-frame);
}
.cg-page .cg-card__frame img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  transition: transform 900ms cubic-bezier(.2, .6, .2, 1);
}
.cg-page .cg-card:hover .cg-card__frame img { transform: scale(1.045); }
.cg-page .cg-card__tag {
  position: absolute; z-index: 2; top: 14px; left: 14px;
  background: var(--cg-white); color: var(--cg-charcoal);
  font-size: var(--cg-fs-micro); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase; padding: 7px 12px;
}
.cg-page .cg-card__body { padding-top: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--cg-hairline); }
.cg-page .cg-card__price {
  font-family: var(--cg-serif); font-weight: 500; font-size: var(--cg-fs-h3);
  line-height: var(--cg-lh-h3); color: var(--cg-black);
  font-variant-numeric: tabular-nums; transition: color 160ms ease;
}
.cg-page .cg-card:hover .cg-card__price { color: var(--cg-gold); }
.cg-page .cg-card__addr { margin-top: 6px; font-size: var(--cg-fs-small); line-height: var(--cg-lh-small); }
.cg-page .cg-card__meta {
  margin-top: 8px; color: var(--cg-gray-med); font-size: var(--cg-fs-micro);
  font-weight: 500; letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
}
/* empty grid: honest, quiet, and it still asks for the lead */
.cg-page .cg-cards--empty {
  display: block; border: 1px solid var(--cg-hairline);
  padding: clamp(28px, 4vw, 56px); text-align: center;
}

/* -------------------------------------------------------------------------
   11. SPLIT BAND / STATS / FACTS
   ---------------------------------------------------------------------- */
.cg-page .cg-split { display: grid; grid-template-columns: 1fr; gap: clamp(24px, 4vw, 56px); align-items: center; }
@media (min-width: 1024px) { .cg-page .cg-split { grid-template-columns: 1.05fr .95fr; } }
.cg-page .cg-split__art { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: var(--cg-frame); }
.cg-page .cg-split__art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.cg-page .cg-split__prose { max-width: 52ch; }
.cg-page .cg-split__prose p { margin-top: 16px; }
.cg-page .cg-split__stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
  margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--cg-hairline);
}
.cg-page .cg-split__cta { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; }

.cg-page .cg-stats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
@media (min-width: 729px) { .cg-page .cg-stats { grid-template-columns: repeat(4, 1fr); gap: 32px; } }
.cg-page .cg-stat { border-top: 1px solid var(--cg-hairline); padding-top: 16px; }
.cg-page .cg-stat__n {
  font-family: var(--cg-serif); font-weight: 500;
  font-size: clamp(1.6rem, 4.4vw, 2.1rem); line-height: 1.1;
  color: var(--cg-black); font-variant-numeric: tabular-nums;
}
.cg-page .cg-stat__l { display: block; margin-top: 8px; color: var(--cg-gray-med); }
/* the data-provenance line: charcoal, not --cg-gray-light (2.20:1 in the mockup).
   This is the disclosure that protects a page publishing third-party feed
   numbers - it has to be readable. */
.cg-page .cg-stats__note { margin-top: 20px; color: var(--cg-charcoal); font-size: var(--cg-fs-small); line-height: var(--cg-lh-small); }

.cg-page .cg-intro { display: grid; grid-template-columns: 1fr; gap: clamp(24px, 4vw, 56px); }
@media (min-width: 1024px) { .cg-page .cg-intro { grid-template-columns: 1.15fr .85fr; } }
.cg-page .cg-facts { border-top: 1px solid var(--cg-hairline); }
.cg-page .cg-facts dl { display: grid; grid-template-columns: 1fr; margin: 0; }
.cg-page .cg-facts div {
  display: flex; justify-content: space-between; gap: 16px;
  padding-block: 14px; border-bottom: 1px solid var(--cg-hairline);
}
.cg-page .cg-facts dt {
  color: var(--cg-gray-med); font-size: var(--cg-fs-micro); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
}
.cg-page .cg-facts dd { font-size: var(--cg-fs-small); text-align: right; }

/* advisor block */
.cg-page .cg-advisor { border-bottom: 1px solid var(--cg-hairline); }
.cg-page .cg-advisor__inner {
  display: grid; grid-template-columns: 1fr; gap: 20px; align-items: center;
  padding-block: clamp(24px, 3.4vw, 36px);
}
@media (min-width: 729px) { .cg-page .cg-advisor__inner { grid-template-columns: auto 1fr auto; gap: 28px; } }
.cg-page .cg-advisor__photo { width: 88px; height: 88px; object-fit: cover; border-radius: 50%; background: var(--cg-panel); }
@media (min-width: 1024px) { .cg-page .cg-advisor__photo { width: 104px; height: 104px; } }
.cg-page .cg-advisor__name {
  font-family: var(--cg-serif); font-weight: 500; font-size: var(--cg-fs-h3);
  line-height: var(--cg-lh-h3); color: var(--cg-black);
}
.cg-page .cg-advisor__role { margin-top: 4px; color: var(--cg-gray-med); }
.cg-page .cg-advisor__copy { margin-top: 8px; max-width: 56ch; }
.cg-page .cg-advisor__cta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* status strip - honest, quiet, not an error message */
.cg-page .cg-status { border-bottom: 1px solid var(--cg-hairline); background: var(--cg-panel); }
.cg-page .cg-status__inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px; padding-block: 14px;
}
.cg-page .cg-status__dot {
  display: inline-block; width: 6px; height: 6px; background: var(--cg-gold);
  margin-right: 10px; vertical-align: middle;
}

/* -------------------------------------------------------------------------
   12. INQUIRY MODULES
   The panel chrome is ours; the FORM inside is the platform's Gravity Forms
   embed. Section 13 restyles the GF fields to match --- and does it with
   selectors scoped to .cg-page so no other form on the site is touched.
   ---------------------------------------------------------------------- */
.cg-page .cg-inquiry { display: grid; grid-template-columns: 1fr; gap: clamp(24px, 4vw, 48px); align-items: start; }
@media (min-width: 1024px) { .cg-page .cg-inquiry { grid-template-columns: .9fr 1.1fr; } }
.cg-page .cg-inquiry__form { background: var(--cg-white); border: 1px solid var(--cg-hairline); padding: clamp(20px, 3.2vw, 36px); }
.cg-page .cg-inquiry__side p { margin-top: 14px; }
.cg-page .cg-inquiry__ways { margin-top: 22px; border-top: 1px solid var(--cg-hairline); }
.cg-page .cg-inquiry__ways div {
  display: flex; justify-content: space-between; gap: 16px;
  padding-block: 13px; border-bottom: 1px solid var(--cg-hairline);
  font-size: var(--cg-fs-small);
}
.cg-page .cg-inquiry__ways span:first-child {
  color: var(--cg-gray-med); font-size: var(--cg-fs-micro); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
}
.cg-page .cg-note,
.cg-page .cg-inquiry__note {
  color: var(--cg-gray-med); font-size: var(--cg-fs-micro);
  letter-spacing: .06em; text-transform: none; font-weight: 400;
}

/* the two-panel lead layout (zero-inventory template) */
.cg-page .cg-panels { display: grid; grid-template-columns: 1fr; gap: clamp(16px, 2.4vw, 24px); }
@media (min-width: 1024px) { .cg-page .cg-panels { grid-template-columns: 1fr 1fr; } }
.cg-page .cg-panel {
  border: 1px solid var(--cg-hairline); background: var(--cg-white);
  padding: clamp(22px, 3.4vw, 40px); display: flex; flex-direction: column;
}
.cg-page .cg-panel__body { margin-top: 12px; }
.cg-page .cg-panel--dark { background: var(--cg-charcoal); border-color: var(--cg-charcoal); }
/* dark ground -> the FULL text inventory, declared white */
.cg-page .cg-panel--dark .cg-h2,
.cg-page .cg-panel--dark .cg-h3,
.cg-page .cg-panel--dark .cg-lead,
.cg-page .cg-panel--dark p,
.cg-page .cg-panel--dark li,
.cg-page .cg-panel--dark strong { color: #fff; }
.cg-page .cg-panel--dark .cg-eyebrow { color: rgba(255, 255, 255, .78); }
.cg-page .cg-panel--dark .cg-small { color: rgba(255, 255, 255, .82); }
.cg-page .cg-panel--dark .cg-note { color: rgba(255, 255, 255, .78); }
.cg-page .cg-panel--dark .cg-link { color: #fff; }
.cg-page .cg-panel--dark .cg-btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .8); }
.cg-page .cg-panel--dark .cg-btn--ghost:hover { border-color: var(--cg-gold); color: #fff; }

/* email capture (micro-conversion) */
.cg-page .cg-capture {
  border: 1px solid var(--cg-hairline); padding: clamp(18px, 2.8vw, 28px);
  display: grid; gap: 16px; align-items: center;
}
@media (min-width: 1024px) { .cg-page .cg-capture { grid-template-columns: 1fr auto; gap: 28px; } }

/* lead band - charcoal ground under a photo at low opacity */
.cg-page .cg-lead-band { position: relative; isolation: isolate; background: var(--cg-charcoal); overflow: hidden; }
.cg-page .cg-lead-band__img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; z-index: 0; opacity: .42;
}
.cg-page .cg-lead-band__scrim {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to bottom, rgba(var(--cg-scrim), .62), rgba(var(--cg-scrim), .78));
}
.cg-page .cg-lead-band__inner {
  position: relative; z-index: 2; padding-block: clamp(44px, 6.4vw, 84px);
  text-align: center; max-width: 60ch; margin-inline: auto;
}
.cg-page .cg-lead-band .cg-h2,
.cg-page .cg-lead-band .cg-h3,
.cg-page .cg-lead-band p,
.cg-page .cg-lead-band li { color: #fff; }
.cg-page .cg-lead-band .cg-eyebrow { color: rgba(255, 255, 255, .78); }
.cg-page .cg-lead-band .cg-lead { margin-top: 14px; color: rgba(255, 255, 255, .92); }
.cg-page .cg-lead-band__cta { margin-top: 28px; display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.cg-page .cg-lead-band__note { margin-top: 16px; color: rgba(255, 255, 255, .8); font-size: var(--cg-fs-small); }
.cg-page .cg-lead-band__form { margin-top: 28px; text-align: left; }

/* -------------------------------------------------------------------------
   13. GRAVITY FORMS INSIDE OUR PANELS
   The platform's form markup, wearing the system's clothes. Scoped to
   .cg-page .cg-inquiry-embed so no other Gravity Form on this site changes.
   Selectors cover both GF 2.5+ (.gform_wrapper .gfield) and the legacy
   list markup the theme still renders on some templates.
   ---------------------------------------------------------------------- */
.cg-page .cg-inquiry-embed .gform_wrapper { margin: 0; }
.cg-page .cg-inquiry-embed .gform_wrapper form { margin: 0; }
.cg-page .cg-inquiry-embed .gform_heading { display: none; }
.cg-page .cg-inquiry-embed .gform_fields {
  display: grid; grid-template-columns: 1fr; gap: 12px; list-style: none; margin: 0; padding: 0;
}
@media (min-width: 729px) { .cg-page .cg-inquiry-embed .gform_fields { grid-template-columns: 1fr 1fr; } }
.cg-page .cg-inquiry-embed .gfield { margin: 0; padding: 0; max-width: 100%; }
.cg-page .cg-inquiry-embed .gfield--width-full,
.cg-page .cg-inquiry-embed .gfield.cg-f--wide,
.cg-page .cg-inquiry-embed .gfield textarea { grid-column: 1 / -1; }
.cg-page .cg-inquiry-embed .gfield_label,
.cg-page .cg-inquiry-embed .gfield label {
  display: block; font-family: var(--cg-sans); font-size: var(--cg-fs-micro);
  font-weight: 500; letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
  color: var(--cg-gray-med); margin-bottom: 6px;
}
/* the required marker carries meaning, so it is charcoal, not gold: gold on
   white measures 2.18:1 and an asterisk nobody can see is a form defect */
.cg-page .cg-inquiry-embed .gfield_required { color: var(--cg-charcoal); }
.cg-page .cg-inquiry-embed input[type="text"],
.cg-page .cg-inquiry-embed input[type="email"],
.cg-page .cg-inquiry-embed input[type="tel"],
.cg-page .cg-inquiry-embed input[type="url"],
.cg-page .cg-inquiry-embed input[type="number"],
.cg-page .cg-inquiry-embed select,
.cg-page .cg-inquiry-embed textarea {
  width: 100%; border: 1px solid var(--cg-hairline); border-radius: 0;
  background: var(--cg-white); color: var(--cg-charcoal);
  font-family: var(--cg-sans); font-size: var(--cg-fs-small);
  line-height: var(--cg-lh-small); padding: 13px 14px; box-shadow: none;
}
.cg-page .cg-inquiry-embed textarea { min-height: 132px; resize: vertical; }
.cg-page .cg-inquiry-embed input:focus,
.cg-page .cg-inquiry-embed select:focus,
.cg-page .cg-inquiry-embed textarea:focus {
  outline: 2px solid var(--cg-gold); outline-offset: -1px; border-color: var(--cg-gold);
}
.cg-page .cg-inquiry-embed ::placeholder { color: var(--cg-gray-med); opacity: 1; }
.cg-page .cg-inquiry-embed .gform_footer { margin: 18px 0 0; padding: 0; }
.cg-page .cg-inquiry-embed .gform_button,
.cg-page .cg-inquiry-embed input[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--cg-sans); font-size: var(--cg-fs-btn); line-height: 1.25;
  font-weight: 500; letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
  padding: 16px 30px; border: 1px solid var(--cg-gold); border-radius: 0;
  background: var(--cg-gold); color: var(--cg-ink-on-gold);
  cursor: pointer; width: auto; box-shadow: none;
  transition: background 200ms ease, border-color 200ms ease;
}
.cg-page .cg-inquiry-embed .gform_button:hover,
.cg-page .cg-inquiry-embed input[type="submit"]:hover {
  background: var(--cg-gold-hover); border-color: var(--cg-gold-hover);
}
.cg-page .cg-inquiry-embed .gfield_description,
.cg-page .cg-inquiry-embed .gform_validation_errors,
.cg-page .cg-inquiry-embed .validation_message {
  font-size: var(--cg-fs-small); line-height: var(--cg-lh-small); color: var(--cg-charcoal);
}
.cg-page .cg-inquiry-embed .validation_message { color: #8a1f1f; margin-top: 6px; }
.cg-page .cg-inquiry-embed .gform_confirmation_message {
  font-family: var(--cg-serif); font-size: var(--cg-fs-h3);
  line-height: var(--cg-lh-h3); color: var(--cg-charcoal);
}
/* the platform's three honeypots stay hidden - never restyle them visible */
.cg-page .cg-inquiry-embed .gform_validation_container,
.cg-page .cg-inquiry-embed .gfield--type-honeypot { display: none !important; }

/* the same form on a charcoal panel: every field token flips white */
.cg-page .cg-panel--dark .cg-inquiry-embed .gfield_label,
.cg-page .cg-panel--dark .cg-inquiry-embed .gfield label,
.cg-page .cg-lead-band .cg-inquiry-embed .gfield_label,
.cg-page .cg-lead-band .cg-inquiry-embed .gfield label { color: rgba(255, 255, 255, .82); }
.cg-page .cg-panel--dark .cg-inquiry-embed input[type="text"],
.cg-page .cg-panel--dark .cg-inquiry-embed input[type="email"],
.cg-page .cg-panel--dark .cg-inquiry-embed input[type="tel"],
.cg-page .cg-panel--dark .cg-inquiry-embed select,
.cg-page .cg-panel--dark .cg-inquiry-embed textarea,
.cg-page .cg-lead-band .cg-inquiry-embed input[type="text"],
.cg-page .cg-lead-band .cg-inquiry-embed input[type="email"],
.cg-page .cg-lead-band .cg-inquiry-embed input[type="tel"],
.cg-page .cg-lead-band .cg-inquiry-embed select,
.cg-page .cg-lead-band .cg-inquiry-embed textarea {
  border-color: rgba(255, 255, 255, .34);
  background: rgba(255, 255, 255, .06);
  color: #fff;
}
.cg-page .cg-panel--dark .cg-inquiry-embed ::placeholder,
.cg-page .cg-lead-band .cg-inquiry-embed ::placeholder { color: rgba(255, 255, 255, .6); }
.cg-page .cg-panel--dark .cg-inquiry-embed .gfield_description,
.cg-page .cg-lead-band .cg-inquiry-embed .gfield_description { color: rgba(255, 255, 255, .82); }
.cg-page .cg-panel--dark .cg-inquiry-embed .gform_confirmation_message,
.cg-page .cg-lead-band .cg-inquiry-embed .gform_confirmation_message { color: #fff; }

/* -------------------------------------------------------------------------
   14. FOOTER
   .cg-foot-legal carries the LIVE SITE'S legal row: Equal Housing
   Opportunity mark at 32x34, the deemed-reliable disclaimer, and the
   Privacy / Terms / Accessibility / Sitemap links. Brand-audit ship-blocker
   1 - this is legal, not taste, and it was a regression against something
   already shipped.
   ---------------------------------------------------------------------- */
.cg-page .cg-foot-callout {
  background: var(--cg-charcoal); text-align: center;
  padding-block: clamp(40px, 5.6vw, 64px);
}
.cg-page .cg-foot-callout .cg-h2,
.cg-page .cg-foot-callout__title { color: #fff; }
.cg-page .cg-foot-callout__mail {
  display: block; margin-top: 10px; color: rgba(255, 255, 255, .86);
  text-decoration: none; font-size: var(--cg-fs-small); letter-spacing: .04em;
}
.cg-page .cg-foot-callout__mail:hover { color: var(--cg-gold); }
.cg-page .cg-foot-callout .cg-btn {
  margin-top: 24px; background: transparent; color: #fff; border-color: rgba(255, 255, 255, .8);
}
.cg-page .cg-foot-callout .cg-btn:hover { background: #fff; color: var(--cg-charcoal); border-color: #fff; }

.cg-page .cg-foot-menu { padding-block: clamp(36px, 4.6vw, 56px); }
.cg-page .cg-foot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
@media (min-width: 729px) { .cg-page .cg-foot-grid { grid-template-columns: repeat(4, 1fr); gap: 32px; } }
.cg-page .cg-foot-grid h4 {
  font-size: var(--cg-fs-micro); font-weight: 500; letter-spacing: var(--cg-ls-caps);
  text-transform: uppercase; color: var(--cg-charcoal); margin-bottom: 12px;
}
.cg-page .cg-foot-grid a {
  display: block; color: var(--cg-gray-med); text-decoration: none;
  font-size: var(--cg-fs-small); line-height: 2.05;
}
.cg-page .cg-foot-grid a:hover { color: var(--cg-charcoal); }

.cg-page .cg-foot-legal {
  border-top: 1px solid var(--cg-hairline); background: var(--cg-white);
  padding-block: 22px; text-align: center;
}
.cg-page .cg-foot-legal__lockup { width: 186px; height: auto; margin: 0 auto 14px; }
.cg-page .cg-foot-legal__eho { width: 32px; height: 34px; margin: 0 auto 12px; }
.cg-page .cg-foot-legal p {
  color: var(--cg-gray-med); font-size: .75rem; line-height: 1.7;
  max-width: 92ch; margin-inline: auto;
}
.cg-page .cg-foot-legal p + p { margin-top: 8px; }
.cg-page .cg-foot-legal__links {
  display: flex; flex-wrap: wrap; gap: 6px 18px; justify-content: center;
  margin-top: 12px;
}
.cg-page .cg-foot-legal__links a {
  color: var(--cg-gray-med); text-decoration: none;
  font-size: var(--cg-fs-micro); font-weight: 500;
  letter-spacing: var(--cg-ls-caps); text-transform: uppercase;
}
.cg-page .cg-foot-legal__links a:hover { color: var(--cg-charcoal); }

/* -------------------------------------------------------------------------
   15. UTILITIES
   ---------------------------------------------------------------------- */
.cg-page .cg-sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.cg-page .cg-stack > * + * { margin-top: 16px; }
.cg-page .cg-center { text-align: center; }
.cg-page .cg-rule { height: 1px; background: var(--cg-hairline); border: 0; margin-block: clamp(28px, 4vw, 48px); }

/* ------------------------------------------------------------------ 13 --
   Caribbean-page redlines. This sheet loads SITEWIDE and prints last
   (explicit dependency chain), so site-wide nudges belong here, scoped
   tight. Nick 2026-08-16: the homepage Caribbean map starts 12px too low
   on phones. :has() is progressive - browsers without it keep today's
   spacing. */
@media (max-width: 728px) {
	.home .text-block:has(.text-block-img img[alt="caribbean map"]) {
		margin-top: -12px;
	}
}