/* ==========================================================================
   Lifeline Advisory Co - shared page styles (About / Services / Contact)
   The CORE below is copied verbatim out of index.html's inline <style> so the
   sub-pages are pixel-identical to the homepage. index.html is deliberately
   NOT refactored to use this file: it is a heavily verified 89KB one-off and
   re-plumbing its CSS would risk a regression for no gain.
   NOTE: this file lives at the ROOT, not /assets - vercel.json serves
   /assets/* as `immutable` for a year, which would strand any edit here.
   ========================================================================== */

/* ---------- core: tokens, base, typography, buttons ---------- */
  :root{
    --ivory:#FBF9F4;--white:#FFFFFF;--sand:#F2EDE1;--sand-2:#E9E2D2;
    --black:#0F0E0C;--char:#1C1A16;--char-2:#26231E;
    --gold:#C9A85C;--gold-2:#A8873B;--gold-lt:#E8D6A8;
    --grad-gold:linear-gradient(118deg,#EBDCAF 0%,#C9A85C 50%,#9E7E32 100%);
    --ink:#141310;--stone:#6E675C;--stone-2:#928A7C;
    --line:rgba(15,14,12,.10);--line-2:rgba(15,14,12,.18);--line-d:rgba(232,214,168,.16);
    --on-d:#F3EEE3;--on-d-mut:rgba(243,238,227,.66);
    --red:#D9705C;--amber:#D9A441;--green:#5DBE8A;
    --shadow:0 30px 70px -34px rgba(15,14,12,.25);--shadow-d:0 40px 90px -40px rgba(0,0,0,.7);
    --sans:"Manrope","Segoe UI",-apple-system,Arial,sans-serif;
    --serif:"Playfair Display",Georgia,"Times New Roman",serif;
    --mono:"SFMono-Regular",Consolas,Menlo,monospace;
    --maxw:1220px;
    /* Accessible derivatives for SMALL text (<=13px), where 4.5:1 matters most.
       The brand tokens fail there: --gold-2 #A8873B is only 3.39:1 on white and
       --stone-2 #928A7C only 3.42:1. These keep the same hue, just deeper:
       --gold-txt #846824 = 5.27:1 white / 5.01 ivory / 4.51 sand.
       index.html still uses the originals - unifying that is a brand call. */
    --gold-txt:#846824;
    --tick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6L9 17l-5-5' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
  body{background:var(--ivory);color:var(--ink);font-family:var(--sans);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  ::selection{background:rgba(201,168,92,.3)}
  a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
  .eyebrow{font-size:11.5px;font-weight:800;letter-spacing:.32em;text-transform:uppercase;color:var(--gold-2);display:inline-flex;align-items:center;gap:12px}
  .eyebrow::before{content:"";width:26px;height:1px;background:var(--gold-2)}
  .eyebrow.on-d{color:var(--gold-lt)}.eyebrow.on-d::before{background:var(--gold-lt)}
  .display{font-family:var(--serif);font-weight:500;line-height:1.02;letter-spacing:-.015em;font-size:clamp(42px,7.4vw,96px)}
  .h2{font-family:var(--serif);font-weight:500;line-height:1.06;letter-spacing:-.01em;font-size:clamp(32px,4.8vw,58px)}
  .lede{font-size:clamp(16px,1.3vw,18.5px);line-height:1.7;max-width:56ch;color:var(--stone)}
  .gold-i{font-style:italic;color:transparent;background:var(--grad-gold);-webkit-background-clip:text;background-clip:text}
  .btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:800;font-size:13.5px;letter-spacing:.02em;padding:15px 26px;border-radius:3px;cursor:pointer;border:0;white-space:nowrap;transition:transform .25s,box-shadow .3s,background .3s,color .3s,border-color .3s}
  .btn-gold{background:var(--grad-gold);color:#241b06;box-shadow:0 14px 34px -14px rgba(201,168,92,.65)}
  .btn-gold:hover{transform:translateY(-2px);box-shadow:0 22px 44px -14px rgba(201,168,92,.75)}
  .btn-line{background:transparent;color:var(--ink);border:1.5px solid var(--line-2)}
  .btn-line:hover{border-color:var(--ink);background:rgba(15,14,12,.03)}
  .btn-line-d{background:transparent;color:var(--gold-lt);border:1px solid rgba(232,214,168,.4)}
  .btn-line-d:hover{border-color:var(--gold-lt);background:rgba(232,214,168,.07)}
  .btn-black{background:var(--black);color:var(--gold-lt)}
  .btn-black:hover{transform:translateY(-2px);background:var(--char-2)}
  .btn .ar{transition:transform .3s}.btn:hover .ar{transform:translateX(4px)}

/* ---------- core: nav ---------- */
  /* NAV */
  header.nav{position:fixed;top:0;left:0;right:0;z-index:80;background:rgba(251,249,244,.86);backdrop-filter:blur(14px);border-bottom:1px solid transparent;transition:border-color .3s,box-shadow .3s}
  header.nav.solid{border-bottom-color:var(--line);box-shadow:0 10px 30px -22px rgba(15,14,12,.35)}
  .nav-in{display:flex;align-items:center;justify-content:space-between;height:80px}
  .brand{display:flex;align-items:center;gap:12px}
  .brand img{height:54px;width:auto}
  .menu{display:flex;align-items:center;gap:30px}
  .menu a.lnk{font-size:13.5px;color:var(--ink);font-weight:600;position:relative;transition:color .25s}
  .menu a.lnk::after{content:"";position:absolute;left:0;bottom:-6px;height:1.5px;width:0;background:var(--gold);transition:width .3s}
  .menu a.lnk:hover{color:var(--gold-2)}.menu a.lnk:hover::after{width:100%}
  .hamb{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
  .hamb span{width:24px;height:2px;background:var(--ink);border-radius:2px}

/* ---------- core: sections ---------- */
  section.blk{padding:104px 0;position:relative}
  section.light{background:var(--ivory)}section.white{background:var(--white)}section.dark{background:var(--char);color:var(--on-d)}
  .sec-head{max-width:720px;margin-bottom:52px}.sec-head.center{margin-inline:auto;text-align:center}.sec-head.center .eyebrow{justify-content:center}
  .sec-head h2{margin-top:16px;color:var(--ink)}section.dark .sec-head h2{color:var(--on-d)}
  .sec-head p{margin-top:14px;color:var(--stone)}section.dark .sec-head p{color:var(--on-d-mut)}

/* ---------- core: footer ---------- */
  footer{background:var(--black);color:var(--on-d-mut);padding:60px 0 30px}
  .foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:36px;margin-bottom:40px}
  .foot-brand img{height:64px;width:auto;filter:brightness(1.15);margin-bottom:14px}
  .foot-brand p{font-size:14px;max-width:38ch}
  .fcol h5{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:14px;font-weight:800}
  .fcol a{display:block;color:var(--on-d-mut);font-size:14px;padding:5px 0;transition:color .2s}.fcol a:hover{color:var(--gold-lt)}
  .foot-bot{border-top:1px solid var(--line-d);padding-top:22px;font-size:12.5px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
  .disc{font-size:11.5px;color:rgba(243,238,227,.4);max-width:90ch;margin-top:14px;line-height:1.6}

/* ---------- core: reveals ---------- */
  /* Hidden-initial is gated on .rv-armed, which pages.js adds only when it
     actually runs and motion is allowed. index.html can hide .rv from CSS
     because its script is inline and same-document; here the stylesheet and
     the script are separate files, so CSS alone must never hide copy. */
  .rv.rv-armed{opacity:0;transform:translateY(26px);transition:opacity .85s cubic-bezier(.2,.8,.2,1),transform .85s cubic-bezier(.2,.8,.2,1)}
  .rv.in{opacity:1;transform:none}.rv.d1{transition-delay:.09s}.rv.d2{transition-delay:.18s}.rv.d3{transition-delay:.27s}

/* ---------- core: responsive + drawer ---------- */
  /* (some selectors below are homepage-only - kept so the shared
   breakpoints stay byte-identical to index.html) */
  @media(max-width:960px){.vitals-in{grid-template-columns:1fr;gap:26px}.vitals{height:320vh}.svc{grid-template-columns:1fr}.partners,.stories,.contact{grid-template-columns:1fr;gap:34px}.how{grid-template-columns:1fr 1fr}.how::before{display:none}.foot-grid{grid-template-columns:1fr 1fr}.hero .wm{display:none}}
  @media(max-width:600px){.menu{display:none}.hamb{display:flex}header.nav .btn{display:none}section.blk{padding:74px 0}.how{grid-template-columns:1fr}.foot-grid{grid-template-columns:1fr}.brand img{height:46px}.m-stats{grid-template-columns:1fr 1fr 1fr}.hero-in{padding:120px 0 180px}}
  .drawer{position:fixed;inset:0;z-index:95;background:rgba(251,249,244,.98);backdrop-filter:blur(12px);display:flex;flex-direction:column;padding:28px 24px;transform:translateX(100%);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
  .drawer.open{transform:none}.drawer .x{align-self:flex-end;background:none;border:0;color:var(--ink);font-size:32px;cursor:pointer}
  .drawer a{font-family:var(--serif);font-size:26px;color:var(--ink);padding:14px 0;border-bottom:1px solid var(--line)}
/* ==========================================================================
   PAGE LAYER - namespaced so nothing can collide with the homepage classes
   pg- = shared page furniture | ab- = About | sv- = Services | ct- = Contact
   ========================================================================== */

/* ---------- page hero (compact: these are reading pages, not the homepage) ---------- */
.pg-hero{position:relative;padding:170px 0 72px;overflow:hidden;
  background:radial-gradient(820px circle at 82% 14%,rgba(201,168,92,.15),transparent 58%),var(--ivory)}
.pg-hero .pg-wm{position:absolute;right:-1%;top:2%;z-index:0;font-family:var(--serif);font-weight:500;
  font-size:min(44vh,420px);line-height:.8;color:transparent;-webkit-text-stroke:1px rgba(201,168,92,.2);
  letter-spacing:-.06em;pointer-events:none;user-select:none}
.pg-hero-in{position:relative;z-index:2;max-width:840px}
.pg-hero h1{color:var(--ink);margin:22px 0 20px;font-size:clamp(38px,6vw,76px)}
.pg-crumb{font-size:12px;font-weight:600;color:var(--stone);margin-bottom:4px}
.pg-crumb a:hover{color:var(--gold-txt)}
.pg-rule{height:1px;background:linear-gradient(90deg,var(--gold),rgba(201,168,92,0));margin-top:38px}
/* The page hero is short, so the shared 104px section padding left a dead
   gap under the rule. Tighten only the block that follows a page hero. */
.pg-hero + section.blk{padding-top:64px}

/* ---------- About ---------- */
.ab-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:66px;align-items:start}
.ab-prose p{font-size:clamp(15.5px,1.15vw,17.5px);line-height:1.82;color:var(--char-2);margin-bottom:26px}
.ab-prose p:last-child{margin-bottom:0}
.ab-prose p.ab-open{font-family:var(--serif);font-size:clamp(20px,2vw,27px);line-height:1.5;color:var(--ink)}
.ab-prose strong{font-weight:700;color:var(--ink)}
.ab-tm{white-space:nowrap}
.ab-aside{position:relative;border:1px solid var(--line);background:var(--white);padding:34px 30px;box-shadow:var(--shadow)}
.ab-aside::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.ab-aside h3{font-family:var(--serif);font-size:22px;font-weight:500;color:var(--ink);margin-bottom:16px}
.ab-aside p{font-size:14.5px;color:var(--stone);line-height:1.7;margin-bottom:18px}
.ab-portrait{width:100%;height:auto;margin-bottom:22px;filter:saturate(1.02)}
.ab-pill{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gold-txt);border:1px solid rgba(132,104,36,.45);padding:7px 13px;border-radius:100px}
.ab-vals{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:12px}
.ab-val{border-top:2px solid var(--gold);padding-top:20px}
.ab-val b{display:block;font-family:var(--serif);font-size:21px;font-weight:500;color:var(--on-d);margin-bottom:9px}
.ab-val span{font-size:14px;color:var(--on-d-mut);line-height:1.65}
/* Four-up variant. This MUST be a class, not an inline style: an inline
   grid-template-columns beats the max-width:960px rule below and left the
   About page overflowing by up to 139px on a phone. */
.ab-vals--4{grid-template-columns:repeat(4,1fr)}
/* light-section variant of the value cards */
section.light .ab-val b{color:var(--ink)}
section.light .ab-val span{color:var(--stone)}

/* ---------- Services ---------- */
.sv-list{display:flex;flex-direction:column;gap:34px}
.sv-card{position:relative;border:1px solid var(--line);background:var(--white);padding:46px 44px;
  box-shadow:var(--shadow);transition:transform .35s,box-shadow .35s}
.sv-card:hover{transform:translateY(-3px);box-shadow:0 40px 84px -34px rgba(15,14,12,.3)}
.sv-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad-gold)}
.sv-top{display:flex;justify-content:space-between;align-items:flex-start;gap:26px;flex-wrap:wrap;margin-bottom:22px}
.sv-no{font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;color:var(--gold-txt);display:block;margin-bottom:10px}
.sv-card h2{font-family:var(--serif);font-weight:500;font-size:clamp(27px,3.1vw,38px);line-height:1.1;color:var(--ink)}
.sv-price{text-align:right;flex-shrink:0}
.sv-price b{display:block;font-family:var(--serif);font-size:30px;font-weight:500;color:var(--ink);line-height:1}
.sv-price span{font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--stone);font-weight:700}
.sv-intro{font-size:16px;line-height:1.78;color:var(--char-2);max-width:72ch;margin-bottom:30px}
.sv-sub{font-size:11.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-txt);margin-bottom:16px}
.sv-gain{list-style:none;display:grid;gap:13px;margin-bottom:30px}
.sv-gain li{display:flex;gap:13px;font-size:15px;line-height:1.65;color:var(--char-2)}
.sv-gain li::before{content:"";flex-shrink:0;width:17px;height:17px;margin-top:3px;border-radius:50%;
  background:var(--grad-gold);
  -webkit-mask:var(--tick) center/contain no-repeat;
  mask:var(--tick) center/contain no-repeat}
