/* ============================================================
   Luminous Wealth — shared site styles
   Design: Direction 1b "Split Portrait". Self-contained, mobile-first.
   ============================================================ */

@import url("fonts/fonts.css");

:root {
  --navy: #1a2740;
  --navy-hover: #243559;
  --navy-stripe-a: #20304d;
  --navy-stripe-b: #233553;
  --gold-text: #735710;   /* AA-safe gold text on light, including --paper-alt */
  --gold: #c9a84c;        /* decorative + gold text on navy + gold buttons */
  --gold-hover: #d8bb63;
  --paper: #f7f5ef;
  --paper-alt: #e8e0cd;
  --ink: #1f2430;
  --soft-ink: #454d60;    /* darkened 2026-10-27 (was #56607a) — body copy read too faint on cream */
  --paper-stripe-a: #ece8dd;
  --paper-stripe-b: #e4dfd0;
  --portrait-stripe-a: #e4dfd0;
  --portrait-stripe-b: #dcd6c4;
  --hairline: rgba(135,104,24,.18);
  --hairline-soft: rgba(135,104,24,.16);
  --hairline-navy: rgba(201,168,76,.2);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }

.serif {
  font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
  font-feature-settings: "onum" 1, "liga" 1;
}

/* entrance motion — reduced-motion safe */
@keyframes lumFade { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.lum-in { animation: lumFade .9s cubic-bezier(.2,.7,.2,1) both; }
@media (prefers-reduced-motion: reduce) {
  .lum-in { animation: none; }
  html { scroll-behavior: auto; }
}

/* scroll-triggered reveal — assets/reveal.js toggles .is-visible via IntersectionObserver */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
}

/* ---------- layout helpers ---------- */
.container { max-width: 1080px; margin: 0 auto; }
.container-wide { max-width: 1120px; margin: 0 auto; }
.container-narrow { max-width: 960px; margin: 0 auto; }
/* large monitors: enlarge the whole page so it fills the screen like it does on a laptop.
   Each width divided by its zoom stays above 1340px, so the full menu still fits. */
:root { --zoom: 1; }
@media (min-width: 1600px) { :root { zoom: 1.1; --zoom: 1.1; } }
@media (min-width: 1800px) { :root { zoom: 1.2; --zoom: 1.2; } }
@media (min-width: 2300px) { :root { zoom: 1.5; --zoom: 1.5; } }
@media (min-width: 3200px) { :root { zoom: 2; --zoom: 2; } }
.section { padding: clamp(70px,9vw,120px) 6vw; }
.section-lg { padding: clamp(80px,11vw,150px) 6vw; }
.section-hero { padding: clamp(80px,11vw,150px) 6vw; }
.navy { background: var(--navy); color: var(--paper); }
.paper-alt { background: var(--paper-alt); }
.center { text-align: center; }

.eyebrow {
  font-size: 13px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--gold-text); margin-bottom: 26px;
}
.eyebrow.on-navy { color: var(--gold); }
.eyebrow.wide { letter-spacing: .28em; margin-bottom: 32px; }

h1, h2, h3 { font-weight: 400; margin: 0; }
.h1 { font-size: clamp(38px,5.8vw,64px); line-height: 1.14; letter-spacing: -.01em; text-wrap: balance; }
.h2 { font-size: clamp(29px,3.7vw,42px); line-height: 1.3; }
.statement { font-size: clamp(27px,3.3vw,36px); line-height: 1.45; }
.statement-lg { font-size: clamp(31px,4.3vw,48px); line-height: 1.32; text-wrap: balance; }
em.gold { color: var(--gold-text); font-style: italic; }
em.gold-navy { color: var(--gold); font-style: italic; }

.lede { font-size: 19px; line-height: 1.75; color: var(--soft-ink); }
.body { font-size: 18px; line-height: 1.75; color: var(--soft-ink); }
.body-navy { font-size: 18px; line-height: 1.75; color: rgba(247,245,239,.72); }

/* ---------- buttons & links ---------- */
.btn { display: inline-block; cursor: pointer; border-radius: 2px; font-size: 16px;
  text-decoration: none; white-space: nowrap; border: none; transition: background .18s, color .18s; }
.btn-navy { background: var(--navy); color: var(--paper); padding: 16px 34px; }
.btn-navy:hover { background: var(--navy-hover); }
.btn-gold { background: var(--gold); color: var(--navy); font-weight: 600; padding: 16px 32px; }
.btn-gold:hover { background: var(--gold-hover); }
.btn-ghost { border: 1px solid var(--navy); color: var(--navy); padding: 15px 32px; background: transparent; }
.btn-ghost:hover { background: var(--navy); color: var(--paper); }

.link-gold { cursor: pointer; text-decoration: none; color: var(--navy);
  border-bottom: 1px solid var(--gold); padding-bottom: 3px; font-size: 16px; }
.link-gold.on-navy { color: var(--paper); }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 50;
  display: flex; flex-wrap: wrap; align-items: center;
  padding: 16px clamp(20px,3vw,48px);
  background: rgba(247,245,239,.88); backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--hairline-soft);
}
.brand { text-decoration: none; font-size: 23px; color: var(--navy); letter-spacing: .01em;
  white-space: nowrap; flex-shrink: 0; margin-right: clamp(32px,5vw,92px); }
.brand span { color: var(--gold-text); }
.site-nav { display: flex; flex-wrap: wrap; align-items: center; gap: clamp(13px,1.5vw,24px) clamp(13px,1.5vw,24px); margin-right: auto; }
.site-nav a { position: relative; white-space: nowrap; font-size: 14.5px; color: var(--soft-ink); text-decoration: none; padding-bottom: 3px; }
.site-nav a:hover { color: var(--navy); }
.site-nav a.active { color: var(--navy); }
.site-nav a.active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1.5px; background: var(--gold); }
.header-actions { display: flex; align-items: center; gap: 22px; }
.header-actions .login {
  cursor: pointer; white-space: nowrap; font-size: 14px; letter-spacing: .04em; text-decoration: none;
  color: var(--gold-text); padding: 9px 17px; border: 1px solid rgba(135,104,24,.4); border-radius: 2px;
}
.header-actions .login:hover { background: rgba(135,104,24,.06); }
.header-actions .schedule {
  cursor: pointer; white-space: nowrap; font-size: 14px; font-weight: 600; letter-spacing: .04em; text-decoration: none;
  color: var(--paper); background: var(--navy); padding: 11px 22px; border-radius: 2px;
}
.header-actions .schedule:hover { background: var(--navy-hover); }

/* ---------- grids ---------- */

/* photo placeholders (striped) — replaced by real imagery where available */

.photo { border-radius: 3px; overflow: hidden; }
.photo img { width: 100%; height: 100%; object-fit: cover; }
.ratio-4x5 { aspect-ratio: 4/5; }
.ratio-3x4 { aspect-ratio: 3/4; }

/* ---------- shared layout snippets ---------- */
.cta-row { margin-top: 38px; display: flex; gap: 26px; justify-content: center; align-items: center; flex-wrap: wrap; }
.navy-close { padding: clamp(78px,9vw,130px) 6vw; border-top: 1px solid rgba(201,168,76,.14); }

/* ---------- faded brand watermark on navy bands (echoes live site's section backgrounds) ---------- */
.navy.center, .svc-highlight, .svc-hero { position: relative; isolation: isolate; overflow: hidden; }
.navy.center::before, .svc-highlight::before, .svc-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("img/bg/ring-field.svg") center/cover no-repeat;
  opacity: .5;
}

/* ---------- homepage hero: the words layered over a very large emblem ---------- */
.hero-home { position: relative; background: var(--navy); color: var(--paper); overflow: hidden;
  --overlap: clamp(40px,6vw,72px);  /* how far the next section rises over the banner, to match .section-overlap */
  --hero-h: max(640px, calc(100vh / var(--zoom) - 74px));  /* the part of the banner left showing */
  --hero-h: max(640px, calc(100svh / var(--zoom) - 74px));
  --badge: min(calc((var(--hero-h) - 44px) / 1.14), calc((100vw / var(--zoom) - 14px) / 1.14)); }  /* the whole ring always fits */
@media (max-width: 640px) { .hero-home { --overlap: 28px; --hero-h: max(560px, calc(100svh - 62px)); } }
.hero-home .bg { position: absolute; inset: 0; background:
  radial-gradient(circle at 50% 46%, rgba(201,168,76,.18), transparent 62%),
  url("img/bg/ring-field.svg") center/cover no-repeat,
  linear-gradient(180deg, #0d1525, #1a2740); }
.hero-home .veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,22,38,.14), rgba(14,22,38,.30) 62%, rgba(20,29,50,.58)); }
.hero-home .inner { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  min-height: var(--hero-h); margin-bottom: var(--overlap); padding: 28px 6vw; text-align: center; }
.hero-home h1 { font-family: 'Newsreader',Georgia,serif; font-weight: 400; font-size: clamp(56px,8.6vw,114px); line-height: 1.05; letter-spacing: .01em; margin: 0; color: #f3ead2; }
.hero-home h1 span { color: var(--gold); }
.hero-home .tag { margin: 28px auto 0; max-width: 54ch; font-size: clamp(18px,2.1vw,21px); line-height: 1.72; color: rgba(247,245,239,.88); }

/* ---------- holistic wealth wheel (our-approach): brand graphic + aspect cards ---------- */
.wheel-fig { max-width: min(640px, 84vw); margin: 0 auto; }
.wheel-fig img { display: block; width: 100%; height: auto; filter: drop-shadow(0 30px 48px rgba(26,39,64,.20)); }

.asp-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: clamp(18px,2.4vw,28px); max-width: 1080px; margin: clamp(48px,6vw,76px) auto 0; }
a.asp-card { position: relative; display: flex; flex-direction: column; text-decoration: none; text-align: left;
  background: var(--paper); border: 1px solid var(--hairline); border-radius: 18px; padding: clamp(26px,3.4vw,40px);
  box-shadow: 0 1px 2px rgba(26,39,64,.06), 0 14px 34px rgba(26,39,64,.08);
  transition: transform .32s cubic-bezier(.2,.7,.3,1), box-shadow .32s ease, border-color .32s ease; }
