/* ============================================================
   Dream Force — Homepage design variations (V2 Bento, V3 Editorial)
   Loaded only by home-v2.html / home-v3.html (after site.css)
   ============================================================ */

/* ===========================================================
   VARIATION 2 — BENTO MODERN
   =========================================================== */
.v2-hero{ position:relative; overflow:hidden; padding:48px 0 70px;
  background:
   radial-gradient(circle at 1px 1px, rgba(255,255,255,.05) 1px, transparent 0) 0 0/24px 24px,
   linear-gradient(135deg,var(--navy-900),var(--navy-700)); }
.v2-hero::before{ content:""; position:absolute; inset:0; pointer-events:none; background:
   radial-gradient(760px 460px at 90% -10%, rgba(var(--glow-rgb),.5), transparent 60%),
   radial-gradient(520px 360px at 4% 120%, rgba(var(--gold-rgb),.16), transparent 60%); }
.v2-hero .wrap{ position:relative; }
.v2-hero-grid{ display:grid; grid-template-columns:1.04fr .96fr; gap:54px; align-items:center; }
.v2-eyebrow{ display:inline-flex; align-items:center; gap:9px; font-size:13px; font-weight:700; letter-spacing:1.2px;
  text-transform:uppercase; color:#fff; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18);
  padding:8px 15px; border-radius:var(--r-full); margin-bottom:22px; }