.sv-note{border-left:2px solid var(--line-2);padding:4px 0 4px 20px;margin-bottom:30px}
.sv-note h4{font-size:11.5px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);margin-bottom:8px}
.sv-note p{font-size:14.8px;line-height:1.7;color:var(--stone)}
.sv-req{display:flex;gap:12px;align-items:flex-start;background:var(--sand);border:1px solid var(--sand-2);
  padding:16px 18px;margin-bottom:30px}
.sv-req p{font-size:13.6px;line-height:1.6;color:var(--char-2)}
.sv-req b{font-weight:800}
.sv-foot{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding-top:8px}
.sv-3rd{font-size:12.5px;color:var(--stone)}

/* ---------- Contact ---------- */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.ct-ways{display:flex;flex-direction:column;gap:16px;margin-bottom:34px}
.ct-way{display:flex;gap:18px;align-items:center;border:1px solid var(--line);background:var(--white);
  padding:20px 22px;transition:border-color .3s,transform .3s}
.ct-way:hover{border-color:var(--gold);transform:translateX(3px)}
.ct-ico{flex-shrink:0;width:42px;height:42px;border-radius:50%;background:var(--sand);
  display:grid;place-items:center;color:var(--gold-txt)}
.ct-ico svg{width:19px;height:19px}
.ct-way b{display:block;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--stone);font-weight:800;margin-bottom:4px}
.ct-way span{font-size:16.5px;font-weight:700;color:var(--ink)}
.ct-meta{border-top:1px solid var(--line);padding-top:26px;display:grid;gap:18px}
.ct-meta h4{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-txt);font-weight:800;margin-bottom:7px}
.ct-meta p{font-size:15px;color:var(--char-2);line-height:1.7}
.ct-form{border:1px solid var(--line);background:var(--white);padding:40px 36px;box-shadow:var(--shadow);position:relative}
.ct-form::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.ct-form h2{font-family:var(--serif);font-weight:500;font-size:29px;color:var(--ink);margin-bottom:10px}
.ct-form > p{font-size:14.8px;color:var(--stone);line-height:1.7;margin-bottom:26px}
.ct-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ct-f{margin-bottom:18px}
.ct-f label{display:block;font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  color:var(--char-2);margin-bottom:8px}
.ct-f label .req{color:var(--gold-txt)}
.ct-f input,.ct-f select,.ct-f textarea{width:100%;font-family:var(--sans);font-size:15px;color:var(--ink);
  background:var(--ivory);border:1px solid var(--line-2);border-radius:2px;padding:13px 14px;transition:border-color .25s,box-shadow .25s}