a.asp-card:hover { transform: translateY(-6px); border-color: rgba(201,168,76,.6);
  box-shadow: 0 3px 6px rgba(26,39,64,.07), 0 26px 54px rgba(26,39,64,.14), 0 0 0 1px rgba(201,168,76,.25); }
.asp-top { display: flex; align-items: baseline; gap: 14px; margin-bottom: 14px; }
.asp-num { font-family: 'Newsreader',Georgia,serif; font-size: 16px; letter-spacing: .14em; color: var(--gold-text); }
.asp-card h3 { font-weight: 500; font-size: clamp(21px,2.4vw,25px); color: var(--ink); margin: 0; }
.asp-card p { font-size: 16.5px; line-height: 1.7; color: var(--soft-ink); margin: 0; }
.asp-more { margin-top: auto; padding-top: 20px; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-text); transition: color .3s ease; }
.asp-more::after { content: "\2192"; margin-left: 8px; transition: margin-left .3s ease; }
a.asp-card:hover .asp-more { color: var(--navy); }
a.asp-card:hover .asp-more::after { margin-left: 13px; }

/* section that floats up and overlaps the band above it — layered depth, matching the live site's card-over-hero treatment */
.section-overlap {
  position: relative; z-index: 2;
  margin-top: clamp(-72px,-6vw,-40px);
  background: var(--paper);
  border-radius: 28px 28px 0 0;
  box-shadow: 0 -26px 60px rgba(15,22,38,.18);
  padding-top: clamp(96px,11vw,150px);
}
@media (max-width: 640px) {
  .section-overlap { margin-top: -28px; border-radius: 18px 18px 0 0; padding-top: 64px; }
}

/* homepage "What We Do" two-pillar grid: big plus sign in the gap, matching the live site */
.pillars-grid { position: relative; }
.pillars-plus {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  font-family: 'Newsreader',Georgia,serif; font-weight: 300;
  font-size: clamp(32px,4vw,52px); line-height: 1; color: var(--gold-text);
  pointer-events: none; z-index: 2;
}
@media (max-width: 640px) { .pillars-plus { display: none; } }

/* self-discovery assessment: the gold helix melts into its navy band.
   "lighten" drops the image's dark background into the navy; the mask fades its inner edge. */
.dna-band { position: relative; overflow: hidden; isolation: isolate; }
.dna-copy { position: relative; z-index: 1; }
.dna-photo { position: absolute; top: 0; right: 0; bottom: 0; width: 56%; mix-blend-mode: lighten;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 46%); mask-image: linear-gradient(to right, transparent 0, #000 46%); }
.dna-photo img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: 50% 42%; }
@media (max-width: 768px) {
  .dna-photo { position: relative; width: 100vw; height: 92vw; margin: calc(-1 * clamp(80px,11vw,150px)) -6vw 0;
    -webkit-mask-image: linear-gradient(to bottom, #000 62%, transparent 100%); mask-image: linear-gradient(to bottom, #000 62%, transparent 100%); }
}

/* homepage "Four Services" split layout: compact list + large bleeding illustration */
.svc-mini-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 18px 20px; margin-top: 4px; }
@media (max-width: 560px) { .svc-mini-grid { grid-template-columns: 1fr; } }
a.svc-mini { text-decoration: none; color: inherit; display: block; }
a.svc-mini .asp-top { margin-bottom: 10px; }
a.svc-mini h3 { font-weight: 500; font-size: 17px; color: var(--ink); margin: 0; transition: color .2s ease; }
a.svc-mini:hover h3 { color: var(--gold-text); }
a.svc-mini p { font-size: 14.5px; line-height: 1.6; color: var(--soft-ink); margin: 0; }

.svc-mini-grid.on-navy { gap: 16px; }
.svc-mini-grid.on-navy .asp-top { align-items: center; margin-bottom: 12px; }
.svc-mini-grid.on-navy .asp-num {
  display: flex; align-items: center; justify-content: center;
  width: 27px; height: 27px; flex-shrink: 0; border-radius: 50%;
  border: 1px solid rgba(201,168,76,.4); background: rgba(201,168,76,.08);
  font-size: 11.5px; color: var(--gold); letter-spacing: 0;
}
.svc-mini-grid.on-navy a.svc-mini h3 { font-size: 15.5px; }
.svc-mini-grid.on-navy a.svc-mini p { font-size: 13px; line-height: 1.55; }
a.svc-mini {
  background: rgba(247,245,239,.045);
  border: 1px solid rgba(201,168,76,.2);
  border-radius: 14px;
  padding: clamp(14px,1.6vw,18px);
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
}
.svc-mini-grid.on-navy a.svc-mini:hover {
  transform: translateY(-5px);
  background: rgba(247,245,239,.075);
  border-color: rgba(201,168,76,.55);
  box-shadow: 0 20px 40px rgba(8,13,24,.32), 0 0 0 1px rgba(201,168,76,.18);
}
.svc-mini-grid.on-navy a.svc-mini h3 { color: #f6efdc; }
.svc-mini-grid.on-navy a.svc-mini:hover h3 { color: var(--gold); }
.svc-mini-grid.on-navy a.svc-mini p { color: rgba(247,245,239,.72); }

/* the man belongs to his navy band, as the DNA helix does: large, past the screen edge, warm light behind him.
   His width and offset both scale with the screen, so his left edge always stays clear of the text column. */
.vit-band { position: relative; overflow: hidden; overflow: clip; isolation: isolate; } /* clip: "hidden" can still be scrolled sideways, which slid the text left */
.vit-copy { position: relative; z-index: 1; }
.svc-vitruvian-wrap { position: absolute; top: 50%; right: calc(-5.5vw / var(--zoom, 1)); width: calc(55.5vw / var(--zoom, 1)); translate: 0 -50%; }
.svc-vitruvian-wrap::before { content: ""; position: absolute; inset: -24% -18%; z-index: -1; pointer-events: none;
  background:
    radial-gradient(ellipse 34% 40% at 48% 42%, rgba(214,170,84,.26), transparent 72%),
    radial-gradient(ellipse 30% 30% at 84% 30%, rgba(190,112,52,.26), transparent 74%),
    radial-gradient(ellipse 24% 22% at 26% 76%, rgba(190,112,52,.14), transparent 74%); }
.svc-vitruvian { display: block; width: 100%; max-width: none; margin: 0; filter: drop-shadow(0 0 22px rgba(230,190,104,.28)); }
.svc-vitruvian-credit { position: absolute; top: calc(100% + 26px); left: 16%; right: 16%; z-index: 1; margin: 0; font-size: 11px; line-height: 1.5; text-align: center; color: var(--soft-ink); opacity: .7; }
.svc-vitruvian-credit.on-navy { color: rgba(247,245,239,.55); }
@media (max-width: 768px) {
  .svc-vitruvian-wrap { position: relative; top: auto; right: auto; width: 100vw; margin: -24px -6vw 0; translate: none; }
  .svc-vitruvian-credit { position: static; margin: 10px 6vw 0; }
}

/* aspect pages: clickable guided-by cards route to team profiles */
a.tmember { text-decoration: none; color: inherit; transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
a.tmember:hover { transform: translateY(-4px); border-color: rgba(201,168,76,.6); box-shadow: 0 4px 8px rgba(26,39,64,.06), 0 18px 38px rgba(26,39,64,.13); }
a.tmember .nm::after { content: "\2192"; display: inline-block; margin-left: 8px; font-size: .8em; color: var(--gold-text); opacity: 0; transform: translateX(-4px); transition: opacity .28s ease, transform .28s ease; }
a.tmember:hover .nm::after { opacity: 1; transform: translateX(0); }

/* team member pages */
.member-head { display: flex; gap: clamp(22px,3vw,36px); align-items: center; justify-content: center; flex-wrap: wrap; text-align: left; }
.member-head img { width: clamp(116px,15vw,158px); height: clamp(116px,15vw,158px); border-radius: 50%; object-fit: cover; object-position: center top;
  border: 2px solid rgba(201,168,76,.55); box-shadow: 0 14px 34px rgba(0,0,0,.4), 0 0 0 6px rgba(201,168,76,.12); }
.member-head h1 { margin: 0; }
.member-contact { display: flex; flex-wrap: wrap; gap: 10px 14px; margin-top: 16px; }
.member-contact a { display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; letter-spacing: .03em; text-decoration: none;
  color: #f3ead2; border: 1px solid rgba(201,168,76,.4); border-radius: 100px; padding: 8px 16px; transition: background .25s ease, color .25s ease; }
.member-contact a:hover { background: var(--gold); color: var(--navy); }
.svc-group h3 { font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin: 0 0 14px; font-weight: 600; }
@media (max-width: 640px) { .member-head { flex-direction: column; text-align: center; } .member-contact { justify-content: center; } }

/* aspect detail pages: resource lists */
.res-cols { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: clamp(20px,3vw,34px); max-width: 1040px; margin: 0 auto; }
.res-col h3 { font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin: 0 0 14px; font-weight: 600; }
.res-col ul { list-style: none; margin: 0; padding: 0; }
.res-col li { font-size: 16.5px; line-height: 1.55; color: var(--soft-ink); padding: 9px 0 9px 22px; position: relative; border-bottom: 1px solid var(--hairline-soft); }
.res-col li:last-child { border-bottom: 0; }
.res-col li::before { content: ""; position: absolute; left: 2px; top: 17px; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); opacity: .75; }
.res-col li em { color: var(--ink); font-style: normal; }

/* ---------- blog article (prose) ---------- */
.post-article { padding: clamp(48px,7vw,88px) 6vw clamp(70px,9vw,120px); }
.post-wrap { max-width: 720px; margin: 0 auto; }
.post-back { display: inline-block; font-size: 15px; color: var(--gold-text); text-decoration: none; letter-spacing: .04em; margin-bottom: 34px; }
.post-back:hover { color: var(--navy); }
.post-tag { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin-bottom: 16px; }
.post-title { font-weight: 400; font-size: clamp(33px,4.8vw,55px); line-height: 1.16; letter-spacing: -.01em; text-wrap: balance; margin: 0; }
.post-meta { font-size: 15px; color: var(--soft-ink); margin-top: 20px; padding-bottom: 30px; border-bottom: 1px solid var(--hairline); }
.post-body { margin-top: 36px; }
.post-body > p:first-child { font-size: 21px; color: var(--ink); }
.post-body p { font-size: 19px; line-height: 1.8; color: var(--soft-ink); margin: 0 0 22px; }
.post-body h2 { font-family: 'Newsreader',Georgia,serif; font-weight: 500; font-size: clamp(24px,3vw,33px); line-height: 1.26; color: var(--ink); margin: 46px 0 16px; }
.post-body h3 { font-family: 'Newsreader',Georgia,serif; font-weight: 500; font-size: 23px; color: var(--ink); margin: 32px 0 12px; }
.post-body ul, .post-body ol { margin: 0 0 22px; padding-left: 22px; }
.post-body li { font-size: 19px; line-height: 1.75; color: var(--soft-ink); margin-bottom: 10px; }
.post-body blockquote { margin: 30px 0; padding: 6px 0 6px 26px; border-left: 2px solid var(--gold); font-family: 'Newsreader',Georgia,serif; font-style: italic; font-size: 22px; line-height: 1.5; color: var(--ink); }
.post-body blockquote p { font-size: inherit; color: inherit; line-height: inherit; margin: 0 0 10px; }
.post-body strong { color: var(--ink); font-weight: 600; }
.post-body em { font-style: italic; }
.post-cta { margin-top: 56px; padding-top: 40px; border-top: 1px solid var(--hairline); text-align: center; }
.post-cta p { font-family: 'Newsreader',Georgia,serif; font-size: 24px; color: var(--ink); margin: 0 0 24px; }

/* ---------- eight aspects chips ---------- */
.aspects-line { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; max-width: 720px; margin: 0 auto; }
.aspect-chip { display: inline-flex; align-items: center; gap: 9px; padding: 9px 17px; border: 1px solid rgba(135,104,24,.28); border-radius: 100px;
  font-size: 13.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--ink); background: var(--paper); text-decoration: none; transition: border-color .2s, background .2s, color .2s; }
.aspect-chip:hover { color: var(--navy); }
.aspect-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); flex-shrink: 0; }
.aspect-chip:hover { border-color: rgba(135,104,24,.55); background: rgba(201,168,76,.06); }

