/* ============================================================
   components.css — editorial "Golden Hour" component library (v2)
   ============================================================ */

/* ---------- Buttons ---------- */
.fpg-btn{ font-family:var(--font-sans); font-size:var(--fs-sm); font-weight:600; letter-spacing:.01em;
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  padding:15px var(--space-6); border-radius:var(--radius-pill); border:1px solid transparent;
  cursor:pointer; text-align:center; line-height:1; white-space:nowrap;
  transition:background-color .2s var(--ease),color .2s var(--ease),transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease); }
/* The fill was brass, so the label was dark ink. The accent is now #12003A —
   near-black — so the label has to invert or the button is unreadable. */
.fpg-btn--primary{ background:var(--accent); color:var(--on-accent); }
.fpg-btn--primary:hover{ background:var(--accent-deep); color:var(--on-accent); transform:translateY(-2px); box-shadow:var(--shadow-2); }
.fpg-btn--primary:active{ transform:scale(.98); }
.fpg-btn--secondary{ background:transparent; border-color:rgba(22,18,31,.22); color:var(--ink); }
.fpg-btn--secondary:hover{ background:var(--ink); border-color:var(--ink); color:#fff; }
.fpg-btn--ghost{ background:transparent; color:var(--brass-deep); padding-inline:0; border-radius:0; gap:10px; }
.fpg-btn--ghost .arr{ transition:transform .2s var(--ease); }
.fpg-btn--ghost:hover{ color:var(--ink); }
.fpg-btn--ghost:hover .arr{ transform:translateX(5px); }
.fpg-btn--lg{ padding:17px var(--space-8); font-size:var(--fs-body); }
.fpg-btn--block{ width:100%; }
.fpg-btn:focus-visible{ outline:none; box-shadow:var(--focus-ring); }
.fpg-btn:disabled{ background:var(--sand); color:var(--ink-muted); cursor:not-allowed; transform:none; box-shadow:none; }
.on-dark .fpg-btn--secondary{ border-color:rgba(255,255,255,.4); color:#fff; }
.on-dark .fpg-btn--secondary:hover{ background:#fff; border-color:#fff; color:var(--ink); }

/* ---------- Eyebrow / labels / chips ---------- */
.eyebrow{ display:inline-flex; align-items:center; gap:10px; font-size:var(--fs-overline); font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brass-deep); }
.eyebrow::before{ content:""; width:26px; height:1px; background:currentColor; opacity:.7; }
.eyebrow--center::before{ display:none; }
.on-dark .eyebrow{ color:#CFC6EA; }
.idx{ font-family:var(--font-serif); font-size:var(--fs-sm); color:var(--brass-deep); letter-spacing:.05em; }
.chip{ display:inline-block; font-size:var(--fs-caption); font-weight:500; color:var(--ink-soft);
  padding:5px 13px; border-radius:var(--radius-pill); border:1px solid var(--sand); background:transparent; }
.pill{ display:inline-flex; align-items:center; gap:7px; font-size:var(--fs-caption); font-weight:600;
  padding:6px 13px; border-radius:var(--radius-pill); background:rgba(255,255,255,.9); backdrop-filter:blur(6px) saturate(140%); }
.pill::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.pill.is-leasing{ color:var(--success); } .pill.is-limited{ color:var(--warning); }

/* ---------- Section header ---------- */
.shead{ max-width:760px; margin-bottom:var(--space-12); }
.shead .eyebrow{ margin-bottom:var(--space-4); }
.shead h2{ margin-bottom:var(--space-4); }
.shead .lead{ max-width:60ch; }
.shead--center{ margin-inline:auto; text-align:center; }
.shead--center .eyebrow{ justify-content:center; }
.shead--center .eyebrow::before{ display:none; }
.shead--split{ display:grid; gap:var(--space-6); align-items:end; max-width:none; }
@media (min-width:900px){ .shead--split{ grid-template-columns:1.5fr 1fr; } .shead--split .aside{ justify-self:end; } }

/* ---------- Nav ---------- */
.nav-sentinel{ position:absolute; top:0; height:1px; width:1px; }
.fpg-nav{ position:fixed; top:0; left:0; right:0; z-index:100; transition:background-color .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
  background:transparent; border-bottom:1px solid transparent; }
.fpg-nav__inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--space-6); padding-block:var(--space-4); }
.fpg-nav__brand{ display:flex; align-items:center; gap:var(--space-3); color:#fff; font-family:var(--font-serif); font-size:1.15rem; font-weight:500; letter-spacing:-.01em; white-space:nowrap; }
.fpg-nav__mark{ width:40px; height:40px; flex:none; }
/* real FPG wordmark — white PNG, recolored to ink on light surfaces via filter */
.fpg-logo{ height:34px; width:auto; display:block; }
.fpg-logo--lg{ height:42px; }
.fpg-logo--ink,
.fpg-nav.is-scrolled .fpg-logo,
.fpg-nav--solid .fpg-logo{ filter:brightness(0) saturate(0); }
.fpg-nav__links{ display:none; align-items:center; gap:var(--space-6); list-style:none; }
.fpg-nav__links a{ position:relative; color:rgba(255,255,255,.9); font-size:var(--fs-sm); font-weight:500; padding-block:6px; }
.fpg-nav__links a::after{ content:""; position:absolute; left:0; bottom:0; height:1.5px; width:0; background:var(--brass); transition:width .22s var(--ease); }
.fpg-nav__links a:hover::after,.fpg-nav__links a[aria-current="page"]::after{ width:100%; }
.fpg-nav__links a:hover,.fpg-nav__links a[aria-current="page"]{ color:#fff; }
.fpg-nav__utility{ display:none; align-items:center; gap:var(--space-5,20px); }
.fpg-nav__phone{ color:#fff; font-size:var(--fs-sm); font-weight:600; white-space:nowrap; }
.fpg-nav__portal{ color:rgba(255,255,255,.9); font-size:var(--fs-sm); font-weight:500; }
.fpg-nav__portal:hover{ color:#fff; }
.fpg-nav.is-scrolled{ background:rgba(244,242,250,.86); backdrop-filter:blur(12px) saturate(150%); box-shadow:0 1px 0 rgba(58,42,114,.5),var(--shadow-1); border-bottom-color:transparent; }
.fpg-nav.is-scrolled .fpg-nav__brand,.fpg-nav.is-scrolled .fpg-nav__phone{ color:var(--ink); }
.fpg-nav.is-scrolled .fpg-nav__links a,.fpg-nav.is-scrolled .fpg-nav__portal{ color:var(--ink-soft); }
.fpg-nav.is-scrolled .fpg-nav__links a:hover,.fpg-nav.is-scrolled .fpg-nav__links a[aria-current="page"]{ color:var(--ink); }
.fpg-nav.is-scrolled .mk-ring{ stroke:var(--brass); } .fpg-nav.is-scrolled .mk-fp{ fill:var(--ink); }
.fpg-nav--solid{ background:rgba(244,242,250,.92); backdrop-filter:blur(12px); border-bottom-color:rgba(58,42,114,.4); }
.fpg-nav--solid .fpg-nav__brand,.fpg-nav--solid .fpg-nav__phone{ color:var(--ink); }
.fpg-nav--solid .fpg-nav__links a,.fpg-nav--solid .fpg-nav__portal{ color:var(--ink-soft); }
.fpg-nav--solid .mk-ring{ stroke:var(--brass); } .fpg-nav--solid .mk-fp{ fill:var(--ink); }
.fpg-nav__toggle{ display:inline-flex; flex-direction:column; gap:5px; background:none; border:0; padding:10px; cursor:pointer; }
.fpg-nav__toggle span{ width:24px; height:2px; background:#fff; border-radius:2px; transition:background .2s; }
.fpg-nav.is-scrolled .fpg-nav__toggle span,.fpg-nav--solid .fpg-nav__toggle span{ background:var(--ink); }
@media (min-width:1040px){ .fpg-nav__links,.fpg-nav__utility{ display:flex; } .fpg-nav__toggle{ display:none; } }

.fpg-drawer{ position:fixed; inset:0; z-index:150; background:var(--bg); padding:var(--space-6) var(--gutter) var(--space-12); display:flex; flex-direction:column; transform:translateY(-100%); transition:transform .35s var(--ease); visibility:hidden; }
.fpg-drawer.is-open{ transform:none; visibility:visible; box-shadow:var(--shadow-3); }
.fpg-drawer .mk-ring{ stroke:var(--brass); } .fpg-drawer .mk-fp{ fill:var(--ink); }
.fpg-drawer__top{ display:flex; align-items:center; justify-content:space-between; margin-bottom:var(--space-8); }
.fpg-drawer__close{ background:none; border:0; font-size:1.8rem; cursor:pointer; color:var(--ink); padding:8px; line-height:1; }
.fpg-drawer a.drawer-link{ display:block; font-family:var(--font-serif); font-size:1.7rem; color:var(--ink); padding-block:var(--space-3); border-bottom:var(--border-hair); }
.fpg-drawer__cta{ margin-top:var(--space-8); display:grid; gap:var(--space-3); }

/* ---------- Hero (full-bleed cinematic) ---------- */
.hero{ position:relative; margin-top:0; min-height:100svh; display:flex; align-items:flex-end; color:#fff; overflow:hidden; isolation:isolate; }
.hero--compact{ min-height:78vh; min-height:78svh; }
.hero__media{ position:absolute; inset:0; z-index:-2; }
.hero__media img,.hero__media .media-img{ width:100%; height:100%; }
.hero__media img{ object-fit:cover; object-position:50% 50%; transform:scale(1.04); }
/* Editor-set focal point. A viewport-cropped photo is the thing that breaks when someone
   swaps the image, so which part survives the crop is a content decision, not a CSS one. */
.hero[data-focal="left"]   .hero__media img{ object-position:22% 50%; }
.hero[data-focal="right"]  .hero__media img{ object-position:78% 50%; }
.hero[data-focal="top"]    .hero__media img{ object-position:50% 22%; }
.hero[data-focal="bottom"] .hero__media img{ object-position:50% 78%; }
/* One slow settle on arrival — the photo comes to rest rather than snapping into place.
   No loop: an endlessly drifting background is a distraction on a page people read. */
@media (prefers-reduced-motion:no-preference){
  .hero__media img{ animation:hero-settle 1600ms var(--ease) both; }
  @keyframes hero-settle{ from{ transform:scale(1.10) } to{ transform:scale(1.04) } }
}
/* Three layers, each with a job: pool the ink behind the copy (radial), hold the left
   third (linear 90deg), anchor the bottom edge and lift the top so the nav reads (0deg). */
.hero__scrim{ position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(110% 80% at 12% 74%,rgba(10,4,26,.62) 0%,rgba(10,4,26,.22) 42%,rgba(10,4,26,0) 70%),
    linear-gradient(90deg,rgba(10,4,26,.60) 0%,rgba(10,4,26,.24) 46%,rgba(10,4,26,0) 78%),
    linear-gradient(0deg,rgba(10,4,26,.74) 0%,rgba(10,4,26,.18) 34%,rgba(10,4,26,.02) 62%,rgba(10,4,26,.22) 100%); }
.hero__inner{ width:100%; padding-block:var(--space-32) var(--space-16); }
.hero__copy{ max-width:920px; }
.hero .eyebrow{ color:#CFC6EA; margin-bottom:var(--space-5,20px); }
.hero__title{ font-family:var(--font-serif); font-weight:400; font-size:var(--fs-mega); line-height:.94; letter-spacing:-.03em; color:#fff; margin-bottom:var(--space-5,20px); text-wrap:balance;
  text-shadow:0 1px 40px rgba(10,4,26,.35); }
.hero__sub{ color:rgba(255,255,255,.92); font-size:var(--fs-lead); max-width:46ch; margin-bottom:var(--space-8); }
.hero__actions{ display:flex; flex-wrap:wrap; gap:var(--space-3); margin-bottom:var(--space-8); }
.hero__meta{ list-style:none; margin:0; padding:var(--space-6) 0 0; display:flex; flex-wrap:wrap; gap:var(--space-4) var(--space-8); align-items:flex-start; border-top:1px solid rgba(255,255,255,.18); max-width:680px; }
.hero__meta .m{ display:flex; flex-direction:column; gap:4px; }
.hero__meta .m b{ font-family:var(--font-serif); font-size:1.75rem; font-weight:500; color:#fff; line-height:1; letter-spacing:-.01em; }
.hero__meta .m span{ font-size:var(--fs-caption); letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.72); }
/* Cue lives in the right gutter, not centre: centred it collides with the proof row. */
.hero__cue{ position:absolute; right:var(--gutter); bottom:var(--space-8); z-index:1; display:flex; flex-direction:column; align-items:center; }
.hero__cue .bar{ display:block; width:1px; height:56px; background:linear-gradient(rgba(255,255,255,.85),transparent); animation:cue 2.6s var(--ease) infinite; }
@media (max-width:900px){ .hero__cue{ display:none; } }
@keyframes cue{ 0%{transform:scaleY(0);transform-origin:top} 40%{transform:scaleY(1);transform-origin:top} 60%{transform:scaleY(1);transform-origin:bottom} 100%{transform:scaleY(0);transform-origin:bottom} }

/* video cover (Vimeo background) */
.video-cover{ position:absolute; inset:0; overflow:hidden; background-size:cover; background-position:center; }
.video-cover iframe{ position:absolute; top:50%; left:50%; width:100vw; height:56.25vw; min-height:100%; min-width:177.78vh; transform:translate(-50%,-50%); pointer-events:none; }
.video-embed{ position:relative; aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-3); }
.video-embed iframe{ position:absolute; inset:0; width:100%; height:100%; }

/* ---------- Page header (interior pages) ---------- */
.pagehead{ position:relative; color:#fff; padding-block:var(--space-32) var(--space-16); display:flex; align-items:flex-end; min-height:64vh; overflow:hidden; isolation:isolate; }
.pagehead__media{ position:absolute; inset:0; z-index:-2; }
.pagehead__media img{ width:100%; height:100%; object-fit:cover; }
.pagehead__scrim{ position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(10,4,26,.8),rgba(10,4,26,.25) 60%,rgba(10,4,26,.45)); }
.pagehead__title{ text-wrap:balance; font-family:var(--font-serif); font-weight:400; font-size:var(--fs-display); line-height:1; letter-spacing:-.02em; color:#fff; max-width:18ch; }

/* ---------- Community card ---------- */
.fpg-card{ position:relative; display:flex; flex-direction:column; background:var(--surface); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-1);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease); }
.fpg-card:hover{ transform:translateY(-6px); box-shadow:var(--shadow-2); }
.fpg-card:focus-within{ box-shadow:var(--focus-ring),var(--shadow-2); }
.fpg-card__media{ aspect-ratio:4/3; overflow:hidden; position:relative; }
.fpg-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.fpg-card:hover .fpg-card__media img{ transform:scale(1.06); }
.fpg-card__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,4,26,.5),transparent 45%); }
.fpg-card__badge{ position:absolute; top:var(--space-4); left:var(--space-4); z-index:2; }
.fpg-card__flag{ position:absolute; top:var(--space-4); right:var(--space-4); z-index:2; background:var(--brass); color:#1C1B19; font-size:var(--fs-caption); font-weight:600; letter-spacing:.04em; padding:5px 12px; border-radius:var(--radius-pill); }
.fpg-card__loc{ position:absolute; bottom:var(--space-4); left:var(--space-4); z-index:2; color:#fff; font-size:var(--fs-sm); display:flex; align-items:center; gap:6px; text-shadow:0 1px 8px rgba(0,0,0,.4); }
.fpg-card__body{ padding:var(--space-6); display:flex; flex-direction:column; flex:1; }
.fpg-card__title{ font-family:var(--font-serif); font-size:var(--fs-h3); font-weight:500; letter-spacing:-.01em; margin-bottom:6px; }
.fpg-card__title a{ color:var(--ink); }
.fpg-card__title a::after{ content:""; position:absolute; inset:0; z-index:1; }
.fpg-card__sub{ font-size:var(--fs-sm); color:var(--ink-muted); margin-bottom:var(--space-4); }
.fpg-card__blurb{ font-size:var(--fs-sm); color:var(--ink-soft); margin-bottom:var(--space-4); }
.fpg-card__chips{ display:flex; flex-wrap:wrap; gap:7px; margin-bottom:var(--space-5,20px); }
.fpg-card__foot{ margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:var(--space-3); padding-top:var(--space-4); border-top:var(--border-hair); }
.fpg-card__foot .fpg-btn{ position:relative; z-index:2; }

/* feature/banner card (flagship) */
.feature-card{ position:relative; border-radius:var(--radius-lg); overflow:hidden; min-height:520px; display:flex; align-items:flex-end; color:#fff; box-shadow:var(--shadow-2); }
.feature-card .media-img,.feature-card img{ position:absolute; inset:0; }
.feature-card img{ width:100%; height:100%; object-fit:cover; transition:transform .9s var(--ease); }
.feature-card:hover img{ transform:scale(1.05); }
.feature-card__scrim{ position:absolute; inset:0; background:linear-gradient(0deg,rgba(10,4,26,.85),rgba(10,4,26,.1) 55%),linear-gradient(90deg,rgba(10,4,26,.6),transparent 60%); }
.feature-card__body{ position:relative; padding:var(--space-12); max-width:560px; }
.feature-card__body h3{ color:#fff; font-size:clamp(1.8rem,3vw,2.6rem); margin:var(--space-3) 0; }
.feature-card__body p{ color:rgba(255,255,255,.85); }

/* ---------- icon helper ---------- */
.ic{ width:1em; height:1em; flex:none; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.ic--brass{ color:var(--brass-deep); }

/* ---------- Editorial split ---------- */
.split{ display:grid; gap:var(--space-12); align-items:center; }
@media (min-width:920px){ .split{ grid-template-columns:1fr 1fr; gap:var(--space-16); } .split--media-first .media{ order:-1; } .split--wide-media{ grid-template-columns:1.15fr .85fr; } }
.media-frame{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-2); aspect-ratio:4/5; }
.media-frame--wide{ aspect-ratio:4/3; }
.media-frame img{ width:100%; height:100%; object-fit:cover; }
.stat-inline{ display:flex; gap:var(--space-8); margin-top:var(--space-8); flex-wrap:wrap; }
.stat-inline .n{ font-family:var(--font-serif); font-size:2.4rem; font-weight:500; color:var(--brass-deep); line-height:1; }
.stat-inline .l{ font-size:var(--fs-caption); letter-spacing:.06em; text-transform:uppercase; color:var(--ink-muted); margin-top:6px; }

/* ---------- Amenity list (editorial, not boxes) ---------- */
.amen{ display:grid; gap:0; }
.amen li{ display:grid; grid-template-columns:auto 1fr auto; gap:var(--space-5,20px); align-items:start; padding:var(--space-6) 0; border-top:var(--border-hair); }
.amen li:last-child{ border-bottom:var(--border-hair); }
.amen .ai{ width:44px; height:44px; border-radius:50%; border:1px solid var(--brass); color:var(--brass-deep); display:grid; place-items:center; }
.amen .ai .ic{ width:20px; height:20px; }
.amen h4{ font-family:var(--font-serif); font-weight:500; font-size:1.3rem; margin-bottom:4px; }
.amen p{ font-size:var(--fs-sm); color:var(--ink-muted); margin:0; }
.amen .ar{ font-family:var(--font-serif); color:var(--brass); align-self:center; }

/* ---------- Lifestyle full-bleed band ---------- */
.band{ position:relative; color:#fff; overflow:hidden; isolation:isolate; }
.band__media{ position:absolute; inset:0; z-index:-2; }
.band__media img{ width:100%; height:100%; object-fit:cover; }
.band__scrim{ position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(10,4,26,.82),rgba(10,4,26,.35) 70%,transparent),linear-gradient(0deg,rgba(10,4,26,.5),transparent 60%); }
.band__inner{ padding-block:var(--space-32); }
.band__quote{ text-wrap:balance; font-family:var(--font-serif); font-weight:400; font-size:clamp(1.8rem,3.4vw,3rem); line-height:1.22; letter-spacing:-.01em; max-width:18ch; color:#fff; }
.band__by{ margin-top:var(--space-6); color:rgba(255,255,255,.78); font-size:var(--fs-sm); }

/* ---------- Stats ---------- */
.stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-12) var(--space-6); }
@media (min-width:780px){ .stats{ grid-template-columns:repeat(4,1fr); } }
.stat{ } .stat__num{ font-family:var(--font-serif); font-weight:500; font-size:clamp(2.6rem,4.5vw,3.6rem); color:var(--brass-deep); line-height:1; letter-spacing:-.02em; }
.on-dark .stat__num{ color:var(--brass); }  /* brighter brass reads on dark; brass-deep is the AA-safe default on light */
.stat__label{ font-size:var(--fs-caption); letter-spacing:.08em; text-transform:uppercase; color:var(--ink-muted); margin-top:var(--space-3); }
.on-dark .stat__label{ color:#A099BD; }
.stat__rule{ width:36px; height:2px; background:var(--brass); margin-bottom:var(--space-4); }

/* ---------- Doors (audience) ---------- */
.doors{ display:grid; gap:var(--space-6); }
@media (min-width:820px){ .doors{ grid-template-columns:repeat(3,1fr); } }
.door{ position:relative; display:flex; flex-direction:column; padding:var(--space-8) 0; border-top:2px solid var(--ink); }
.door__n{ font-family:var(--font-serif); font-size:var(--fs-sm); color:var(--brass-deep); margin-bottom:var(--space-8); }
.door h3{ font-size:var(--fs-h3); margin-bottom:var(--space-3); }
.door p{ color:var(--ink-soft); font-size:var(--fs-sm); flex:1; margin-bottom:var(--space-5,20px); }
.door .fpg-btn{ align-self:flex-start; }

/* ---------- CTA band ---------- */
.cta{ position:relative; color:#fff; overflow:hidden; isolation:isolate; }
.cta__media{ position:absolute; inset:0; z-index:-2; } .cta__media img{ width:100%; height:100%; object-fit:cover; }
.cta__scrim{ position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,rgba(10,4,26,.9),rgba(10,4,26,.6)); }
.cta__inner{ padding-block:var(--space-32); text-align:center; }
.cta__title{ font-family:var(--font-serif); font-weight:400; color:#fff; font-size:clamp(2.2rem,5vw,4rem); line-height:1.02; letter-spacing:-.02em; margin-bottom:var(--space-5,20px); text-wrap:balance; }
.cta__sub{ color:rgba(255,255,255,.82); max-width:50ch; margin:0 auto var(--space-8); }

/* ---------- Core values band (the step-down into the footer) ----------
   Palette here is deliberately narrow: white ground, black type, brown rule, and the
   slate blue for the medallion's seat. No new parchment tones — the warm mid-browns are
   not part of the house palette. */
.fpg-values{ position:relative; background:var(--surface); border-top:var(--border-hair); }
.fpg-values__grid{ display:grid; grid-template-columns:minmax(220px,320px) minmax(0,1fr); gap:clamp(32px,5vw,80px);
  align-items:center; padding-block:var(--space-16); }
.fpg-values__mark{ margin:0; }
/* The artwork is a white disc on a transparent field. On white it would vanish at the edge,
   so a slate hairline gives it a rim and seats it on the page. */
.fpg-values__mark img{ width:100%; height:auto; display:block; border-radius:50%;
  box-shadow:0 0 0 1px rgba(74,90,110,.20), 0 14px 36px rgba(28,27,25,.07); }
.fpg-values__body{ min-width:0; }
.fpg-values .eyebrow{ color:var(--brass-deep); margin-bottom:var(--space-3); }
.fpg-values__h{ font-family:var(--font-serif); font-weight:400; font-size:var(--fs-h2); line-height:1.05;
  letter-spacing:-.02em; color:var(--ink); margin:0 0 var(--space-4); }
.fpg-values__p{ color:var(--ink-soft); font-size:var(--fs-body); line-height:1.65; max-width:56ch; margin:0; }
.fpg-values__list{ list-style:none; display:flex; flex-wrap:wrap; gap:var(--space-3) var(--space-8);
  margin:var(--space-8) 0 0; padding:0; }
.fpg-values__list li{ font-family:var(--font-serif); font-size:1.05rem; font-weight:500; color:var(--ink);
  letter-spacing:.12em; text-transform:uppercase; }
.fpg-values__rule{ display:block; width:24px; height:2px; background:var(--slate-blue); margin-bottom:10px; }
@media (max-width:860px){
  .fpg-values__grid{ grid-template-columns:1fr; justify-items:center; text-align:center; gap:var(--space-8);
    padding-block:var(--space-12); }
  .fpg-values__mark{ width:min(240px,62vw); }
  .fpg-values__p{ margin-inline:auto; }
  .fpg-values .eyebrow::before{ display:none; }
  .fpg-values__list{ justify-content:center; gap:var(--space-3) var(--space-6); }
  .fpg-values__rule{ margin-inline:auto; }
}

/* ---------- Footer ---------- */
.fpg-footer{ background:var(--ground); color:#C6C1D6; }
.fpg-footer a{ color:#C6C1D6; } .fpg-footer a:hover{ color:#fff; }
.fpg-footer__top{ display:grid; grid-template-columns:1.5fr .9fr .9fr 1.15fr; gap:var(--space-8); padding-block:var(--space-16) var(--space-12); }
/* min-width:0 lets the 1fr tracks shrink below their content's min-content so a wide child
   (logo, newsletter form) can't force horizontal overflow that pushes the fixed nav off-screen. */
.fpg-footer__brand, .fpg-footer__col{ min-width:0; }
.fpg-footer__brand .fpg-logo{ max-width:min(100%,260px); height:auto; }
@media (max-width:900px){ .fpg-footer__top{ grid-template-columns:1fr 1fr; gap:var(--space-10,40px) var(--space-6); } }
@media (max-width:520px){ .fpg-footer__top{ grid-template-columns:1fr; } }
.fpg-footer__brand .fpg-nav__brand{ color:#fff; display:block; margin-bottom:var(--space-5,20px); }
.fpg-footer__brand .mk-ring{ stroke:var(--brass); } .fpg-footer__brand .mk-fp{ fill:#fff; }
.fpg-footer__tag{ font-family:var(--font-serif); font-size:1.3rem; color:#CFC6EA; max-width:22ch; line-height:1.3; }
.fpg-footer__seal{ margin-top:var(--space-4); font-size:var(--fs-caption); color:#8B85A3; display:flex; align-items:center; gap:8px; }
.fpg-footer h4{ color:#fff; font-size:var(--fs-caption); letter-spacing:.14em; text-transform:uppercase; margin-bottom:var(--space-5,20px); }
.fpg-footer__col ul{ list-style:none; display:grid; gap:var(--space-3); margin:0; padding:0; }
.fpg-footer__col a{ font-size:var(--fs-sm); }
/* One shared alignment for the contact rows: the icon column is fixed so the phone, the
   address and the email all start on the same vertical, however many lines each wraps to. */
.fpg-footer__col--contact li{ display:grid; grid-template-columns:18px minmax(0,1fr); gap:10px; align-items:start;
  font-size:var(--fs-sm); line-height:1.5; }
.fpg-footer__col--contact .ic{ width:18px; height:18px; margin-top:2px; color:var(--brass); }
.fpg-footer__col--contact .brk{ overflow-wrap:anywhere; }
.fpg-footer__social{ display:flex; gap:var(--space-3); margin-top:var(--space-6); }
.fpg-footer__social a{ width:40px; height:40px; border:1px solid rgba(255,255,255,.18); border-radius:50%; display:grid; place-items:center; transition:border-color .2s,background .2s,transform .2s; }
.fpg-footer__social a:hover{ border-color:var(--brass); background:rgba(58,42,114,.12); transform:translateY(-1px); }

/* Newsletter as its own full-width strip — as a fifth item inside the brand column it made
   that column twice the height of the link columns. */
.fpg-footer__news{ border-top:1px solid rgba(255,255,255,.1); padding-block:var(--space-8);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,26rem); gap:var(--space-6) var(--space-12); align-items:center; }
.fpg-footer__news h4{ margin-bottom:6px; }
.fpg-footer__news p{ font-size:var(--fs-sm); color:#8B85A3; margin:0; max-width:44ch; }
.fpg-footer__news .footer-news{ margin-top:0; max-width:none; }
@media (max-width:860px){ .fpg-footer__news{ grid-template-columns:1fr; } }

.fpg-footer__bar{ border-top:1px solid rgba(255,255,255,.1); padding-block:var(--space-6); display:flex; flex-wrap:wrap; gap:var(--space-4) var(--space-6); align-items:center; justify-content:space-between; }
.fpg-footer__bar,.fpg-footer__bar a{ font-size:var(--fs-caption); color:#8B85A3; }
.fpg-footer__bar .links{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-4); }
.fpg-footer__bar .eho{ display:inline-flex; align-items:center; gap:6px; }
.fpg-footer__bar .eho .ic{ width:15px; height:15px; opacity:.8; }

/* ---------- Forms ---------- */
.field{ display:block; margin-bottom:var(--space-4); }
.field > label{ display:block; font-size:var(--fs-sm); font-weight:600; color:var(--ink-soft); margin-bottom:7px; }
.field input,.field select,.field textarea{ width:100%; font:inherit; font-size:var(--fs-body); color:var(--ink); background:var(--bg); border:var(--border-soft); border-radius:var(--radius-sm); padding:13px var(--space-4); transition:border-color .15s,box-shadow .15s; }
.field textarea{ min-height:120px; resize:vertical; }
.field input::placeholder,.field textarea::placeholder{ color:var(--ink-muted); }
.field input:hover,.field select:hover,.field textarea:hover{ border-color:var(--ink-muted); }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--brass); box-shadow:var(--focus-ring); }
.form-row{ display:grid; gap:var(--space-4); }
@media (min-width:600px){ .form-row--2{ grid-template-columns:1fr 1fr; } }
.form-card{ background:var(--surface); border-radius:var(--radius-md); box-shadow:var(--shadow-2); padding:var(--space-8); }
.form-note{ font-size:var(--fs-caption); color:var(--ink-muted); margin-top:var(--space-3); }
.badge-soft{ display:inline-flex; align-items:center; gap:8px; background:var(--success-bg); color:var(--success); font-size:var(--fs-caption); font-weight:600; padding:8px 14px; border-radius:var(--radius-pill); }

/* ---------- Finder ---------- */
.finder{ position:sticky; top:73px; z-index:60; background:rgba(244,242,250,.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(58,42,114,.4); }
.finder__inner{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); padding-block:var(--space-3); }
.finder select,.finder input[type=search]{ font:inherit; font-size:var(--fs-sm); color:var(--ink); background:var(--surface); border:var(--border-soft); border-radius:var(--radius-pill); padding:10px var(--space-4); }
.finder input[type=search]{ min-width:200px; }
.finder__count{ margin-left:auto; font-size:var(--fs-sm); color:var(--ink-muted); }
.finder__count strong{ color:var(--ink); }
.finder__clear{ font-size:var(--fs-sm); background:none; border:0; color:var(--brass-deep); cursor:pointer; font-weight:600; }
.is-hidden{ display:none!important; }
.empty-state{ text-align:center; padding:var(--space-16) 0; color:var(--ink-muted); }

/* ---------- Map band ---------- */
.map-wrap{ position:relative; border-radius:var(--radius-lg); overflow:hidden; }
.map-wrap svg{ display:block; width:100%; height:auto; }

/* Real US states map */
.usmap-wrap{ max-width:660px; }
.usmap-svg{ display:block; width:100%; height:auto; overflow:visible; }
.usmap-svg .st{ fill:var(--sand); stroke:var(--bg); stroke-width:1.4; transition:fill .18s var(--ease); }
.usmap-svg .st--on{ fill:var(--brass); cursor:pointer; }
.usmap-svg .st--on:hover{ fill:var(--brass-deep); }
.usmap-svg .st--on:focus-visible{ outline:none; stroke:var(--ink); stroke-width:2.5; }
.usmap__key{ display:inline-block; width:12px; height:12px; border-radius:3px; background:var(--brass); vertical-align:-1px; margin-right:4px; }

.map-legend{ display:grid; grid-template-columns:1fr 1fr; gap:var(--space-3); }
@media (min-width:1024px){ .map-legend{ grid-template-columns:1fr; } }
.map-legend button{ display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3); background:transparent; border:0; border-bottom:var(--border-hair); padding:var(--space-4) 0; cursor:pointer; text-align:left; transition:padding-left .2s var(--ease), color .2s var(--ease); color:var(--ink); }
.map-legend button:hover{ padding-left:8px; color:var(--brass-deep); }
.map-legend .st{ font-family:var(--font-serif); font-size:1.2rem; color:inherit; }
.map-legend .ct{ font-size:var(--fs-sm); color:var(--brass-deep); font-weight:600; }

/* ---------- Detail ---------- */
.detail-bar{ position:sticky; top:73px; z-index:60; background:rgba(244,242,250,.92); backdrop-filter:blur(12px); border-bottom:1px solid rgba(58,42,114,.35); }
.detail-bar__inner{ display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); padding-block:var(--space-3); flex-wrap:wrap; }
.gallery{ display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:1fr 1fr; gap:var(--space-3); }
.gallery > *{ border-radius:var(--radius-md); overflow:hidden; aspect-ratio:auto; }
.gallery > *:first-child{ grid-row:span 2; }
.gallery img{ width:100%; height:100%; object-fit:cover; min-height:140px; }
@media (max-width:767px){ .gallery{ grid-template-columns:1fr 1fr; } .gallery > *:first-child{ grid-column:span 2; } }
.spec-list{ list-style:none; display:grid; gap:0; }
.spec-list li{ display:flex; justify-content:space-between; gap:var(--space-4); padding:var(--space-4) 0; border-bottom:var(--border-hair); font-size:var(--fs-sm); }
.spec-list .k{ color:var(--ink-muted); display:flex; align-items:center; gap:8px; } .spec-list .v{ font-weight:600; }
.floorplan{ background:var(--surface); border-radius:var(--radius-md); box-shadow:var(--shadow-1); padding:var(--space-6); border-left:3px solid var(--accent); }
.floorplan h4{ margin-bottom:2px; } .floorplan .price{ font-family:var(--font-serif); font-size:1.5rem; color:var(--brass-deep); }
.sticky-aside{ position:sticky; top:130px; }

/* ---------- FAQ ---------- */
.faq{ border-top:var(--border-hair); }
.faq details{ border-bottom:var(--border-hair); }
.faq summary{ display:flex; justify-content:space-between; align-items:center; gap:var(--space-4); cursor:pointer; padding-block:var(--space-5,20px); font-family:var(--font-serif); font-size:1.25rem; color:var(--ink); list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary .chev{ transition:transform .25s var(--ease); color:var(--brass-deep); }
.faq details[open] summary .chev{ transform:rotate(180deg); }
.faq details > div{ padding-bottom:var(--space-5,20px); color:var(--ink-soft); font-size:var(--fs-sm); max-width:66ch; }

/* ---------- Marquee ---------- */
.marquee{ overflow:hidden; border-block:var(--border-hair); padding-block:var(--space-5,20px); }
.marquee__track{ display:flex; align-items:center; width:max-content; animation:marq 55s linear infinite; }
.marquee__item{ font-family:var(--font-serif); font-size:clamp(1.2rem,2vw,1.75rem); color:var(--ink-soft); white-space:nowrap; display:inline-flex; align-items:center; letter-spacing:-.01em; }
.marquee__item::before{ content:"·"; color:var(--brass); margin-inline:var(--space-6); font-size:1.1em; line-height:0; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marq{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
@media (prefers-reduced-motion:reduce){ .marquee__track{ animation:none; } }

/* ---------- misc ---------- */
.surface-bg{ background:var(--bg); } .surface-card{ background:var(--surface); }
.surface-sand{ background:linear-gradient(180deg,var(--bg),#EBE8F2); }
.surface-dark{ background:var(--ground); color:var(--bg); }
.lockup-note{ font-size:var(--fs-caption); color:var(--ink-muted); }
.cluster{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); }
.measure{ max-width:62ch; }