.ct-f textarea{min-height:118px;resize:vertical}
.ct-f input:focus,.ct-f select:focus,.ct-f textarea:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,168,92,.16)}
.ct-f input[aria-invalid="true"],.ct-f textarea[aria-invalid="true"]{border-color:var(--red);box-shadow:0 0 0 3px rgba(217,112,92,.14)}
.ct-err{display:none;font-size:12.5px;color:#B4503C;margin-top:6px;font-weight:600}
.ct-err.on{display:block}
.ct-form .btn{width:100%;justify-content:center;margin-top:6px}
.ct-fine{font-size:12px;color:var(--stone);line-height:1.65;margin-top:16px}
.ct-ok{display:none;border:1px solid rgba(93,190,138,.45);background:rgba(93,190,138,.09);padding:20px;margin-top:20px}
.ct-ok.on{display:block}
.ct-ok b{display:block;font-size:15.5px;color:var(--ink);margin-bottom:6px;font-weight:800}
.ct-ok p{font-size:14px;color:var(--char-2);line-height:1.65}
.ct-ok a{color:var(--gold-txt);font-weight:700;text-decoration:underline}

/* ---------- page responsive ---------- */
@media(max-width:960px){
  .ab-grid,.ct-grid{grid-template-columns:1fr;gap:38px}
  .ab-vals,.ab-vals--4{grid-template-columns:1fr;gap:26px}
  .pg-hero{padding:150px 0 58px}
  .pg-hero .pg-wm{display:none}
  .sv-card{padding:38px 30px}
}
@media(max-width:600px){
  .pg-hero{padding:126px 0 48px}
  .pg-hero + section.blk{padding-top:44px}
  .ct-row{grid-template-columns:1fr;gap:0}
  .ct-form{padding:30px 22px}
  .sv-card{padding:32px 22px}
  .sv-price{text-align:left}
  .ab-aside{padding:28px 22px}
}
@media(prefers-reduced-motion:reduce){
  .sv-card,.ct-way,.ct-f input,.ct-f textarea{transition:none}
  .sv-card:hover,.ct-way:hover{transform:none}
}

/* .eyebrow is 11.5px, below the size where 3:1 is acceptable, so these
   pages use the accessible gold. index.html is untouched. */
.pg-hero .eyebrow,.blk .eyebrow{color:var(--gold-txt)}
.pg-hero .eyebrow::before,.blk .eyebrow::before{background:var(--gold-txt)}
section.dark .eyebrow.on-d,section.dark .eyebrow.on-d::before{color:var(--gold-lt)}
section.dark .eyebrow.on-d::before{background:var(--gold-lt)}

/* ---------- tap targets (WCAG 2.5.8) ----------
   The shared .hamb is only ~32px tall and .menu links are bare text at
   ~20px. Both are enlarged WITHOUT changing how they look: the hamburger
   grows via min-size, and each nav link gets an invisible 44px hit box on
   ::before (::after is already the gold underline, so it stays put). */
.hamb{min-width:44px;min-height:44px;align-items:center;justify-content:center}
.menu a.lnk::before{content:"";position:absolute;left:0;right:0;top:50%;
  transform:translateY(-50%);height:44px}

/* ==========================================================================
   PROGRAMME EMBLEMS  (Gold / Diamond / Couples)
   Three bespoke marks, one system: 64x64 viewBox, 2.4 stroke, brand gold
   gradient, set on a stone plate. Geometry is generated and asserted inside
   the viewBox by scratchpad/gen_emblems.py - never hand-typed.

   Each mark says something from her own copy:
     gold    - a value gauge swept into the upper range ("shift into high gear")
     diamond - a brilliant cut, facets and all ("we prove otherwise")
     couples - two separate pulses, each with its own beat, converging into one
               ("dual-track ... aligning your shared financial future")

   The draw-in animation runs ONLY when pages.js has measured each stroke and
   added .em-ready. With JS off the marks are simply drawn and still.
   ========================================================================== */

.sv-card{overflow:hidden}                 /* clips the oversized watermark */
.sv-card > *{position:relative;z-index:1} /* copy sits above the watermark */

.sv-id{display:flex;gap:22px;align-items:center;min-width:0}
.sv-idt{min-width:0}                      /* lets the h2 wrap instead of overflowing */

.sv-em{
  flex-shrink:0;position:relative;width:78px;height:78px;border-radius:50%;
  background:radial-gradient(circle at 34% 26%,#fff 0%,var(--sand) 82%);
  border:1px solid var(--sand-2);
  display:grid;place-items:center;
  box-shadow:inset 0 1px 0 #fff,0 12px 26px -16px rgba(15,14,12,.34);
  transition:transform .5s var(--sc-e,cubic-bezier(.2,.8,.2,1)),box-shadow .5s;
}
.sv-em::after{                            /* thin gold ring, just inside the plate */
  content:"";position:absolute;inset:5px;border-radius:50%;
  border:1px solid rgba(201,168,92,.34);pointer-events:none;
}
.sv-card:hover .sv-em{transform:translateY(-3px);box-shadow:inset 0 1px 0 #fff,0 18px 34px -16px rgba(158,126,50,.5)}
.sv-emb{width:54px;height:54px;overflow:visible;display:block}

/* ---------- shared stroke language ---------- */
.sv-emb path,.sv-emb circle,.sv-emb rect{vector-effect:non-scaling-stroke}

/* ---------- 1. gold: the gauge ---------- */
.sv-emb--gold .em-track{fill:none;stroke:rgba(158,126,50,.24);stroke-width:2.4;stroke-linecap:round}
.sv-emb--gold .em-value{fill:none;stroke:url(#emg-g);stroke-width:3.4;stroke-linecap:round}
.sv-emb--gold .em-ticks path{fill:none;stroke:rgba(158,126,50,.5);stroke-width:1.5;stroke-linecap:round}
.sv-emb--gold .em-needle-l{fill:none;stroke:var(--ink);stroke-width:2.1;stroke-linecap:round}
.sv-emb--gold .em-hub{fill:var(--ink)}
.sv-emb--gold .em-needle{transform-box:view-box;transform-origin:32px 40.5px}

/* ---------- 2. diamond: brilliant cut ---------- */
.sv-emb--diamond .em-outline{fill:none;stroke:url(#emd-g);stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.sv-emb--diamond .em-facets path{fill:none;stroke:rgba(158,126,50,.5);stroke-width:1.4;stroke-linecap:round}
.sv-emb--diamond .em-spark{fill:url(#emd-g)}
.sv-emb--diamond .em-glint{fill:url(#emd-s)}

/* ---------- 3. couples: two pulses converging ---------- */
.sv-emb--couples .em-trace{fill:none;stroke:url(#emc-g);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.sv-emb--couples .em-trace--sh{stroke-width:3.2}
.sv-emb--couples .em-node{fill:rgba(158,126,50,.5)}
.sv-emb--couples .em-merge{fill:url(#emc-g)}

/* ---------- watermark ---------- */
.sv-wm{position:absolute;top:-26px;right:-24px;width:250px;height:250px;
  z-index:0;opacity:.055;pointer-events:none}
.sv-wm path{fill:none;stroke:var(--gold-2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* ==========================================================================
   ANIMATION - gated on .em-ready (added by pages.js once each stroke length
   is measured) and .in (the card has revealed). Never gated on CSS alone.
   ========================================================================== */
@keyframes em-draw{to{stroke-dashoffset:0}}
@keyframes em-needle{from{transform:rotate(-140deg)}to{transform:rotate(0)}}
@keyframes em-fade{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes em-glint{0%{transform:translateX(0)}20%,100%{transform:translateX(98px)}}
@keyframes em-beat{0%,84%,100%{transform:scale(1)}90%{transform:scale(1.42)}}

.sv-emb.em-ready [d]{stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
.sv-emb.em-ready .em-spark,
.sv-emb.em-ready .em-node,
.sv-emb.em-ready .em-merge,
.sv-emb.em-ready .em-hub{opacity:0}
.sv-emb.em-ready .em-glint{transform:translateX(0)}

/* --- play --- */
.rv.in .sv-emb.em-ready [d]{animation:em-draw .95s cubic-bezier(.25,.85,.3,1) both}
.rv.in .sv-emb.em-ready .em-ticks path{animation-duration:.5s;animation-delay:.34s}
.rv.in .sv-emb--gold.em-ready .em-value{animation-delay:.2s;animation-duration:1.05s}
.rv.in .sv-emb--gold.em-ready .em-needle{animation:em-needle 1.25s cubic-bezier(.22,.92,.24,1) .22s both}
.rv.in .sv-emb--gold.em-ready .em-needle-l{animation-delay:.22s}
.rv.in .sv-emb--gold.em-ready .em-hub{animation:em-fade .4s ease .3s both}

.rv.in .sv-emb--diamond.em-ready .em-facets path{animation-delay:.3s;animation-duration:.8s}
.rv.in .sv-emb--diamond.em-ready .em-spark--a{animation:em-fade .55s cubic-bezier(.2,1.5,.3,1) .85s both}
.rv.in .sv-emb--diamond.em-ready .em-spark--b{animation:em-fade .55s cubic-bezier(.2,1.5,.3,1) 1.02s both}
.rv.in .sv-emb--diamond.em-ready .em-glint{animation:em-glint 5.4s ease-in-out 1.5s infinite}

.rv.in .sv-emb--couples.em-ready .em-trace--lo{animation-delay:.1s}
.rv.in .sv-emb--couples.em-ready .em-trace--sh{animation-delay:.42s;animation-duration:.85s}
.rv.in .sv-emb--couples.em-ready .em-node{animation:em-fade .45s cubic-bezier(.2,1.5,.3,1) both}
.rv.in .sv-emb--couples.em-ready .em-node--b{animation-delay:.12s}
.rv.in .sv-emb--couples.em-ready .em-merge{
  transform-box:fill-box;transform-origin:center;
  animation:em-fade .5s cubic-bezier(.2,1.6,.3,1) 1.05s both,
            em-beat 3.4s ease-in-out 2s infinite;
}

/* ---------- responsive ---------- */
@media (max-width:760px){
  .sv-em{width:62px;height:62px}
  .sv-emb{width:42px;height:42px}
  .sv-id{gap:16px}
  .sv-wm{width:180px;height:180px;top:-18px;right:-16px}
}
@media (max-width:420px){
  .sv-em{width:58px;height:58px}
  .sv-emb{width:42px;height:42px}
  .sv-id{gap:13px}
  /* below this size the gauge ticks and the smaller sparkle stop being detail
     and start being noise - the arc, value and needle carry the mark alone */
  .sv-emb--gold .em-ticks,
  .sv-emb--diamond .em-spark--b{display:none}
}

/* ---------- reduced motion: drawn, still, no glint ---------- */
@media (prefers-reduced-motion:reduce){
  .sv-emb.em-ready [d]{stroke-dasharray:none;stroke-dashoffset:0}
  .sv-emb.em-ready .em-spark,
  .sv-emb.em-ready .em-node,
  .sv-emb.em-ready .em-merge,
  .sv-emb.em-ready .em-hub{opacity:1}
  .sv-emb .em-glint{display:none}
  .rv.in .sv-emb.em-ready [d],
  .rv.in .sv-emb--gold.em-ready .em-needle,
  .rv.in .sv-emb--couples.em-ready .em-merge,
  .rv.in .sv-emb--diamond.em-ready .em-spark--a,
  .rv.in .sv-emb--diamond.em-ready .em-spark--b,
  .rv.in .sv-emb--gold.em-ready .em-hub,
  .rv.in .sv-emb--couples.em-ready .em-node{animation:none}
  .sv-em,.sv-card:hover .sv-em{transition:none;transform:none}
}

/* ---------- contact v3: hero CTA + hours line ---------- */
.ct-hero-cta{display:flex;gap:14px;flex-wrap:wrap;margin-top:26px}
.ct-hours-line{margin-top:18px;font-size:15px;color:var(--char-2)}
.ct-hours-line b{color:var(--ink)}
@media(max-width:600px){.ct-hero-cta .btn{flex:1 1 100%;justify-content:center}}

/* ---------- contact: honeypot, calendar embed, fallback panel ---------- */
.ct-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.ct-ok--fb{border-color:rgba(217,164,65,.5);background:rgba(217,164,65,.09)}
.ct-cal{position:relative;border:1px solid var(--line);background:var(--white);box-shadow:var(--shadow);padding:10px}
.ct-cal::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.ct-cal iframe{display:block;width:100%;min-height:780px;border:0;background:var(--white)}
.ct-cal-fb{font-size:13px;color:var(--stone-2);padding:12px 8px 4px;text-align:center}
.ct-cal-fb a{color:var(--gold-txt,var(--gold-2));font-weight:700}
@media(max-width:600px){.ct-cal{padding:6px}.ct-cal iframe{min-height:900px}}

/* ---------- grant services (on /services) ---------- */
.gr-list{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.gr-card{position:relative;border:1px solid var(--line);background:var(--ivory);padding:36px 34px;display:flex;flex-direction:column;transition:transform .35s,box-shadow .35s}
.gr-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.gr-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.gr-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:18px}
.gr-card h3{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2.2vw,27px);line-height:1.15;color:var(--ink)}
.gr-price{text-align:right;flex-shrink:0}
.gr-price b{display:block;font-family:var(--serif);font-size:26px;font-weight:500;color:var(--ink);line-height:1;white-space:nowrap}
.gr-price b s{font-size:15px;color:var(--stone-2);font-weight:400;margin-right:4px}
.gr-price span{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:var(--stone-2);font-weight:700}
.gr-p{font-size:15px;line-height:1.75;color:var(--char-2);margin-bottom:14px}
.gr-gain{margin:4px 0 18px}
.gr-gain li{font-size:14.5px}
.gr-card .sv-foot{margin-top:auto;padding-top:14px}
.gr-card:last-child:nth-child(odd){grid-column:1/-1}
@media(max-width:960px){.gr-list{grid-template-columns:1fr}.gr-card:last-child:nth-child(odd){grid-column:auto}.gr-card{padding:30px 24px}.gr-price{text-align:left}}

/* ---------- course page ---------- */
.cs-grid{display:grid;grid-template-columns:1.35fr .65fr;gap:44px;align-items:start}
.cs-card{position:relative;border:1px solid var(--line);background:var(--white);padding:46px 44px;box-shadow:var(--shadow)}
.cs-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--grad-gold)}
.cs-card h2{font-family:var(--serif);font-weight:500;font-size:clamp(30px,3.6vw,44px);line-height:1.08;color:var(--ink);margin:8px 0 16px}
.cs-lede{font-size:16.5px;line-height:1.75;color:var(--char-2);max-width:60ch;margin-bottom:26px}
.cs-price{display:flex;align-items:baseline;gap:14px;margin:6px 0 26px;padding-top:22px;border-top:1px solid var(--line)}
.cs-price b{font-family:var(--serif);font-size:44px;font-weight:500;color:var(--ink);line-height:1}
.cs-price .cs-cents{font-size:20px;color:var(--stone-2)}
.cs-price span{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone-2);font-weight:800}
.cs-aside{border:1px solid var(--line);background:var(--ivory);padding:28px 26px}
.cs-aside h3{font-size:11.5px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-txt,var(--gold-2));margin-bottom:16px}
.cs-link{display:block;padding:14px 0;border-top:1px solid var(--line);transition:transform .25s}
.cs-link:hover{transform:translateX(4px)}
.cs-link b{display:block;font-family:var(--serif);font-size:18px;font-weight:500;color:var(--ink);margin-bottom:4px}
.cs-link span{font-size:13.5px;color:var(--stone);line-height:1.6}
@media(max-width:960px){.cs-grid{grid-template-columns:1fr;gap:28px}.cs-card{padding:34px 26px}}
@media(max-width:600px){.cs-card{padding:28px 20px}.cs-price b{font-size:36px}}

/* ---------- nav: seven links + button need a little less air below 1180px ---------- */
@media(max-width:1180px){.menu{gap:20px}.menu a.lnk{font-size:13px}}
@media(max-width:1024px){.menu{gap:16px}.menu a.lnk{font-size:12.5px}header.nav .btn{padding:13px 18px;font-size:12.5px}}
@media(prefers-reduced-motion:reduce){.gr-card,.cs-link{transition:none}.gr-card:hover,.cs-link:hover{transform:none}}

/* ---------- legal pages ---------- */
.lg-prose{max-width:76ch}
.lg-prose h2{font-family:var(--serif);font-weight:500;font-size:clamp(21px,2.2vw,26px);color:var(--ink);margin:38px 0 12px}
.lg-prose p{font-size:15.5px;line-height:1.8;color:var(--char-2);margin-bottom:14px}
.lg-prose ul{margin:0 0 16px 22px}
.lg-prose li{font-size:15.5px;line-height:1.75;color:var(--char-2);margin-bottom:8px}
.lg-prose a{color:var(--gold-txt,var(--gold-2));font-weight:700}
.lg-prose strong{color:var(--ink)}
.lg-see{border-top:1px solid var(--line);padding-top:22px;margin-top:34px;color:var(--stone)}
.foot-bot a{color:inherit}.foot-bot a:hover{color:var(--gold-lt)}

/* ---------- Resources store + vault ---------- */
.vt-resend{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:14px 0 18px}.vt-resend input{flex:1 1 220px;min-width:0;padding:13px 14px;border:1px solid var(--line);background:#fff;font:inherit;font-size:15px}.vt-resend .vt-modal-msg{flex-basis:100%;margin:0}
.vt-bundles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.vt-bundle{position:relative;min-width:0;border:1px solid var(--line);background:var(--ivory);padding:34px 30px 30px;display:flex;flex-direction:column;transition:transform .35s,box-shadow .35s}
.vt-bundle:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.vt-bundle::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.vt-bundle.vt-feat{background:var(--black);color:var(--on-d);border-color:rgba(232,214,168,.28);box-shadow:0 30px 60px -30px rgba(0,0,0,.55)}
.vt-bundle.vt-feat h3,.vt-bundle.vt-feat .vt-b-price b{color:var(--gold-lt)}
.vt-bundle.vt-feat .gr-p,.vt-bundle.vt-feat .vt-lead,.vt-bundle.vt-feat .vt-inc li{color:var(--on-d-mut)}
.vt-bundle.vt-feat .vt-inc li{border-color:rgba(232,214,168,.16)}
.vt-bundle.vt-feat .vt-inc li em{color:var(--gold-lt)}
.vt-bundle.vt-feat .sv-no{color:var(--gold-lt)}
.vt-bundle.vt-feat .vt-b-price span{color:var(--on-d-mut)}
.vt-bundle.vt-feat .vt-b-price strong{color:var(--gold-lt)}
.vt-badge{position:absolute;top:18px;right:18px;font-size:10.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#241b06;background:var(--grad-gold);padding:7px 11px;border-radius:100px}
.vt-b-head h3{font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.3vw,30px);line-height:1.12;color:var(--ink);margin:0 0 10px}
.vt-lead{font-size:15px;line-height:1.6;color:var(--char-2);margin-bottom:18px}
.vt-b-price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin:6px 0 18px}
.vt-b-price b{font-family:var(--serif);font-size:40px;font-weight:500;color:var(--ink);line-height:1}
.vt-b-price span{font-size:12.5px;color:var(--stone)}.vt-b-price s{color:var(--stone-2)}.vt-b-price strong{color:var(--gold-txt);font-weight:800;letter-spacing:.04em}
.vt-inc{list-style:none;margin:0 0 18px;padding:0;border-top:1px solid var(--line)}
.vt-inc li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--char-2)}
.vt-inc li em{font-style:normal;color:var(--stone);white-space:nowrap}
.vt-bundle .gr-p{font-size:14.5px}.vt-bundle .sv-foot{margin-top:auto;padding-top:14px}
.vt-list{display:grid;gap:26px}
.vt-card{position:relative;display:grid;grid-template-columns:220px minmax(0,1fr);gap:34px;border:1px solid var(--line);background:var(--ivory);padding:34px;transition:transform .35s,box-shadow .35s}
.vt-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.vt-card::before{content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--grad-gold)}
.vt-cover{position:relative;align-self:start}
.vt-cover img{display:block;width:100%;height:auto;aspect-ratio:587/917;object-fit:cover;box-shadow:0 22px 40px -20px rgba(0,0,0,.45);border:1px solid rgba(0,0,0,.06);background:#fff}
.vt-pages{display:block;margin-top:12px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--stone)}
.vt-body{min-width:0}
.vt-card h3{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2.2vw,27px);line-height:1.15;color:var(--ink)}
.vt-sub{display:block;margin-top:6px;font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-txt)}
.vt-disc{font-size:12.5px;line-height:1.65;color:var(--stone);border-left:2px solid var(--gold);padding-left:14px;margin:0 0 22px}
.vt-disc.on-d{color:var(--on-d-mut);border-color:rgba(232,214,168,.5);margin-top:34px;max-width:78ch}
.vt-disc.on-d a{color:var(--gold-lt);text-decoration:underline}
.vt-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.vt-step{border:1px solid rgba(232,214,168,.18);padding:26px 24px}
.vt-step span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--grad-gold);color:#241b06;font-weight:800;margin-bottom:14px}
.vt-step h4{font-family:var(--serif);font-weight:500;font-size:20px;color:var(--gold-lt);margin-bottom:8px}
.vt-step p{font-size:14px;color:var(--on-d-mut);line-height:1.6}
.vt-modal[hidden]{display:none}
.vt-modal{position:fixed;inset:0;z-index:200;background:rgba(15,13,10,.62);display:grid;place-items:center;padding:20px;backdrop-filter:blur(3px)}
.vt-modal-card{position:relative;width:min(520px,100%);background:var(--ivory);padding:38px 36px 32px;border-top:3px solid var(--gold);box-shadow:0 40px 80px -30px rgba(0,0,0,.6)}
.vt-modal-card .x{position:absolute;top:12px;right:14px;background:none;border:0;font-size:30px;line-height:1;color:var(--stone);cursor:pointer}
.vt-modal-card h3{font-family:var(--serif);font-weight:500;font-size:28px;color:var(--ink);margin:10px 0 10px}
.vt-modal-card p{font-size:14.5px;line-height:1.65;color:var(--char-2);margin-bottom:18px}
.vt-modal-card label{display:block;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--stone);margin-bottom:12px}
.vt-modal-card input[type=text],.vt-modal-card input[type=email]{display:block;width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--line);background:#fff;font:inherit;font-size:15px;color:var(--ink)}
.vt-modal-card input:focus{outline:2px solid var(--gold);outline-offset:1px}
.vt-modal-card button[type=submit]{width:100%;justify-content:center;margin-top:6px}
.vt-modal-msg{min-height:20px;margin:12px 0 0;font-size:13.5px}.vt-modal-msg.ok{color:#1f6b45}.vt-modal-msg.err{color:#B4503C}
.vl-list{display:grid;gap:18px}
.vl-item{display:grid;grid-template-columns:96px minmax(0,1fr);gap:24px;align-items:center;border:1px solid var(--line);background:var(--ivory);padding:22px}
.vl-item img{width:96px;height:auto;aspect-ratio:587/917;object-fit:cover;box-shadow:0 14px 26px -14px rgba(0,0,0,.5)}
.vl-item h3{font-family:var(--serif);font-weight:500;font-size:22px;color:var(--ink);margin:0 0 14px}
.vl-bad h3{font-family:var(--serif);font-weight:500;font-size:26px;color:var(--ink);margin-bottom:10px}
@media (max-width:980px){.vt-bundles{grid-template-columns:1fr 1fr}.vt-bundle.vt-feat{grid-column:1/-1}.vt-how{grid-template-columns:1fr}}
@media (max-width:760px){.vt-bundles{grid-template-columns:1fr}.vt-bundle.vt-feat{grid-column:auto}.vt-card{grid-template-columns:1fr;gap:22px;padding:24px}.vt-cover{max-width:180px}.vt-modal-card{padding:30px 22px 24px}.vl-item{grid-template-columns:72px minmax(0,1fr);gap:16px;padding:16px}.vl-item img{width:72px}}