/* ---------- discovery process cards ---------- */
.process { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 30px; }
.pstep { position: relative; display: grid; grid-template-columns: 56px 1fr; gap: 26px; align-items: start;
  background: var(--paper); border: 1px solid var(--hairline); border-radius: 20px;
  padding: clamp(26px,3vw,38px);
  box-shadow: 0 1px 2px rgba(26,39,64,.06), 0 8px 18px rgba(26,39,64,.10), 0 18px 40px rgba(26,39,64,.08);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.pstep:hover { transform: translateY(-6px);
  box-shadow: 0 2px 4px rgba(26,39,64,.08), 0 16px 30px rgba(26,39,64,.14), 0 30px 60px rgba(26,39,64,.12);
  border-color: rgba(135,104,24,.38); }
/* down-arrow pointing to the next card */
.pstep:not(:last-child)::after {
  content: ""; position: absolute; left: 50%; top: 100%; z-index: 2;
  width: 11px; height: 11px;
  border-right: 2px solid var(--gold-text); border-bottom: 2px solid var(--gold-text);
  transform: translate(-50%, 8px) rotate(45deg); opacity: .7;
}
.pnum { width: 56px; height: 56px; border-radius: 50%;
  border: 1px solid rgba(135,104,24,.4); background: rgba(201,168,76,.08);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Newsreader',Georgia,serif; font-size: 23px; color: var(--gold-text); }
.pstep h3 { font-weight: 500; font-size: clamp(22px,2.6vw,27px); margin: 11px 0 10px; color: var(--ink); }
.pstep p { margin: 0; max-width: 58ch; font-size: 18px; line-height: 1.75; color: var(--soft-ink); }
.pstep .tag { display: inline-block; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-text); margin-top: 12px; }
@media (max-width: 560px) {
  .pstep { grid-template-columns: 46px 1fr; gap: 18px; }
  .pnum { width: 46px; height: 46px; font-size: 19px; }
}

/* ---------- journey: numbered steps on one gold line, not separate cards ---------- */
.journey { list-style: none; margin: 0 auto; padding: 0; max-width: 1080px; }
.jstep { position: relative; display: grid; grid-template-columns: 1fr 96px 1fr; column-gap: clamp(28px,3.4vw,48px); align-items: start;
  padding-bottom: clamp(48px,5.5vw,72px); }
.jstep:last-child { padding-bottom: 0; }
/* the gold line: each step draws down to the next, so it stops at the last medallion */
.jstep:not(:last-child)::before { content: ""; position: absolute; left: 50%; top: 48px; bottom: -48px; width: 2px; margin-left: -1px;
  background: linear-gradient(180deg, var(--gold), rgba(135,104,24,.55)); }
.jnode { grid-column: 2; grid-row: 1; position: relative; z-index: 1; width: 96px; height: 96px; border-radius: 50%; color: var(--gold);
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 35% 28%, var(--navy-hover), var(--navy) 72%);
  box-shadow: 0 0 0 1px rgba(201,168,76,.55), 0 14px 28px rgba(26,39,64,.2);
  transition: box-shadow .3s, transform .3s; }
.jnode svg { width: 46px; height: 46px; }
.jnode::after { content: ""; position: absolute; inset: -12px; background: url("img/ring.svg") center/contain no-repeat; opacity: .75;
  animation: jturn 90s linear infinite; }
@keyframes jturn { to { transform: rotate(360deg); } }
.jstep:hover .jnode { transform: scale(1.05); box-shadow: 0 0 0 1px var(--gold), 0 16px 34px rgba(135,104,24,.32); }
.jmain { grid-column: 1; grid-row: 1; }
.jnote { grid-column: 3; grid-row: 1; margin: 0; padding-top: 34px; font-family: 'Newsreader',Georgia,serif; font-style: italic;
  font-size: clamp(18px,1.6vw,20px); line-height: 1.55; color: var(--soft-ink); }
.jnote strong { display: block; margin-bottom: 8px; font-family: 'Inter',system-ui,sans-serif; font-style: normal; font-weight: 500;
  font-size: 11.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.jstep:nth-child(even) .jmain { grid-column: 3; }
.jstep:nth-child(even) .jnote { grid-column: 1; text-align: right; }
.jlabel { font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); }
.jmain h3 { font-family: 'Newsreader',Georgia,serif; font-weight: 400; font-size: clamp(27px,3vw,34px); line-height: 1.2; margin: 6px 0 12px; color: var(--ink); }
.jmain p { margin: 0; font-size: 17.5px; line-height: 1.72; color: var(--soft-ink); }
@media (max-width: 860px) {
  .jstep, .jstep:nth-child(even) { grid-template-columns: 64px 1fr; column-gap: 24px; padding-bottom: 46px; }
  .jstep:last-child { padding-bottom: 0; }
  .jstep:not(:last-child)::before { left: 32px; top: 32px; bottom: -32px; }
  .jnode { grid-column: 1; grid-row: 1 / span 2; width: 64px; height: 64px; align-self: start; }
  .jnode svg { width: 32px; height: 32px; }
  .jnode::after { inset: -8px; }
  .jmain, .jstep:nth-child(even) .jmain { grid-column: 2; grid-row: 1; }
  .jnote, .jstep:nth-child(even) .jnote { grid-column: 2; grid-row: 2; padding-top: 18px; text-align: left; }
}
@media (prefers-reduced-motion: reduce) { .jnode::after { animation: none; } }

/* ---------- responsive video embed ---------- */
.video-frame {
  position: relative; width: 100%; max-width: 860px; margin: 0 auto;
  aspect-ratio: 16 / 9; border-radius: 4px; overflow: hidden;
  box-shadow: 0 20px 50px rgba(26,39,64,.18);
}
.video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ---------- services page ---------- */
.svc-pillars { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px 0; }
.svc-pillars .pill { padding: 6px clamp(22px,3.4vw,46px); text-align: center; }
.svc-pillars .pill + .pill { border-left: 1px solid var(--hairline); }
.svc-pillars .pill .k { display: block; font-family: 'Newsreader',Georgia,serif; font-size: clamp(21px,2.5vw,27px); line-height: 1.15; color: var(--ink); }
.svc-pillars .pill .l { display: block; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold-text); margin-top: 9px; }

.svc-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(288px,1fr)); gap: 24px; }
.svc-card { display: block; text-decoration: none; color: inherit;
  position: relative; overflow: hidden; background: var(--paper); border: 1px solid var(--hairline);
  border-radius: 4px; padding: clamp(30px,3.4vw,42px); transition: border-color .25s, transform .25s, box-shadow .25s; }
a.svc-card:hover { border-color: rgba(135,104,24,.45); transform: translateY(-3px); box-shadow: 0 18px 40px rgba(26,39,64,.09); }
.svc-more { display: inline-block; margin-top: 20px; font-size: 15px; color: var(--gold-text); }
a.svc-card:hover .svc-more { text-decoration: underline; text-underline-offset: 3px; }
.svc-num { position: absolute; top: 14px; right: 24px; font-family: 'Newsreader',Georgia,serif; font-weight: 400;
  font-size: 66px; line-height: 1; color: var(--gold); opacity: .16; pointer-events: none; }
