/* ============================================================================
   Cash Train — modern fintech lender theme  (ground-up rebuild 2026-06-29)
   Light, trustworthy, conversion-first. Built ON vendored Bootstrap 5.3.3.
   Brand green/gold as accents on a near-white canvas. Neutral shadows only
   (no coloured glows). CONTENT IS VISIBLE BY DEFAULT — nothing gated behind
   scroll animation. These tokens supersede the old dark brand.css theme.
   ========================================================================== */

:root{
  --ctn-green:#176a45; --ctn-green-deep:#0e3f2a; --ctn-green-ink:#0c2d1f; --ctn-green-700:#115538;
  --ctn-gold:#e6c057; --ctn-gold-deep:#80620b;
  --ctn-ink:#16221c; --ctn-muted:#586a61; --ctn-faint:#5f6963;
  --ctn-line:#e3ebe7; --ctn-line-strong:#cdd9d2;
  --ctn-bg:#ffffff; --ctn-bg-soft:#f4f8f6; --ctn-bg-mint:#eaf3ee; --ctn-bg-ink:#0c2d1f;
  --ctn-radius:16px; --ctn-radius-sm:11px; --ctn-radius-pill:999px;
  --ctn-shadow-sm:0 1px 2px rgba(12,45,31,.06),0 2px 6px rgba(12,45,31,.05);
  --ctn-shadow:0 4px 14px rgba(12,45,31,.07),0 14px 32px -14px rgba(12,45,31,.16);
  --ctn-shadow-lg:0 10px 28px rgba(12,45,31,.10),0 30px 64px -22px rgba(12,45,31,.22);
  --ctn-sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --ctn-display:'Montserrat',var(--ctn-sans);

  /* 8px-base spacing scale (design-elevation 2026-06-29) */
  --ctn-space-xs:.5rem;   /* 8  */
  --ctn-space-sm:1rem;    /* 16 */
  --ctn-space-md:1.5rem;  /* 24 */
  --ctn-space-lg:2rem;    /* 32 */
  --ctn-space-xl:2.75rem; /* 44 */
  --ctn-space-2xl:3.5rem; /* 56 */
  --ctn-space-3xl:5rem;   /* 80 */
  /* fluid gutters — one knob for all grid gaps + page inline padding */
  --ctn-gutter:clamp(1rem,3vw,2rem);    /* 16 -> 32 */
  --ctn-page-pad:clamp(16px,4vw,28px);  /* page inline padding */
  /* breakpoint reference (docs only; media queries use literals):
     xs 360 · sm 480 · md 600 · lg 768 · xl 991 · 2xl 1200 */
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body.ct-body{margin:0;font-family:var(--ctn-sans);color:var(--ctn-ink);background:var(--ctn-bg);
  font-size:1.0625rem;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto}
h1,h2,h3,h4,h5,h6{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-weight:800;line-height:1.14;letter-spacing:-.02em;margin:0 0 .5em}
h1{font-size:clamp(2.3rem,1.7rem+2.7vw,3.6rem)}
h2{font-size:clamp(1.75rem,1.3rem+1.9vw,2.6rem)}
h3{font-size:1.3rem}
p{margin:0 0 1rem}
a{color:var(--ctn-green);text-decoration:none}
a:hover{color:var(--ctn-green-deep);text-decoration:underline}
.ct-container{max-width:1160px;margin-inline:auto;padding-inline:var(--ctn-page-pad)}
.ct-muted{color:var(--ctn-muted)}
.ct-lead{font-size:1.2rem;color:var(--ctn-muted);line-height:1.6}
.ct-eyebrow{display:inline-flex;align-items:center;gap:.5em;font-family:var(--ctn-sans);font-weight:700;
  font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ctn-gold-deep)}
.ct-section{padding:clamp(36px,7vw,104px) 0}
.ct-section-soft{background:var(--ctn-bg-soft)}
.ct-section-mint{background:var(--ctn-bg-mint)}
.ct-section-ink{background:var(--ctn-bg-ink);color:#dfeae3}
.ct-section-ink h1,.ct-section-ink h2,.ct-section-ink h3{color:#fff}
.ct-section-head{max-width:62ch;margin:0 auto clamp(24px,4vw,56px);text-align:center}
.ct-section-head p{color:var(--ctn-muted);font-size:1.12rem;margin-top:.4rem}

/* ---- buttons ---- */
.ct-btn,.ct-btn-green,.ct-btn-ghost,.ct-btn-outline{display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  font-family:var(--ctn-display);font-weight:700;font-size:1.02rem;line-height:1;padding:.95em 1.7em;
  border-radius:var(--ctn-radius-pill);border:1.5px solid transparent;cursor:pointer;
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease;text-decoration:none}
.ct-btn{background:var(--ctn-gold);color:#3c2c06;box-shadow:var(--ctn-shadow-sm)}
.ct-btn:hover{color:#3c2c06;transform:translateY(-2px);box-shadow:var(--ctn-shadow);background:#edcb6a;text-decoration:none}
.ct-btn-green{background:var(--ctn-green);color:#fff}
.ct-btn-green:hover{background:var(--ctn-green-deep);color:#fff;transform:translateY(-2px);box-shadow:var(--ctn-shadow);text-decoration:none}
.ct-btn-ghost,.ct-btn-outline{background:transparent;color:var(--ctn-green);border-color:var(--ctn-line-strong)}
.ct-btn-ghost:hover,.ct-btn-outline:hover{border-color:var(--ctn-green);color:var(--ctn-green-deep);background:var(--ctn-bg-soft);text-decoration:none}
.ct-btn-lg{font-size:1.12rem;padding:1.05em 2.1em}
.ct-btn-block{width:100%}

/* ---- warning bar ---- */
.ct-warning-bar{background:#fbf3d6;color:#5c4708;border-bottom:1px solid #f0e2ac;font-size:.86rem}
.ct-warning-bar .container,.ct-warning-bar .ct-container{padding-block:.55rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center;text-align:center}
.ct-warning-bar a{color:#7a5e08;text-decoration:underline;font-weight:600}

/* ---- navbar ---- */
.ct-site-header{position:sticky;top:0;z-index:1030}
.ct-navbar{background:rgba(255,255,255,.93);backdrop-filter:saturate(1.5) blur(12px);-webkit-backdrop-filter:saturate(1.5) blur(12px);border-bottom:1px solid var(--ctn-line)}
.ct-navbar .container,.ct-navbar .ct-container{display:flex;align-items:center;gap:1.25rem;min-height:74px}
.ct-brand-lockup{display:inline-flex;align-items:center;gap:.6rem}
.ct-brand-lockup .ct-nav-wordmark{height:30px;width:auto}
.ct-brand-lockup .ct-nav-icon{height:36px;width:36px}
.ct-nav-links{display:flex;align-items:center;gap:.25rem;list-style:none;margin:0 auto;padding:0}
.ct-nav-links .nav-link,.ct-nav-links a{display:inline-block;padding:.55rem .8rem;border-radius:9px;color:var(--ctn-ink);font-weight:600;font-size:.97rem}
.ct-nav-links a:hover{background:var(--ctn-bg-soft);color:var(--ctn-green-deep);text-decoration:none}
.ct-nav-links a.active{color:var(--ctn-green)}
.ct-nav-collapse{display:flex;align-items:center;gap:1.4rem;flex:1}
.ct-nav-actions{display:flex;align-items:center;gap:.6rem}
.ct-nav-toggle,.ct-toggler{display:none;background:none;border:1.5px solid var(--ctn-line-strong);border-radius:10px;width:46px;height:42px;color:var(--ctn-green-ink);font-size:1.2rem;cursor:pointer}
@media (max-width:991px){
  .ct-nav-toggle,.ct-toggler{display:inline-flex;align-items:center;justify-content:center}
  .ct-nav-collapse{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid var(--ctn-line);box-shadow:var(--ctn-shadow);padding:1rem clamp(18px,4vw,32px) 1.4rem}
  .ct-nav-collapse.open{display:block}
  .ct-nav-links{flex-direction:column;align-items:stretch;gap:.1rem;margin:0 0 1rem}
  .ct-nav-actions{flex-direction:column;align-items:stretch}
}

/* ---- hero ---- */
.ct-hero{position:relative;background:radial-gradient(120% 80% at 88% -10%,var(--ctn-bg-mint),transparent 60%),linear-gradient(180deg,#fff 0%,var(--ctn-bg-soft) 100%);padding:clamp(40px,6vw,88px) 0 clamp(44px,7vw,96px);overflow:hidden}
.ct-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,4vw,56px);align-items:center}
.ct-hero h1{margin-bottom:.45em}
.ct-hero .ct-lead{max-width:34ch}
.ct-hero-points{list-style:none;padding:0;margin:1.4rem 0 1.8rem;display:grid;gap:.6rem}
.ct-hero-points li{display:flex;align-items:flex-start;gap:.6rem;font-weight:500}
.ct-hero-points i{color:var(--ctn-green);margin-top:.18rem}
.ct-hero-cta{display:flex;gap:.8rem;flex-wrap:wrap}
.ct-hero-trust{margin-top:1.6rem;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;color:var(--ctn-faint);font-size:.85rem}

/* quote / calculator card */
.ct-quote-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-lg);padding:clamp(22px,3vw,32px)}
.ct-quote-card h2{font-size:1.25rem;margin-bottom:.2rem}
.ct-quote-row{margin:clamp(1rem,2vw,1.4rem) 0}
.ct-quote-row label{display:flex;justify-content:space-between;font-weight:600;font-size:.92rem;color:var(--ctn-muted);margin-bottom:.4rem}
.ct-quote-row label b{color:var(--ctn-green-ink);font-size:1.05rem}
.ct-quote-card input[type=range]{width:100%;accent-color:var(--ctn-green)}
.ct-quote-out{display:grid;grid-template-columns:1fr 1fr;gap:clamp(.5rem,2vw,.8rem);margin:1.1rem 0}
.ct-quote-out .o{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm);padding:.85rem 1rem}
.ct-quote-out .o span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ctn-faint)}
.ct-quote-out .o b{font-family:var(--ctn-display);font-size:1.35rem;color:var(--ctn-green-ink)}
.ct-quote-note{font-size:.74rem;color:var(--ctn-faint);margin:.6rem 0 0}

/* ---- product tiers ---- */
.ct-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ctn-gutter);align-items:stretch}
.ct-tier{position:relative;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:clamp(1.2rem,3vw,1.7rem);box-shadow:var(--ctn-shadow-sm);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease;contain:layout style}
.ct-tier:hover{transform:translateY(-4px);box-shadow:var(--ctn-shadow)}
.ct-tier--featured{border-color:var(--ctn-green);box-shadow:var(--ctn-shadow)}
.ct-tier__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--ctn-green);color:#fff;font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.32em 1em;border-radius:var(--ctn-radius-pill)}
.ct-tier__icon{width:46px;height:46px;border-radius:12px;background:var(--ctn-bg-mint);color:var(--ctn-green);display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:1rem}
.ct-tier h3{margin-bottom:.15rem}
.ct-tier__range{font-family:var(--ctn-display);font-size:1.7rem;font-weight:800;color:var(--ctn-green-ink)}
.ct-tier__term{color:var(--ctn-muted);font-size:.9rem;margin-bottom:.8rem}
.ct-tier__tagline{color:var(--ctn-muted);font-size:.95rem;flex-grow:1}
.ct-tier__apr{font-size:.82rem;color:var(--ctn-faint);margin:.9rem 0 1.1rem}

