@charset "UTF-8";
/* ==========================================================================
   GROWTH MASTER — gm.css
   Child theme stylesheet.  Version 1.1  ·  built from growth-master-ui-v3.html
   --------------------------------------------------------------------------
   WHAT IS IN HERE
     Only what Elementor cannot express: design tokens, gradients,
     pseudo-element seams, per-card colour rules, auto-margins, calc(),
     scroll-snap, and the components you PASTE as HTML widgets.
     Full category-by-category rationale: see gm-css-reference.md.

   WHAT IS *NOT* IN HERE  — deliberately
     Layout (widths, heights, padding, gaps)      -> SET IN ELEMENTOR
     Typography (family, size, weight, l-height)  -> SET IN ELEMENTOR (Global Fonts)
     Section background colours                   -> SET IN ELEMENTOR (Global Colours)
     Never set the same property in both places. One will silently win, and
     clearing Elementor's cache can flip which — that is the .btn padding bug.

   THE ONE SPLIT TO REMEMBER
     Some things are half-and-half. A ::before seam is CSS, but the
     Position:Relative it needs is set in Elementor. A button's gradient is
     CSS, but its padding is Elementor. Reference sheet flags each.

   INSTALL
     1. Save as  /wp-content/themes/hello-elementor-child/assets/gm.css
     2. Enqueue from functions.php (see functions-enqueue.php)

   COLOUR RULE — read before editing
     --bar-1..4 are DECORATION ONLY (fills, rules, icon tints).
     Bright teal is 2.88:1 on white and FAILS WCAG AA as text.
     Wherever TEXT sits on or in these colours, use the -t variants.

   v1.1 changelog: added .menu auto-margin (Elementor cannot hold `auto`).
   ========================================================================== */


/* ==========================================================================
   1. TOKENS
   ========================================================================== */
:root{
  /* --- NAVY — sampled from the logo background --- */
  --navy:#0A1B33;
  --navy-2:#102847;
  --navy-3:#17375E;
  --navy-deep:#06101F;

  /* --- GOLD — sampled from the logo wordmark. Warm amber, NOT #D4AF37. --- */
  --gold:#D9A02B;
  --gold-lt:#E8B33C;
  --gold-dk:#B97512;
  --gold-text:#8A5A0C;            /* 5.9:1 — the ONLY gold allowed as text on white */
  --gold-grad:linear-gradient(135deg,#E8B33C 0%,#D9A02B 48%,#B97512 100%);

  /* --- THE ASCENDING SEQUENCE — sampled from the logo bars. Decoration only. --- */
  --bar-1:#1F4FBF;                /* royal blue   */
  --bar-2:#0E7CC4;                /* azure        */
  --bar-3:#0AA9AC;                /* teal         */
  --bar-4:#0FA37A;                /* emerald-teal */

  /* --- TEXT-SAFE variants — use wherever TEXT sits on/in the colour --- */
  --bar-1-t:#1F4EBF;              /* 7.2:1 on white */
  --bar-2-t:#0E7BC4;              /* 4.5:1 */
  --bar-3-t:#078386;              /* 4.6:1 */
  --bar-4-t:#0C8564;              /* 4.6:1 */

  --growth:linear-gradient(90deg,#1F4FBF 0%,#0E7CC4 34%,#0AA9AC 68%,#0FA37A 100%);

  /* --- Neutrals --- */
  --white:#fff;
  --cream:#FCF9F2;
  --grey:#F3F6F9;
  --dark:#16202E;
  --muted:#63738A;                /* 4.8:1 on white */
  --border:#E1E7EE;

  /* --- Metrics --- */
  --wrap:1240px;
  --gm-header-h:82px;             /* MUST match the .nav container min-height set  */
                                  /* in Elementor. Change both together. Drives     */
                                  /* the legal-page TOC offset and anchor scroll.   */
  --r:14px;
  --r-lg:22px;
  --r-pill:100px;

  --sh:0 4px 24px rgba(10,27,51,.07);
  --sh-lg:0 18px 48px rgba(10,27,51,.14);
  --sh-gold:0 12px 32px rgba(217,160,43,.3);
  --ease:260ms cubic-bezier(.4,0,.2,1);
}


/* ==========================================================================
   2. GLOBAL — focus, skip link, motion
   ========================================================================== */

/* Focus ring. REQUIRED for WCAG 2.4.7. Do not remove. */
:focus-visible{
  outline:3px solid var(--gold);
  outline-offset:3px;
  border-radius:4px;
}

/* Skip link — first focusable element on every page */
.gm-skip{
  position:absolute;left:-9999px;top:0;z-index:999999;
  background:var(--navy);color:#fff;padding:12px 20px;
  text-decoration:none;font-weight:700;
}
.gm-skip:focus{left:0}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}


/* ==========================================================================
   3. BUTTONS
   Add the classes in Elementor: Advanced > CSS Classes > "btn btn--gold"
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  border:2px solid transparent;border-radius:var(--r-pill);
  text-decoration:none;cursor:pointer;transition:all var(--ease);
}

/* PRIMARY — gold gradient fill with NAVY text = 7.4:1.
   White on gold is 2.3:1 and FAILS AA. Do not change the text colour. */
.btn--gold{
  background:var(--gold-grad);
  color:var(--navy);
  box-shadow:var(--sh-gold);
}
.btn--gold:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 40px rgba(217,160,43,.45);
  color:var(--navy);
}