.svc-icon { width: 42px; height: 42px; color: var(--gold-text); margin-bottom: 22px; position: relative; }
.svc-icon svg { width: 100%; height: 100%; display: block; }
.svc-card h3 { font-weight: 500; font-size: clamp(23px,2.7vw,28px); margin: 0 0 13px; color: var(--ink); }
.svc-card > p { font-size: 17px; line-height: 1.72; color: var(--soft-ink); margin: 0 0 22px; }
.svc-incl { list-style: none; margin: 0; padding: 18px 0 0; border-top: 1px solid var(--hairline); display: flex; flex-direction: column; gap: 9px; }
.svc-incl li { position: relative; padding-left: 20px; font-size: 15px; line-height: 1.5; color: var(--soft-ink); }
.svc-incl li::before { content: ""; position: absolute; left: 0; top: 7px; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); }

/* ---------- service detail pages ---------- */
.svc-hero { background: var(--navy); color: var(--paper); text-align: center; padding: clamp(64px,9vw,110px) 6vw clamp(52px,7vw,80px); }
.svc-hero .back { display: inline-block; color: var(--gold); text-decoration: none; font-size: 14px; letter-spacing: .06em; margin-bottom: 32px; opacity: .85; }
.svc-hero .back:hover { opacity: 1; }
.svc-hero-badge { width: 84px; height: 84px; margin: 0 auto 26px; border-radius: 50%; border: 1px solid rgba(201,168,76,.42);
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 40% 35%, rgba(201,168,76,.18), rgba(26,39,64,0) 72%);
  box-shadow: 0 0 46px rgba(201,168,76,.18) inset; }
.svc-hero-badge svg { width: 38px; height: 38px; color: var(--gold); }
.svc-hero h1 { font-weight: 400; font-size: clamp(37px,5.4vw,59px); line-height: 1.12; max-width: 18ch; margin: 0 auto; color: #f6efdc; text-wrap: balance; }
.svc-hero .subtitle { max-width: 54ch; margin: 24px auto 0; font-size: clamp(19px,2.2vw,23px); line-height: 1.55; color: rgba(247,245,239,.84); font-family: 'Newsreader',Georgia,serif; font-style: italic; }

.svc-section { padding: clamp(58px,8vw,108px) 6vw; }
.svc-section.alt { background: var(--paper-alt); }
.svc-lead { max-width: 720px; margin: 0 auto; }
.svc-lead .big { font-family: 'Newsreader',Georgia,serif; font-weight: 400; font-size: clamp(27px,3.3vw,36px); line-height: 1.36; color: var(--ink); margin: 0 0 26px; }
.svc-lead .big em { color: var(--gold-text); font-style: italic; }
.svc-lead p { font-size: 19px; line-height: 1.8; color: var(--soft-ink); margin: 0 0 20px; }
.svc-section-head { text-align: center; max-width: 60ch; margin: 0 auto clamp(36px,5vw,56px); }
.svc-section-head h2 { font-weight: 400; font-size: clamp(29px,3.7vw,42px); line-height: 1.24; margin: 16px 0 0; color: var(--ink); }

.feature-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(272px,1fr)); gap: 22px; max-width: 1040px; margin: 0 auto; }
.feature-card { position: relative; background: var(--paper); border: 1px solid var(--hairline); border-radius: 12px;
  padding: clamp(26px,3vw,36px); box-shadow: 0 4px 16px rgba(26,39,64,.05); transition: transform .25s, box-shadow .25s, border-color .25s; }
.feature-card:hover { transform: translateY(-4px); box-shadow: 0 20px 44px rgba(26,39,64,.11); border-color: rgba(135,104,24,.35); }
.feature-card .fnum { font-family: 'Newsreader',Georgia,serif; font-size: 16px; color: var(--gold-text); letter-spacing: .12em; }
.feature-card h3 { font-weight: 500; font-size: 22px; margin: 9px 0 11px; color: var(--ink); }
.feature-card p { font-size: 16.5px; line-height: 1.66; color: var(--soft-ink); margin: 0; }

.svc-highlight { background: var(--navy); color: var(--paper); text-align: center; padding: clamp(60px,8vw,104px) 6vw; }
.svc-highlight .q { font-family: 'Newsreader',Georgia,serif; font-weight: 400; font-size: clamp(27px,3.7vw,42px); line-height: 1.34; max-width: 26ch; margin: 0 auto; color: #f3ead2; }
.svc-highlight .q em { color: var(--gold); font-style: italic; }
.svc-highlight .attr { margin-top: 22px; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); }

.chip-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 760px; margin: 0 auto; }
.chip-row span { padding: 11px 20px; border: 1px solid rgba(135,104,24,.28); border-radius: 100px; font-size: 15px; letter-spacing: .02em; color: var(--ink); background: var(--paper); }

/* ---------- aspect detail: team members ---------- */
.aspect-team { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 18px; max-width: 880px; margin: 0 auto; }
.tmember { display: flex; gap: 18px; align-items: center; background: var(--paper); border: 1px solid var(--hairline);
  border-radius: 14px; padding: 20px 22px; box-shadow: 0 4px 16px rgba(26,39,64,.05); }
.tmember img { width: 74px; height: 74px; border-radius: 50%; object-fit: cover; object-position: center top; flex-shrink: 0; }
.tmember .nm { font-family: 'Newsreader',Georgia,serif; font-size: 21px; color: var(--ink); line-height: 1.2; }
.tmember .rl { font-size: 13.5px; letter-spacing: .03em; color: var(--gold-text); margin-top: 4px; line-height: 1.4; }

/* ---------- services nav dropdown ---------- */
.site-nav .nav-item { position: relative; display: inline-flex; align-items: center; }
.subnav { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); padding-top: 12px;
  opacity: 0; visibility: hidden; transition: opacity .18s ease; z-index: 60; pointer-events: none; }
.nav-item:hover .subnav, .nav-item:focus-within .subnav { opacity: 1; visibility: visible; pointer-events: auto; }
.subnav-inner { display: flex; flex-direction: column; min-width: 232px; padding: 8px;
  background: var(--paper); border: 1px solid var(--hairline-soft); border-radius: 10px; box-shadow: 0 18px 44px rgba(26,39,64,.16); }
.subnav-inner a { padding: 11px 14px; font-size: 14.5px; color: var(--soft-ink); white-space: nowrap; border-radius: 6px; text-decoration: none; letter-spacing: 0; }
.subnav-inner a:hover { background: var(--paper-alt); color: var(--navy); }
.subnav-inner a::after { display: none; } /* suppress active-underline styles inside dropdown */

/* ---------- gold dot marker + hairline rows ---------- */

/* ---------- footer ---------- */
.site-footer { background: var(--navy); color: rgba(247,245,239,.72); padding: clamp(64px,7vw,90px) 6vw 40px; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 44px; }
.footer-brand { font-size: 23px; color: var(--paper); margin-bottom: 16px; }
.footer-brand span { color: var(--gold); }
.footer-col h4 { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin: 0 0 16px; font-weight: 400; }
.footer-col .links { display: flex; flex-direction: column; gap: 11px; }
.footer-col a { font-size: 15px; color: rgba(247,245,239,.72); text-decoration: none; }
.footer-col a:hover { color: var(--paper); }
.site-footer .social-links a { font-size: 14px; letter-spacing: .05em; color: var(--gold); text-decoration: none; }
.site-footer .social-links a:hover { color: var(--paper); }
.footer-contact { margin-top: 26px; }
.footer-contact h4 { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin: 0 0 14px; font-weight: 400; }
.footer-contact .lines { display: flex; flex-direction: column; gap: 8px; font-size: 15px; line-height: 1.6; }
.footer-contact .lines a { color: rgba(247,245,239,.72); text-decoration: none; }
.footer-contact .lines a:hover { color: var(--paper); }
.footer-legal-row { padding-top: 28px; margin-top: 48px; border-top: 1px solid var(--hairline-navy);
  display: flex; flex-wrap: wrap; gap: 14px 26px; align-items: center; }
.brokercheck { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; letter-spacing: .06em;
  color: var(--gold); border: 1px solid rgba(201,168,76,.4); border-radius: 2px; padding: 7px 12px; text-decoration: none; }
.footer-legal-row a:not(.brokercheck) { font-size: 14px; color: rgba(247,245,239,.72); text-decoration: none; }
.footer-legal-row a:not(.brokercheck):hover { color: var(--paper); }
.footer-fine { margin-top: 24px; font-size: 13px; line-height: 1.7; color: rgba(247,245,239,.5); }
.footer-fine p { margin: 0 0 10px; }
.footer-fine p:last-child { margin: 0; }

/* ============================================================
   Mobile — grids that use fixed fractions must stack.
   auto-fit grids collapse on their own; these need help.
   ============================================================ */
/* header has 9 nav items + 2 buttons — needs to wrap well before general tablet layout does */
@media (max-width: 1100px) {
  .site-nav { gap: 10px 14px; }
  .site-nav a { font-size: 13.5px; }
  .header-actions { flex-basis: 100%; justify-content: flex-start; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--hairline-soft); }
}
@media (max-width: 768px) {
  .split-2col { grid-template-columns: 1fr !important; gap: 40px !important; }
  .split-2col .order-photo { order: -1; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 640px) {
  .header-actions .login { display: none; } /* keep the primary CTA, drop secondary on tiny screens */
  .footer-grid { grid-template-columns: 1fr; gap: 28px; }
  .btn-navy, .btn-gold { padding-left: 26px; padding-right: 26px; }
  .asp-grid { grid-template-columns: 1fr; }
  /* services value strip: stack cleanly, drop vertical dividers when wrapped */
  .svc-pillars { flex-direction: column; gap: 22px; }
  .svc-pillars .pill + .pill { border-left: 0; }
}

/* ============================================================
   REFRESH 2026-10-27 — "the eight-point light"
   Signature: a thin gold ring with eight points (the Eight Aspects),
   img/ring.svg — hero halo, eyebrow marks, step numbers, pop-up.
   Same colours, same words; more air, larger type, gentle motion.
   ============================================================ */
:root { --ring: url("img/ring.svg"); --ease: cubic-bezier(.2,.7,.2,1); }

/* type: a little larger and more editorial */
.statement { font-size: clamp(30px,3.7vw,44px); line-height: 1.3; letter-spacing: -.008em; text-wrap: balance; }
.statement-lg { font-size: clamp(34px,4.6vw,54px); line-height: 1.22; letter-spacing: -.012em; }
.h2 { font-size: clamp(31px,3.8vw,46px); line-height: 1.22; letter-spacing: -.01em; text-wrap: balance; }
.lede, .body { color: var(--soft-ink); text-wrap: pretty; }
p { text-wrap: pretty; }

/* eyebrow carries a tiny ring */
.eyebrow { display: block; } /* stays on its own line; text-align centres it where the section is centred */
.eyebrow::before { content: ""; display: inline-block; width: 17px; height: 17px; margin-right: 12px; vertical-align: -4px;
  background: var(--ring) center/contain no-repeat; opacity: .9; }

/* buttons: softer, pill-shaped, with a slow gold sheen */
.btn, .header-actions .login, .header-actions .schedule { border-radius: 999px; }
.btn { letter-spacing: .02em; transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease); }
.btn:hover { transform: translateY(-1px); }
.btn-gold { position: relative; overflow: hidden; box-shadow: 0 10px 26px rgba(201,168,76,.28); }
.btn-gold::after { content: ""; position: absolute; inset: 0; transform: translateX(-120%);
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.45) 50%, transparent 65%); transition: transform .9s var(--ease); }
.btn-gold:hover::after { transform: translateX(120%); }
.btn-navy { box-shadow: 0 10px 24px rgba(26,39,64,.18); }