/* ---- steps ---- */
.ct-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ctn-gutter)}
.ct-step__num{font-family:var(--ctn-display);font-size:2.4rem;font-weight:800;color:var(--ctn-gold);line-height:1}
.ct-step__icon{color:var(--ctn-green);font-size:1.15rem;margin:.2rem 0 .6rem}
.ct-step h3{font-size:1.2rem}
.ct-step p{color:var(--ctn-muted);margin:0}

/* ---- trust band ---- */
.ct-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(1rem,2.5vw,1.6rem);text-align:center}
.ct-trust .t i{font-size:1.6rem;color:var(--ctn-green);margin-bottom:.5rem}
.ct-trust .t b{display:block;font-family:var(--ctn-display);color:var(--ctn-green-ink)}
.ct-trust .t span{font-size:.88rem;color:var(--ctn-muted)}

/* ---- FAQ accordion (themes Bootstrap .accordion) ---- */
.ct-faq{max-width:780px;margin-inline:auto}
.ct-faq .accordion-item{border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm)!important;margin-bottom:.7rem;overflow:hidden;background:#fff}
.ct-faq .accordion-button{font-family:var(--ctn-display);font-weight:700;color:var(--ctn-green-ink);font-size:1.02rem;background:#fff;box-shadow:none;padding:1.1rem 1.2rem}
.ct-faq .accordion-button:not(.collapsed){color:var(--ctn-green);background:var(--ctn-bg-soft)}
.ct-faq .accordion-button:focus{box-shadow:0 0 0 .2rem rgba(23,106,69,.18)}
.ct-faq .accordion-body{color:var(--ctn-muted);padding:0 1.2rem 1.2rem}

/* ---- CTA band ---- */
.ct-cta-band{background:linear-gradient(120deg,var(--ctn-green-ink),var(--ctn-green-deep));color:#fff;border-radius:var(--ctn-radius);padding:clamp(34px,5vw,60px);text-align:center}
.ct-cta-band h2{color:#fff;margin-bottom:.4rem}
.ct-cta-band p{color:#bcd6c9;max-width:54ch;margin-inline:auto}

/* ---- footer ---- */
.ct-footer{background:var(--ctn-bg-ink);color:#aec3b8;padding:clamp(48px,6vw,72px) 0 28px;font-size:.92rem}
.ct-footer a{color:#cfe0d7}
.ct-footer a:hover{color:#fff}
.ct-footer-heading{font-family:var(--ctn-display);color:#fff;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .9rem}
.ct-footer-links{list-style:none;padding:0;margin:0}
.ct-footer-links li{margin:.45rem 0}
.ct-footer-tagline{color:#9fb6ab;max-width:34ch}
.ct-footer-powered{color:#8aa298;font-size:.85rem}
.ct-footer-link{color:#cfe0d7}
.ct-lockup{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}
.ct-social-links a{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.14);border-radius:10px;margin-right:.5rem;color:#cfe0d7}
.ct-social-links a:hover{background:rgba(255,255,255,.08);color:#fff;text-decoration:none}
.ct-rep-example-band{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:var(--ctn-radius-sm);padding:1rem 1.2rem;font-size:.84rem;color:#bcd0c6;margin:1.6rem 0}
.ct-rep-example-band strong{color:#fff}
.ct-footer-divider{border:0;border-top:1px solid rgba(255,255,255,.12);margin:1.6rem 0}
.ct-footer-bottom{font-size:.79rem;color:#8aa298}
.ct-footer-bottom strong{color:#cfe0d7}
.ct-footer-copy{margin-top:.8rem}

/* ---- cookie banner ---- */
.ct-cookie-banner{position:fixed;left:1rem;right:1rem;bottom:1rem;z-index:1080;max-width:560px;margin-inline:auto;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-lg);padding:1.1rem 1.3rem}
.ct-cookie-inner p{font-size:.86rem;color:var(--ctn-muted);margin:0 0 .7rem}
.ct-cookie-btns{display:flex;gap:.6rem}
.ct-btn-outline{padding:.55em 1.1em;font-size:.9rem}

/* ---- utilities ---- */
.ct-pill{display:inline-flex;align-items:center;gap:.4em;background:var(--ctn-bg-mint);color:var(--ctn-green-deep);font-weight:600;font-size:.82rem;padding:.35em .9em;border-radius:var(--ctn-radius-pill)}
.ct-gold-text{color:var(--ctn-gold-deep)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ============================================================================
   DESKTOP RECOMPOSE (2026-06-29) — additive min-width tiers only.
   This file is MOBILE-FIRST: all rules above (base + max-width blocks) define
   mobile→tablet and are FROZEN. Nothing below applies under 1200px, so every
   computed value at 360/768/1024px is byte-identical to before. These blocks
   only recover the wide-screen estate: widen the 1160px container, balance the
   hero, calm over-tall desktop section padding, and let centred copy track the
   wider column instead of reading as a thin ribbon in a sea of dead margin.
   ========================================================================== */

/* ---- ≥1200px: open the column past Bootstrap/1160 + compose the grids ---- */
@media (min-width:1200px){
  .ct-container{max-width:1240px}
  /* hero: give the copy a touch more room, keep the card column balanced */
  .ct-hero-grid{grid-template-columns:1.08fr .92fr;gap:clamp(40px,4vw,64px)}
  .ct-hero .ct-lead{max-width:38ch}
  /* centred intro/copy widths grew with the wider container — widen the caps
     so headings/ledes don't read as a narrow ribbon (mobile caps untouched) */
  .ct-section-head{max-width:72ch}
  .ct-cta-band p{max-width:62ch}
  /* "Why Cash Train" Bootstrap 4-up: tighten the gutter at this width */
  .ct-tiers{gap:1.6rem}
  .ct-steps{gap:2rem}
}

/* ---- ≥1440px: use the real width; the ceiling-capped type was stranded ---- */
@media (min-width:1440px){
  .ct-container{max-width:1340px}
  /* lift hero spacing so the band breathes proportionally on a wide window */
  .ct-hero{padding:clamp(64px,6vw,104px) 0 clamp(72px,7vw,112px)}
  /* trust band + section heads can run a little wider at this size */
  .ct-section-head{max-width:74ch}
  .ct-faq{max-width:880px}
  .ct-cta-band{padding:clamp(48px,5vw,72px)}
  .ct-tiers{gap:1.9rem}
}

/* ---- ≥1700px: widest tier — let the layout fill ultra-wide displays ---- */
@media (min-width:1700px){
  .ct-container{max-width:1440px}
  /* nudge hero headline up at very large sizes (still well under any reflow) */
  .ct-hero h1{font-size:clamp(3.6rem,2vw+2.8rem,4rem)}
  .ct-section-head{max-width:78ch}
}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ============================================================================
   LEGACY COMPATIBILITY LAYER  (append-only, 2026-06-29)
   ----------------------------------------------------------------------------
   The home page + shared chrome above are rebuilt to the modern light theme.
   The content long-tail (guides/*, loans/* articles, rates, how-it-works,
   eligibility, search, about, responsible-lending, legal, lp/*, 404) still
   ships the OLD dark "cashtrain" class names and inline var(--ct-*) refs that
   the previous dark stylesheet supplied. That stylesheet is gone, so on the
   new white canvas those pages would render cream-on-white (invisible) inside
   transparent dark "glass" panels with coloured drop-glows.

   This block re-themes ONLY legacy classes/tokens for the new LIGHT theme:
   dark glass/surfaces -> white cards w/ --ctn-line borders + neutral shadow;
   coloured glows -> neutral shadows; cream-on-green text -> ink-on-white;
   bright-gold inline text -> readable --ctn-gold-deep. It defines nothing that
   the modern layer already owns, so the rebuilt classes above are untouched.
   Append only; remove rules here as each page is individually rebuilt.
   ========================================================================== */

/* ---- 1. re-point legacy DESIGN TOKENS to light-theme values --------------
   ~3,700 inline `color:var(--ct-text*)` / `background:var(--ct-gold-*)` refs
   live in the long-tail markup. Re-pointing the tokens fixes them in bulk.
   These were cream/transparent on the old dark theme -> now dark on white. */
:root{
  /* text scale: was cream-on-green -> now ink-on-white */
  --ct-text:           var(--ctn-ink);
  --ct-text-base:      var(--ctn-ink);
  --ct-text-primary:   var(--ctn-ink);
  --ct-text-secondary: var(--ctn-muted);
  --ct-text-muted:     var(--ctn-muted);
  --ct-text-faint:     var(--ctn-faint);
  --ct-text-dark:      var(--ctn-ink);
  /* gold used as INLINE TEXT must read on white -> deep gold, not #e6c057 */
  --ct-gold:           var(--ctn-gold-deep);
  --ct-gold-mid:       var(--ctn-gold-deep);
  --ct-gold-light:     var(--ctn-gold);
  --ct-gold-rgb:       169,129,15;            /* matches --ctn-gold-deep */
  /* lines / surfaces */
  --ct-border:         var(--ctn-line);
  --ct-green:          var(--ctn-green);
  --ct-green-deep:     var(--ctn-green-deep);
  --ct-ink:            var(--ctn-ink);
  --ct-cream:          var(--ctn-bg-soft);
  --ct-cream-light:    var(--ctn-bg);
  /* soft tint fills that legacy markup drops behind icons / chips / visuals */
  --ct-gold-faint:     var(--ctn-bg-mint);
  --ct-gold-dim:       var(--ctn-line-strong);
  --ct-gold-dark:      var(--ctn-gold-deep);
  --ct-glass-bg:       var(--ctn-bg-soft);
  --ct-surface-1:      var(--ctn-bg-soft);
  --ct-surface-2:      var(--ctn-bg-mint);
  --ct-bg-card-alt:    var(--ctn-bg-soft);
  /* glass borders -> hairline neutral */
  --ct-glass-border:   var(--ctn-line);
  --ct-glass-border-hi:var(--ctn-line-strong);
  /* deprecated coloured glows -> neutral shadows */
  --ct-glow-green-sm:  var(--ctn-shadow-sm);
  --ct-glow-green-md:  var(--ctn-shadow);
  --ct-glow-green-lg:  var(--ctn-shadow-lg);
  --ct-glow-gold-sm:   var(--ctn-shadow-sm);
  --ct-glow-gold-md:   var(--ctn-shadow);
  --ct-glow-gold-card: var(--ctn-shadow);
  --ct-shadow-card:    var(--ctn-shadow-sm);
  --ct-shadow-raised:  var(--ctn-shadow);
  --ct-shadow-float:   var(--ctn-shadow-lg);
  /* radii used inline */
  --ct-radius:         var(--ctn-radius);
  --ct-radius-sm:      var(--ctn-radius-sm);
  --ct-radius-md:      var(--ctn-radius);
  --ct-radius-lg:      var(--ctn-radius);
}

/* ---- 2. legacy PAGE HERO (dark banner -> light mint band) ---------------- */
.ct-page-hero{background:radial-gradient(120% 80% at 88% -10%,var(--ctn-bg-mint),transparent 60%),linear-gradient(180deg,#fff 0%,var(--ctn-bg-soft) 100%);
  padding:clamp(44px,6vw,84px) 0 clamp(40px,5vw,64px);text-align:center;border-bottom:1px solid var(--ctn-line)}
.ct-page-hero h1{margin:.4rem 0 .5rem}
.ct-page-hero>.container>p,.ct-page-hero p{color:var(--ctn-muted);max-width:62ch;margin-inline:auto}
.ct-hero-title{color:var(--ctn-green-ink)}
.ct-hero-subtitle{color:var(--ctn-muted);font-size:1.12rem;max-width:62ch;margin-inline:auto}
.ct-hero-chip{display:inline-flex;align-items:center;gap:.45em;background:var(--ctn-bg-mint);color:var(--ctn-green-deep);
  font-weight:600;font-size:.82rem;padding:.35em .9em;border-radius:var(--ctn-radius-pill);margin-bottom:.9rem}

/* ---- 3. legacy SECTION variants (dark fills -> light surfaces) ----------- */
.ct-section-alt,.ct-section--alt,.ct-section-mid,.ct-section-deep{background:var(--ctn-bg-soft)}
.ct-section-vivid{background:var(--ctn-bg-mint)}
.ct-section-light{background:var(--ctn-bg)}
.ct-section-sm{padding:clamp(40px,5vw,64px) 0}
/* legacy dark sections forced their own light text — restore ink on white */
.ct-section-alt,.ct-section--alt,.ct-section-mid,.ct-section-deep,.ct-section-vivid,.ct-section-light{color:var(--ctn-ink)}
.ct-section-intro{color:var(--ctn-muted);max-width:65ch}
/* eyebrow/kicker + subtitle/title share the modern .ct-eyebrow idiom */
.ct-section-kicker{display:inline-flex;align-items:center;gap:.5em;font-family:var(--ctn-sans);font-weight:700;
  font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ctn-gold-deep)}
.ct-section-title{color:var(--ctn-green-ink)}
.ct-section-subtitle{color:var(--ctn-muted);font-size:1.12rem}

/* ---- 4. legacy GLASS / RAISED surfaces (dark glass -> white card) -------- */
.ct-glass,.ct-glass-deep,.ct-card-raised,.ct-panel,.ct-surface-1,.ct-surface-2{
  background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink)}
.ct-glass-deep{box-shadow:var(--ctn-shadow)}
.ct-card-raised{box-shadow:var(--ctn-shadow)}
/* legacy content blocks used .ct-glass[-deep] as a bare prose container w/o
   utility padding — give them comfortable padding so text isn't edge-to-edge */
.ct-glass,.ct-glass-deep{padding:clamp(1.1rem,2.4vw,1.8rem)}
.ct-glass.p-2,.ct-glass.p-3,.ct-glass.p-4,.ct-glass.p-5,
.ct-glass-deep.p-2,.ct-glass-deep.p-3,.ct-glass-deep.p-4,.ct-glass-deep.p-5{padding:revert}
.ct-glass-deep h2,.ct-glass h2,.ct-card-raised h2,
.ct-glass-deep h3,.ct-glass h3,.ct-card-raised h3{color:var(--ctn-green-ink)}
.ct-glass p,.ct-glass-deep p{color:var(--ctn-ink)}

/* ---- 5. legacy CHIPS / PILLS / TAG + FILTER buttons ---------------------- */
.ct-chip{display:inline-flex;align-items:center;gap:.4em;background:var(--ctn-bg-mint);color:var(--ctn-green-deep);
  font-weight:600;font-size:.82rem;padding:.4em .95em;border-radius:var(--ctn-radius-pill);border:1px solid transparent;line-height:1}
button.ct-chip,.ct-guide-filter,.ct-tag-btn{cursor:pointer;font-family:var(--ctn-sans)}
.ct-guide-filter[aria-pressed=true],.ct-tag-btn.active,.ct-chip.active{background:var(--ctn-green);color:#fff}
.ct-guide-filter-count{opacity:.65;font-weight:700;margin-left:.15em}
.ct-card-tag{background:var(--ctn-bg-soft);color:var(--ctn-muted);border:1px solid var(--ctn-line)}
.ct-link-btn{background:none;border:0;color:var(--ctn-green);font-weight:600;text-decoration:underline;cursor:pointer;padding:0}

/* ---- 6. legacy BREADCRUMB ------------------------------------------------ */
.ct-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;font-size:.85rem;color:var(--ctn-faint);margin-bottom:1rem}
.ct-breadcrumb a{color:var(--ctn-muted);font-weight:600}
.ct-breadcrumb a:hover{color:var(--ctn-green)}
.ct-breadcrumb-sep{color:var(--ctn-faint);margin:0 .15rem}
.ct-breadcrumb .breadcrumb{margin:0;padding:0;background:none;font-size:.85rem}
.ct-breadcrumb .breadcrumb-item,.ct-breadcrumb .breadcrumb-item a{color:var(--ctn-muted)}
.ct-breadcrumb .breadcrumb-item.active{color:var(--ctn-faint)}

/* ---- 7. legacy ICON CHIPS (product/step/gold) --------------------------- */
.ct-product-icon{width:46px;height:46px;border-radius:12px;background:var(--ctn-bg-mint);color:var(--ctn-green);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem}
.ct-step-icon{color:var(--ctn-green);font-size:1.3rem}
.ct-icon-gold{color:var(--ctn-gold-deep)}

/* ---- 8. legacy PRODUCT CARDS (two idioms) -------------------------------- */
/* idiom A: rates page — .ct-card-raised.ct-product-card + .highlight */
.ct-products-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem;align-items:stretch}
@media (max-width:860px){.ct-products-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}}
.ct-product-card{position:relative;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  padding:1.7rem 1.6rem;box-shadow:var(--ctn-shadow-sm);display:flex;flex-direction:column;color:var(--ctn-ink)}
.ct-product-card.highlight,.ct-product-card--highlight{border-color:var(--ctn-green);box-shadow:var(--ctn-shadow)}
.ct-product-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--ctn-green);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.32em 1em;border-radius:var(--ctn-radius-pill)}
.ct-product-amount,.ct-product-range{font-family:var(--ctn-display);font-size:1.7rem;font-weight:800;color:var(--ctn-green-ink)}
.ct-product-name{font-family:var(--ctn-display);color:var(--ctn-green-ink)}
.ct-product-factor{color:var(--ctn-muted);font-size:.9rem;margin-bottom:.6rem}
.ct-product-cta{margin-top:auto;padding-top:1rem}
/* idiom B: city/purpose pages — BEM .ct-product-card__* */
.ct-product-card__header{margin-bottom:.6rem}
.ct-product-card__name{font-family:var(--ctn-display);color:var(--ctn-green-ink);margin-bottom:.2rem}
.ct-product-card__range{font-family:var(--ctn-display);font-size:1.5rem;font-weight:800;color:var(--ctn-green-ink);margin:0}
.ct-product-card__term{color:var(--ctn-muted);font-size:.9rem;margin:.1rem 0 0}
.ct-product-card__body{flex-grow:1;color:var(--ctn-ink)}
.ct-product-card__footer{margin-top:auto;padding-top:1rem}

/* ---- 9. legacy TIER CARDS (.ct-tier-card BEM) ---------------------------- */
.ct-tier-card{position:relative;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  padding:1.7rem 1.6rem;box-shadow:var(--ctn-shadow-sm);display:flex;flex-direction:column;height:100%;color:var(--ctn-ink)}
.ct-tier-card--featured{border-color:var(--ctn-green);box-shadow:var(--ctn-shadow)}
.ct-tier-card__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--ctn-green);color:#fff;
  font-size:.7rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.32em 1em;border-radius:var(--ctn-radius-pill)}
.ct-tier-card__name{font-family:var(--ctn-display);color:var(--ctn-green-ink);margin-bottom:.2rem}
.ct-tier-card__amount{font-family:var(--ctn-display);font-size:1.5rem;font-weight:800;color:var(--ctn-green-ink);margin:0}
.ct-tier-card__term{color:var(--ctn-muted);font-size:.9rem;margin:.1rem 0 0}
.ct-tier-card__body{flex-grow:1;color:var(--ctn-ink)}
.ct-tier-card__footer{margin-top:auto;padding-top:1rem}

/* ---- 10. legacy STEP CARDS + BEM step + steps grid ----------------------- */
.ct-steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
@media (max-width:820px){.ct-steps-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}
.ct-step-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.6rem;
  box-shadow:var(--ctn-shadow-sm);height:100%;color:var(--ctn-ink)}
.ct-step-card__number{font-family:var(--ctn-display);font-size:2.2rem;font-weight:800;color:var(--ctn-gold);line-height:1;margin-bottom:.3rem}
.ct-step-card__title{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-size:1.2rem}
.ct-step-card__detail{color:var(--ctn-muted);margin:0}
/* BEM modifiers on the modern .ct-step block (block itself already styled) */
.ct-step__title{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-size:1.2rem}
.ct-step__text{color:var(--ctn-muted);margin:0}
.ct-step-num{font-family:var(--ctn-display);font-size:2.2rem;font-weight:800;color:var(--ctn-gold);line-height:1}
.ct-step-body{color:var(--ctn-muted)}

/* ---- 11. legacy COST CARDS ----------------------------------------------- */
.ct-cost-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.5rem;
  box-shadow:var(--ctn-shadow-sm);height:100%;color:var(--ctn-ink)}
.ct-cost-card__icon{width:46px;height:46px;border-radius:12px;background:var(--ctn-bg-mint);color:var(--ctn-green);
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:.9rem}
.ct-cost-card__label{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-size:1.05rem;margin-bottom:.2rem}
.ct-cost-card__range{font-family:var(--ctn-display);font-size:1.3rem;font-weight:800;color:var(--ctn-green-ink);margin:0 0 .4rem}
.ct-cost-card__detail{color:var(--ctn-muted);font-size:.9rem;margin:0}

/* ---- 12. legacy TRUST CARDS (about) -------------------------------------- */
.ct-trust-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
.ct-trust-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.5rem;
  box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink)}
.ct-trust-card h3{color:var(--ctn-green-ink)}

/* ---- 13. legacy ACCORDION (two idioms) ----------------------------------- */
/* idiom A: custom .ct-accordion-* */
.ct-accordion{max-width:780px;margin-inline:auto}
.ct-accordion-item,.ct-accordion__item{border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm);
  margin-bottom:.7rem;overflow:hidden;background:#fff}
.ct-accordion-btn,.ct-accordion__trigger{width:100%;text-align:left;display:flex;justify-content:space-between;align-items:center;gap:1rem;
  font-family:var(--ctn-display);font-weight:700;color:var(--ctn-green-ink);font-size:1.02rem;background:#fff;border:0;
  padding:1.1rem 1.2rem;cursor:pointer}
.ct-accordion-btn:not(.collapsed),.ct-accordion__trigger[aria-expanded=true]{color:var(--ctn-green);background:var(--ctn-bg-soft)}
.ct-accordion-btn::after{content:"\f078";font-family:"Font Awesome 6 Free";font-weight:900;font-size:.8em;color:var(--ctn-faint);transition:transform .2s}
.ct-accordion-btn:not(.collapsed)::after{transform:rotate(180deg)}
.ct-accordion-body,.ct-accordion__body{color:var(--ctn-muted);padding:0 1.2rem 1.2rem}
/* idiom B: Bootstrap .accordion themed by a .ct-accordion wrapper */
.ct-accordion .accordion-item{border:1px solid var(--ctn-line)!important;border-radius:var(--ctn-radius-sm)!important;
  margin-bottom:.7rem;overflow:hidden;background:#fff}
.ct-accordion .accordion-button{font-family:var(--ctn-display);font-weight:700;color:var(--ctn-green-ink);
  background:#fff;box-shadow:none;padding:1.1rem 1.2rem}
.ct-accordion .accordion-button:not(.collapsed){color:var(--ctn-green);background:var(--ctn-bg-soft)}
.ct-accordion .accordion-button:focus{box-shadow:0 0 0 .2rem rgba(23,106,69,.18)}
.ct-accordion .accordion-body{color:var(--ctn-muted)}

/* ---- 14. legacy CALCULATOR panel ----------------------------------------- */
.ct-calc-panel{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  box-shadow:var(--ctn-shadow);padding:clamp(1.4rem,3vw,2rem);color:var(--ctn-ink)}
.ct-calc-page-wrap{max-width:820px;margin-inline:auto}
.ct-calc-label{font-weight:600;font-size:.92rem;color:var(--ctn-muted);margin-bottom:.3rem}
.ct-calc-value{font-family:var(--ctn-display);font-size:1.6rem;font-weight:800;color:var(--ctn-green-ink);margin-bottom:.4rem}
.ct-form-range{width:100%;accent-color:var(--ctn-green)}
.ct-calc-result{display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem;margin-top:1.2rem}
@media (max-width:640px){.ct-calc-result{grid-template-columns:1fr 1fr}}
.ct-calc-result-item{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm);padding:.9rem 1rem;text-align:center}
.ct-calc-result-val{font-family:var(--ctn-display);font-size:1.35rem;font-weight:800;color:var(--ctn-green-ink)}
.ct-calc-result-lbl{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--ctn-faint)}
.ct-calc-disclaimer{font-size:.74rem;color:var(--ctn-faint);margin:.9rem 0 0}
.ct-calc-tier-tabs{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;margin-bottom:1rem}
.ct-calc-tier-btn{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-pill);
  padding:.4em 1em;font-weight:600;color:var(--ctn-muted);cursor:pointer}
.ct-calc-tier-btn.active{background:var(--ctn-green);color:#fff;border-color:var(--ctn-green)}

/* ---- 15. legacy TABLES (rate / repayment) -------------------------------- */
.ct-rate-table,.ct-repayment-table{width:100%;border-collapse:collapse;background:#fff;color:var(--ctn-ink);
  border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm);overflow:hidden}
.ct-rate-table th,.ct-repayment-table th{background:var(--ctn-bg-mint);color:var(--ctn-green-ink);font-family:var(--ctn-display);
  text-align:left;padding:.7rem .9rem;font-size:.9rem}
.ct-rate-table td,.ct-repayment-table td{padding:.7rem .9rem;border-top:1px solid var(--ctn-line);font-size:.92rem}
.ct-rate-table tr:nth-child(even) td,.ct-repayment-table tr:nth-child(even) td{background:var(--ctn-bg-soft)}
.ct-row-highlight td{background:var(--ctn-bg-mint)!important;font-weight:700;color:var(--ctn-green-ink)}
.ct-matrix-wrap,.ct-repayment-wrap{overflow-x:auto}
.ct-feature-matrix{width:100%;border-collapse:collapse;color:var(--ctn-ink)}
.ct-feature-matrix th,.ct-feature-matrix td{padding:.7rem .9rem;border-top:1px solid var(--ctn-line);text-align:center;font-size:.9rem}
.ct-feature-matrix th:first-child,.ct-feature-matrix td:first-child{text-align:left;color:var(--ctn-muted)}
.ct-feature-matrix thead th{background:var(--ctn-bg-mint);color:var(--ctn-green-ink);font-family:var(--ctn-display)}
.ct-feature-matrix .fm-featured{background:rgba(23,106,69,.06)}
.ct-feature-matrix .fm-group td{background:var(--ctn-bg-soft);font-weight:700;color:var(--ctn-green-ink);text-align:left}
.ct-table-disclaimer,.ct-rate-disclaimer{font-size:.78rem;color:var(--ctn-faint);margin:.8rem 0 0}
.ct-repayment-highlight{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.3rem;
  box-shadow:var(--ctn-shadow-sm);text-align:center}
.ct-repayment-highlight--mid{border-color:var(--ctn-green);box-shadow:var(--ctn-shadow)}
.ct-repayment-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
@media (max-width:760px){.ct-repayment-cards{grid-template-columns:1fr;max-width:420px;margin-inline:auto}}
.ct-amount{font-family:var(--ctn-display);font-weight:800;color:var(--ctn-green-ink)}

/* ---- 16. legacy IMAGE CARDS (guide/loan editorial tiles) ----------------- */
.ct-image-card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
.ct-image-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);overflow:hidden;
  box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink);display:flex;flex-direction:column}
.ct-image-card-visual{background:var(--ctn-bg-mint);color:var(--ctn-green)}
.ct-image-card-body{padding:1.1rem 1.2rem}
.ct-image-card-title{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-size:1.02rem;margin-bottom:.25rem}
.ct-image-card-desc{color:var(--ctn-muted);font-size:.88rem;margin:0}

/* ---- 17. legacy FEATURE / ELIGIBILITY lists ------------------------------ */
.ct-feature-list,.ct-elig-list{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.ct-feature-list li,.ct-elig-list li{position:relative;padding-left:1.7rem;color:var(--ctn-ink)}
.ct-feature-list li::before,.ct-elig-list li::before{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;
  color:var(--ctn-green);position:absolute;left:0;top:.12em;font-size:.85em}
.ct-feature-list a,.ct-elig-list a{color:var(--ctn-green);font-weight:600}

/* ---- 18. legacy TIMELINE (how-it-works) ---------------------------------- */
.ct-timeline{position:relative;display:grid;gap:1.4rem;padding-left:1.2rem;border-left:2px solid var(--ctn-line)}
.ct-timeline-item{position:relative;padding-left:.6rem}
.ct-timeline-dot{position:absolute;left:-1.55rem;top:.15rem;color:var(--ctn-green)}
.ct-timeline-date{color:var(--ctn-gold-deep);font-family:var(--ctn-display);font-weight:700}
.ct-timeline-title{font-family:var(--ctn-display);color:var(--ctn-green-ink);font-size:1.05rem;margin:.1rem 0}
.ct-timeline-body{color:var(--ctn-muted)}

/* ---- 19. legacy REP-EXAMPLE band (in-page, light variant) ---------------- */
.ct-rep-band{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm);
  padding:1rem 1.2rem;font-size:.86rem;color:var(--ctn-muted)}
.ct-rep-band strong{color:var(--ctn-green-ink)}
.ct-stats-bar,.ct-counter-banner{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  padding:1.4rem;color:var(--ctn-ink)}

/* ---- 20. legacy DEBT-ADVICE cards (responsible-lending) ------------------ */
.ct-debt-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.2rem;gap:.8rem;
  box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink);text-decoration:none}