.btn--navy{background:var(--navy);color:#fff;box-shadow:var(--sh)}
.btn--navy:hover{background:var(--navy-3);color:#fff;transform:translateY(-2px)}

.btn--ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.34)}
.btn--ghost:hover{background:#fff;color:var(--navy);border-color:#fff}

.btn--out{background:transparent;color:var(--navy);border-color:var(--border)}
.btn--out:hover{border-color:var(--navy);background:var(--navy);color:#fff}


/* ==========================================================================
   4. SECTION FURNITURE
   Backgrounds and padding are SET IN ELEMENTOR. Only the gradient
   flourishes live here.
   ========================================================================== */

/* The signature seam. Drop an empty Container, class gm-seam, height 4px. */
.gm-seam{height:4px;background:var(--growth);border:0;margin:0}

/* Section heading underline — add class gm-shead to the Heading widget */
.gm-shead::after{
  content:"";display:block;width:88px;height:4px;border-radius:4px;
  background:var(--growth);margin:16px auto 0;
}
.gm-shead--left::after{margin-left:0;margin-right:auto}

/* Eyebrow pill — gold TEXT must be --gold-text, never --gold */
.eyebrow{
  display:inline-block;background:rgba(217,160,43,.14);
  color:var(--gold-text);
  border-radius:var(--r-pill);
}
.sec--navy .eyebrow,
.gm-on-navy .eyebrow{background:rgba(232,179,60,.18);color:var(--gold-lt)}


/* ==========================================================================
   5. HEADER — statutory strip + nav
   Container dimensions are SET IN ELEMENTOR (see guide §5.0).
   ========================================================================== */

/* --- The 2px gradient seam under the nav.
       REQUIRES: the .nav container has Advanced > Layout > Position = Relative. --- */
.nav{position:relative}
.nav::after{
  content:"";position:absolute;left:0;right:0;bottom:0;
  height:2px;background:var(--growth);
}

/* Nav links */

/* margin-left:auto pushes the menu to the right of the logo. It lives here
   because Elementor's margin fields are NUMERIC and reject the `auto`
   keyword — this is the one nav layout value the panel cannot hold.
   PREFERRED ALTERNATIVE: set the nav__in container's Justify Content to
   "Space Between" in Elementor and DELETE this rule. Only keep this if your
   header layout needs the menu pushed independently of the button.
   NOTE: add the class "menu" in the widget's Advanced > CSS Classes, or this
   targets nothing — Elementor's Menu widget outputs .elementor-nav-menu. */
.menu{margin-left:auto;display:flex;align-items:center;gap:5px}

.menu a{
  color:rgba(255,255,255,.82);text-decoration:none;
  padding:9px 15px;border-radius:var(--r-pill);
  transition:all var(--ease);
}
.menu a:hover{background:rgba(255,255,255,.1);color:#fff}
.menu .current-menu-item > a{background:rgba(232,179,60,.18);color:var(--gold-lt)}

/* --- Statutory ticker (PASTE block) --- */
.ticker{position:relative;flex:1;min-height:38px;overflow:hidden}
.ticker p{
  position:absolute;inset:0;margin:0;
  display:flex;align-items:center;justify-content:flex-end;text-align:right;
  color:rgba(255,255,255,.6);
  opacity:0;transition:opacity 600ms ease;
}
.ticker p.on{opacity:1}
.ticker b{color:var(--gold-lt);font-weight:700;margin-right:5px}

@media(max-width:680px){
  .ticker p{justify-content:center;text-align:center}
}


/* ==========================================================================
   6. MEGA-PANEL — 20 compliance links
   ========================================================================== */
.gm-mega-panel{
  position:absolute;left:0;right:0;background:#fff;
  border-top:4px solid transparent;
  border-image:var(--growth) 1;
  box-shadow:0 16px 32px rgba(10,27,51,.14);
  z-index:99;                      /* must sit BELOW Elementor's sticky wrapper */
}
.gm-mega-panel[hidden]{display:none}
.gm-mega-panel__in{
  max-width:var(--wrap);margin-inline:auto;padding:40px 28px;
  display:grid;grid-template-columns:repeat(4,1fr);gap:40px;
}

/* Column headers use the TEXT-SAFE variants — they are text. */
.gm-mega-col h3{
  margin:0 0 16px;padding-bottom:12px;
  border-bottom:1px solid var(--border);
  font-size:.75rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
}
.gm-mega-col-1 h3{color:var(--bar-1-t)}
.gm-mega-col-2 h3{color:var(--bar-2-t)}
.gm-mega-col-3 h3{color:var(--bar-3-t)}
.gm-mega-col-4 h3{color:var(--bar-4-t)}

.gm-mega-col a{display:block;padding:8px 0;color:var(--navy);text-decoration:none}
.gm-mega-col a:hover{color:var(--gold-text)}

@media(max-width:1080px){
  .gm-mega-panel{position:static;box-shadow:none}
  .gm-mega-panel__in{grid-template-columns:1fr;gap:24px;padding:24px}
}


/* ==========================================================================
   7. HERO
   ========================================================================== */
.hero{
  background:
    radial-gradient(880px 540px at 84% 16%,rgba(217,160,43,.15),transparent 62%),
    radial-gradient(720px 520px at 6% 92%,rgba(31,79,191,.28),transparent 62%),
    linear-gradient(155deg,#0A1B33 0%,#0E2440 50%,#08172B 100%);
  color:#fff;position:relative;overflow:hidden;
}

/* "GROWTH" in gold gradient */
.hero-em{
  background:var(--gold-grad);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
}

/* Stat figures — bright bars are OK here: large text on navy, 3.9–6.0:1 */
.gm-hstat-1 .gm-hstat-n{color:var(--bar-2)}
.gm-hstat-2 .gm-hstat-n{color:var(--bar-3)}
.gm-hstat-3 .gm-hstat-n{color:var(--bar-4)}

/* Founder photo panel */
.photo{
  position:relative;overflow:hidden;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:linear-gradient(165deg,#102847,#0A1B33);
  border:1px solid rgba(217,160,43,.22);border-bottom:0;
}
.photo::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--growth);z-index:2;
}
.namecard{
  position:absolute;left:20px;right:20px;bottom:22px;z-index:2;
  background:rgba(255,255,255,.97);border-radius:var(--r);
  box-shadow:var(--sh-lg);
}
.namecard i{
  font-style:normal;background:rgba(15,163,122,.12);color:#0A7355;
  border-radius:var(--r-pill);font-weight:800;
}

/* Credential pills — one sequence stop each */
.gm-pill{border-radius:var(--r-pill);border:1px solid;color:rgba(255,255,255,.92)}
.gm-pill-1{background:rgba(15,163,122,.12);border-color:rgba(15,163,122,.42)}
.gm-pill-2{background:rgba(31,79,191,.14);border-color:rgba(31,79,191,.46)}
.gm-pill-3{background:rgba(14,124,196,.14);border-color:rgba(14,124,196,.46)}
.gm-pill-4{background:rgba(10,169,172,.13);border-color:rgba(10,169,172,.46)}
.gm-pill b{color:var(--gold-lt);font-weight:800}


/* ==========================================================================
   8. CARDS — the ascending sequence
   EXPLICIT CLASSES, never :nth-child. Elementor wraps each widget in its
   own divs, so nth-child counts the wrong element and the sequence
   silently collapses to one colour.
   Add in Elementor: Advanced > CSS Classes > "gm-svc-2"  (no leading dot)
   ========================================================================== */

/* --- shared card shell --- */
.gm-card{
  background:#fff;border:1px solid var(--border);
  border-radius:var(--r-lg);box-shadow:var(--sh);
  position:relative;overflow:hidden;
  transition:transform var(--ease),box-shadow var(--ease);
}
.gm-card:hover{transform:translateY(-6px);box-shadow:var(--sh-lg)}

/* --- coloured top border, one stop per card --- */
.gm-card::before{content:"";position:absolute;top:0;left:0;right:0;height:4px}

/* Services */
.gm-svc-1::before{background:var(--bar-1)}
.gm-svc-2::before{background:var(--bar-2)}
.gm-svc-3::before{background:var(--bar-3)}
.gm-svc-4::before{background:var(--bar-4)}
.gm-svc-1 .gm-ic{background:rgba(31,79,191,.10);color:var(--bar-1)}
.gm-svc-2 .gm-ic{background:rgba(14,124,196,.10);color:var(--bar-2)}
.gm-svc-3 .gm-ic{background:rgba(10,169,172,.10);color:var(--bar-3)}
.gm-svc-4 .gm-ic{background:rgba(15,163,122,.10);color:var(--bar-4)}

/* Why-join carousel */
.gm-why-1::before{background:var(--bar-1)}
.gm-why-2::before{background:var(--bar-2)}
.gm-why-3::before{background:var(--bar-3)}
.gm-why-4::before{background:var(--bar-4)}
.gm-why-5::before{background:var(--bar-2)}
.gm-why-6::before{background:var(--bar-4)}
.gm-why-1 .gm-ic{background:rgba(31,79,191,.10);color:var(--bar-1)}
.gm-why-2 .gm-ic{background:rgba(14,124,196,.10);color:var(--bar-2)}
.gm-why-3 .gm-ic{background:rgba(10,169,172,.10);color:var(--bar-3)}
.gm-why-4 .gm-ic{background:rgba(15,163,122,.10);color:var(--bar-4)}
.gm-why-5 .gm-ic{background:rgba(14,124,196,.10);color:var(--bar-2)}
.gm-why-6 .gm-ic{background:rgba(15,163,122,.10);color:var(--bar-4)}

/* Carousel cards animate their border in on hover */
.gm-why-1::before,.gm-why-2::before,.gm-why-3::before,
.gm-why-4::before,.gm-why-5::before,.gm-why-6::before{
  transform:scaleX(0);transform-origin:left;transition:transform 320ms ease;
}
.gm-card[class*="gm-why-"]:hover::before{transform:scaleX(1)}

/* Plans — middle card is the featured one */
.gm-plan-1::before{background:var(--bar-2)}
.gm-plan-2::before{background:var(--gold-grad)}
.gm-plan-3::before{background:var(--bar-4)}
.gm-plan--hot{
  border-color:var(--gold);box-shadow:var(--sh-gold);
  background:linear-gradient(180deg,#FFFCF5,#fff);
}
.gm-plan__rib{
  position:absolute;top:16px;right:-34px;transform:rotate(45deg);
  background:var(--gold-grad);color:var(--navy);
  padding:6px 40px;box-shadow:0 4px 14px rgba(217,160,43,.4);
  font-weight:800;letter-spacing:.06em;text-transform:uppercase;
}

/* Compliance cards */
.gm-comp-1::before{background:var(--bar-1)}
.gm-comp-2::before{background:var(--bar-2)}
.gm-comp-3::before{background:var(--bar-3)}
.gm-comp-4::before{background:var(--bar-4)}
.gm-comp-1 .gm-ic{background:rgba(31,79,191,.10);color:var(--bar-1)}
.gm-comp-2 .gm-ic{background:rgba(14,124,196,.10);color:var(--bar-2)}
.gm-comp-3 .gm-ic{background:rgba(10,169,172,.10);color:var(--bar-3)}
.gm-comp-4 .gm-ic{background:rgba(15,163,122,.10);color:var(--bar-4)}

/* Testimonial avatars — TEXT-SAFE fills (a white initial sits on them) */
.gm-tst-1 .gm-av{background:var(--bar-2-t)}
.gm-tst-2 .gm-av{background:var(--bar-3-t)}
.gm-tst-3 .gm-av{background:var(--bar-4-t)}
.gm-av{border-radius:50%;color:#fff;font-weight:800;display:grid;place-items:center}

/* Icon tile shared shell */
.gm-ic{border-radius:16px;display:grid;place-items:center}

/* Emerald tick marks on inclusion lists */
.gm-ticks li{position:relative;padding-left:24px;list-style:none}
.gm-ticks li::before{
  content:"";position:absolute;left:0;top:7px;width:15px;height:15px;
  border-radius:50%;background:rgba(15,163,122,.13);
}
.gm-ticks li::after{
  content:"";position:absolute;left:4.5px;top:11px;width:6px;height:3.5px;
  border-left:1.7px solid var(--bar-4);border-bottom:1.7px solid var(--bar-4);
  transform:rotate(-45deg);
}

/* F&O mandatory risk box */
.gm-warn{
  background:#FEF3F2;border:1px solid #FECDCA;border-radius:10px;
  color:#B42318;
}


/* ==========================================================================
   9. METHODOLOGY — 10 steps (PASTE as one HTML widget, real <ol>)
   Top borders use BRIGHT bars (decoration).
   Numeral badges use DARKENED fills (white text sits on them).
   ========================================================================== */
.flow{list-style:none;margin:0;padding:0}
.step{
  background:#fff;border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--sh);position:relative;overflow:hidden;text-align:center;
  transition:transform var(--ease),box-shadow var(--ease);
}
.step:hover{transform:translateY(-5px);box-shadow:var(--sh-lg)}
.step::before{content:"";position:absolute;top:0;left:0;right:0;height:3px}

.gm-step-1::before {background:#1F4FBF}
.gm-step-2::before {background:#1A5CC0}
.gm-step-3::before {background:#1569C2}
.gm-step-4::before {background:#0E7CC4}
.gm-step-5::before {background:#0A8FBA}
.gm-step-6::before {background:#0AA9AC}
.gm-step-7::before {background:#0AAA9C}
.gm-step-8::before {background:#0DA78C}
.gm-step-9::before {background:#0FA37A}
.gm-step-10::before{background:#12A06C}

.step__n{
  width:34px;height:34px;border-radius:50%;margin:0 auto 13px;
  color:#fff;font-weight:800;display:grid;place-items:center;
}
/* Darkened so white-on-fill clears 4.5:1. Calculated, not eyeballed. */
.gm-step-1  .step__n{background:#1F4EBF}   /* 7.2:1 */
.gm-step-2  .step__n{background:#1A5AB8}   /* 6.3:1 */
.gm-step-3  .step__n{background:#1467AC}   /* 5.5:1 */
.gm-step-4  .step__n{background:#0E7BC4}   /* 4.5:1 */
.gm-step-5  .step__n{background:#09819F}   /* 4.6:1 */
.gm-step-6  .step__n{background:#078386}   /* 4.6:1 */
.gm-step-7  .step__n{background:#088179}   /* 4.7:1 */
.gm-step-8  .step__n{background:#0A836E}   /* 4.7:1 */
.gm-step-9  .step__n{background:#0C8564}   /* 4.6:1 */
.gm-step-10 .step__n{background:#0E845A}   /* 4.7:1 */


/* ==========================================================================
   10. CAROUSEL TRACK
   ========================================================================== */
.track{
  display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;
}
.track::-webkit-scrollbar{display:none}
.track > *{scroll-snap-align:start;flex:0 0 300px}

@media(max-width:680px){
  .track > *{flex:0 0 84vw}
}

.arrows button{
  width:46px;height:46px;border-radius:50%;
  border:1px solid var(--border);background:#fff;cursor:pointer;
  display:grid;place-items:center;color:var(--navy);
  box-shadow:var(--sh);transition:all var(--ease);
}
.arrows button:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}


/* ==========================================================================
   11. ABOUT / NEVER-EXPECT / SOCIAL
   ========================================================================== */
.about__img{position:relative;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-lg)}
.about__img::before{
  content:"";position:absolute;top:0;left:0;right:0;height:5px;
  background:var(--growth);z-index:2;
}
.about__badge{
  position:absolute;right:-14px;bottom:30px;z-index:3;
  background:var(--gold-grad);color:var(--navy);
  border-radius:var(--r);box-shadow:var(--sh-gold);text-align:center;
}
.about__reg{
  background:var(--cream);
  border-left:4px solid transparent;border-image:var(--growth) 1;
}

/* Never-expect glass cards on navy */
.nev__c{
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:var(--r-lg);position:relative;overflow:hidden;
  transition:all var(--ease);
}
.nev__c::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:var(--gold-grad);transform:scaleX(0);transform-origin:left;
  transition:transform 320ms ease;
}
.nev__c:hover{background:rgba(217,160,43,.09);border-color:var(--gold);transform:translateY(-4px)}
.nev__c:hover::before{transform:scaleX(1)}

.soc{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r);text-decoration:none;transition:all var(--ease);
}
.soc:hover{background:rgba(217,160,43,.14);border-color:var(--gold);transform:translateY(-5px)}


/* ==========================================================================
   12. FAQ — Elementor Accordion
   Add class gm-faq to the Accordion widget.
   The <details> rules at the end apply ONLY to the HTML-widget fallback.
   ========================================================================== */
.gm-faq .elementor-accordion-item{
  background:#fff;border:1px solid var(--border);border-radius:var(--r);
  box-shadow:var(--sh);margin-bottom:16px;overflow:hidden;
}
.gm-faq .elementor-tab-title{color:var(--navy);font-weight:700}
.gm-faq .elementor-tab-title.elementor-active{color:var(--gold-text)}
.gm-faq .elementor-active .elementor-accordion-icon{color:var(--gold-dk)}

/* --- FALLBACK ONLY: native <details> if the Accordion ARIA fails QA --- */
.fq{background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:var(--sh)}
.fq[open]{border-color:var(--gold);box-shadow:var(--sh-lg)}
.fq summary{display:flex;align-items:center;gap:13px;cursor:pointer;list-style:none}
.fq summary::-webkit-details-marker{display:none}
.fq[open] .fq__ch{transform:rotate(180deg)}
.fq__ch{transition:transform var(--ease)}


/* ==========================================================================
   13. CTA BAND + FOOTER
   ========================================================================== */
.band{background:var(--gold-grad);position:relative;overflow:hidden}
.band::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(600px 340px at 88% 20%,rgba(255,255,255,.28),transparent 62%);
}
.band::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:5px;
  background:var(--growth);
}
.band h2{color:var(--navy)}
.band p{color:rgba(10,27,51,.74)}

.foot{
  background:var(--navy-deep);color:rgba(255,255,255,.62);
  border-top:4px solid transparent;border-image:var(--growth) 1;
}
.foot h4{color:var(--gold-lt);font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.foot a{color:rgba(255,255,255,.62);text-decoration:none;transition:color var(--ease)}
.foot a:hover{color:var(--gold-lt)}

.fcred{border-top:1px solid rgba(217,160,43,.32);color:#fff}
.fcred b{color:var(--gold-lt);font-weight:800}

/* Legal block. 0.8125rem MINIMUM — these disclosures exist to be read. */
.flegal{
  border-top:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.46);
  font-size:.8125rem;line-height:1.8;
}
.flegal b{color:rgba(255,255,255,.76);font-weight:700}

.fsoc a{
  width:38px;height:38px;border-radius:11px;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);
  transition:all var(--ease);
}
.fsoc a:hover{background:var(--gold);border-color:var(--gold);transform:translateY(-3px)}
.fsoc a:hover svg{color:var(--navy)}
.fsoc svg{color:#fff;transition:color var(--ease)}


/* ==========================================================================
   14. COMPLIANCE PAGES — single-compliance.php
   ========================================================================== */
.gm-legal__head{background:var(--grey);position:relative;padding-block:56px}
.gm-legal__head::before{
  content:"";position:absolute;top:0;left:0;right:0;height:4px;
  background:var(--growth);
}
.gm-crumbs{color:var(--muted);font-size:.875rem}
.gm-legal__updated{color:var(--muted);font-size:.875rem}

.gm-legal__body{
  max-width:var(--wrap);margin-inline:auto;padding:64px 28px;
  display:grid;grid-template-columns:240px 1fr;gap:64px;align-items:start;
}

/* Offsets derive from --gm-header-h so changing the header updates both. */
.gm-legal__toc{position:sticky;top:calc(var(--gm-header-h) + 28px)}
.gm-legal__toc ul{list-style:none;margin:0;padding:0}
.gm-legal__toc a{
  display:block;padding:7px 0 7px 14px;
  border-left:2px solid var(--border);
  color:var(--muted);text-decoration:none;font-size:.875rem;
}
.gm-legal__toc a:hover{color:var(--navy)}
.gm-legal__toc a.is-active{
  border-left-color:var(--gold);color:var(--navy);font-weight:600;
}

.gm-legal__content{max-width:760px;line-height:1.8}
.gm-legal__content h2{
  margin:48px 0 16px;
  scroll-margin-top:calc(var(--gm-header-h) + 28px);
}
.gm-legal__content a{color:var(--gold-text);text-decoration:underline}
.gm-legal__content ul,.gm-legal__content ol{padding-left:1.25rem}
.gm-legal__content li{margin-bottom:.5rem}

/* Group accent — class set on <main> from the ACF gm_group value */
.gm-group-regulatory .gm-legal__head::before{background:var(--bar-1)}
.gm-group-risk       .gm-legal__head::before{background:var(--bar-3)}
.gm-group-policies   .gm-legal__head::before{background:var(--bar-4)}

.gm-legal__escalation{background:var(--navy);color:#fff}
.gm-legal__escalation a{color:var(--gold-lt)}

/* Placeholder banner — shown while gm_status = placeholder */
.gm-placeholder{
  background:#FEF3F2;border:1px solid #FECDCA;border-radius:10px;
  padding:14px 18px;margin-bottom:28px;color:#B42318;
}

@media(max-width:1080px){
  .gm-legal__body{grid-template-columns:1fr;gap:32px}
  .gm-legal__toc{position:static}
}


/* ==========================================================================
   15. UTILITIES
   ========================================================================== */
.gm-visually-hidden{
  position:absolute!important;width:1px;height:1px;
  padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}

/* Print: drop chrome, keep the legal copy readable */
@media print{
  .statbar,.nav,.gm-mega-panel,.gm-legal__toc,.band,.wa,
  .gm-a11y-panel,.gm-overlay,.gm-reading-guide{display:none!important}
  .gm-legal__body{grid-template-columns:1fr;padding:0}
  .gm-legal__content{max-width:none}
  a[href^="http"]::after{content:" (" attr(href) ")";font-size:.75em;color:#555}
}