/* ---------- header: one line on desktop, "Menu" button below 1340px (menu + medallion need ~1,300px incl. margins) ---------- */
.site-header { flex-wrap: nowrap; gap: 0 20px; padding: 14px clamp(20px,3vw,40px); background: rgba(247,245,239,.92); }
.brand { margin-right: clamp(16px,2.4vw,40px); font-size: 24px; }
.site-nav { flex-wrap: nowrap; gap: 0 clamp(12px,1.1vw,22px); }
.site-nav a { font-size: 14px; letter-spacing: .01em; }
.header-actions { gap: 10px; flex-shrink: 0; }
.header-actions .login { padding: 9px 16px; font-size: 13.5px; }
.header-actions .schedule { padding: 10px 20px; font-size: 13.5px; }
.nav-toggle { display: none; }
@media (max-width: 1100px) { /* undo the old wrap-to-second-row rule */
  .header-actions { flex-basis: auto; margin-top: 0; padding-top: 0; border-top: 0; justify-content: flex-end; }
}
@media (max-width: 1339px) {
  /* no hover drop-downs here: sub-items are listed under each heading inside the Menu panel */
  .subnav { display: none; }
  .js .site-nav .subnav { display: block; position: static; transform: none; opacity: 1; visibility: visible; pointer-events: auto; padding: 0; }
  .js .site-nav .subnav-inner { min-width: 0; padding: 4px 0 6px 16px; background: none; border: 0; box-shadow: none; }
  .js .site-nav .subnav-inner a { padding: 9px 0; font-size: 15px; border: 0; }
  .js .site-nav .nav-item { display: block; }
  .js .site-nav .nav-item > a { display: block; padding: 0; font-weight: 500; color: var(--navy); }
  .js .site-nav .has-sub > a::before, .js .site-nav .has-sub > a::after { display: none; }
  .js .site-nav .nav-item .subnav-inner a { display: block; padding: 8px 0; font-size: 15px; color: var(--soft-ink); border: 0; }
  .js .site-nav .nav-item .subnav-inner a:hover { background: none; color: var(--gold-text); }
  .js .site-header { flex-wrap: wrap; }
  .js .brand { order: 0; margin-right: auto; }
  .js .header-actions { order: 1; }
  .js .nav-toggle { order: 2; display: inline-flex; align-items: center; gap: 10px; margin-left: 4px;
    background: none; border: 1px solid var(--hairline); border-radius: 999px; padding: 9px 16px; cursor: pointer;
    font: 500 13.5px/1 'Inter', system-ui, sans-serif; letter-spacing: .04em; color: var(--navy); }
  .js .nav-toggle:hover { border-color: rgba(135,104,24,.5); }
  .nav-toggle-bars, .nav-toggle-bars::before { display: block; width: 16px; height: 1.5px; background: var(--navy); position: relative; transition: transform .3s var(--ease); }
  .nav-toggle-bars::before { content: ""; position: absolute; top: 5px; }
  .nav-toggle-bars { top: -2.5px; }
  .nav-open .nav-toggle-bars { transform: translateY(2.5px) rotate(45deg); }
  .nav-open .nav-toggle-bars::before { transform: translateY(-5px) rotate(-90deg); }
  .js .site-nav { order: 3; flex-basis: 100%; flex-direction: column; align-items: stretch; gap: 0; margin: 0;
    max-height: 0; overflow: hidden; opacity: 0; transition: max-height .45s var(--ease), opacity .3s ease, margin .3s ease; }
  .js .nav-open .site-nav { max-height: calc(100vh - 150px); max-height: calc(100dvh - 150px); overflow-y: auto; overscroll-behavior: contain; opacity: 1; margin: 14px 0 6px; }
  .js .site-nav a, .js .site-nav .nav-item { padding: 13px 2px; font-size: 16px; border-bottom: 1px solid var(--hairline-soft); }
  .js .site-nav .nav-item a { padding: 0; border: 0; }
  .js .site-nav a.active::after { display: none; }
  .js .site-nav a.active { color: var(--gold-text); }
}
@media (max-width: 640px) {
  .site-header { padding: 12px 16px; }
  .brand { font-size: 21px; }
  .js .header-actions { order: 4; flex-basis: 100%; display: none; padding: 16px 0 6px; gap: 10px; }
  .js .nav-open .header-actions { display: flex; }
  .js .nav-open .header-actions .login { display: inline-block; }
  .js .header-actions a { flex: 1; text-align: center; }
}

/* ---------- homepage hero: the emblem with its slow-turning ring ---------- */
.hero-home .veil { background: linear-gradient(180deg, rgba(14,22,38,.08), rgba(14,22,38,.16) 62%, rgba(20,29,50,.55)); }
.hero-home .inner { isolation: isolate; }
.hero-badge { position: absolute; z-index: -1; left: 50%; top: 50%; translate: -50% -50%; width: var(--badge); aspect-ratio: 1; border-radius: 50%; }
.hero-badge img { position: relative; display: block; width: 100%; height: 100%; filter: drop-shadow(0 0 70px rgba(226,190,104,.24)); }
/* the ring is a square laid behind this same box, so it can only ever share the badge's centre */
.hero-badge::before { content: ""; position: absolute; z-index: -1; inset: calc(var(--badge) * -.122); pointer-events: none;
  background: url("img/bg/ring-fine.svg") center/contain no-repeat; animation: lumTurn 140s linear infinite; }
/* dims the emblem behind the words only: the band of words is the same height on any screen, so it is set in px */
.hero-badge::after { content: ""; position: absolute; inset: 0; border-radius: 50%; pointer-events: none; background:
  linear-gradient(180deg, transparent calc(50% - 310px), rgba(10,16,28,.46) calc(50% - 230px), rgba(10,16,28,.46) calc(50% + 230px), transparent calc(50% + 310px)),
  radial-gradient(circle closest-side, rgba(10,16,28,.6), rgba(10,16,28,.52) 60%, rgba(10,16,28,.18) 86%, rgba(10,16,28,.1)); }
@media (max-width: 760px) { .hero-badge::after { background: rgba(10,16,28,.68); } }
@keyframes lumTurn { to { rotate: 360deg; } }
.hero-home .eyebrow { display: inline-block; padding: 8px 18px; border-radius: 999px; color: #e6c766; background: rgba(12,19,34,.82); backdrop-filter: blur(6px);
  border: 1px solid rgba(201,168,76,.28); font-size: 12px; }
.hero-home .eyebrow::before { width: 14px; height: 14px; }
.hero-home h1 { text-shadow: 0 2px 30px rgba(8,13,24,.55); }
.hero-home .tag { color: rgba(247,245,239,.94); text-shadow: 0 1px 16px rgba(8,13,24,.6); }
@media (prefers-reduced-motion: reduce) { .hero-badge::before { animation: none; } }
@media (max-width: 640px) {
  .hero-home .eyebrow { font-size: 10.5px; letter-spacing: .13em; padding: 8px 14px; white-space: nowrap; }
  .hero-home .eyebrow::before { display: none; }
}

/* ---------- cards: a gold edge that draws in on hover ---------- */
a.asp-card, .feature-card, .svc-card, .pstep { overflow: hidden; }
a.asp-card::after, .feature-card::after, a.svc-card::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent); transform: scaleX(0); transition: transform .6s var(--ease); }
a.asp-card:hover::after, .feature-card:hover::after, a.svc-card:hover::after { transform: scaleX(1); }
.pstep { overflow: visible; }

/* step numbers sit inside the ring */
.pnum { border: 0; background: var(--ring) center/contain no-repeat; width: 62px; height: 62px; }
@media (max-width: 560px) { .pnum { width: 50px; height: 50px; } }
.svc-hero-badge { border-color: transparent; background: var(--ring) center/contain no-repeat, radial-gradient(circle, rgba(201,168,76,.16), transparent 70%); }

/* ---------- footer newsletter box ---------- */
.footer-newsletter { margin-top: 26px; max-width: 320px; }
.footer-newsletter h4 { font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--gold); margin: 0 0 10px; font-weight: 400; }
.footer-newsletter p { margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: rgba(247,245,239,.72); }
.lw-signup { display: flex; gap: 8px; }
.lw-signup input { width: 100%; min-width: 0; font: 15px 'Inter', system-ui, sans-serif; border-radius: 999px; }
.footer-newsletter input { flex: 1; padding: 11px 16px; background: rgba(247,245,239,.08); color: var(--paper); border: 1px solid rgba(247,245,239,.28); }
.footer-newsletter input::placeholder { color: rgba(247,245,239,.5); }
.footer-newsletter button { flex-shrink: 0; padding: 11px 18px; border: 0; border-radius: 999px; background: var(--gold); color: var(--navy);
  font: 600 14px 'Inter', system-ui, sans-serif; cursor: pointer; }