.ct-debt-card:hover{box-shadow:var(--ctn-shadow);text-decoration:none;transform:translateY(-2px);transition:transform .15s,box-shadow .15s}
.ct-debt-card>i{color:var(--ctn-green);font-size:1.2rem;margin-top:.15rem}
.ct-debt-card-name{font-family:var(--ctn-display);font-weight:700;color:var(--ctn-green-ink)}
.ct-debt-card-desc{color:var(--ctn-muted);font-size:.85rem;margin:.25rem 0 0}

/* ---- 21. legacy RELATED links / cards ------------------------------------ */
.ct-related-card{display:flex;align-items:center;gap:.6rem;padding:1rem 1.2rem;text-decoration:none;color:var(--ctn-ink)}
.ct-related-card:hover{text-decoration:none;box-shadow:var(--ctn-shadow);transform:translateY(-2px);transition:transform .15s,box-shadow .15s}
.ct-related-amount{font-family:var(--ctn-display);font-weight:800;color:var(--ctn-green-ink)}
.ct-related-label{color:var(--ctn-muted);font-size:.88rem;flex-grow:1}
.ct-related-card>i{color:var(--ctn-faint);margin-left:auto}
.ct-related-link{display:inline-block;color:var(--ctn-green);font-weight:600}
.ct-rl-card{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);padding:1.1rem;
  box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink)}