.v2-eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--teal-400); }
.v2-hero h1{ color:#fff; font-size:clamp(36px,5vw,62px); line-height:1.1; letter-spacing:-.5px; margin:0 0 20px; }
.v2-hero h1 .hl{ color:var(--teal-400); }
.v2-hero .lead{ color:#a9bccd; font-size:19px; max-width:54ch; margin:0 0 30px; }
.v2-hero .lead-actions .btn-primary{ border-radius:var(--r-full); }
.v2-hero .lead-actions .btn-ghost-light{ border-radius:var(--r-full); }
.v2-trust{ display:flex; gap:24px; flex-wrap:wrap; margin-top:32px; padding-top:26px; border-top:1px solid rgba(255,255,255,.13); }
.v2-trust div{ display:inline-flex; align-items:center; gap:9px; color:#cfe0ee; font-weight:600; font-size:15px; }
.v2-trust .ic{ width:20px; height:20px; color:var(--teal-400); }

/* bento grid */
.bento{ display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:96px; gap:14px; }
.bento .bt{ border-radius:var(--r-xl); overflow:hidden; position:relative; box-shadow:var(--sh-lg); }
.bt-photo{ grid-column:span 4; grid-row:span 3; }
.bt-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.bt-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(11,28,44,.45)); }
.bt-photo .bt-cap{ position:absolute; left:18px; bottom:16px; z-index:2; color:#fff; display:flex; align-items:center; gap:9px; font-weight:600; font-size:14.5px; }
.bt-photo .bt-cap .ic{ width:18px; height:18px; }
.bt-stat{ grid-column:span 2; grid-row:span 2; background:linear-gradient(150deg,var(--teal),var(--teal-600)); color:#fff; padding:20px; display:flex; flex-direction:column; justify-content:center; }
.bt-stat .n{ font-family:var(--serif); font-weight:800; font-size:38px; line-height:1; }
.bt-stat .l{ font-size:13.5px; opacity:.9; margin-top:6px; }
.bt-gold{ grid-column:span 2; grid-row:span 1; background:linear-gradient(150deg,var(--gold),#a9883b); color:#fff; padding:0 18px; display:flex; align-items:center; gap:11px; font-weight:700; }
.bt-gold .ic{ width:24px; height:24px; flex:none; }
.bt-gold small{ display:block; font-weight:500; font-size:11.5px; opacity:.9; }
.bt-live{ grid-column:span 4; grid-row:span 1; background:#fff; padding:0 20px; display:flex; align-items:center; gap:14px; }
.bt-live .bl-ic{ width:38px; height:38px; border-radius:11px; background:var(--green-bg); color:var(--green); display:grid; place-items:center; flex:none; position:relative; }
.bt-live .bl-ic .ic{ width:20px; height:20px; }
.bt-live .bl-ic::after{ content:""; position:absolute; top:-2px; right:-2px; width:10px; height:10px; border-radius:50%; background:var(--green); border:2px solid #fff; animation:pulse 1.8s infinite; }
.bt-live b{ font-family:var(--serif); color:var(--ink); font-size:19px; }
.bt-live span{ font-size:13px; color:var(--muted); }
.bt-flags{ grid-column:span 2; grid-row:span 1; background:var(--navy-800); color:#fff; display:flex; align-items:center; justify-content:center; gap:7px; }
.bt-flags .cflag{ width:26px; height:18px; }

/* bento services mosaic */
.bento-svc{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.bsvc{ border-radius:var(--r-xl); padding:26px; position:relative; overflow:hidden; min-height:188px; display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--line); transition:transform .2s, box-shadow .2s; }
.bsvc:hover{ transform:translateY(-5px); box-shadow:var(--sh-md); }
.bsvc.big{ grid-column:span 2; grid-row:span 2; color:#fff; border:0; background:linear-gradient(150deg,var(--navy),var(--navy-700)); justify-content:flex-end; min-height:auto; }
.bsvc.big .bsvc-photo{ position:absolute; inset:0; }
.bsvc.big .bsvc-photo img{ width:100%; height:100%; object-fit:cover; opacity:.32; }
.bsvc.big > *{ position:relative; z-index:1; }
.bsvc.accent{ background:linear-gradient(150deg,var(--teal),var(--teal-600)); color:#fff; border:0; }
.bsvc .bsvc-ic{ width:50px; height:50px; border-radius:14px; display:grid; place-items:center; margin-bottom:auto;
  background:linear-gradient(150deg,var(--tint-a),var(--tint-b)); color:var(--teal-600); }
.bsvc.big .bsvc-ic, .bsvc.accent .bsvc-ic{ background:rgba(255,255,255,.16); color:#fff; }
.bsvc .bsvc-ic .ic{ width:25px; height:25px; }
.bsvc h3{ font-size:19px; margin:18px 0 7px; }
.bsvc.big h3{ font-size:26px; }
.bsvc p{ font-size:14px; color:var(--muted); margin:0; }
.bsvc.big p, .bsvc.accent p{ color:rgba(255,255,255,.85); }
.bsvc.big p{ font-size:15.5px; }

@media (max-width:980px){
  .v2-hero-grid{ grid-template-columns:1fr; gap:34px; }
  .bento{ max-width:560px; }
  .bento-svc{ grid-template-columns:repeat(2,1fr); }
  .bsvc.big{ grid-column:span 2; grid-row:span 1; min-height:240px; }
}
@media (max-width:560px){
  .bento{ grid-auto-rows:80px; }
  .bento-svc{ grid-template-columns:1fr; }
  .bsvc.big{ grid-column:span 1; }
}

/* ===========================================================
   VARIATION 3 — EDITORIAL WARM
   =========================================================== */
.v3-hero{ position:relative; min-height:92vh; display:flex; align-items:flex-end; overflow:hidden; }
.v3-hero .v3-bg{ position:absolute; inset:0; }
.v3-hero .v3-bg img{ width:100%; height:100%; object-fit:cover; }
.v3-hero .v3-bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(16,30,26,.30) 0%, rgba(16,30,26,.42) 42%, rgba(16,30,26,.86) 100%); }
.v3-hero .wrap{ position:relative; z-index:2; padding-bottom:64px; padding-top:120px; }
.v3-kicker{ display:inline-flex; align-items:center; gap:10px; color:var(--gold-200); font-family:var(--sans);
  font-size:14px; font-weight:700; letter-spacing:2px; text-transform:uppercase; margin-bottom:22px; }
.v3-kicker::before{ content:""; width:40px; height:2px; background:var(--gold); }
.v3-hero h1{ color:#fff; font-family:var(--serif); font-size:clamp(40px,6vw,76px); line-height:1.06; letter-spacing:-.5px; max-width:16ch; margin:0 0 22px; }
.v3-hero h1 em{ font-style:italic; color:var(--teal-200); }
.v3-hero .lead{ color:#e7ddd2; font-size:20px; max-width:50ch; margin:0 0 32px; }
.v3-actions{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.v3-actions .btn-primary{ background:var(--teal); }
.v3-hero .v3-meta{ display:flex; gap:40px; flex-wrap:wrap; margin-top:46px; padding-top:28px; border-top:1px solid rgba(255,255,255,.2); }
.v3-hero .v3-meta .m-n{ font-family:var(--serif); font-weight:800; color:#fff; font-size:30px; line-height:1; }
.v3-hero .v3-meta .m-l{ color:#cdbfb2; font-size:13.5px; margin-top:6px; }

/* editorial section heads */
.ed-head{ display:grid; grid-template-columns:auto 1fr; gap:40px; align-items:end; margin-bottom:50px; }
.ed-head .eh-l .kick{ font-family:var(--sans); font-size:13px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--teal-600); display:block; margin-bottom:12px; }
.ed-head .eh-l h2{ font-size:clamp(30px,3.8vw,46px); line-height:1.12; }
.ed-head .eh-r{ color:var(--muted); font-size:16px; max-width:42ch; padding-bottom:6px; }
@media (max-width:760px){ .ed-head{ grid-template-columns:1fr; gap:18px; } }

/* editorial service rows */
.ed-rows{ border-top:1px solid var(--line); }
.ed-row{ display:grid; grid-template-columns:120px 1fr auto; gap:34px; align-items:center; padding:30px 8px;
  border-bottom:1px solid var(--line); position:relative; transition:padding .25s ease; }
.ed-row::before{ content:""; position:absolute; inset:0; background:var(--tint-a); opacity:0; transition:opacity .25s; z-index:-1; border-radius:var(--r-lg); }
.ed-row:hover{ padding-left:24px; padding-right:24px; }
.ed-row:hover::before{ opacity:1; }
.ed-row .ed-num{ font-family:var(--serif); font-weight:800; font-size:54px; color:var(--line); line-height:1; transition:color .25s; }
.ed-row:hover .ed-num{ color:var(--teal); }
.ed-row .ed-c h3{ font-size:24px; margin-bottom:7px; }
.ed-row .ed-c p{ font-size:15.5px; color:var(--muted); margin:0; max-width:60ch; }
.ed-row .ed-go{ width:52px; height:52px; border-radius:50%; border:1.5px solid var(--line); display:grid; place-items:center; color:var(--teal-600); flex:none; transition:background .25s, color .25s, border-color .25s; }
.ed-row:hover .ed-go{ background:var(--teal); color:#fff; border-color:var(--teal); }
.ed-row .ed-go .ic{ width:22px; height:22px; }
@media (max-width:680px){
  .ed-row{ grid-template-columns:64px 1fr; gap:18px; padding:24px 6px; }
  .ed-row .ed-num{ font-size:34px; }
  .ed-row .ed-go{ display:none; }
}

/* editorial split feature */
.ed-split{ display:grid; grid-template-columns:1fr 1fr; gap:0; border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-lg); }
.ed-split .es-media{ position:relative; min-height:440px; }
.ed-split .es-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ed-split .es-body{ background:var(--navy-800); color:#fff; padding:54px 48px; display:flex; flex-direction:column; justify-content:center; }
.ed-split .es-body .kick{ font-size:13px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--teal-200); margin-bottom:14px; }
.ed-split .es-body h2{ color:#fff; font-size:clamp(26px,3vw,38px); line-height:1.18; margin-bottom:16px; }
.ed-split .es-body p{ color:#cdbfb2; font-size:16px; margin-bottom:24px; }
.ed-split .es-list{ list-style:none; margin:0 0 28px; padding:0; display:grid; gap:13px; }
.ed-split .es-list li{ display:flex; gap:12px; align-items:center; color:#e7ddd2; font-size:15.5px; }
.ed-split .es-list .ic{ width:22px; height:22px; flex:none; color:#fff; background:var(--teal); border-radius:50%; padding:4px; }
@media (max-width:820px){ .ed-split{ grid-template-columns:1fr; } .ed-split .es-media{ min-height:280px; } .ed-split .es-body{ padding:40px 30px; } }

/* warm hero nav legibility: when v3, header sits over image */
body.v3 .nav{ background:rgba(255,255,255,.97); }
/* make the top menu follow the page on scroll (topbar scrolls away, nav sticks) */
body.v3 header{ display:contents; }
body.v3 .nav{ position:sticky; top:0; z-index:60; }

/* ---- V2 extra punch (scoped to body.v2) ---- */
body.v2 .v2-eyebrow{ background:rgba(var(--gold-rgb),.16); border-color:rgba(var(--gold-rgb),.4); color:var(--gold-200); }
body.v2 .v2-eyebrow .dot{ background:var(--gold); }
body.v2 .bt{ transition:transform .2s ease, box-shadow .2s ease; }
body.v2 .bt-photo:hover,body.v2 .bt-stat:hover,body.v2 .bt-live:hover{ transform:translateY(-3px); }
body.v2 .bsvc{ border-width:1.5px; }
body.v2 .bsvc:hover{ box-shadow:0 0 0 2px var(--teal-200), var(--sh-md); }
body.v2 .bsvc.big{ box-shadow:var(--sh-lg); }
body.v2 .section .eyebrow::before{ background:var(--teal); }
body.v2 .h-sec{ letter-spacing:-1px; }

/* ============================================================
   V2 DARK THEME — full dark "fintech" treatment (body.v2)
   ============================================================ */
body.v2{
  --bg:#0a0e20; --bg-2:#0f1430; --surface:#161c3a; --surface-raised:#1d2448;
  --ink:#f2f4ff; --body:#aeb7da; --muted:#828dba;
  --line:#262e54; --line-soft:#1b2142;
  --teal:#6c78ee; --teal-600:#5b67e2; --teal-400:#9aa3f5; --teal-200:#39406f;
  --gold:#e0992f; --gold-200:#f3d9a6;
  --tint-a:#1e2547; --tint-b:#222a52;
  --glow-rgb:108,120,238; --gold-rgb:224,153,47;
  background:var(--bg); color:var(--body);
}
body.v2 .bg-soft{ background:var(--bg-2); }
body.v2 .bg-soft2{ background:var(--bg-2); }

/* nav → dark glass */
body.v2 .nav{ background:rgba(10,14,32,.94); border-bottom-color:var(--line); }
body.v2 .nav.scrolled{ box-shadow:0 6px 24px rgba(0,0,0,.5); }
body.v2 .nav-links a{ color:#e7ebff; }
body.v2 .nav-links a:hover{ color:#fff; background:var(--surface); }
body.v2 .nav-links a.active{ color:var(--teal-400); }
body.v2 .nav-phone{ color:#fff; }
body.v2 .nav-burger{ background:var(--surface); border-color:var(--line); }
body.v2 .nav-burger span{ background:#fff; }
@media (max-width:1024px){ body.v2 .nav-links{ background:#0d1230; } }

/* surfaces → raised dark panels */
body.v2 .bsvc,
body.v2 .nat,
body.v2 .tcard,
body.v2 .faq,
body.v2 .track-card,
body.v2 .post,
body.v2 .value,
body.v2 .agency,
body.v2 .alert,
body.v2 .df-note,
body.v2 .df-channel,
body.v2 .notify-feats li{ background:var(--surface); border-color:var(--line); box-shadow:0 2px 14px rgba(0,0,0,.35); }
body.v2 .bt-live{ background:var(--surface); }
body.v2 .bt-live b{ color:#fff; }
body.v2 .bsvc-ic{ background:var(--surface-raised); color:var(--teal-400); }
body.v2 .svc-no,body.v2 .sr-no{ color:var(--line); }

/* inputs */
body.v2 .track-bar input,
body.v2 .field input,body.v2 .field select,body.v2 .field textarea{ background:var(--bg-2); color:var(--ink); border-color:var(--line); }
body.v2 .track-bar input:focus,body.v2 .field input:focus{ background:var(--surface-raised); border-color:var(--teal); }
body.v2 .track-hint code{ background:var(--surface-raised); color:var(--teal-400); }
body.v2 .track-step .ts-dot{ background:var(--surface-raised); border-color:var(--line); }

/* tints / chips */
body.v2 .fq-no,body.v2 .sr-tag,body.v2 .track-step .ts-tag.cur{ background:var(--surface-raised); color:var(--teal-400); }
body.v2 .pill{ background:var(--surface); border-color:var(--line); color:var(--body); }
body.v2 .ts-tag{ color:var(--teal-400); }

/* ghost button on dark */
body.v2 .btn-ghost{ color:#fff; border-color:var(--line); }
body.v2 .btn-ghost:hover{ background:var(--surface); border-color:var(--teal); }

/* headings stay light via --ink; eyebrow accent */
body.v2 .eyebrow{ color:var(--teal-400); }
body.v2 .faq-support .fs-av{ color:#fff; }

/* glow accents a touch stronger on dark */
body.v2 .v2-hero::before{ opacity:.9; }
body.v2 .bsvc:hover{ box-shadow:0 0 0 2px var(--teal), 0 10px 30px rgba(0,0,0,.5); }

/* ============================================================
   VARIATION 4 — AGENCY (SEOZ-style) · violet & amber
   =========================================================== */
body.v4{ background:var(--bg); }
body.v4 .nav{ background:rgba(255,255,255,.92); }

/* v2 dark — inner-page components (about/services/articles/contact) */
body.v2 .value,body.v2 .agency,body.v2 .svc-row,body.v2 .post-feature,body.v2 .cc,body.v2 .media-frame .mf-tag,body.v2 .inforow{ background:var(--surface); border-color:var(--line); }
body.v2 .filters .fbtn{ background:var(--surface); border-color:var(--line); color:var(--body); }
body.v2 .filters .fbtn.active{ background:var(--teal); border-color:var(--teal); color:#fff; }
body.v2 .agency .ag-ic,body.v2 .inforow .ir-ic{ background:var(--surface-raised); color:var(--teal-400); }
body.v2 .map-embed{ border:1px solid var(--line); }
body.v2 .timeline::before,body.v2 .steps.line .step:not(:last-child)::after{ background:var(--line); }

/* hero */
.v4-hero{ position:relative; overflow:hidden; padding:56px 0 80px; background:var(--bg); }
.v4-hero .blob{ position:absolute; border-radius:50%; filter:blur(8px); pointer-events:none; z-index:0; }
.v4-hero .blob-1{ width:420px; height:420px; right:-90px; top:-120px; background:radial-gradient(circle, rgba(var(--glow-rgb),.18), transparent 68%); }
.v4-hero .blob-2{ width:360px; height:360px; left:-120px; bottom:-140px; background:radial-gradient(circle, rgba(var(--gold-rgb),.16), transparent 68%); }
.v4-hero .ring{ position:absolute; right:8%; top:14%; width:120px; height:120px; border:2px dashed var(--teal-200); border-radius:50%; opacity:.7; z-index:0; }
.v4-hero .wrap{ position:relative; z-index:1; }
.v4-hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:center; }
.v4-badge{ display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--line); box-shadow:var(--sh-sm);
  padding:8px 16px 8px 9px; border-radius:var(--r-full); font-weight:600; font-size:14px; color:var(--ink); margin-bottom:22px; }
.v4-badge .vb-tag{ background:linear-gradient(135deg,var(--teal),var(--teal-600)); color:#fff; font-size:12px; font-weight:700; padding:4px 11px; border-radius:var(--r-full); }
.v4-hero h1{ font-size:clamp(38px,5vw,62px); line-height:1.08; letter-spacing:-1px; color:var(--ink); margin:0 0 20px; }
.v4-hero h1 .hl{ position:relative; color:var(--teal-600); white-space:nowrap; }
.v4-hero h1 .hl::after{ content:""; position:absolute; left:0; right:0; bottom:4px; height:11px; background:var(--gold-200); opacity:.7; z-index:-1; border-radius:3px; }
.v4-hero .lead{ font-size:19px; color:var(--muted); max-width:52ch; margin:0 0 30px; }
.v4-actions{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
.v4-actions .btn-primary{ border-radius:var(--r-full); background:linear-gradient(135deg,var(--teal),var(--teal-600)); box-shadow:0 12px 26px rgba(var(--glow-rgb),.34); }
.v4-actions .btn-ghost{ border-radius:var(--r-full); }
.v4-hstats{ display:flex; gap:40px; margin-top:40px; }
.v4-hstats .hs-n{ font-family:var(--serif); font-weight:800; font-size:40px; color:var(--ink); line-height:1; }
.v4-hstats .hs-n .u{ color:var(--teal-600); }
.v4-hstats .hs-l{ font-size:14px; color:var(--muted); margin-top:6px; max-width:14ch; }
.v4-hstats .hs-div{ width:1px; background:var(--line); }

/* hero visual */
.v4-visual{ position:relative; }
.v4-visual .v4-photo{ border-radius:30px 30px 30px 90px; overflow:hidden; box-shadow:var(--sh-lg); aspect-ratio:1/1.05; }
.v4-visual .v4-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.v4-fcard{ position:absolute; background:#fff; border-radius:16px; box-shadow:var(--sh-lg); padding:14px 16px; display:flex; align-items:center; gap:12px; z-index:3; }
.v4-fcard .fc-ic{ width:42px; height:42px; border-radius:12px; display:grid; place-items:center; flex:none; color:#fff; }
.v4-fcard .fc-ic.teal{ background:linear-gradient(135deg,var(--teal),var(--teal-600)); }
.v4-fcard .fc-ic.gold{ background:linear-gradient(135deg,var(--gold),#cf8a16); }
.v4-fcard .fc-ic .ic{ width:22px; height:22px; }
.v4-fcard b{ display:block; font-family:var(--serif); color:var(--ink); font-size:18px; line-height:1; }
.v4-fcard span{ font-size:12px; color:var(--muted); }
.v4-fcard.top{ top:24px; left:-26px; }
.v4-fcard.bot{ bottom:30px; right:-22px; }
.v4-dots{ position:absolute; right:-18px; top:40%; width:90px; height:90px; z-index:0;
  background-image:radial-gradient(var(--teal-200) 2px, transparent 2px); background-size:16px 16px; opacity:.8; }

@media (max-width:920px){
  .v4-hero-grid{ grid-template-columns:1fr; gap:46px; }
  .v4-visual{ max-width:460px; }
  .v4-fcard.top{ left:0; } .v4-fcard.bot{ right:0; }
}

/* agency services — 4 cards with icon tile */
.ag-svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
@media (max-width:980px){ .ag-svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .ag-svc-grid{ grid-template-columns:1fr; } }
.ag-svc{ background:#fff; border:1px solid var(--line); border-radius:24px; padding:34px 26px; position:relative; overflow:hidden;
  box-shadow:var(--sh-sm); transition:transform .25s ease, box-shadow .25s ease; }
.ag-svc::before{ content:""; position:absolute; left:0; top:0; right:0; height:5px; background:linear-gradient(90deg,var(--teal),var(--teal-400)); transform:scaleX(0); transform-origin:left; transition:transform .3s ease; }
.ag-svc:hover{ transform:translateY(-8px); box-shadow:var(--sh-lg); }
.ag-svc:hover::before{ transform:scaleX(1); }
.ag-svc .as-ic{ width:74px; height:74px; border-radius:22px; display:grid; place-items:center; margin-bottom:22px;
  background:linear-gradient(150deg,var(--tint-a),var(--tint-b)); color:var(--teal-600); transition:background .3s, color .3s; position:relative; }
.ag-svc:hover .as-ic{ background:linear-gradient(135deg,var(--teal),var(--teal-600)); color:#fff; }
.ag-svc .as-ic .ic{ width:36px; height:36px; }
.ag-svc .as-no{ position:absolute; top:30px; right:28px; font-family:var(--serif); font-weight:800; font-size:30px; color:var(--line); }
.ag-svc h3{ font-size:20px; margin-bottom:10px; }
.ag-svc p{ font-size:14.5px; color:var(--muted); margin:0 0 18px; }
.ag-svc .as-link{ display:inline-flex; align-items:center; gap:8px; font-weight:700; font-size:14px; color:var(--teal-600); }
.ag-svc .as-link .ic{ width:16px; height:16px; transition:transform .2s; }
.ag-svc:hover .as-link .ic{ transform:translateX(4px); }

/* working process */
.ag-proc{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; position:relative; }
@media (max-width:820px){ .ag-proc{ grid-template-columns:1fr; gap:22px; } }
.ag-step{ text-align:center; position:relative; padding:0 10px; }
.ag-step .ap-circle{ width:104px; height:104px; margin:0 auto 22px; border-radius:50%; display:grid; place-items:center; position:relative;
  background:#fff; border:2px dashed var(--teal-200); }
.ag-step .ap-circle .ap-in{ width:72px; height:72px; border-radius:50%; background:linear-gradient(150deg,var(--teal),var(--teal-600)); color:#fff; display:grid; place-items:center; }
.ag-step .ap-circle .ap-in .ic{ width:34px; height:34px; }
.ag-step .ap-no{ position:absolute; top:-4px; right:50%; margin-right:-58px; width:34px; height:34px; border-radius:50%; background:var(--gold); color:#3a2f12;
  font-family:var(--serif); font-weight:800; font-size:15px; display:grid; place-items:center; border:3px solid var(--bg); }
.ag-step h3{ font-size:20px; margin-bottom:9px; }
.ag-step p{ font-size:14.5px; color:var(--muted); margin:0; max-width:34ch; margin-inline:auto; }
.ag-proc .ap-conn{ position:absolute; top:52px; left:16.6%; right:16.6%; height:2px; background:repeating-linear-gradient(90deg,var(--teal-200) 0 8px, transparent 8px 16px); z-index:-1; }
@media (max-width:820px){ .ag-proc .ap-conn{ display:none; } }

/* why-choose counters band */
.ag-counters{ background:linear-gradient(135deg,var(--navy-800),var(--teal-600)); border-radius:30px; padding:54px 40px; position:relative; overflow:hidden; }
.ag-counters::before{ content:""; position:absolute; right:-40px; top:-40px; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle,rgba(255,255,255,.12),transparent 70%); }
.ag-counters .agc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; position:relative; }
@media (max-width:760px){ .ag-counters .agc-grid{ grid-template-columns:repeat(2,1fr); gap:36px 20px; } }
.agc{ text-align:center; color:#fff; }
.agc .ag-n{ font-family:var(--serif); font-weight:800; font-size:clamp(34px,4vw,46px); line-height:1; }
.agc .ag-n .u{ color:var(--gold-200); }
.agc .ag-l{ font-size:14.5px; color:rgba(255,255,255,.82); margin-top:9px; }
.agc-sep{ position:absolute; }

/* ---- V4 STRUCTURAL DIFFERENTIATION (floating nav + agency cards) ---- */
/* remove dark utility bar, float the navbar as a rounded capsule */
body.v4 .topbar{ display:none; }
body.v4 .nav{ position:fixed; top:16px; left:50%; transform:translateX(-50%); width:calc(100% - 36px); max-width:1140px;
  border:1px solid var(--line); border-radius:var(--r-full); background:rgba(255,255,255,.86); backdrop-filter:saturate(1.4) blur(12px);
  box-shadow:0 14px 40px rgba(124,58,237,.12); }
body.v4 .nav.scrolled{ box-shadow:0 18px 46px rgba(124,58,237,.18); }
body.v4 .nav .wrap{ height:62px; padding-left:24px; padding-right:12px; }
body.v4 .nav-links a.active::after{ left:15px; right:15px; background:var(--teal); }
body.v4 .nav-cta .btn-primary{ border-radius:var(--r-full); background:linear-gradient(135deg,var(--teal),var(--teal-600)); }
body.v4 .v4-hero{ padding-top:112px; }
body.v4 .fab a.fab-line{ background:var(--teal); }

/* big rounded agency cards across reused sections */
body.v4 .nat,body.v4 .track-card,body.v4 .tcard,body.v4 .faq{ border-radius:24px; }
body.v4 .nat:hover,body.v4 .tcard:hover{ box-shadow:0 16px 40px rgba(126,211,33,.16); }
body.v4 .gitem{ border-radius:24px; }
body.v4 .cc-ic,body.v4 .nat .cflag{ border-radius:14px; }
body.v4 .post-cat{ background:var(--teal-600); }
body.v4 .post .post-more,body.v4 .post:hover h3{ color:var(--teal-600); }
body.v4 .pill{ background:#fff; border-color:var(--line); }
body.v4 .pill .dot{ background:var(--teal); }
/* tracking + faq accents to violet (inherits via tokens, nudge specifics) */
body.v4 .track-live{ background:var(--tint-a); color:var(--teal-600); }
body.v4 .track-live .dot{ background:var(--teal); }
body.v4 .faq.open::before,body.v4 .faq-q .fq-no{ background:var(--teal); }
body.v4 .faq.open .faq-q .fq-no{ background:var(--teal-600); }
/* eyebrow becomes a soft pill chip */
body.v4 .eyebrow{ background:var(--tint-a); color:var(--teal-600); padding:7px 15px; border-radius:var(--r-full); }
body.v4 .eyebrow::before{ display:none; }
@media (max-width:1024px){ body.v4 .nav{ top:10px; width:calc(100% - 24px); } }

/* ---- V4 StaffX flavor: lime buttons, rotating badge, about ---- */
body.v4 .btn-primary,body.v4 .v4-actions .btn-primary{ background:var(--teal); color:var(--ink); box-shadow:0 12px 26px rgba(var(--glow-rgb),.4); }
body.v4 .btn-primary:hover{ background:var(--teal-400); }
body.v4 .v4-badge .vb-tag{ background:var(--teal); color:var(--ink); }
body.v4 .v4-hero h1 .hl{ color:var(--teal-600); }
body.v4 .ag-svc:hover .as-ic{ background:var(--teal); color:var(--ink); }
body.v4 .ag-step .ap-circle .ap-in{ background:var(--teal); color:var(--ink); }
body.v4 .ag-step .ap-no{ background:var(--ink); color:#fff; }
body.v4 .v4-fcard .fc-ic.teal{ background:var(--teal); color:var(--ink); }
body.v4 .v4-fcard .fc-ic.gold{ background:var(--ink); color:var(--teal); }
body.v4 .ag-counters{ background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); }
body.v4 .agc .ag-n .u{ color:var(--teal); }
body.v4 .cta-band{ background:linear-gradient(135deg,var(--navy-900),var(--navy-700)); }
body.v4 .btn-gold{ background:var(--teal); color:var(--ink); }

/* rotating circular badge */
.spin-badge{ position:relative; width:128px; height:128px; border-radius:50%; background:var(--teal); display:grid; place-items:center; }
.spin-badge .sb-rotate{ position:absolute; inset:0; animation:dfspin 16s linear infinite; }
.spin-badge .sb-rotate svg{ width:100%; height:100%; }
.spin-badge .sb-core{ width:78px; height:78px; border-radius:50%; background:var(--ink); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; }
.spin-badge .sb-core .ic{ width:26px; height:26px; color:var(--teal); }
.spin-badge .sb-core img.sb-mark{ width:34px; height:27px; object-fit:contain; }
.spin-badge .sb-core img.sb-word{ width:52px; height:auto; object-fit:contain; }
@keyframes dfspin{ to{ transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){ .spin-badge .sb-rotate{ animation:none; } }

/* about — two stacked images + badge */
.ag-about-grid{ display:grid; grid-template-columns:.95fr 1.05fr; gap:58px; align-items:center; }
@media (max-width:880px){ .ag-about-grid{ grid-template-columns:1fr; gap:60px; } }
.ag-about-media{ position:relative; }
.ag-about-media .am-1{ border-radius:26px; overflow:hidden; box-shadow:var(--sh-lg); }
.ag-about-media .am-1 img{ width:100%; height:430px; object-fit:cover; display:block; }
.ag-about-media .am-2{ position:absolute; right:-22px; bottom:-34px; width:210px; border-radius:20px; overflow:hidden; border:7px solid var(--bg); box-shadow:var(--sh-lg); }
.ag-about-media .am-2 img{ width:100%; height:178px; object-fit:cover; display:block; }
.ag-about-media .spin-badge{ position:absolute; left:-34px; top:26px; box-shadow:var(--sh-lg); z-index:3; }
.ag-about .ab-list{ list-style:none; padding:0; margin:20px 0 28px; display:grid; gap:13px; }
.ag-about .ab-list li{ display:flex; gap:13px; align-items:center; font-size:15.5px; color:var(--ink); font-weight:500; }
.ag-about .ab-list .ic{ width:24px; height:24px; flex:none; color:var(--ink); background:var(--teal); border-radius:50%; padding:5px; }
@media (max-width:560px){ .ag-about-media .am-2{ width:150px; right:0; } .ag-about-media .spin-badge{ width:96px; height:96px; left:-10px; } }

/* ============================================================
   VARIATION 5 — CORPORATE (StaffX index5) · royal blue
   =========================================================== */
/* announcement bar replaces dark topbar */
body.v5 .topbar{ background:linear-gradient(90deg,var(--teal-600),var(--teal)); }
body.v5 .topbar .tb-license b{ color:#fff; }
body.v5 .topbar a,body.v5 .topbar .tb-license,body.v5 .topbar .tb-item{ color:#eaf1fe; }
body.v5 .topbar .ic{ color:#fff; }

/* hero — centered bold statement on tinted bg + partner strip */
.v5-hero{ position:relative; overflow:hidden; background:radial-gradient(900px 460px at 50% -16%, var(--tint-a), var(--bg) 62%); padding:70px 0 0; }
.v5-hero .wrap{ position:relative; z-index:1; }
.v5-hero .v5-top{ display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center; }
.v5-eyebrow{ display:inline-flex; align-items:center; gap:9px; background:#fff; border:1px solid var(--line); box-shadow:var(--sh-sm);
  padding:8px 16px; border-radius:var(--r-full); font-weight:700; font-size:13.5px; color:var(--teal-600); margin-bottom:24px; }
.v5-eyebrow .dot{ width:8px; height:8px; border-radius:50%; background:var(--teal); }
.v5-hero h1{ font-size:clamp(40px,5.4vw,68px); line-height:1.04; letter-spacing:-1.5px; color:var(--ink); margin:0 0 22px; }
.v5-hero h1 .hl{ color:var(--teal-600); }
.v5-hero .lead{ font-size:19px; color:var(--muted); max-width:48ch; margin:0 0 30px; }
.v5-actions{ display:flex; gap:15px; flex-wrap:wrap; align-items:center; }
.v5-actions .btn-primary{ border-radius:var(--r-full); }
.v5-hero-media{ position:relative; }
.v5-hero-media .vh-img{ border-radius:26px; overflow:hidden; box-shadow:var(--sh-lg); aspect-ratio:1/1; }
.v5-hero-media .vh-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.v5-hero-media .vh-card{ position:absolute; left:-22px; bottom:34px; background:#fff; border-radius:18px; box-shadow:var(--sh-lg); padding:16px 20px; display:flex; align-items:center; gap:14px; }
.v5-hero-media .vh-card .vc-n{ font-family:var(--serif); font-weight:800; font-size:30px; color:var(--teal-600); line-height:1; }
.v5-hero-media .vh-card .vc-l{ font-size:13px; color:var(--muted); max-width:13ch; }
.v5-partners{ margin-top:56px; border-top:1px solid var(--line); padding:26px 0 40px; }
.v5-partners .vp-label{ text-align:center; font-size:13px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--muted); margin-bottom:18px; }
.v5-partners .vp-row{ display:flex; flex-wrap:wrap; justify-content:center; gap:14px 30px; }
.v5-partners .vp-item{ display:inline-flex; align-items:center; gap:10px; color:var(--ink); font-weight:600; font-size:15.5px; opacity:.78; }
.v5-partners .vp-item .ic{ width:22px; height:22px; color:var(--teal-600); }
@media (max-width:880px){ .v5-hero .v5-top{ grid-template-columns:1fr; gap:36px; } .v5-hero-media{ max-width:440px; } }

/* about — image + 4 big stat blocks */
.v5-about{ display:grid; grid-template-columns:.85fr 1.15fr; gap:54px; align-items:center; }
@media (max-width:920px){ .v5-about{ grid-template-columns:1fr; gap:40px; } }
.v5-about-media{ border-radius:26px; overflow:hidden; box-shadow:var(--sh-lg); position:relative; }
.v5-about-media img{ width:100%; height:480px; object-fit:cover; display:block; }
.v5-about-media .vam-badge{ position:absolute; left:20px; bottom:20px; right:20px; background:rgba(15,27,61,.78); backdrop-filter:blur(6px); color:#fff; border-radius:16px; padding:16px 18px; display:flex; align-items:center; gap:13px; }
.v5-about-media .vam-badge .ic{ width:34px; height:34px; color:var(--teal-400); flex:none; }
.v5-about-media .vam-badge b{ display:block; font-family:var(--serif); font-size:18px; }
.v5-about-media .vam-badge span{ font-size:12.5px; color:#aebbd4; }
.v5-stats{ display:grid; grid-template-columns:1fr 1fr; gap:26px 34px; }
@media (max-width:560px){ .v5-stats{ grid-template-columns:1fr; } }
.v5-stat{ border-left:3px solid var(--teal); padding-left:18px; }
.v5-stat .vs-n{ font-family:var(--serif); font-weight:800; font-size:clamp(30px,3.4vw,42px); color:var(--ink); line-height:1; }
.v5-stat .vs-n .u{ color:var(--teal-600); }
.v5-stat .vs-t{ font-weight:700; color:var(--ink); font-size:15.5px; margin:8px 0 5px; }
.v5-stat .vs-d{ font-size:13.5px; color:var(--muted); margin:0; }

/* services — 6-item grid, list style */
.v5-svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:900px){ .v5-svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .v5-svc-grid{ grid-template-columns:1fr; } }
.v5-svc{ background:#fff; border:1px solid var(--line); border-radius:20px; padding:30px 26px; box-shadow:var(--sh-sm);
  transition:transform .22s, box-shadow .22s, background .22s; position:relative; overflow:hidden; }
.v5-svc:hover{ transform:translateY(-6px); box-shadow:var(--sh-lg); background:var(--navy-800); }
.v5-svc .vsi{ width:60px; height:60px; border-radius:16px; display:grid; place-items:center; margin-bottom:20px;
  background:linear-gradient(150deg,var(--tint-a),var(--tint-b)); color:var(--teal-600); transition:background .22s,color .22s; }
.v5-svc:hover .vsi{ background:var(--teal); color:#fff; }
.v5-svc .vsi .ic{ width:30px; height:30px; }
.v5-svc h3{ font-size:19px; margin-bottom:9px; transition:color .22s; }
.v5-svc p{ font-size:14.5px; color:var(--muted); margin:0 0 16px; transition:color .22s; }
.v5-svc .vs-link{ display:inline-flex; align-items:center; gap:7px; font-weight:700; font-size:14px; color:var(--teal-600); transition:color .22s; }
.v5-svc .vs-link .ic{ width:16px; height:16px; transition:transform .2s; }
.v5-svc:hover h3,.v5-svc:hover .vs-link{ color:#fff; }
.v5-svc:hover p{ color:#aebbd4; }
.v5-svc:hover .vs-link .ic{ transform:translateX(4px); }
.v5-svc .vs-no{ position:absolute; top:24px; right:26px; font-family:var(--serif); font-weight:800; font-size:26px; color:var(--line); transition:color .22s; }
.v5-svc:hover .vs-no{ color:rgba(255,255,255,.16); }

/* V5 hero slider */
.v5-slider{ position:relative; }
.v5-slide{ display:none; }
.v5-slide.active{ display:block; animation:v5fade .6s ease; }
@keyframes v5fade{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.v5-slide .hl{ color:var(--teal-600); }
.v5-hero-media .vh-img img{ transition:opacity .5s ease; }
.v5-dots-nav{ display:flex; gap:10px; margin-top:30px; align-items:center; }
.v5-dots-nav button{ width:11px; height:11px; border-radius:var(--r-full); border:0; background:var(--line); cursor:pointer; padding:0; transition:width .25s, background .25s; }
.v5-dots-nav button.on{ width:34px; background:var(--teal); }
.v5-arrows{ display:flex; gap:10px; margin-left:auto; }
.v5-arrows button{ width:46px; height:46px; border-radius:50%; border:1.5px solid var(--line); background:#fff; cursor:pointer; display:grid; place-items:center; color:var(--ink); transition:background .2s,color .2s,border-color .2s; }
.v5-arrows button:hover{ background:var(--teal); color:#fff; border-color:var(--teal); }
.v5-arrows .ic{ width:20px; height:20px; }

/* V5 hero — FULL BACKGROUND slider */
.v5-hero.v5-full{ background:var(--navy-900); padding:0; }
.v5-hero.v5-full .v5-stage{ position:relative; min-height:88vh; display:flex; align-items:center; overflow:hidden; }
.v5-hero.v5-full .v5-bg{ position:absolute; inset:0; z-index:0; }
.v5-hero.v5-full .v5-bg img{ width:100%; height:100%; object-fit:cover; transition:opacity .5s ease; }
.v5-hero.v5-full .v5-bg::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(96deg, rgba(7,13,28,.92) 0%, rgba(7,13,28,.74) 44%, rgba(10,18,40,.42) 100%); }
.v5-hero.v5-full .v5-stage > .wrap{ position:relative; z-index:2; width:100%; padding-top:118px; padding-bottom:60px; }
.v5-hero.v5-full .v5-slider{ max-width:720px; }
.v5-hero.v5-full .v5-eyebrow{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.22); color:#fff; }
.v5-hero.v5-full .v5-eyebrow .dot{ background:var(--teal-400); }
.v5-hero.v5-full h1{ color:#fff; }
.v5-hero.v5-full h1 .hl{ color:var(--teal-400); }
.v5-hero.v5-full .lead{ color:#cdd6ea; }
.v5-hero.v5-full .v5-dots-nav button{ background:rgba(255,255,255,.3); }
.v5-hero.v5-full .v5-dots-nav button.on{ background:var(--teal-400); }
.v5-hero.v5-full .v5-arrows button{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.28); color:#fff; }
.v5-hero.v5-full .v5-arrows button:hover{ background:var(--teal); border-color:var(--teal); }
.v5-hero.v5-full .v5-badge-float{ position:absolute; right:40px; bottom:48px; z-index:2; background:rgba(255,255,255,.96);
  border-radius:18px; box-shadow:var(--sh-lg); padding:18px 22px; display:flex; align-items:center; gap:15px; }
.v5-hero.v5-full .v5-badge-float .vc-n{ font-family:var(--serif); font-weight:800; font-size:34px; color:var(--teal-600); line-height:1; }
.v5-hero.v5-full .v5-badge-float .vc-l{ font-size:13.5px; color:var(--muted); max-width:14ch; }
.v5-hero.v5-full .v5-partners{ position:relative; z-index:2; background:#fff; margin-top:0; border-top:0; padding:26px 0 34px; }
@media (max-width:760px){
  .v5-hero.v5-full .v5-stage{ min-height:auto; }
  .v5-hero.v5-full .v5-stage > .wrap{ padding-top:104px; padding-bottom:48px; }
  .v5-hero.v5-full .v5-badge-float{ display:none; }
}

/* ============================================================
   VARIATION 6 — REGAL LAW FIRM (charcoal · gold · serif)
   =========================================================== */
body.v6{ --serif:"Noto Serif Thai", Georgia, serif; }
body.v6 h1,body.v6 h2,body.v6 h3,body.v6 h4{ letter-spacing:.1px; }
body.v6 .btn-primary{ background:var(--gold); color:var(--navy-900); }
body.v6 .btn-primary:hover{ background:var(--teal-400); }
body.v6 .topbar{ background:var(--navy-900); }
body.v6 .eyebrow{ color:var(--teal-600); letter-spacing:2px; }
body.v6 .eyebrow::before{ background:var(--gold); }

/* hero */
.v6-hero{ position:relative; overflow:hidden; background:linear-gradient(180deg,var(--bg) 0%, var(--tint-a) 100%); padding:64px 0 0; }
.v6-hero .v6-grid{ display:grid; grid-template-columns:1.06fr .94fr; gap:54px; align-items:center; }
.v6-kicker{ display:inline-flex; align-items:center; gap:11px; font-size:13px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--teal-600); margin-bottom:22px; }
.v6-kicker::before{ content:""; width:44px; height:1.5px; background:var(--gold); }
.v6-hero h1{ font-family:var(--serif); font-size:clamp(38px,4.8vw,60px); line-height:1.12; color:var(--ink); margin:0 0 22px; font-weight:700; }
.v6-hero .lead{ font-size:18px; color:var(--body); max-width:54ch; margin:0 0 28px; line-height:1.8; }
.v6-hero .v6-checks{ display:flex; flex-direction:column; gap:13px; margin:0 0 30px; }
.v6-hero .v6-checks div{ display:flex; align-items:center; gap:12px; font-size:16px; color:var(--ink); font-weight:600; }
.v6-hero .v6-checks .ic{ width:22px; height:22px; flex:none; color:var(--gold); }
.v6-hero-media{ position:relative; }
.v6-hero-media .vhm-main{ border-radius:6px; overflow:hidden; box-shadow:var(--sh-lg); aspect-ratio:4/4.6; border-bottom:4px solid var(--gold); }
.v6-hero-media .vhm-main img{ width:100%; height:100%; object-fit:cover; display:block; }
.v6-hero-media .vhm-stat{ position:absolute; left:-26px; bottom:38px; background:var(--navy-900); color:#fff; padding:22px 26px; border-radius:4px; box-shadow:var(--sh-lg); border-bottom:3px solid var(--gold); }
.v6-hero-media .vhm-stat .n{ font-family:var(--serif); font-weight:800; font-size:38px; color:var(--gold); line-height:1; }
.v6-hero-media .vhm-stat .l{ font-size:13px; color:#cabfa8; margin-top:6px; max-width:16ch; }
@media (max-width:900px){ .v6-hero .v6-grid{ grid-template-columns:1fr; gap:40px; } .v6-hero-media{ max-width:460px; } }

/* about with tabs */
.v6-about{ display:grid; grid-template-columns:.9fr 1.1fr; gap:54px; align-items:center; }
@media (max-width:900px){ .v6-about{ grid-template-columns:1fr; gap:38px; } }
.v6-about-media{ border-radius:6px; overflow:hidden; box-shadow:var(--sh-lg); border-bottom:4px solid var(--gold); }
.v6-about-media img{ width:100%; height:480px; object-fit:cover; display:block; }
/* glass stat card overlay (Regalis about) */
.v6-about-media{ position:relative; }
.v6-statcard{ position:absolute; left:0; bottom:64px; display:grid; grid-template-columns:auto 1fr; align-items:center; gap:22px;
  background:rgba(18,17,15,.42); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,.16); border-radius:8px;
  padding:24px 28px; width:88%; }
.v6-statcard .sc-n{ font-weight:800; font-size:clamp(40px,4.4vw,56px); color:#fff; line-height:1; white-space:nowrap; }
.v6-statcard .sc-n .u{ color:var(--gold); }
.v6-statcard .sc-l{ font-size:15px; color:#ece4d4; font-weight:600; margin-top:8px; }
.v6-statcard .sc-d{ font-size:14.5px; color:#cdc4b4; line-height:1.6; border-left:1px solid rgba(255,255,255,.2); padding-left:22px; }
@media (max-width:560px){ .v6-statcard{ grid-template-columns:1fr; gap:10px; position:static; width:100%; border-radius:0 0 8px 8px; background:var(--navy-900); } .v6-statcard .sc-d{ border-left:0; padding-left:0; } }
/* kicker pill (About Our Firm style) */
.v6-kpill{ display:inline-block; background:var(--tint-a); color:var(--ink); font-weight:700; font-size:13.5px; padding:9px 18px; border-radius:6px; margin-bottom:20px; }
.v6-tabs{ display:flex; gap:8px; margin:22px 0 20px; border-bottom:1px solid var(--line); }
.v6-tab{ font-family:var(--sans); font-weight:700; font-size:15px; color:var(--muted); background:none; border:0; padding:12px 18px; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; transition:color .2s,border-color .2s; }
.v6-tab.on{ color:var(--ink); border-bottom-color:var(--gold); }
.v6-tab-body{ display:none; font-size:16px; color:var(--body); line-height:1.85; }
.v6-tab-body.on{ display:block; }
.v6-about-contact{ display:flex; flex-wrap:wrap; gap:24px 40px; margin-top:26px; padding-top:24px; border-top:1px solid var(--line); }
.v6-about-contact .vac{ display:flex; gap:13px; align-items:center; }
.v6-about-contact .vac .ic{ width:38px; height:38px; flex:none; color:var(--gold); background:var(--tint-a); border-radius:50%; padding:9px; }
.v6-about-contact .vac h4{ font-family:var(--sans); font-size:13px; color:var(--muted); font-weight:600; margin:0 0 2px; }
.v6-about-contact .vac b{ font-size:15.5px; color:var(--ink); }

/* 3 feature cards */
.v6-feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border:1px solid var(--line); border-radius:6px; overflow:hidden; background:#fff; }
@media (max-width:820px){ .v6-feat-grid{ grid-template-columns:1fr; } }
.v6-feat{ padding:40px 34px; border-right:1px solid var(--line); transition:background .25s; }
.v6-feat:last-child{ border-right:0; }
.v6-feat:hover{ background:var(--tint-a); }
.v6-feat .vf-ic{ width:64px; height:64px; border-radius:50%; background:var(--navy-900); color:var(--gold); display:grid; place-items:center; margin-bottom:22px; }
.v6-feat .vf-ic .ic{ width:30px; height:30px; }
.v6-feat h3{ font-family:var(--serif); font-size:21px; margin-bottom:11px; }
.v6-feat p{ font-size:14.5px; color:var(--muted); margin:0 0 16px; }
.v6-feat .vf-link{ font-weight:700; font-size:13.5px; color:var(--teal-600); letter-spacing:.5px; text-transform:uppercase; display:inline-flex; gap:7px; align-items:center; }
.v6-feat .vf-link .ic{ width:15px; height:15px; }

/* services — dark section, gold icons */
.v6-svc-sec{ background:var(--navy-900); position:relative; }
.v6-svc-sec .eyebrow{ color:var(--gold); }
.v6-svc-sec .eyebrow::before{ background:var(--gold); }
.v6-svc-sec .h-sec{ color:#fff; }
.v6-svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.1); }
@media (max-width:820px){ .v6-svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .v6-svc-grid{ grid-template-columns:1fr; } }
.v6-svc{ background:var(--navy-900); padding:36px 30px; transition:background .25s; }
.v6-svc:hover{ background:var(--navy-700); }
.v6-svc .vs-ic{ width:58px; height:58px; display:grid; place-items:center; color:var(--gold); border:1px solid rgba(184,146,79,.4); border-radius:50%; margin-bottom:20px; }
.v6-svc .vs-ic .ic{ width:28px; height:28px; }
.v6-svc h3{ font-family:var(--serif); color:#fff; font-size:20px; margin-bottom:10px; }
.v6-svc p{ font-size:14px; color:#b3aa98; margin:0; }

/* work process */
.v6-proc{ display:grid; grid-template-columns:repeat(3,1fr); gap:34px; }
@media (max-width:820px){ .v6-proc{ grid-template-columns:1fr; gap:24px; } }
.v6-step{ position:relative; padding-top:14px; }
.v6-step .vp-n{ font-family:var(--serif); font-weight:800; font-size:56px; color:var(--tint-b); line-height:1; margin-bottom:14px; }
.v6-step h3{ font-family:var(--serif); font-size:22px; margin-bottom:10px; }
.v6-step p{ font-size:15px; color:var(--muted); margin:0; }
.v6-step::before{ content:""; position:absolute; left:0; top:0; width:46px; height:3px; background:var(--gold); }
.v6-slide{ display:none; }
.v6-slide.active{ display:block; animation:v5fade .6s ease; }
.v6-snav{ display:flex; gap:10px; margin-top:8px; }
.v6-snav button{ width:11px; height:11px; border-radius:var(--r-full); border:0; background:var(--line); cursor:pointer; padding:0; transition:width .25s, background .25s; }
.v6-snav button.on{ width:34px; background:var(--gold); }

/* v6 — featured statement band */
.v6-band{ display:grid; grid-template-columns:1fr 1fr; border-radius:6px; overflow:hidden; box-shadow:var(--sh-lg); }
@media (max-width:820px){ .v6-band{ grid-template-columns:1fr; } }
.v6-band .vb-img{ min-height:360px; position:relative; }
.v6-band .vb-img img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.v6-band .vb-body{ background:var(--navy-900); color:#fff; padding:50px 46px; display:flex; flex-direction:column; justify-content:center; border-bottom:4px solid var(--gold); }
.v6-band .vb-q{ font-family:var(--serif); font-size:28px; color:var(--gold); line-height:1; margin-bottom:18px; }
.v6-band .vb-body p{ font-family:var(--serif); font-size:clamp(20px,2vw,25px); line-height:1.55; color:#f3eee4; margin:0; }

/* v6 — team grid */
.v6-team{ display:grid; grid-template-columns:repeat(4,1fr); gap:26px; }
@media (max-width:880px){ .v6-team{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .v6-team{ grid-template-columns:1fr; } }
.v6-tm{ text-align:center; }
.v6-tm .tm-photo{ border-radius:6px; overflow:hidden; aspect-ratio:3/3.5; margin-bottom:18px; position:relative; border-bottom:3px solid var(--gold); }
.v6-tm .tm-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .4s; }
.v6-tm:hover .tm-photo img{ transform:scale(1.05); }
.v6-tm h3{ font-family:var(--serif); font-size:19px; margin-bottom:4px; }
.v6-tm span{ font-size:13.5px; color:var(--teal-600); font-weight:600; }

/* v6 — case studies list */
.v6-cases{ display:grid; grid-template-columns:1fr 1fr; gap:0 50px; }
@media (max-width:760px){ .v6-cases{ grid-template-columns:1fr; gap:0; } }
.v6-case{ display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px 4px; border-bottom:1px solid var(--line); cursor:pointer; transition:padding-left .25s, background .25s; }
.v6-case:hover{ padding-left:14px; }
.v6-case .vc-cat{ font-size:12px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--teal-600); display:block; margin-bottom:6px; }
.v6-case h3{ font-family:var(--serif); font-size:18px; color:var(--ink); margin:0; line-height:1.4; }
.v6-case .vc-go{ width:42px; height:42px; border-radius:50%; border:1px solid var(--line); display:grid; place-items:center; color:var(--gold); flex:none; transition:background .25s,color .25s; }
.v6-case:hover .vc-go{ background:var(--gold); color:#fff; }
.v6-case .vc-go .ic{ width:18px; height:18px; }

/* v6 — counters band */
.v6-counters{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; margin-top:54px; padding-top:46px; border-top:1px solid var(--line); }
@media (max-width:620px){ .v6-counters{ grid-template-columns:1fr 1fr; gap:30px 20px; } }
.v6-cn{ text-align:center; }
.v6-cn .n{ font-family:var(--serif); font-weight:800; font-size:clamp(34px,4vw,46px); color:var(--ink); line-height:1; }
.v6-cn .n .u{ color:var(--gold); }
.v6-cn .l{ font-size:14px; color:var(--muted); margin-top:8px; }

/* v6 — faq tabs */
.v6-faq-tabs{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-bottom:34px; }
.v6-faq-tab{ font-family:var(--sans); font-weight:700; font-size:14.5px; color:var(--muted); background:#fff; border:1px solid var(--line); padding:11px 22px; border-radius:var(--r-full); cursor:pointer; transition:all .2s; }
.v6-faq-tab.on{ background:var(--navy-900); color:var(--gold); border-color:var(--navy-900); }
.v6-faq-group{ display:none; }
.v6-faq-group.on{ display:block; }
body.v6 .faq.open::before{ background:var(--gold); }
body.v6 .faq-q .fq-no{ background:var(--tint-a); color:var(--teal-600); }
body.v6 .faq.open .faq-q .fq-no{ background:var(--gold); color:#fff; }

/* ---- V6 DARK LUXURY HERO (dramatic, distinct) ---- */
body.v6 .topbar{ display:none; }
body.v6 .nav{ background:rgba(12,12,11,.66); border-bottom:1px solid rgba(184,146,79,.28); backdrop-filter:blur(8px); }
body.v6 .nav.scrolled{ background:rgba(12,12,11,.94); }
body.v6 .brand-tag b{ color:#fff; }
body.v6 .nav-links a{ color:#ece4d4; }
body.v6 .nav-links a:hover{ color:#fff; background:rgba(255,255,255,.08); }
body.v6 .nav-links a.active{ color:var(--gold); }
body.v6 .nav-links a.active::after{ background:var(--gold); }
body.v6 .nav-phone{ color:#fff; }
body.v6 .nav-burger{ background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.2); }
body.v6 .nav-burger span{ background:#fff; }
@media (max-width:1024px){ body.v6 .nav-links{ background:#100f0d; } }

.v6-hero{ background:
   radial-gradient(900px 500px at 78% 0%, rgba(184,146,79,.16), transparent 60%),
   linear-gradient(160deg,#15140f 0%, #0c0b09 60%, #0a0a09 100%) !important;
  padding:0 !important; position:relative; }
.v6-stage{ position:relative; min-height:94vh; display:flex; align-items:center; overflow:hidden; }
.v6-stage .v6-bg{ position:absolute; inset:0; z-index:0; }
.v6-stage .v6-bg img{ width:100%; height:100%; object-fit:cover; transition:opacity .6s ease; }
.v6-stage .v6-bg::after{ content:""; position:absolute; inset:0; background:linear-gradient(95deg, rgba(8,8,7,.9) 0%, rgba(8,8,7,.72) 42%, rgba(8,8,7,.42) 100%); }
.v6-stage .v6-bg::before{ content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg,transparent,rgba(184,146,79,.5),transparent); z-index:1; }
.v6-stage > .wrap{ position:relative; z-index:2; width:100%; padding-top:120px; padding-bottom:96px; }
.v6-hero .v6-slider{ max-width:660px; }
.v6-hero .v6-kicker{ color:var(--gold); }
.v6-hero .v6-kicker::before{ background:var(--gold); }
.v6-hero h1{ color:#fdfaf3 !important; font-size:clamp(40px,5.4vw,66px) !important; line-height:1.08 !important; }
.v6-hero h1::after{ content:""; display:block; width:70px; height:2px; background:var(--gold); margin-top:24px; }
.v6-hero .lead{ color:#cabfa8 !important; font-size:18.5px !important; }
.v6-hero .v6-checks div{ color:#ece4d4; }
.v6-hero .v6-checks .ic{ color:var(--gold); }
.v6-hero .btn-primary{ background:var(--gold); color:#15140f; box-shadow:0 14px 30px rgba(184,146,79,.32); }
.v6-hero .btn-primary:hover{ background:var(--teal-400); }
.v6-hero .v6-snav{ margin-top:26px; }
.v6-hero .v6-snav button{ background:rgba(255,255,255,.28); }
.v6-hero .v6-snav button.on{ background:var(--gold); }
/* side arrows */
.v6-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:54px; height:54px; border-radius:50%;
  background:rgba(255,255,255,.08); border:1px solid rgba(184,146,79,.45); color:#fff; cursor:pointer; display:grid; place-items:center; transition:background .2s,color .2s; }
.v6-arrow:hover{ background:var(--gold); color:#15140f; border-color:var(--gold); }
.v6-arrow.prev{ left:26px; } .v6-arrow.next{ right:26px; }
.v6-arrow .ic{ width:22px; height:22px; }
/* bottom trust row */
.v6-trust{ position:absolute; left:0; right:0; bottom:30px; z-index:2; }
.v6-trust .wrap{ display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }
.v6-trust .vt{ display:inline-flex; align-items:center; gap:11px; color:#ece4d4; font-size:16px; font-weight:600; }
.v6-trust .vt::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--gold); }
@media (max-width:980px){ .v6-arrow{ display:none; } }
@media (max-width:760px){ .v6-stage{ min-height:auto; } .v6-stage > .wrap{ padding-top:104px; padding-bottom:120px; } .v6-trust .wrap{ justify-content:flex-start; gap:8px 20px; } .v6-trust .vt{ font-size:13.5px; } }

/* ---- V6 photo cards (replace icons with real images) ---- */
.v6-feat{ padding:0 !important; display:flex; flex-direction:column; }
.v6-feat .vf-img{ height:210px; overflow:hidden; position:relative; }
.v6-feat .vf-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.v6-feat:hover .vf-img img{ transform:scale(1.05); }
.v6-feat .vf-body{ padding:30px 30px 34px; }
.v6-feat h3{ margin-bottom:11px; }

.v6-svc{ padding:0 !important; position:relative; overflow:hidden; min-height:300px; display:flex; align-items:flex-end; }
.v6-svc .vs-img{ position:absolute; inset:0; }
.v6-svc .vs-img img{ width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.v6-svc:hover .vs-img img{ transform:scale(1.06); }
.v6-svc .vs-img::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,10,9,.15) 0%, rgba(10,10,9,.62) 55%, rgba(10,10,9,.92) 100%); }
.v6-svc .vs-c{ position:relative; z-index:1; padding:30px 28px; }
.v6-svc .vs-c .vs-tag{ display:inline-block; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--navy-900); background:var(--gold); padding:4px 11px; border-radius:2px; margin-bottom:14px; }
.v6-svc h3{ margin-bottom:8px; }
.v6-svc:hover{ background:var(--navy-900); }

/* ============================================================
   Ken Burns hero sliders — V3 (cinematic) & V4 (split)
   =========================================================== */
.kb-bg{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.kb-layer{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0;
  transition:opacity 1.1s ease; will-change:opacity,transform; }
.kb-layer.on{ opacity:1; animation:kbzoom 8s ease-out forwards; }
.v3-hero .kb-bg::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(95deg, rgba(8,8,7,.82), rgba(8,8,7,.46) 58%, rgba(8,8,7,.24)); }
@keyframes kbzoom{ from{ transform:scale(1.0); } to{ transform:scale(1.12); } }
@media (prefers-reduced-motion:reduce){ .kb-layer.on{ animation:none; } }

/* V3 cinematic slider */
body.v3 .v3-hero{ min-height:100vh; }
.v3-hero .v3-slide{ display:none; }
.v3-hero .v3-slide.on{ display:block; animation:v5fade .7s ease; }
.v3-snav{ display:flex; gap:11px; margin-top:40px; }
.v3-snav button{ width:42px; height:4px; border-radius:3px; border:0; background:rgba(255,255,255,.32); cursor:pointer; padding:0; transition:background .25s; }
.v3-snav button.on{ background:var(--teal-400); }
.v3-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:54px; height:54px; border-radius:50%;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.35); color:#fff; cursor:pointer; display:grid; place-items:center; transition:background .2s,color .2s; }
.v3-arrow:hover{ background:var(--teal); border-color:var(--teal); color:#fff; }
.v3-arrow.prev{ left:26px; } .v3-arrow.next{ right:26px; }
.v3-arrow .ic{ width:22px; height:22px; }
@media (max-width:980px){ .v3-arrow{ display:none; } }

/* V4 split slider — animated visual stack */
.v4-visual .v4-photo{ position:relative; overflow:hidden; }
.v4-visual .v4-kb{ position:absolute; inset:0; }
.v4-visual .v4-kb .kb-layer{ border-radius:30px 30px 30px 90px; }
.v4-hero .v4-slot{ position:relative; }
.v4-hero .v4-cap{ display:none; }
.v4-hero .v4-cap.on{ display:block; animation:v5fade .6s ease; }
.v4-snav{ display:flex; gap:10px; margin-top:30px; align-items:center; }
.v4-snav button{ width:11px; height:11px; border-radius:var(--r-full); border:0; background:var(--line); cursor:pointer; padding:0; transition:width .25s, background .25s; }
.v4-snav button.on{ width:32px; background:var(--teal); }
.v4-hero .v4-fcard{ z-index:4; }
/* brighter v4 hero pop */
body.v4 .v4-hero{ background:radial-gradient(820px 420px at 50% -10%, var(--tint-a), var(--bg) 64%); }
body.v4 .v4-hero .blob-1{ background:radial-gradient(circle, rgba(var(--glow-rgb),.28), transparent 68%); }
body.v4 .v4-hero .blob-2{ background:radial-gradient(circle, rgba(var(--gold-rgb),.22), transparent 68%); }

/* V4 full-bleed centered Ken Burns slider */
.v4-hero.v4-full{ padding:0 !important; background:var(--navy-900) !important; }
.v4-hero.v4-full .v4fstage{ position:relative; min-height:92vh; display:flex; align-items:center; overflow:hidden; }
.v4-hero.v4-full .kb-bg::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(180deg, rgba(7,17,12,.62), rgba(7,17,12,.5) 50%, rgba(7,17,12,.78)); }
.v4-hero.v4-full .v4fwrap{ position:relative; z-index:2; width:100%; text-align:center; padding:120px 24px 70px; }
.v4-hero.v4-full .v4-cap{ max-width:860px; margin:0 auto; }
.v4-hero.v4-full .v4-badge{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.24); color:#fff; }
.v4-hero.v4-full .v4-badge .vb-tag{ background:var(--teal); color:var(--navy-900); }
.v4-hero.v4-full h1{ color:#fff !important; font-size:clamp(40px,5.6vw,68px) !important; line-height:1.08 !important; margin-bottom:22px; }
.v4-hero.v4-full h1 .hl{ color:var(--teal-400); }
.v4-hero.v4-full .lead{ color:#d6e4cf !important; margin-left:auto; margin-right:auto; }
.v4-hero.v4-full .v4-actions{ justify-content:center; }
.v4-hero.v4-full .v4-snav{ justify-content:center; margin-top:34px; }
.v4-hero.v4-full .v4-snav button{ background:rgba(255,255,255,.34); }
.v4-hero.v4-full .v4-snav button.on{ background:var(--teal); }
.v4-hero.v4-full .v4f-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:52px; height:52px; border-radius:50%;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.34); color:#fff; cursor:pointer; display:grid; place-items:center; transition:background .2s,color .2s; }
.v4-hero.v4-full .v4f-arrow:hover{ background:var(--teal); color:var(--navy-900); border-color:var(--teal); }
.v4-hero.v4-full .v4f-arrow.prev{ left:26px; } .v4-hero.v4-full .v4f-arrow.next{ right:26px; }
.v4-hero.v4-full .v4f-arrow .ic{ width:21px; height:21px; }
.v4-hero.v4-full .v4f-trust{ position:absolute; left:0; right:0; bottom:28px; z-index:2; display:flex; justify-content:center; gap:14px 34px; flex-wrap:wrap; }
.v4-hero.v4-full .v4f-trust span{ display:inline-flex; align-items:center; gap:9px; color:#e7f3df; font-weight:600; font-size:15px; }
.v4-hero.v4-full .v4f-trust span::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--teal); }
@media (max-width:980px){ .v4-hero.v4-full .v4f-arrow{ display:none; } }
@media (max-width:760px){ .v4-hero.v4-full .v4fstage{ min-height:auto; } .v4-hero.v4-full .v4fwrap{ padding:104px 20px 110px; } }

/* ============================================================
   V3 EXPIRY-ALERT SECTION → green (match Design 4)
   Recolor only the notify section + its heading via Design 4's
   agency-green tokens, scoped to body.v3.
   ============================================================ */
body.v3 .notify-grid,
body.v3 .notify-grid .phone,
body.v3 .center:has(+ .notify-grid){
  --navy:#19271f; --navy-700:#13201a; --navy-800:#0e1813; --navy-900:#09110d;
  --teal:#5ba32a; --teal-600:#4d7c1a; --teal-400:#bce86e; --teal-200:#e3f4c3;
  --gold:#2c4a32; --gold-200:#cfe3b0;
  --glow-rgb:158,226,63; --gold-rgb:44,74,50;
  --tint-a:#eef6dd; --tint-b:#e2f0c6;
}
/* icon tiles + accent bars to green family */
body.v3 .notify-grid .alert.a-navy::before{ background:#19271f; }
body.v3 .notify-grid .alert.a-navy .a-ic{ background:#19271f; }
body.v3 .notify-grid .alert.a-teal::before{ background:#5ba32a; }
body.v3 .notify-grid .alert.a-teal .a-ic{ background:#eef6dd; color:#4d7c1a; }
body.v3 .notify-grid .alert.a-gold::before{ background:#84c43f; }
body.v3 .notify-grid .alert.a-gold .a-ic{ background:linear-gradient(150deg,#84c43f,#5ba32a); color:#fff; }
/* round-status chips on a green base */
body.v3 .notify-grid .a-round.r-ok{ background:#e3f4c3; color:#3d6b16; }
/* phone notification accent dots */
body.v3 .notify-grid .df-note.n-navy{ border-left-color:#19271f; }
body.v3 .notify-grid .df-note.n-teal{ border-left-color:#5ba32a; }
body.v3 .notify-grid .df-note.n-navy .nt-ic{ background:#19271f; }
body.v3 .notify-grid .df-note.n-teal .nt-ic{ background:#eef6dd; color:#4d7c1a; }
/* channel chips: LINE stays green (already), call/mail follow green */
body.v3 .notify-grid .notify-feats .ic{ color:#4d7c1a; }

/* ============================================================
   V3 ABOUT SECTION (borrowed from Design 4) → green palette
   ============================================================ */
body.v3 .ag-about,
body.v3 .ag-about .spin-badge{
  --navy:#19271f; --navy-700:#13201a; --navy-800:#0e1813; --navy-900:#09110d;
  --teal:#5ba32a; --teal-600:#4d7c1a; --teal-400:#bce86e; --teal-200:#e3f4c3;
  --gold:#2c4a32; --gold-200:#cfe3b0;
  --glow-rgb:158,226,63; --gold-rgb:44,74,50;
  --tint-a:#eef6dd; --tint-b:#e2f0c6;
}
body.v3 .ag-about .eyebrow{ background:#e3f4c3; color:#3d6b16; }
body.v3 .ag-about .ab-list .ic{ background:#5ba32a; color:#fff; }
body.v3 .ag-about .btn-primary{ background:#5ba32a; color:#fff; box-shadow:0 10px 24px rgba(91,163,42,.32); }
body.v3 .ag-about .btn-primary:hover{ background:#4d7c1a; }
body.v3 .ag-about .spin-badge{ background:#86e01a; }
body.v3 .ag-about .am-2{ border-color:var(--bg); }