.footer-newsletter button:hover { background: var(--gold-hover); }
.lw-signup-done { color: var(--gold) !important; }
.lw-frame { position: absolute; width: 1px; height: 1px; border: 0; opacity: 0; pointer-events: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }

/* ---------- newsletter pop-up ---------- */
.lw-pop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 16px; }
.lw-pop[hidden] { display: none; }
.lw-pop-backdrop { position: absolute; inset: 0; background: rgba(12,19,34,.6); backdrop-filter: blur(4px); opacity: 0; transition: opacity .3s ease; }
.lw-pop-card { position: relative; width: 100%; max-width: 760px; max-height: calc(100vh - 32px); overflow: auto;
  background: var(--navy); color: var(--paper); border: 1px solid rgba(201,168,76,.3); border-radius: 22px;
  padding: clamp(30px,5vw,56px); box-shadow: 0 40px 90px rgba(5,9,18,.5);
  opacity: 0; transform: translateY(18px) scale(.98); transition: opacity .35s var(--ease), transform .45s var(--ease); isolation: isolate; }
.lw-pop-card::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit;
  background: url("img/bg/ring-field.svg") center/cover no-repeat; opacity: .5; }
.lw-pop.is-open .lw-pop-backdrop { opacity: 1; }
.lw-pop.is-open .lw-pop-card { opacity: 1; transform: none; }
.lw-pop-ring { width: 58px; height: 58px; filter: drop-shadow(0 0 10px rgba(201,168,76,.45)); background: var(--ring) center/contain no-repeat; margin-bottom: 18px; animation: lumTurn 60s linear infinite; }
.lw-pop-x { position: absolute; top: 14px; right: 16px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(247,245,239,.22);
  background: rgba(247,245,239,.04); color: var(--paper); font-size: 24px; line-height: 1; cursor: pointer; }
.lw-pop-x:hover { border-color: var(--gold); color: var(--gold); }
.lw-pop h2 { font-weight: 400; font-size: clamp(28px,3.6vw,40px); line-height: 1.18; color: #f3ead2; margin: 0 0 12px; max-width: 20ch; }
.lw-pop-text { margin: 0 0 28px; font-size: 17px; line-height: 1.6; color: rgba(247,245,239,.82); max-width: 52ch; }
.lw-pop .lw-signup { flex-direction: column; align-items: flex-start; gap: 22px; }
.lw-pop-fields { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; width: 100%; }
.lw-pop-fields label { display: flex; flex-direction: column; gap: 8px; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); }
.lw-pop-fields input { padding: 14px 18px; border: 1px solid rgba(247,245,239,.3); background: rgba(247,245,239,.96); color: var(--ink); text-transform: none; letter-spacing: 0; }
.lw-pop-fields input:focus { outline: 2px solid var(--gold); outline-offset: 2px; }
.lw-pop .lw-signup-done { font-size: 18px; margin: 0; }
@media (max-width: 640px) { .lw-pop-fields { grid-template-columns: 1fr; } .lw-pop .btn { width: 100%; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .lw-pop-card, .lw-pop-backdrop { transition: none; } .lw-pop-ring { animation: none; } }

/* homepage services band: roomier cards */
.svc-mini-grid.on-navy { gap: 18px; }
.svc-mini-grid.on-navy a.svc-mini { padding: 20px 22px; }
.svc-mini-grid.on-navy a.svc-mini h3 { font-size: 17px; }
.svc-mini-grid.on-navy a.svc-mini p { font-size: 14.5px; line-height: 1.62; }

/* closing invitation echoes the hero: the same ring, turning the other way */
.lw-bookend::after { content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: min(620px, 110vw); aspect-ratio: 1;
  translate: -50% -50%; background: var(--ring) center/contain no-repeat; opacity: .16; animation: lumTurn 180s linear infinite reverse; }
@media (prefers-reduced-motion: reduce) { .lw-bookend::after { animation: none; } }

/* service/aspect heroes already show the ring as a badge — no second ring on the eyebrow */
.svc-hero .eyebrow::before { display: none; }

/* reading progress: a gold hairline under the header that fills as you scroll (site.js sets --lw-progress) */
.site-header::after { content: ""; position: absolute; left: 0; bottom: -1px; height: 1.5px; width: 100%;
  background: linear-gradient(90deg, var(--gold-text), var(--gold)); transform-origin: 0 50%;
  transform: scaleX(var(--lw-progress, 0)); pointer-events: none; }

/* long button labels may wrap on phones instead of pushing the page sideways */
@media (max-width: 640px) { .btn { white-space: normal; text-align: center; max-width: 100%; } }

/* homepage "How we empower your financial future": an editorial index, not four boxes (2026-10-27).
   Rows on gold hairlines; big serif numerals; the ring fades in around the numeral on hover. */
.svc-index { margin-top: 10px; border-top: 1px solid rgba(201,168,76,.24); }
.svc-index a.svc-mini { position: relative; display: grid; grid-template-columns: 76px 1fr 32px; column-gap: 6px; row-gap: 8px;
  padding: 26px 0; background: none; border: 0; border-bottom: 1px solid rgba(201,168,76,.24); border-radius: 0;
  box-shadow: none; transform: none; transition: background .4s var(--ease); }
.svc-index a.svc-mini .asp-top { display: contents; }
.svc-index .asp-num { grid-column: 1; grid-row: 1 / span 2; align-self: start; position: relative; isolation: isolate;
  width: 54px; text-align: center; font-family: 'Newsreader', Georgia, serif; font-size: 34px; line-height: 1;
  color: var(--gold); letter-spacing: 0; padding-top: 2px; font-feature-settings: "lnum" 1; }
.svc-index .asp-num::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 50%; width: 66px; height: 66px;
  translate: -50% -50%; background: var(--ring) center/contain no-repeat; opacity: 0; scale: .7;
  transition: opacity .5s var(--ease), scale .7s var(--ease), rotate 1.4s var(--ease); }
.svc-index a.svc-mini h3 { grid-column: 2; grid-row: 1; margin: 0; font-family: 'Newsreader', Georgia, serif; font-weight: 400;
  font-size: clamp(22px,2vw,26px); line-height: 1.2; color: #f6efdc; transition: color .3s ease; }
.svc-index a.svc-mini p { grid-column: 2; grid-row: 2; margin: 0; max-width: 52ch; font-size: 15.5px; line-height: 1.65; color: rgba(247,245,239,.74); }
.svc-index a.svc-mini::after { content: "\2192"; grid-column: 3; grid-row: 1 / span 2; align-self: center; justify-self: end;
  font-size: 20px; color: var(--gold); opacity: .55; transition: transform .4s var(--ease), opacity .4s ease; }
.svc-index a.svc-mini::before { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, var(--gold), rgba(201,168,76,.15)); transform: scaleX(0); transform-origin: 0 50%;
  transition: transform .7s var(--ease); }