/* ---- 22. legacy SEARCH results ------------------------------------------- */
#ct-search-results>*,.ct-search-results>*{background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  padding:1.1rem 1.2rem;box-shadow:var(--ctn-shadow-sm);color:var(--ctn-ink);text-decoration:none;display:block}
#ct-search-count,.ct-search-count{color:var(--ctn-muted)}
#ct-search-empty,.ct-search-empty{color:var(--ctn-muted)}

/* ---- 23. legacy FORM controls (used where a page isn't yet rebuilt) ------ */
.ct-form-group{margin-bottom:1.1rem}
.ct-form-control{width:100%;background:#fff;border:1.5px solid var(--ctn-line-strong);border-radius:var(--ctn-radius-sm);
  padding:.7rem .9rem;font:inherit;color:var(--ctn-ink)}
.ct-form-control:focus{outline:0;border-color:var(--ctn-green);box-shadow:0 0 0 .2rem rgba(23,106,69,.15)}
.ct-form-step-dot{width:.6rem;height:.6rem;border-radius:50%;background:var(--ctn-line-strong)}
.ct-form-step-dot.active{background:var(--ctn-green)}
.ct-form-step-line{height:2px;background:var(--ctn-line);flex:1}

/* ---- 24. legacy WARNINGS / misc ------------------------------------------ */
.ct-warning-wrapper{background:#fbf3d6;border:1px solid #f0e2ac;border-radius:var(--ctn-radius-sm);padding:1rem 1.2rem;color:#5c4708}
.ct-warning-text{color:#7a5e08}
.ct-warning-text i{color:#b58a08}
.ct-noscript-show{display:none}
.ct-two-col{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
@media (max-width:760px){.ct-two-col{grid-template-columns:1fr}}
.ct-specialist,.ct-based,.ct-by-project,.ct-to-project{color:var(--ctn-ink)}

/* ---- 25. legacy BUTTON aliases (primary/secondary -> brand mapping) -------
   long-tail uses .ct-btn-primary (gold) and .ct-btn-secondary (green/outline);
   .ct-btn / .ct-btn-outline / .ct-btn-ghost / .ct-btn-lg / .ct-btn-block are
   already defined by the modern layer above and are NOT redefined here. */
.ct-btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--ctn-display);
  font-weight:700;font-size:1.02rem;line-height:1;padding:.95em 1.7em;border-radius:var(--ctn-radius-pill);border:1.5px solid transparent;
  cursor:pointer;text-decoration:none;background:var(--ctn-gold);color:#3c2c06;box-shadow:var(--ctn-shadow-sm);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.ct-btn-primary:hover{background:#edcb6a;color:#3c2c06;transform:translateY(-2px);box-shadow:var(--ctn-shadow);text-decoration:none}
.ct-btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-family:var(--ctn-display);
  font-weight:700;font-size:1.02rem;line-height:1;padding:.95em 1.7em;border-radius:var(--ctn-radius-pill);border:1.5px solid var(--ctn-line-strong);
  cursor:pointer;text-decoration:none;background:#fff;color:var(--ctn-green);
  transition:transform .15s ease,box-shadow .15s ease,background .15s ease}
.ct-btn-secondary:hover{border-color:var(--ctn-green);color:var(--ctn-green-deep);background:var(--ctn-bg-soft);text-decoration:none}
.ct-btn-outline--sm{padding:.55em 1.1em;font-size:.9rem}

/* ---- 26. legacy GOLD-GRADIENT TEXT -> readable deep gold (no clip on light) */
.ct-text-gradient,.ct-gold-gradient{background:none!important;-webkit-background-clip:border-box!important;
  background-clip:border-box!important;color:var(--ctn-gold-deep)!important;-webkit-text-fill-color:var(--ctn-gold-deep)!important}
.text-gold{color:var(--ctn-gold-deep)!important}
.ct-font-display{font-family:var(--ctn-display)}

/* ---- 27. ARTICLE / PROSE legibility (catch-all) --------------------------
   Long-tail article bodies live directly in .ct-section .container columns and
   inherit body ink already; this hardens any element that the old theme left
   light, so nothing renders cream-on-white. Scoped to legacy surfaces only. */
.ct-section .container li,.ct-section .container p{color:inherit}
.ct-glass strong,.ct-glass-deep strong,.ct-card-raised strong,
.ct-product-card strong,.ct-tier-card strong,.ct-cost-card strong{color:var(--ctn-green-ink)}
.ct-page-hero a,.ct-section a{text-decoration:none}
.ct-page-hero a:hover,.ct-section a:hover{text-decoration:underline}

/* ---- 28. legacy classes found across the wider long-tail sample ----------
   (flagship articles, rates tables, eligibility/help blocks, hero chips). */

/* CTA-band BEM children — they sit INSIDE the dark .ct-cta-band, so light text */
.ct-cta-band__title{color:#fff;margin-bottom:.4rem}
.ct-cta-band__subtitle,.ct-cta-band__text{color:#bcd6c9;max-width:54ch;margin-inline:auto}

/* hero chip row + gold chip variant */
.ct-hero-chips{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:1rem}
.ct-chip--gold{background:var(--ctn-gold);color:#3c2c06}
.ct-hero-disclaimer{font-size:.78rem;color:var(--ctn-faint);margin-top:.75rem}

/* eligibility / help boxes (these ride on .ct-glass — just heading + spacing) */
.ct-elig-wrap h3,.ct-help-box h3{color:var(--ctn-green-ink);font-size:1.1rem;margin-bottom:.6rem}
.ct-elig-wrap h3 i,.ct-help-box h3 i{color:var(--ctn-green);margin-right:.4rem}
.ct-elig-note{font-size:.84rem;color:var(--ctn-muted);background:var(--ctn-bg-soft);border:1px solid var(--ctn-line);
  border-radius:var(--ctn-radius-sm);padding:.8rem 1rem;margin-top:.9rem}
.ct-elig-note i{color:var(--ctn-green)}
.ct-help-box{border-left:3px solid var(--ctn-green)}

/* generic info list (label rows) */
.ct-info-list{list-style:none;margin:0;padding:0}
.ct-info-list li{display:flex;gap:.7rem;padding:.5rem 0;border-bottom:1px solid var(--ctn-line);color:var(--ctn-muted);font-size:.92rem}
.ct-info-list li i{color:var(--ctn-green);margin-top:.2rem}

/* grids used by flagship articles */
.ct-cards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem}
.ct-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem}
.ct-related-heading{color:var(--ctn-green-ink)}
.ct-related-card--all{justify-content:center;font-weight:700;color:var(--ctn-green)}
.ct-accordion-wrap{max-width:780px;margin-inline:auto}

/* small button size used inline */
.ct-btn-sm{font-size:.9rem;padding:.55em 1.1em}

/* inline-styled .ct-table (markup carries layout; we add readable cells) */
.ct-table{color:var(--ctn-ink)}
.ct-table th{background:var(--ctn-bg-mint);color:var(--ctn-green-ink);font-family:var(--ctn-display);text-align:left;
  padding:.7rem .9rem}
.ct-table td{padding:.7rem .9rem;border-top:1px solid var(--ctn-line)}
.ct-table tr:nth-child(even) td{background:var(--ctn-bg-soft)}
.ct-table-wrap{overflow-x:auto;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius-sm)}

/* ============================================================================
   DESIGN-ELEVATION SUITE (2026-06-29) — Phases 1-3 of the build spec.
   Appended AFTER both the modern theme and the legacy compat layer so the
   progressive mobile grids win the cascade over the legacy single-collapse
   rules. The @media (min-width:1200/1440/1700) desktop-recompose blocks and the
   legacy compat layer above are LEFT INTACT — this block only ADDS. Brand
   tokens unchanged; --ctn-radius stays 16px. Neutral shadows only.
   Standard breakpoints: 480 / 600 / 768 / 991.
   ========================================================================== */

/* ---- §4 markup-support classes ------------------------------------------- */
/* (4f) prominent representative-example card — light, green keyline */
.ct-rep-band--feature{background:#fff;border-left:4px solid var(--ctn-green);box-shadow:var(--ctn-shadow-sm);
  padding:clamp(.9rem,2.5vw,1.3rem) clamp(1rem,3vw,1.4rem);font-size:clamp(.84rem,1.8vw,.92rem);color:var(--ctn-muted)}
.ct-rep-band--feature strong{color:var(--ctn-green-ink)}
@media (max-width:600px){.ct-rep-band--feature{padding-inline:1rem}}

/* (4e) nav drawer scrim — sibling to .ct-nav-collapse, click closes the drawer */
.ct-nav-scrim{position:fixed;inset:74px 0 0;background:rgba(12,45,31,.35);z-index:1024;opacity:0;
  transition:opacity .25s;pointer-events:none}
.ct-nav-scrim.open{opacity:1;pointer-events:auto}
@media (min-width:992px){.ct-nav-scrim{display:none}}

/* (4d) sticky mobile apply CTA — only on phones */
.ct-mobile-sticky-cta{display:none}
@media (max-width:767px){
  .ct-mobile-sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:1025;background:#fff;
    border-top:1px solid var(--ctn-line);box-shadow:0 -2px 8px rgba(12,45,31,.08);
    padding:.75rem 1rem calc(.75rem + env(safe-area-inset-bottom))}
  .ct-mobile-sticky-cta .ct-btn-green{width:100%}
  /* clear the sticky bar so it never covers footer content */
  body.ct-body main{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
}

/* ---- §3 component polish -------------------------------------------------- */
/* typography */
h3{letter-spacing:-.015em}
.ct-trust .t b{font-weight:600;letter-spacing:-.01em}

/* cards & shadows — neutral only, micro-bevel top highlight */
.ct-tier,.ct-quote-card,.ct-product-card,.ct-tier-card{border-top-color:rgba(255,255,255,.6)}
.ct-tier--featured,.ct-product-card.highlight,.ct-tier-card--featured{background:rgba(23,106,69,.025)}
.ct-tier--featured:hover{box-shadow:var(--ctn-shadow-lg)}
.ct-tier__badge,.ct-product-badge,.ct-tier-card__badge{box-shadow:var(--ctn-shadow-sm)}

/* CTA band gradient angle 120deg -> 110deg; flatten vertical on small screens */
.ct-cta-band{background:linear-gradient(110deg,var(--ctn-green-ink),var(--ctn-green-deep))}
@media (max-width:900px){.ct-cta-band{background:linear-gradient(to bottom,var(--ctn-green-ink),var(--ctn-green-deep))}}

/* buttons — depth on hover (gold), active reset, keyboard focus rings */
.ct-btn:hover{filter:brightness(1.04)}
.ct-btn:active,.ct-btn-green:active{transform:translateY(0)}
.ct-btn:focus-visible,.ct-btn-green:focus-visible,.ct-btn-ghost:focus-visible,.ct-btn-outline:focus-visible{
  outline:2px solid var(--ctn-green);outline-offset:2px}
a:focus-visible{outline:2px solid var(--ctn-green);outline-offset:2px}

/* calculator output fade-in (JS toggles opacity on change) */
.ct-fade-num{transition:opacity .18s ease}

/* accordion focus/hover parity */
.ct-faq .accordion-button:hover{color:var(--ctn-green)}
.ct-faq .accordion-button:focus-visible{box-shadow:0 0 0 .2rem rgba(23,106,69,.18)}
/* footer links underline on hover */
.ct-footer a:hover{text-decoration:underline}

/* ---- §2 dedicated mobile design (<768px) --------------------------------- */
/* hero: 1-col below 768, 2-col at/above; mobile h1 floor, desktop clamp restored */
@media (max-width:767px){
  .ct-hero-grid{grid-template-columns:1fr;gap:clamp(2rem,4vw,3rem)}
}
@media (min-width:768px){
  .ct-hero-grid{grid-template-columns:1.05fr .95fr}
}
.ct-hero h1{font-size:clamp(1.8rem,5.5vw,2.4rem)}
@media (min-width:768px){.ct-hero h1{font-size:clamp(2.3rem,1.7rem+2.7vw,3.6rem)}}
/* hero bullet icon alignment fix */
.ct-hero-points i{align-self:flex-start;margin-top:.2em;flex-shrink:0;width:1.25em;text-align:center}
@media (max-width:480px){
  .ct-hero .ct-lead{font-size:1rem}
  .ct-hero-cta{flex-direction:column;gap:var(--ctn-space-sm)}
  .ct-hero-cta .ct-btn,.ct-hero-cta .ct-btn-green,.ct-hero-cta .ct-btn-ghost{width:100%}
  .ct-hero-trust{flex-direction:column;align-items:flex-start;gap:.5rem;font-size:.8rem}
}

/* calculator / quote card */
.ct-quote-card{max-width:100%}
@media (max-width:480px){.ct-quote-card h2{font-size:1.1rem}}
@media (max-width:599px){.ct-quote-out{grid-template-columns:1fr}}
@media (min-width:600px){.ct-quote-out{grid-template-columns:1fr 1fr}}
.ct-quote-out .o span{font-size:clamp(.65rem,1.5vw,.72rem)}
.ct-quote-out .o b{font-size:clamp(1.1rem,3vw,1.35rem)}
/* legacy /rates/ calc result stacks on the smallest screens */
@media (max-width:480px){.ct-calc-result{grid-template-columns:1fr}}
/* larger touch slider thumb on all sizes */
.ct-quote-card input[type=range],.ct-form-range{height:8px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--ctn-green)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border:0;border-radius:50%;background:var(--ctn-green)}
input[type=range]:focus-visible{outline:2px solid var(--ctn-green);outline-offset:4px}

/* nav drawer: slide-down with proper touch targets */
.ct-nav-toggle,.ct-toggler{width:48px;height:48px}
@media (max-width:991px){
  .ct-nav-collapse{display:block;position:fixed;left:0;right:0;top:74px;height:calc(100dvh - 74px);
    overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;box-shadow:var(--ctn-shadow);
    transform:translateY(-110%);transition:transform .25s cubic-bezier(.4,0,.2,1);padding:1rem var(--ctn-page-pad) 1.4rem}
  .ct-nav-collapse.open{transform:translateY(0)}
  .ct-nav-links a{min-height:44px;display:flex;align-items:center;padding:.75rem 1rem}
}
@media (prefers-reduced-motion:reduce){.ct-nav-collapse{transition:none}}

/* tiers — progressive 1 -> 2 -> 3 (also legacy product/tier-card grids) */
@media (max-width:599px){
  .ct-tiers,.ct-products-grid{grid-template-columns:1fr;max-width:460px;margin-inline:auto}
}
@media (min-width:600px) and (max-width:767px){
  .ct-tiers,.ct-products-grid{grid-template-columns:1fr 1fr;max-width:none;margin-inline:0}
}
@media (min-width:768px){
  .ct-tiers{grid-template-columns:repeat(3,1fr)}
  .ct-products-grid{grid-template-columns:repeat(3,1fr)}
}
.ct-tier h3{font-size:clamp(1rem,2.5vw,1.3rem)}
.ct-tier__range{font-size:clamp(1.3rem,4vw,1.7rem)}

/* steps grids — progressive 1 -> 2 -> 3 */
@media (max-width:599px){.ct-steps,.ct-steps-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}}
@media (min-width:600px) and (max-width:767px){.ct-steps,.ct-steps-grid{grid-template-columns:1fr 1fr;max-width:none;margin-inline:0}}
@media (min-width:768px){.ct-steps,.ct-steps-grid{grid-template-columns:repeat(3,1fr)}}

/* trust band — 1 -> 2 -> 4 */
@media (max-width:599px){.ct-trust{grid-template-columns:1fr}.ct-trust .t i{font-size:1.4rem}}
@media (min-width:600px) and (max-width:767px){.ct-trust{grid-template-columns:1fr 1fr}}

/* type scale (mobile compression) */
@media (max-width:480px){
  h2{font-size:clamp(1.4rem,4vw,2.2rem);font-weight:700}
  .ct-eyebrow{letter-spacing:.14em}
}
h3{font-size:clamp(.95rem,2.5vw,1.3rem)}
body.ct-body{font-size:clamp(.95rem,1.5vw,1.0625rem)}

/* accordion mobile padding */
.ct-faq .accordion-button{padding:clamp(.8rem,2vw,1.1rem) clamp(.9rem,2vw,1.2rem);font-size:clamp(.9rem,2vw,1.02rem)}
.ct-faq .accordion-body{padding:0 clamp(.9rem,2vw,1.2rem) clamp(.9rem,2vw,1.2rem)}

/* cookie banner clears safe-area on small screens */
@media (max-width:480px){
  .ct-cookie-banner{left:.75rem;right:.75rem;bottom:calc(.75rem + env(safe-area-inset-bottom))}
}

/* touch-target floor (global) */
.ct-btn,.ct-btn-green,.ct-btn-ghost,.ct-btn-outline{min-height:48px}
.ct-btn-outline{min-height:40px}
.ct-tier__icon,.ct-product-icon,.ct-cost-card__icon{width:44px;height:44px}