.svc-index a.svc-mini:hover { background: linear-gradient(90deg, rgba(201,168,76,.06), transparent 70%); }
.svc-index a.svc-mini:hover::before { transform: scaleX(1); }
.svc-index a.svc-mini:hover::after { transform: translateX(6px); opacity: 1; }
.svc-index a.svc-mini:hover h3 { color: var(--gold); }
.svc-index a.svc-mini:hover .asp-num::before { opacity: .95; scale: 1; rotate: 45deg; }
.svc-index a.svc-mini:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
@media (max-width: 640px) {
  .svc-index a.svc-mini { grid-template-columns: 52px 1fr 20px; padding: 22px 0; }
  .svc-index .asp-num { width: 40px; font-size: 27px; }
  .svc-index .asp-num::before { width: 50px; height: 50px; }
  .svc-index a.svc-mini p { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) { .svc-index a.svc-mini::before, .svc-index .asp-num::before, .svc-index a.svc-mini::after { transition: none; } }

/* ---------- echoes of the original site's layout (Jeff/Jai 2026-10-27: refresh, but familiar) ---------- */
/* "What we do": one open panel, two halves, the big "+" between — as on the original site */
.pillars-open { max-width: 1000px; gap: 0; margin-top: clamp(40px,5vw,64px); border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.pillars-open a.asp-card { background: none; border: 0; border-radius: 0; box-shadow: none; padding: clamp(30px,4vw,48px) clamp(20px,4vw,56px); }
.pillars-open a.asp-card:hover { transform: none; box-shadow: none; background: linear-gradient(180deg, rgba(201,168,76,.06), transparent 75%); }
.pillars-open a.asp-card::after { top: auto; bottom: -1px; }
.pillars-open .asp-top { flex-direction: column; align-items: flex-start; gap: 8px; }
.pillars-open .asp-num { font-size: 13px; letter-spacing: .24em; }
.pillars-open .asp-card h3 { font-family: 'Newsreader', Georgia, serif; font-weight: 400; font-size: clamp(26px,2.8vw,32px); }
.pillars-open .pillars-plus { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%;
  background: var(--paper) var(--ring) center/contain no-repeat; color: var(--gold-text); font-size: 34px; }
@media (min-width: 641px) { .pillars-open a.asp-card + .pillars-plus + a.asp-card { border-left: 1px solid var(--hairline); } }
@media (max-width: 640px) { .pillars-open a.asp-card + .pillars-plus + a.asp-card { border-top: 1px solid var(--hairline); } }

/* the three steps sit side by side on desktop, as on the original site */
@media (min-width: 900px) {
  .process-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; max-width: 1120px; }
  .process-row .pstep { grid-template-columns: 1fr; gap: 18px; align-content: start; }
  .process-row .pstep h3 { margin-top: 0; }
  .process-row .pstep:not(:last-child)::after { left: 100%; top: 50%; transform: translate(9px, -50%) rotate(-45deg); }
}
@media (max-width: 640px) { .pillars-open .pillars-plus { display: none; } }

/* grouped menu (inject_header.py): a small caret on items that open a drop-down */
.site-nav .has-sub > a { padding-right: 14px; }
.site-nav .has-sub > a::before { content: ""; position: absolute; right: 1px; top: 7px; width: 5px; height: 5px;
  border-right: 1.3px solid currentColor; border-bottom: 1.3px solid currentColor; transform: rotate(45deg); opacity: .55; transition: transform .25s var(--ease); }
.site-nav .has-sub:hover > a::before, .site-nav .has-sub:focus-within > a::before { transform: translateY(2px) rotate(45deg); opacity: .9; }
.subnav { left: 0; transform: none; }
.site-nav > .has-sub:last-child .subnav { left: auto; right: 0; }

/* footer links: at least 24px tall to tap comfortably (review 2026-10-27) */
.footer-col .links { gap: 4px; }
.footer-col .links a, .site-footer .social-links a, .footer-legal-row a:not(.brokercheck), .footer-contact .lines a { display: inline-block; padding: 4px 0; min-height: 26px; }

/* the firm's medallion beside the wordmark, as on the original site (logo from the live FMG site, 2026-10-27) */
.site-header .brand { display: inline-flex; align-items: center; }
.site-header .brand::before { content: ""; width: 44px; height: 44px; flex-shrink: 0; margin-right: 12px; border-radius: 50%;
  background: url("img/emblem-176.webp") center/contain no-repeat; filter: drop-shadow(0 2px 6px rgba(26,39,64,.25));
  transition: rotate 1.2s var(--ease); }
.site-header .brand:hover::before { rotate: 45deg; }
@media (max-width: 640px) { .site-header .brand::before { width: 36px; height: 36px; margin-right: 9px; } }

/* the sign-up form is display:flex, which beat the browser's own [hidden] rule — so after sending, the form
   (button stuck on "Sending…") stayed on screen over the thank-you line. Make hidden really hide. (2026-10-27) */
.lw-signup[hidden], .lw-signup-done[hidden] { display: none !important; }

/* ---------- interactive Eight Aspects wheel (homepage): clickable shapes laid over the wheel artwork ---------- */
.wheel-fig { position: relative; }
.wheel-map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.wheel-seg path { fill: rgba(255,255,255,0); stroke: transparent; stroke-width: 7; transition: fill .35s var(--ease), stroke .35s var(--ease); cursor: pointer; }
.wheel-seg:hover path, .wheel-seg:focus-visible path { fill: rgba(255,250,235,.16); stroke: var(--gold); filter: drop-shadow(0 0 14px rgba(201,168,76,.55)); }
.wheel-seg:focus { outline: none; }
.wheel-caption { min-height: 3.4em; max-width: 46ch; margin: clamp(18px,2.5vw,28px) auto 0; text-align: center; font-size: 17px; line-height: 1.6; color: var(--soft-ink); transition: opacity .25s ease; }
.wheel-caption strong { display: block; font-family: 'Newsreader', Georgia, serif; font-weight: 400; font-size: 24px; color: var(--ink); margin-bottom: 2px; }
@media (hover: none) { .wheel-caption { min-height: 0; } }

/* Journal tools on the homepage: the same editorial rows as the services band, in light colours */
.tool-index { margin-top: 26px; border-top-color: var(--hairline); }
.tool-index a.svc-mini { padding: 20px 0; border-bottom-color: var(--hairline); grid-template-columns: 58px 1fr 28px; }
.tool-index .asp-num { font-size: 27px; width: 44px; color: var(--gold-text); }
.tool-index a.svc-mini h3 { font-size: clamp(20px,1.8vw,23px); color: var(--ink); }
.tool-index a.svc-mini p { color: var(--soft-ink); font-size: 15.5px; }
.tool-index a.svc-mini::after { color: var(--gold-text); }
.tool-index a.svc-mini:hover h3 { color: var(--gold-text); }
.tool-index a.svc-mini:hover { background: linear-gradient(90deg, rgba(201,168,76,.08), transparent 70%); }
/* book and journal as 3D objects, turned gently toward the text beside them:
   the cover is the image, ::before the spine, ::after the back cover and shadow */
.book3d { --t: 34px; --w: 310px; display: flex; justify-content: center; perspective: 2800px; padding: 14px 0 14px 18px; }
.book3d-thin { --t: 18px; }
.book3d-small { --t: 20px; --w: 100%; padding-left: 10px; }
.book3d-small.book3d-thin { --t: 12px; }
.book3d-body { position: relative; width: 100%; max-width: var(--w); transform-style: preserve-3d;
  transform: rotateY(19deg); transition: transform .7s var(--ease); }
.book3d-body:hover { transform: rotateY(11deg); }
.book3d-body img { display: block; width: 100%; height: auto; max-width: none; border-radius: 1px 3px 3px 1px;
  transform: translateZ(calc(var(--t) / 2)); }
.book3d-body::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: var(--t);
  background: linear-gradient(to right, #a79e8e, #e6dfd2 42%, #c4bbab); transform: translateX(calc(var(--t) / -2)) rotateY(-90deg); }
.book3d-body::after { content: ""; position: absolute; inset: 0; background: #2a3442; border-radius: 1px 3px 3px 1px;
  transform: translateZ(calc(var(--t) / -2)); box-shadow: 24px 26px 46px rgba(16,22,36,.3), 5px 7px 14px rgba(16,22,36,.2); }
.book3d-sheen { position: absolute; inset: 0; pointer-events: none; transform: translateZ(calc(var(--t) / 2 + .5px));
  background: linear-gradient(to right, rgba(0,0,0,.2) 0, rgba(255,255,255,.16) 1.6%, rgba(0,0,0,.14) 3.4%, transparent 7%, rgba(255,255,255,.07) 60%, transparent 100%); }
@media (max-width: 768px) { .book3d:not(.book3d-small) { --w: 240px; } }

/* ============================================================
   GRADIENTS + DEPTH (2026-10-27, Jeff picked "Gradients + depth")
   ============================================================ */
/* dark bands: a soft gold light from above; on desktop it follows the pointer (site.js sets --mx / --my) */
.navy, .svc-highlight, .svc-hero, .site-footer {
  background-image: radial-gradient(640px circle at var(--mx, 50%) var(--my, -12%), rgba(201,168,76,.13), transparent 62%); }
.site-footer { background-image: radial-gradient(900px circle at var(--mx, 15%) var(--my, -30%), rgba(201,168,76,.08), transparent 60%); }

/* cream sections: faint warm light, so they read as lit rather than flat */
.section:not(.navy), .svc-section, .section-hero, .section-lg {
  background-image:
    radial-gradient(ellipse 60% 55% at 12% 0%, rgba(201,168,76,.075), transparent 60%),
    radial-gradient(ellipse 55% 50% at 92% 100%, rgba(26,39,64,.035), transparent 60%); }

/* "Wealth" in the hero title: a slow gold shimmer */
.hero-home h1 span {
  background: linear-gradient(100deg, #c9a84c 0%, #c9a84c 38%, #f6e6b0 50%, #c9a84c 62%, #c9a84c 100%);
  background-size: 260% 100%; background-position: 100% 0;
  -webkit-background-clip: text; background-clip: text; color: transparent;
  animation: lumShimmer 9s ease-in-out 1.5s infinite; }
@keyframes lumShimmer { 0%, 55% { background-position: 100% 0; } 85%, 100% { background-position: 0% 0; } }

/* hero artwork drifts slightly as you scroll (site.js sets --lw-parallax) */
.hero-home .bg { transform: translate3d(0, var(--lw-parallax, 0px), 0) scale(1.08); will-change: transform; }

/* closing invitation rises over the section above with rounded corners — mirrors the card at the top of the page */
.lw-bookend { border-radius: 28px 28px 0 0; margin-top: -28px; z-index: 1; box-shadow: 0 -24px 50px rgba(15,22,38,.14); }
@media (max-width: 640px) { .lw-bookend { border-radius: 18px 18px 0 0; margin-top: -18px; } }

@media (prefers-reduced-motion: reduce) {
  .hero-home h1 span { animation: none; background-position: 50% 0; }
  .hero-home .bg { transform: scale(1.08); }
}

/* ---------- banner photos, as on the original site (inject_photos.py picks the photo for each page) ---------- */
.photo-hero { position: relative; isolation: isolate; overflow: hidden; background-color: #1c1711; color: var(--paper);
  --dim: .74; --dim-mid: .66;
  --veil: radial-gradient(ellipse 74% 96% at 50% 50%, rgba(22,18,14,var(--dim)) 0%, rgba(22,18,14,var(--dim-mid)) 58%, rgba(22,18,14,.3) 100%); }
/* photos that are already dark need less tint, or the warmth is lost */
.ph-jupiter-wetlands, .ph-family-sunset, .ph-meditation { --dim: .52; --dim-mid: .44; }
.ph-florida-palm, .ph-journal { --dim: .7; --dim-mid: .58; }
.photo-hero.section-lg { --veil: linear-gradient(rgba(22,18,14,.62), rgba(22,18,14,.62)); }
@media (max-width: 760px) { .photo-hero { --veil: linear-gradient(rgba(22,18,14,var(--dim)), rgba(22,18,14,var(--dim))); } }
.photo-hero.photo-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 1; pointer-events: none;
  background-size: cover; background-position: center; background-repeat: no-repeat; }
.photo-strip { height: clamp(150px,20vw,260px); --veil: linear-gradient(180deg, rgba(22,18,14,.06), rgba(22,18,14,.28)); }
.photo-hero .h1, .photo-hero h1 { color: #f8f1df; text-shadow: 0 2px 18px rgba(8,13,24,.6); }
.photo-hero .lede, .photo-hero .subtitle { color: rgba(250,247,240,.94); text-shadow: 0 1px 12px rgba(8,13,24,.65); }
.photo-hero .gold { color: #e6c766; }
.photo-hero .eyebrow { display: inline-block; padding: 8px 18px; border-radius: 20px; color: #e6c766; background: rgba(14,12,10,.55); backdrop-filter: blur(6px); }
.photo-hero .back { opacity: 1; padding: 6px 14px; border-radius: 20px; color: #e6c766; background: rgba(14,12,10,.55); backdrop-filter: blur(6px); }
.photo-hero.ph-beach-sunrise::before { background-image: var(--veil), url("img/bg/beach-sunrise.webp"); }
.photo-hero.ph-boardwalk::before { background-image: var(--veil), url("img/bg/boardwalk.webp"); }
.photo-hero.ph-couple-sunset::before { background-image: var(--veil), url("img/bg/couple-sunset.webp"); }
.photo-hero.ph-family-sunset::before { background-image: var(--veil), url("img/bg/family-sunset.webp"); }
.photo-hero.ph-florida-palm::before { background-image: var(--veil), url("img/bg/florida-palm.webp"); }
.photo-hero.ph-friends-joy::before { background-image: var(--veil), url("img/bg/friends-joy.webp"); }
.photo-hero.ph-friends-sunset::before { background-image: var(--veil), url("img/bg/friends-sunset.webp"); }
.photo-hero.ph-golden-trees::before { background-image: var(--veil), url("img/bg/golden-trees.webp"); }
.photo-hero.ph-harbor::before { background-image: var(--veil), url("img/bg/harbor.webp"); }
.photo-hero.ph-harvest::before { background-image: var(--veil), url("img/bg/harvest.webp"); }
.photo-hero.ph-jensen-dawn::before { background-image: var(--veil), url("img/bg/jensen-dawn.webp"); }
.photo-hero.ph-jensen-sunrise::before { background-image: var(--veil), url("img/bg/jensen-sunrise.webp"); }
.photo-hero.ph-journal::before { background-image: var(--veil), url("img/bg/journal.webp"); }
.photo-hero.ph-jupiter-lighthouse::before { background-image: var(--veil), url("img/bg/jupiter-lighthouse.webp"); }
.photo-hero.ph-jupiter-wetlands::before { background-image: var(--veil), url("img/bg/jupiter-wetlands.webp"); }
.photo-hero.ph-library::before { background-image: var(--veil), url("img/bg/library.webp"); }
.photo-hero.ph-living-room::before { background-image: var(--veil), url("img/bg/living-room.webp"); }
.photo-hero.ph-meditation::before { background-image: var(--veil), url("img/bg/meditation.webp"); }
.photo-hero.ph-sailboat::before { background-image: var(--veil), url("img/bg/sailboat.webp"); }
.photo-hero.ph-seedling::before { background-image: var(--veil), url("img/bg/seedling.webp"); }
.photo-hero.ph-sunbeams::before { background-image: var(--veil), url("img/bg/sunbeams.webp"); }
.photo-hero.ph-sunrise-figure::before { background-image: var(--veil), url("img/bg/sunrise-figure.webp"); }
.photo-hero.ph-vegetables-table::before { background-image: var(--veil), url("img/bg/vegetables-table.webp"); }
.photo-hero.ph-walking-beach::before { background-image: var(--veil), url("img/bg/walking-beach.webp"); }
.photo-hero.ph-writing-desk::before { background-image: var(--veil), url("img/bg/writing-desk.webp"); }

/* ---------- artwork on the other bands: palm light on cream, ring pattern on navy (both from gen_art.py) ---------- */
section.paper-alt:not(.navy), .svc-section.alt {
  background-color: var(--paper-alt);
  background-image: url("img/bg/palm-light.webp"), radial-gradient(ellipse 60% 55% at 12% 0%, rgba(201,168,76,.1), transparent 60%);
  background-repeat: no-repeat; background-position: right top, 0 0; background-size: max(1100px,100%) auto, auto; }
.svc-highlight::before { background: url("img/bg/ring-field.svg") center/cover no-repeat; opacity: .6; }

/* ---------- wheel on a deep dark band ---------- */
.section.wheel-dark { position: relative; isolation: isolate; overflow: hidden; background-color: #0e1626; }
.section.wheel-dark::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(circle at 50% 56%, rgba(201,168,76,.17), transparent 52%), url("img/bg/ring-field.svg") center/cover no-repeat; }
.wheel-dark .statement { color: #f6efdc; }
.navy .btn-ghost { border-color: rgba(230,199,102,.75); color: #f3e7c4; }
.navy .btn-ghost:hover { background: var(--gold); border-color: var(--gold); color: var(--navy); }
.navy .lede, .wheel-dark .wheel-caption { color: rgba(247,245,239,.86); }
.wheel-dark .wheel-caption strong { color: var(--gold); }
.wheel-dark .wheel-fig img { filter: drop-shadow(0 0 54px rgba(201,168,76,.28)); }

/* ---------- clear separation between bands: dark bands cast a shadow, cream bands read as set in ---------- */
section.navy:not(.lw-bookend), .svc-highlight, .svc-hero, .photo-hero, .hero-home { position: relative; z-index: 1;
  border-top: 1px solid rgba(201,168,76,.4); border-bottom: 1px solid rgba(201,168,76,.4);
  box-shadow: 0 16px 32px -8px rgba(15,22,38,.46), 0 -16px 32px -8px rgba(15,22,38,.46); }
.hero-home { border-top: 0; }
.photo-strip { border-top: 0; box-shadow: 0 12px 26px -8px rgba(15,22,38,.4); }
section.paper-alt:not(.navy), .svc-section.alt {
  box-shadow: inset 0 1px 0 rgba(135,104,24,.3), inset 0 -1px 0 rgba(135,104,24,.3),
    inset 0 18px 24px -20px rgba(26,39,64,.3), inset 0 -18px 24px -20px rgba(26,39,64,.3); }
.site-footer { position: relative; box-shadow: 0 -16px 32px -8px rgba(15,22,38,.4); }
.site-header { box-shadow: 0 6px 22px rgba(15,22,38,.16); }
.feature-card:not(:hover), a.asp-card:not(:hover), a.svc-card:not(:hover), .svc-card:not(:hover) {
  border-color: rgba(135,104,24,.3); box-shadow: 0 2px 4px rgba(26,39,64,.08), 0 14px 30px rgba(26,39,64,.14); }
.feature-card, a.asp-card, a.svc-card, .svc-card { background-color: #fffdf8; }

/* ---------- fee schedule (our-unique-way) ---------- */
.fee-card { max-width: 1000px; margin: clamp(36px,4.5vw,56px) auto 0; overflow: hidden; border-radius: 14px; background: var(--paper); color: var(--ink);
  border: 1px solid rgba(201,168,76,.5); box-shadow: 0 2px 6px rgba(8,13,24,.3), 0 24px 56px rgba(8,13,24,.45); }
.fee-table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 1.4; font-variant-numeric: tabular-nums; }
.sr-fee { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.fee-table th, .fee-table td { padding: 17px 20px; text-align: left; vertical-align: top; }
.fee-table thead th { background: var(--paper-alt); border-bottom: 1px solid rgba(135,104,24,.4); font-size: 11.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-text); }
.fee-table tbody th { font-family: 'Newsreader',Georgia,serif; font-weight: 500; font-size: 19px; color: var(--ink); white-space: nowrap; }
.fee-table tbody tr + tr { border-top: 1px solid var(--hairline); }
.fee-table .fv small { display: block; margin-top: 3px; font-size: 12.5px; color: var(--soft-ink); }
.fee-notes { max-width: 1000px; margin: 24px auto 0; font-size: 15.5px; line-height: 1.7; color: rgba(247,245,239,.84); }
.fee-notes p { margin: 0 0 8px; }
@media (max-width: 760px) {
  .fee-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .fee-table, .fee-table tbody, .fee-table tr, .fee-table tbody th, .fee-table td { display: block; }
  .fee-table tbody tr { padding: 18px 20px; }
  .fee-table tbody th { padding: 0 0 8px; white-space: normal; }
  .fee-table td { display: flex; justify-content: space-between; gap: 18px; padding: 8px 0; text-align: right; border-top: 1px solid var(--hairline); }
  .fee-table td::before { content: attr(data-label); flex: 0 1 46%; text-align: left; font-size: 14px; line-height: 1.35; color: var(--soft-ink); }
}

/* ---------- footer layout: brand and newsletter on top, four even columns beneath, so no one column runs on alone ---------- */
.site-footer { padding-top: clamp(46px,5vw,64px); padding-bottom: 30px; }
.site-footer .container-wide { max-width: 1280px; }
.footer-grid { grid-template-columns: repeat(4, 1fr); gap: 0 clamp(28px,4vw,56px); align-items: start; }
.footer-grid > div:first-child { display: contents; }
.footer-brand { grid-area: 1 / 1 / 2 / 3; }
.footer-grid > div:first-child > p { grid-area: 2 / 1 / 3 / 3; }
.site-footer .social-links { grid-area: 3 / 1 / 4 / 3; }
.footer-newsletter { grid-area: 1 / 3 / 4 / 5; margin-top: 0; max-width: none; }
.footer-grid::after { content: ""; grid-area: 4 / 1 / 5 / -1; height: 1px; margin: 30px 0 28px; background: var(--hairline-navy); }
.footer-contact { grid-area: 5 / 1 / 6 / 2; margin-top: 0; }
.footer-col { grid-row: 5; }
.footer-col h4, .footer-contact h4 { margin-bottom: 12px; }
.footer-contact .lines { gap: 2px; }
.footer-legal-row { margin-top: 28px; padding-top: 20px; }
.footer-fine { margin-top: 14px; }
@media (max-width: 900px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-area: 1 / 1 / 2 / -1; }
  .footer-grid > div:first-child > p { grid-area: 2 / 1 / 3 / -1; }
  .site-footer .social-links { grid-area: 3 / 1 / 4 / -1; }
  .footer-newsletter { grid-area: 4 / 1 / 5 / -1; margin-top: 24px; max-width: 460px; }
  .footer-grid::after { grid-area: 5 / 1 / 6 / -1; margin: 26px 0 24px; }
  .footer-contact { grid-area: 6 / 1 / 7 / 2; }
  .footer-col { grid-row: auto; margin-bottom: 22px; }
  .footer-contact { margin-bottom: 22px; }
}
@media (max-width: 560px) {
  .footer-contact { grid-area: 6 / 1 / 7 / -1; }
  #client-access { grid-column: 1 / -1; }
}