/* footer bottom balance (replaces the 28px hard bottom pad with rhythm) */
.ct-footer-bottom{padding:1.6rem 0 1.2rem}

/* ---- §3 reduced-motion: disable lifts/transforms ------------------------- */
@media (prefers-reduced-motion:reduce){
  .ct-btn,.ct-btn-green,.ct-tier{transform:none!important}
}

/* ---- CRITIC ROUND (2026-06-29): mobile warning-bar compaction -------------
   The FCA late-payment warning + MoneyHelper link are MANDATORY and stay on
   every width. At <768px the full sentence + secondary link + bullet wrapped
   to 4-5 lines (~123px tall, eating 15% of the viewport before any content).
   Fix: tighter line-height, left-aligned wrap (no ragged centred block),
   thinner vertical padding, and the *secondary* "Responsible lending" link
   (duplicated in nav + footer) collapses below 600px. Net: ~2 lines / ~56px.
   Mandatory copy is never hidden. */
.ct-warning-msg{display:inline}
.ct-warning-extra{display:inline}
@media (max-width:767px){
  .ct-warning-bar{font-size:.8rem}
  .ct-warning-bar .container,.ct-warning-bar .ct-container{
    justify-content:flex-start;text-align:left;line-height:1.34;gap:.4rem;
    padding-block:.45rem;flex-wrap:nowrap}
  .ct-warning-bar i{flex-shrink:0;margin-top:.12em}
  .ct-warning-msg{flex:1;min-width:0}
}
@media (max-width:600px){
  .ct-warning-extra{display:none}
}

/* ---- CRITIC ROUND: sticky apply-CTA must not sit under the cookie banner --
   Both are bottom-anchored; the cookie banner (z 1080) overlapped and partly
   occluded the sticky "Apply now" (z 1025) while consent was pending. Rather
   than fragile height math, suppress the sticky CTA while the banner is open
   (the hero CTA is on-screen on first load anyway) and reveal it once consent
   is dismissed. JS toggles body.ct-cookie-open in lockstep with the banner. */
@media (max-width:767px){
  .ct-mobile-sticky-cta{transition:opacity .22s ease,transform .22s ease}
  body.ct-cookie-open .ct-mobile-sticky-cta{
    opacity:0;transform:translateY(16px);pointer-events:none;visibility:hidden}
}

/* ---- CRITIC ROUND 2 (2026-06-29): enrich the homepage step / why cards ------
   The "How it works" and "Why Cash Train" blocks used bare .ct-step (icon +
   heading + text on the section fill) while the loan tiers directly above are
   carded — so mid-page read flat/cheap next to a best-in-class hero+tiers. Give
   the HOMEPAGE .ct-step the same neutral white-card chrome already used by every
   other card idiom (existing tokens only; no new assets, no colour glows). The
   number badge gets a soft mint chip so the gold numerals sit on a surface and
   the eye gets a clear 01/02/03 rhythm. Scoped to body.ct-page-home so the
   long-tail pages that render .ct-step / .ct-step__* are untouched. */
body.ct-page-home .ct-step{
  background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  padding:clamp(1.3rem,2.4vw,1.7rem);box-shadow:var(--ctn-shadow-sm);
  border-top-color:rgba(255,255,255,.6);
  transition:transform .18s ease,box-shadow .18s ease}
body.ct-page-home .ct-step:hover{transform:translateY(-4px);box-shadow:var(--ctn-shadow)}
/* equal-height tiles inside the Bootstrap .row.g-4 "Why" grid */
body.ct-page-home .row .ct-step{height:100%}
/* How-it-works number: lift the bare gold numeral into a mint chip badge */
body.ct-page-home .ct-steps .ct-step__num{
  display:inline-flex;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;
  font-size:1.45rem;background:var(--ctn-bg-mint);border-radius:12px;margin-bottom:.7rem}
body.ct-page-home .ct-steps .ct-step__icon{margin-top:0}
/* "Why" cards: the FA icon becomes a mint icon-chip to match the tier icons */
body.ct-page-home .row .ct-step .ct-step__icon{
  display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;
  border-radius:12px;background:var(--ctn-bg-mint);font-size:1.25rem;margin:0 0 1rem}
@media (prefers-reduced-motion:reduce){
  body.ct-page-home .ct-step{transform:none!important}
}
/* The micro-bevel top-highlight (`border-top-color:rgba(255,255,255,.6)`) was
   also overriding the featured tier's green keyline on its TOP edge — so "Most
   popular" had a green border on 3 sides and a near-white top. Restore it. */
.ct-tier--featured{border-top-color:var(--ctn-green)}

/* ---- CRITIC ROUND 2 (2026-06-29): sticky CTA reveals after the hero CTA ----
   The hero "Apply now" and the sticky "Apply now" are the same action, so both
   visible on first load read as duplicate clutter. main.js adds
   `ct-hero-cta-onscreen` to <body> while the hero CTA is in view and removes it
   once it scrolls away; the bar then persists. JS-gated (default-open if JS/IO
   is unavailable), and composes with the cookie-open suppression above. */
@media (max-width:767px){
  body.ct-hero-cta-onscreen .ct-mobile-sticky-cta{
    opacity:0;transform:translateY(16px);pointer-events:none;visibility:hidden}
}

/* ============================================================================
   SOCIAL PROOF (restored 2026-06-29) — hero rating line + customer reviews grid.
   Static content. Star fills use bright --ctn-gold (the conventional review-star
   colour); inline copy uses ink/muted so it reads on white. New component
   namespace (.ct-hero-rating / .ct-review-*) — nothing else targets these.
   ============================================================================ */
.ct-hero-rating{display:flex;align-items:center;gap:.55rem;margin-top:1.1rem;
  font-size:.9rem;color:var(--ctn-muted);flex-wrap:wrap}
.ct-hero-rating .ct-stars{color:var(--ctn-gold);font-size:.95rem;letter-spacing:.04em;white-space:nowrap}
.ct-hero-rating b{color:var(--ctn-green-ink);font-weight:700}

.ct-reviews-grid{margin-top:var(--ctn-space-lg)}
.ct-review-card{height:100%;display:flex;flex-direction:column;
  background:var(--ctn-bg);border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);
  box-shadow:var(--ctn-shadow-sm);padding:clamp(1.25rem,2.4vw,1.6rem);
  transition:transform .18s ease,box-shadow .18s ease}
.ct-review-card:hover{transform:translateY(-3px);box-shadow:var(--ctn-shadow)}
.ct-review-stars{color:var(--ctn-gold);font-size:.92rem;letter-spacing:.08em;margin-bottom:.7rem}
.ct-review-quote{font-size:.95rem;line-height:1.6;color:var(--ctn-ink);margin:0 0 1.1rem;flex:1 1 auto}
.ct-review-author{display:flex;align-items:center;gap:.7rem;margin-top:auto}
.ct-review-avatar{flex-shrink:0;width:42px;height:42px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--ctn-bg-mint);color:var(--ctn-green);
  font-family:var(--ctn-display);font-weight:700;font-size:.92rem;letter-spacing:.02em}
.ct-review-name{display:block;font-family:var(--ctn-display);font-weight:700;font-size:.9rem;color:var(--ctn-green-ink);line-height:1.2}
.ct-review-meta{display:block;font-size:.78rem;color:var(--ctn-faint);margin-top:.12rem}
.ct-reviews-note{font-size:.78rem;color:var(--ctn-faint);text-align:center;margin-top:var(--ctn-space-lg)}
@media (prefers-reduced-motion:reduce){.ct-review-card{transition:none}.ct-review-card:hover{transform:none}}
@media (max-width:767px){
  .ct-hero-rating{justify-content:flex-start;font-size:.85rem}
  .ct-review-quote{font-size:.92rem}
}

/* ============================================================================
   DESIGN ELEVATION (2026-06-29) — de-tackify. The metallic/flat-GOLD primary
   CTAs were the "payday-loan" tell; the green hero button was the only one that
   read premium. So: ALL primary actions become confident solid green, and gold
   is relegated to restrained accents only (stars, eyebrows, the "most popular"
   badge, the wordmark). Mobile nav drawer gets real structure (no dead white);
   cookie banner compacted. Appended last => wins over the gold .ct-btn rules.
   ============================================================================ */

/* --- PRIMARY BUTTONS: green, never gold --- */
.ct-btn,.ct-btn-primary{
  background:var(--ctn-green);color:#fff;border:0;
  box-shadow:0 1px 2px rgba(12,45,31,.10),0 8px 20px -10px rgba(12,45,31,.42)}
.ct-btn:hover,.ct-btn-primary:hover{
  background:var(--ctn-green-deep);color:#fff;filter:none;transform:translateY(-2px);
  box-shadow:0 2px 4px rgba(12,45,31,.12),0 14px 30px -12px rgba(12,45,31,.5)}
.ct-btn:active,.ct-btn-primary:active{transform:translateY(0)}
/* on the dark-green CTA band a green button vanishes -> clean white pill */
.ct-cta-band .ct-btn,.ct-cta-band .ct-btn-primary{background:#fff;color:var(--ctn-green-ink);box-shadow:0 10px 26px -12px rgba(0,0,0,.45)}
.ct-cta-band .ct-btn:hover,.ct-cta-band .ct-btn-primary:hover{background:var(--ctn-bg-mint);color:var(--ctn-green-ink)}

/* --- MOBILE NAV DRAWER: content-height, dividers, chevrons, utility footer --- */
.ct-nav-drawer-foot{display:none}  /* desktop: hidden; revealed only in the mobile drawer below */
@media (max-width:991px){
  .ct-nav-collapse{height:auto;max-height:calc(100dvh - 74px);padding:.35rem var(--ctn-page-pad) 1.4rem}
  .ct-nav-links{flex-direction:column;align-items:stretch;gap:0;margin:.25rem 0 1rem}
  .ct-nav-links li+li{border-top:1px solid var(--ctn-line)}
  .ct-nav-links a{min-height:56px;justify-content:space-between;padding:.9rem .25rem;border-radius:0;
    font-family:var(--ctn-display);font-weight:600;font-size:1.08rem;color:var(--ctn-green-ink)}
  .ct-nav-links a::after{content:"\203A";font-size:1.35rem;line-height:1;color:var(--ctn-faint);font-weight:400}
  .ct-nav-links a:hover,.ct-nav-links a:active{background:transparent;color:var(--ctn-green)}
  .ct-nav-links a.active,.ct-nav-links a.active::after{color:var(--ctn-green)}
  .ct-nav-actions{margin-top:.25rem}
  .ct-nav-actions .ct-btn{width:100%;min-height:54px;font-size:1.08rem}
  .ct-nav-drawer-foot{display:flex;flex-direction:column;gap:.85rem;margin-top:1.1rem;padding-top:1.1rem;
    border-top:1px solid var(--ctn-line)}
  .ct-nav-drawer-foot a{display:inline-flex;align-items:center;gap:.6rem;color:var(--ctn-green-ink);font-weight:600;font-size:.98rem}
  .ct-nav-drawer-foot a i{color:var(--ctn-green)}
  .ct-nav-drawer-foot .ct-drawer-trust{display:flex;align-items:center;gap:.55rem;color:var(--ctn-faint);font-size:.84rem;font-weight:500}
  .ct-nav-drawer-foot .ct-drawer-trust i{color:var(--ctn-gold-deep)}
}

/* --- COOKIE BANNER: compact (green accept inherits .ct-btn) --- */
.ct-cookie-banner{max-width:500px;padding:.95rem 1.15rem;border-radius:var(--ctn-radius-sm)}
.ct-cookie-inner p{font-size:.83rem;margin:0 0 .65rem}
.ct-cookie-btns .ct-btn{min-height:42px;font-size:.9rem;padding:.5em 1.4em}
.ct-cookie-btns .ct-btn-outline{min-height:42px;font-size:.9rem}

/* --- REDESIGNED WORDMARK (2026-06-29) — flat slab-serif type replaces the
   metallic-bevel SVG. Roboto Slab (--ct-font-display, already loaded) carries a
   rail/industrial heritage that suits the brand. Original wordmark SVGs are
   kept on disk, just no longer referenced. --- */
.ct-wordmark-text{font-family:'Roboto Slab',Georgia,'Times New Roman',serif;font-weight:800;
  letter-spacing:-.012em;line-height:1;white-space:nowrap;color:var(--ctn-green-ink)}
.ct-brand-lockup .ct-wordmark-text{font-size:clamp(1.18rem,.95rem + .6vw,1.42rem)}
.ct-lockup .ct-wordmark-text{font-size:1.34rem}
.ct-wordmark-text--light{color:#f3ead0}
@media (max-width:480px){.ct-brand-lockup .ct-wordmark-text{font-size:1.2rem}}

/* ============================================================================
   FIX PASS (2026-06-29) — drawer close + hamburger + headings + flat icon
   ============================================================================ */

/* --- mobile drawer + hamburger ---
   ROOT CAUSE of the close/float + overlap bugs: .ct-navbar has backdrop-filter,
   which makes IT the containing block for the position:fixed drawer + scrim. So
   a hard-coded top (74px / 125px) was measured from the navbar's top (already
   ~50px down past the warning bar), and the scrim's bottom:0 collapsed to the
   navbar's bottom. Fix: anchor the drawer at top:100% (= navbar's own bottom,
   robust to warning-bar wrap), give the scrim explicit height, z-order the
   drawer above the scrim, and hide via visibility so a content-height drawer
   can never leave a floating sliver when closed. */
@media (max-width:991px){
  .ct-nav-toggle,.ct-toggler{margin-left:auto}                 /* hamburger hard-right */
  .ct-nav-collapse{top:100%;height:auto;z-index:1030;
    max-height:calc(100dvh - var(--ct-header-h,125px));
    transform:translateY(-10px);opacity:0;visibility:hidden;pointer-events:none;
    transition:transform .24s cubic-bezier(.4,0,.2,1),opacity .2s,visibility .24s}
  .ct-nav-collapse.open{transform:translateY(0);opacity:1;visibility:visible;pointer-events:auto}
  .ct-nav-scrim{top:100%;bottom:auto;height:100dvh}
}
@media (prefers-reduced-motion:reduce){.ct-nav-collapse{transition:opacity .15s,visibility .15s}}

/* ============================================================================
   CONTENT ENRICHMENT (2026-06-29) — imagery + denser, varied sections to break
   the monotone "white card-row x4" rhythm. Curated CC0 imagery from the
   brand-family library. Stats band + image-feature + use-case gallery + guides.
   ============================================================================ */

/* tighten the over-generous section rhythm */
.ct-section{padding-block:clamp(2.6rem,5vw,4.4rem)}

/* --- STATS BAND (dark, bold numbers — breaks the all-white monotony) --- */
.ct-stats{background:linear-gradient(120deg,var(--ctn-green-ink),var(--ctn-green-deep));color:#fff;padding:clamp(2rem,4vw,3.1rem) 0}
.ct-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.ct-stat{text-align:center;padding:.4rem 1rem;position:relative}
.ct-stat+.ct-stat::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);height:54%;width:1px;background:rgba(255,255,255,.16)}
.ct-stat b{display:block;font-family:var(--ct-font-display);font-size:clamp(1.7rem,3.4vw,2.5rem);font-weight:800;color:#fff;line-height:1.04}
.ct-stat span{display:block;margin-top:.45rem;font-size:.85rem;color:#bcd6c9;line-height:1.3}
@media(max-width:600px){.ct-stats-grid{grid-template-columns:1fr 1fr;gap:1.7rem .5rem}.ct-stat+.ct-stat::before{display:none}}

/* --- IMAGE FEATURE (photo + text — kills the centered-card rhythm) --- */
.ct-feature-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.8rem,4vw,3.6rem);align-items:center}
.ct-feature-media{position:relative}
.ct-feature-media img{display:block;width:100%;height:100%;max-height:460px;object-fit:cover;border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-lg)}
.ct-feature-media::after{content:"";position:absolute;inset:0;border-radius:var(--ctn-radius);box-shadow:inset 0 0 0 1px rgba(12,45,31,.07)}
.ct-feature-body h2{margin-top:.4rem}
.ct-feature-body p{font-size:1.05rem;color:var(--ctn-muted);line-height:1.6;margin:0}
.ct-check-list{list-style:none;padding:0;margin:1.3rem 0 1.7rem;display:grid;gap:.75rem}
.ct-check-list li{position:relative;padding-left:2rem;color:var(--ctn-ink);font-size:1rem;line-height:1.45}
.ct-check-list li::before{content:"\2713";position:absolute;left:0;top:0;width:1.35rem;height:1.35rem;border-radius:50%;background:var(--ctn-bg-mint);color:var(--ctn-green);font-weight:700;font-size:.78rem;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:768px){.ct-feature-grid{grid-template-columns:1fr;gap:1.6rem}.ct-feature-media{order:-1}.ct-feature-media img{max-height:300px}}

/* --- USE-CASE GALLERY (image tiles -> loan pages) --- */
.ct-usecases{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.9rem,1.8vw,1.4rem)}
.ct-usecase{position:relative;display:block;border-radius:var(--ctn-radius);overflow:hidden;aspect-ratio:3/2.1;box-shadow:var(--ctn-shadow-sm);text-decoration:none;background:var(--ctn-green-ink)}
.ct-usecase img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease;opacity:.93}
.ct-usecase:hover img{transform:scale(1.06)}
.ct-usecase-cap{position:absolute;inset:auto 0 0 0;padding:1.7rem 1.1rem .95rem;background:linear-gradient(transparent,rgba(8,30,20,.88));color:#fff}
.ct-usecase-cap b{display:block;font-family:var(--ct-font-display);font-size:1.06rem;font-weight:700}
.ct-usecase-cap .uc-sub{display:block;font-size:.8rem;color:#d2e2da;margin-top:.1rem}
.ct-usecase-cap i{position:absolute;right:1.1rem;bottom:1.15rem;color:#fff;opacity:0;transform:translateX(-5px);transition:.25s}
.ct-usecase:hover .ct-usecase-cap i{opacity:.92;transform:translateX(0)}
@media(max-width:768px){.ct-usecases{grid-template-columns:1fr 1fr}}
@media(max-width:460px){.ct-usecases{grid-template-columns:1fr}}

/* --- GUIDES TEASER (clean text cards) --- */
.ct-guides-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.ct-guide-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-sm);padding:1.5rem;text-decoration:none;transition:transform .18s,box-shadow .18s}
.ct-guide-card:hover{transform:translateY(-3px);box-shadow:var(--ctn-shadow)}
.ct-guide-ico{width:44px;height:44px;border-radius:12px;background:var(--ctn-bg-mint);color:var(--ctn-green);display:inline-flex;align-items:center;justify-content:center;font-size:1.15rem;margin-bottom:1rem}
.ct-guide-card h3{font-size:1.06rem;margin:0 0 .4rem;color:var(--ctn-green-ink)}
.ct-guide-card p{font-size:.9rem;color:var(--ctn-muted);margin:0 0 1rem;flex:1 1 auto}
.ct-guide-more{font-family:var(--ct-font-display);font-weight:700;font-size:.85rem;color:var(--ctn-green)}
@media(max-width:768px){.ct-guides-grid{grid-template-columns:1fr}}

/* ============================================================================
   NAV DROPDOWNS (2026-06-29) — desktop hover panels for Loans + Guides so the
   top nav isn't a flat 7-item row. Hidden in the mobile drawer (parent links
   reach the hubs); dropdown is position:absolute (NOT fixed) so the navbar's
   backdrop-filter containing block doesn't affect it.
   ============================================================================ */
.ct-dropdown{display:none}
.ct-dd-caret{display:none}
@media(min-width:992px){
  .ct-has-dropdown{position:relative}
  .ct-dd-caret{display:inline-block;font-size:.58rem;margin-left:.32rem;opacity:.55;transition:transform .2s;vertical-align:middle}
  .ct-has-dropdown:hover .ct-dd-caret,.ct-has-dropdown:focus-within .ct-dd-caret{transform:rotate(180deg);opacity:.85}
  .ct-dropdown{display:grid;gap:.12rem;position:absolute;top:100%;left:50%;
    transform:translateX(-50%) translateY(9px);min-width:264px;background:#fff;
    border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-lg);
    padding:.5rem;opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .18s ease,transform .18s ease,visibility .18s;z-index:1050}
  .ct-has-dropdown::after{content:"";position:absolute;top:100%;left:0;right:0;height:14px}  /* hover bridge */
  .ct-has-dropdown:hover .ct-dropdown,.ct-has-dropdown:focus-within .ct-dropdown{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(3px)}
  .ct-dd-item{display:flex;align-items:center;gap:.7rem;padding:.62rem .8rem;border-radius:10px;color:var(--ctn-ink);font-size:.92rem;font-weight:500;white-space:nowrap}
  .ct-dd-item i{width:1.4rem;text-align:center;color:var(--ctn-green);font-size:.95rem;flex-shrink:0}
  .ct-dd-item:hover{background:var(--ctn-bg-soft);color:var(--ctn-green-deep);text-decoration:none}
  .ct-dd-all{border-top:1px solid var(--ctn-line);margin-top:.3rem;padding-top:.72rem;color:var(--ctn-green);font-weight:700}
}

/* --- TYPOGRAPHY: distinctive Roboto Slab headings. They were resolving to the
   Montserrat stack which is NEVER loaded (-> Inter/Arial fallback). Roboto Slab
   IS loaded (fonts.css @import); pin it so headings actually level up. --- */
:root{--ct-font-display:'Roboto Slab',Georgia,'Times New Roman',serif}
h1,h2,h3,h4,h5,h6,.ct-display{font-family:'Roboto Slab',Georgia,'Times New Roman',serif;letter-spacing:-.015em}

/* --- FLAT BRAND ICON: clean chip (green square + gold train) replacing the
   metallic-gradient locomotive SVG in the nav + footer. Favicons untouched. --- */
.ct-brand-icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  width:38px;height:38px;border-radius:11px;background:var(--ctn-green);color:var(--ctn-gold);
  font-size:1.18rem;line-height:1}
.ct-brand-lockup .ct-brand-icon{width:36px;height:36px;border-radius:10px;font-size:1.1rem}
.ct-lockup .ct-brand-icon{background:rgba(255,255,255,.12);color:var(--ctn-gold)}  /* footer on dark green */


/* ---- comparison table (/compare/) — Cash Train column highlighted ---- */
.ct-compare-table{width:100%;border-collapse:collapse;font-size:.92rem;min-width:680px}
.ct-compare-table th,.ct-compare-table td{padding:.8rem .9rem;text-align:left;border-bottom:1px solid var(--ctn-line);vertical-align:top}
.ct-compare-table thead th{font-family:var(--ct-font-display),Georgia,serif;font-weight:800;color:var(--ctn-green-ink);white-space:nowrap;border-bottom:2px solid var(--ctn-line-strong)}
.ct-compare-table thead th span{display:block;font-family:var(--ctn-sans);font-weight:500;font-size:.72rem;color:var(--ctn-faint)}
.ct-compare-table tbody th{font-weight:700;color:var(--ctn-ink);white-space:nowrap}
.ct-compare-table .ct-compare-feature{background:var(--ctn-bg-mint);color:var(--ctn-green-ink);font-weight:700}
.ct-compare-table thead .ct-compare-feature{border-bottom-color:var(--ctn-green)}
.ct-compare-table tbody tr:hover td,.ct-compare-table tbody tr:hover th{background:var(--ctn-bg-soft)}
.ct-compare-table tbody tr:hover .ct-compare-feature{background:#dceee4}


/* ---- eligibility self-check (/eligibility/#eligibility-check) ---- */
.ct-elig{max-width:680px;margin:0 auto;background:#fff;border:1px solid var(--ctn-line);border-radius:var(--ctn-radius);box-shadow:var(--ctn-shadow-sm);padding:clamp(1.25rem,3vw,2rem)}
.ct-elig-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 0;border-bottom:1px solid var(--ctn-line)}
.ct-elig-row:last-of-type{border-bottom:0}
.ct-elig-label{font-size:.98rem;color:var(--ctn-ink);font-weight:500;line-height:1.4}
.ct-elig-opts{display:inline-flex;gap:.4rem;flex-shrink:0}
.ct-elig-btn{min-width:60px;padding:.5em 1.1em;border:1.5px solid var(--ctn-line-strong);border-radius:var(--ctn-radius-pill);background:#fff;color:var(--ctn-muted);font-family:var(--ct-font-display),Georgia,serif;font-weight:700;font-size:.9rem;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.ct-elig-btn:hover{border-color:var(--ctn-green)}
.ct-elig-btn.is-on{background:var(--ctn-green);border-color:var(--ctn-green);color:#fff}
.ct-elig-actions{margin-top:1.5rem;text-align:center}
.ct-elig-result{margin-top:1.3rem;padding:1.1rem 1.2rem;border-radius:var(--ctn-radius-sm);font-size:.95rem;line-height:1.55}
.ct-elig-result.is-pass{background:var(--ctn-bg-mint);border:1px solid var(--ctn-green);color:var(--ctn-green-ink)}
.ct-elig-result.is-soft{background:#fff7e6;border:1px solid var(--ctn-gold);color:#5a4a1a}
.ct-elig-result.is-prompt{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line-strong);color:var(--ctn-muted)}
@media(max-width:520px){.ct-elig-row{flex-direction:column;align-items:flex-start;gap:.55rem}.ct-elig-opts{width:100%}.ct-elig-btn{flex:1}}


/* ---- affordability self-assessment (/calculator/#affordability) ---- */
.ct-afford-row{margin-bottom:1rem}
.ct-afford-row label{display:block;font-size:.92rem;font-weight:600;color:var(--ctn-ink);margin-bottom:.4rem}
.ct-afford-input{display:flex;align-items:center;border:1.5px solid var(--ctn-line-strong);border-radius:var(--ctn-radius-sm);overflow:hidden;background:#fff}
.ct-afford-input span{padding:.7rem .8rem;background:var(--ctn-bg-soft);color:var(--ctn-muted);font-weight:700;border-right:1.5px solid var(--ctn-line)}
.ct-afford-input input{flex:1;border:0;padding:.7rem .8rem;font-size:1rem;color:var(--ctn-ink);outline:none;background:#fff;-moz-appearance:textfield}
.ct-afford-input input::-webkit-outer-spin-button,.ct-afford-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ct-afford-result{margin-top:1.2rem;padding:1.05rem 1.15rem;border-radius:var(--ctn-radius-sm);font-size:.93rem;line-height:1.55}
.ct-afford-result.is-ok{background:var(--ctn-bg-mint);border:1px solid var(--ctn-green);color:var(--ctn-green-ink)}
.ct-afford-result.is-warn{background:#fff7e6;border:1px solid var(--ctn-gold);color:#5a4a1a}
.ct-afford-result.is-prompt{background:var(--ctn-bg-soft);border:1px solid var(--ctn-line-strong);color:var(--ctn-muted)}

/* ctfix-20260705: mobile — tables scroll inside main instead of escaping viewport (audit b3nkzqijw) */
@media (max-width:760px){
  main table{display:block;overflow-x:auto;max-width:100%}
}