/* ═══════════════════════════════════════════════════════════════════════
   TaxClue — HOME (light) · flagship polish
   ------------------------------------------------------------------------
   Loaded LAST on the home template, after mythos-home.css + theme-light.css.
   Purpose:
     1. Re-enable tasteful MOTION on the hero (mythos-home.css froze it to a
        static block on 2026-08-13; the brief is a motion-forward light hero).
     2. Premium refinement of the hero + key home sections for the light theme.
   All rules are scoped to html[data-theme="light"] so they only apply on light
   and out-specify the frozen `animation:none` block in mythos-home.css.
   ═══════════════════════════════════════════════════════════════════════ */

/* ═══════════════════════════════════════════════════════════════════════
   HERO · AURORA MESH (2026-08-17) — richer, motion-forward light hero.
   Layers (back → front):
     0. Ivory canvas + drifting brand colour blooms (navy / crimson / amber /
        a green tricolour nod) built as a mesh of soft radial gradients.
     1. .qhp-hero::before — a large blurred diagonal aurora ribbon that sweeps.
     2. .ph-grid-bg      — refined edge-masked blueprint grid (kept).
     3. .ph-sky-stars(2) — repurposed into soft floating particle "dust" in
        navy / crimson so they actually read on ivory (white was invisible).
     4. .ph-spotlight    — warm cursor glow re-enabled (presets B/C).
   All scoped to html[data-theme="light"] and !important to beat the frozen
   `animation:none` / `display:none` block in mythos-home.css.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .qhp-hero{
  /* Tighter gap between the header/menu and hero content (mythos = +80px) */
  padding-top: calc(var(--ticker-h,36px) + var(--hdr-h,76px) + 40px) !important;
  background:
    radial-gradient(ellipse 40% 46% at 18% 22%, rgba(10,19,43,.10),  transparent 60%),
    radial-gradient(ellipse 52% 56% at 50% 30%, rgba(227,25,55,.16),  transparent 64%),
    radial-gradient(ellipse 44% 50% at 84% 26%, rgba(180,83,9,.11),   transparent 62%),
    radial-gradient(ellipse 50% 46% at 78% 88%, rgba(19,136,8,.075),  transparent 64%),
    radial-gradient(ellipse 46% 44% at 16% 84%, rgba(227,25,55,.07),  transparent 64%),
    linear-gradient(180deg, #FFFFFF 0%, #FBFCFE 55%, #F6F8FC 100%) !important;
  background-size: 200% 200%, 180% 180%, 200% 200%, 220% 220%, 200% 200%, 100% 100% !important;
  animation: heroMeshDrift 26s ease-in-out infinite !important;
}
@keyframes heroMeshDrift{
  0%   { background-position: 12% 18%, 50% 30%, 82% 24%, 78% 88%, 16% 84%, center; }
  50%  { background-position: 20% 26%, 46% 24%, 74% 30%, 84% 80%, 10% 78%, center; }
  100% { background-position: 12% 18%, 50% 30%, 82% 24%, 78% 88%, 16% 84%, center; }
}

/* 1 · Diagonal aurora ribbon — re-enabled on light, retinted tricolour */
html[data-theme="light"] .qhp-hero::before{
  display: block !important;
  content:''; position:absolute; top:2%; left:-18%; right:-18%; height:60%;
  background: linear-gradient(115deg,
      transparent 16%,
      rgba(255,153,51,.10) 30%,
      rgba(227,25,55,.09)  46%,
      rgba(255,255,255,.04) 56%,
      rgba(10,19,43,.06)   68%,
      rgba(19,136,8,.07)   80%,
      transparent 92%) !important;
  filter: blur(60px) !important;
  opacity: 1 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  animation: heroAurora 18s ease-in-out infinite alternate !important;
}
@keyframes heroAurora{
  0%   { transform: translateX(-7%) skewX(-3deg); opacity:.55; }
  100% { transform: translateX(7%)  skewX(3deg);  opacity:.9;  }
}

/* 2 · Blueprint grid (edge-masked so it dissolves toward the sides) */
html[data-theme="light"] .ph-grid-bg{
  background-image:
    linear-gradient(rgba(10,19,43,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,19,43,.06) 1px, transparent 1px) !important;
  background-size: 34px 34px !important;
  -webkit-mask-image: radial-gradient(ellipse 62% 64% at 50% 42%, #000 22%, transparent 74%) !important;
          mask-image: radial-gradient(ellipse 62% 64% at 50% 42%, #000 22%, transparent 74%) !important;
  opacity: 1 !important;
  animation: gridBreathe 9s ease-in-out infinite !important;
}
@keyframes gridBreathe{ 0%,100%{opacity:.75} 50%{opacity:1} }

/* 3 · Floating particle dust — repurpose the two star layers for light.
   Navy + crimson specks that slowly drift up; visible on ivory, unlike the
   original white stars. Overrides mythos' frozen opacity:.4 + animation:none. */
html[data-theme="light"] .ph-sky{ opacity:1 !important; }
html[data-theme="light"] .ph-sky-stars{
  background-image:
    radial-gradient(1.5px 1.5px at 12% 30%, rgba(10,19,43,.30),  transparent 60%),
    radial-gradient(2px 2px   at 26% 66%, rgba(227,25,55,.26),  transparent 60%),
    radial-gradient(1.5px 1.5px at 41% 20%, rgba(10,19,43,.24),  transparent 60%),
    radial-gradient(1.5px 1.5px at 57% 74%, rgba(10,19,43,.22),  transparent 60%),
    radial-gradient(2px 2px   at 71% 40%, rgba(227,25,55,.22),  transparent 60%),
    radial-gradient(1.5px 1.5px at 86% 62%, rgba(10,19,43,.24),  transparent 60%),
    radial-gradient(1.5px 1.5px at 17% 84%, rgba(10,19,43,.20),  transparent 60%),
    radial-gradient(2px 2px   at 63% 48%, rgba(227,25,55,.20),  transparent 60%) !important;
  opacity: .9 !important;
  animation: dustDrift 34s linear infinite !important;
}
html[data-theme="light"] .ph-sky-stars2{
  background-image:
    radial-gradient(1.5px 1.5px at 20% 40%, rgba(227,25,55,.22),  transparent 60%),
    radial-gradient(1.5px 1.5px at 35% 14%, rgba(10,19,43,.22),   transparent 60%),
    radial-gradient(2px 2px   at 54% 64%, rgba(10,19,43,.20),   transparent 60%),
    radial-gradient(1.5px 1.5px at 70% 30%, rgba(180,83,9,.24),   transparent 60%),
    radial-gradient(1.5px 1.5px at 84% 50%, rgba(10,19,43,.22),   transparent 60%),
    radial-gradient(2px 2px   at 10% 66%, rgba(227,25,55,.18),   transparent 60%),
    radial-gradient(1.5px 1.5px at 46% 32%, rgba(10,19,43,.20),   transparent 60%),
    radial-gradient(1.5px 1.5px at 74% 90%, rgba(180,83,9,.20),   transparent 60%) !important;
  opacity: .85 !important;
  animation: dustDrift2 42s linear infinite !important;
}
@keyframes dustDrift{
  0%   { transform: translateY(0)      translateX(0);    opacity:.55; }
  50%  { transform: translateY(-22px)  translateX(8px);  opacity:.95; }
  100% { transform: translateY(-44px)  translateX(0);    opacity:.55; }
}
@keyframes dustDrift2{
  0%   { transform: translateY(0)      translateX(0);    opacity:.7;  }
  50%  { transform: translateY(-18px)  translateX(-10px);opacity:.4;  }
  100% { transform: translateY(-36px)  translateX(0);    opacity:.7;  }
}

/* 4 · Cursor spotlight — re-enabled on light (mythos display:none'd it),
   retinted to a warm crimson/amber glow. JS in home.php already wires it. */
html[data-theme="light"] .ph-spotlight{
  display: block !important;
  background: radial-gradient(circle,
      rgba(227,25,55,.09) 0%,
      rgba(180,83,9,.06)  38%,
      transparent 66%) !important;
}

/* Bottom fade → let the section below blend into ivory (mythos' dark
   vignette would read as a grey smudge on light). */
html[data-theme="light"] .qhp-hero::after{
  background: linear-gradient(to top, #F6F8FC, transparent) !important;
  height: 90px !important;
}

/* ───────────────────────── HERO · floating trust chips ────────────────── */
html[data-theme="light"] .ph-float-card{
  padding: 11px 15px !important;
  background: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(10,19,43,.09) !important;
  border-radius: 14px !important;
  color: #3A5C4A !important;
  font-weight: 600 !important;
  box-shadow: 0 10px 30px rgba(10,19,43,.10), 0 2px 6px rgba(10,19,43,.05) !important;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  opacity: 1 !important;
}
html[data-theme="light"] .ph-float-card .fc-icon{
  width: 30px !important; height: 30px !important; border-radius: 9px !important;
  background: linear-gradient(135deg, rgba(227,25,55,.16), rgba(227,25,55,.06)) !important;
  font-size: 15px !important;
}
html[data-theme="light"] .ph-float-card .fc-status{
  color: #E31937 !important; letter-spacing: .6px !important;
}
/* Re-enable the gentle float drift (was frozen) */
html[data-theme="light"] .ph-fc1{ animation: cardFloat1 18s ease-in-out infinite !important; }
html[data-theme="light"] .ph-fc2{ animation: cardFloat2 20s ease-in-out infinite !important; }
html[data-theme="light"] .ph-fc3{ animation: cardFloat3 22s ease-in-out infinite !important; }
html[data-theme="light"] .ph-fc4{ animation: cardFloat1 19s 2s ease-in-out infinite !important; }

/* ───────────────────────── HERO · typography rhythm ───────────────────── */
html[data-theme="light"] .ph-h1{
  letter-spacing: -.6px !important;
  text-wrap: balance;
}
html[data-theme="light"] .ph-tagline{ font-weight: 600 !important; }
/* Typing headline — keep the blinking caret alive */
html[data-theme="light"] .ph-typing{ color:#B45309 !important; }
html[data-theme="light"] .ph-typing::after{
  background:#E31937 !important;
  animation: typeBlink .8s step-end infinite !important;
}

/* Stat counters — ink numerals, gold suffix */
html[data-theme="light"] .ph-stat-num{ color:#0A132B !important; }
html[data-theme="light"] .ph-stat-suffix{ color:#B45309 !important; }
html[data-theme="light"] .ph-stat-label{ color: rgba(10,19,43,.55) !important; }

/* ───────────────────────── HERO · call-to-action ──────────────────────── */
html[data-theme="light"] .ph-btn-primary{
  background: linear-gradient(135deg, #E31937, #F5405E) !important;
  color:#0A132B !important;
  border: 1px solid rgba(227,25,55,.55) !important;
  box-shadow: 0 8px 22px rgba(227,25,55,.30) !important;
  animation: ctaBreathe 3.2s ease-in-out 1.5s infinite !important;
}
@keyframes ctaBreathe{
  0%,100%{ box-shadow: 0 8px 22px rgba(227,25,55,.28); }
  50%    { box-shadow: 0 12px 30px rgba(227,25,55,.42), 0 0 0 4px rgba(227,25,55,.10); }
}
html[data-theme="light"] .ph-btn-primary:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(227,25,55,.40) !important;
}
/* Secondary / WhatsApp button — quiet on light */
html[data-theme="light"] .ph-btn-wa{
  background:#fff !important; border:1px solid rgba(19,136,8,.35) !important;
  color:#E31937 !important; box-shadow: var(--shadow-sm) !important;
}
html[data-theme="light"] .ph-btn-wa:hover{
  background: rgba(19,136,8,.06) !important; border-color:#E31937 !important; color:#186E4C !important;
}
/* Veda pulse button — subtle gold ring */
html[data-theme="light"] .ph-btn-veda{
  background: rgba(227,25,55,.08) !important;
  border:1px solid rgba(227,25,55,.30) !important;
  color:#B45309 !important;
  animation: vedaPulse 3s 2s ease-in-out infinite !important;
}
html[data-theme="light"] .ph-veda-dot{
  background:#E31937 !important;
  animation: vedaDot 2s ease-in-out infinite !important;
}

/* ───────────────────────── HERO · tricolor accent bar ─────────────────── */
html[data-theme="light"] .ph-tribar{ opacity:.85 !important; }

/* ───────────────────────── SECTION cards · premium light ──────────────── */
/* Case-study + review cards: crisp paper, gold hairline on hover */
html[data-theme="light"] .q-cs,
html[data-theme="light"] .q-rv{
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  box-shadow: 0 1px 2px rgba(10,19,43,.04) !important;
}
html[data-theme="light"] .q-cs:hover,
html[data-theme="light"] .q-rv:hover{
  border-color: rgba(227,25,55,.35) !important;
  box-shadow: 0 20px 44px rgba(10,19,43,.12) !important;
}
html[data-theme="light"] .q-cs p{ color: rgba(10,19,43,.62) !important; }
html[data-theme="light"] .q-cs h3,
html[data-theme="light"] .q-rv-name{ color:#0A132B !important; }
html[data-theme="light"] .q-rv-quote{ color: rgba(10,19,43,.72) !important; }
html[data-theme="light"] .q-rv-quote::before{ color: rgba(227,25,55,.28) !important; }
html[data-theme="light"] .q-rv-role{ color: rgba(10,19,43,.45) !important; }
html[data-theme="light"] .q-cs-footer,
html[data-theme="light"] .q-rv-footer{ border-top-color: rgba(10,19,43,.07) !important; }
html[data-theme="light"] .q-rv-avatar{ color:#fff !important; }

/* Industries cards */
html[data-theme="light"] .ind-fcard,
html[data-theme="light"] .ind-card{
  background:#FFFFFF !important; border:1px solid rgba(10,19,43,.08) !important;
}
html[data-theme="light"] .ind-fcard:hover{
  border-color: rgba(227,25,55,.35) !important;
  box-shadow: 0 18px 40px rgba(10,19,43,.12) !important;
}
html[data-theme="light"] .ind-fcard-body h4{ color:#0A132B !important; }
html[data-theme="light"] .ind-fcard-body p{ color: rgba(10,19,43,.6) !important; }
html[data-theme="light"] .ind-card{ color: rgba(10,19,43,.7) !important; }
html[data-theme="light"] .ind-card:hover{ background: rgba(227,25,55,.06) !important; color:#B45309 !important; border-color: rgba(227,25,55,.3) !important; }

/* Comparison table — light, with a gold-tinted "us" column */
html[data-theme="light"] .q-cmp-wrap{ border-color: rgba(10,19,43,.10) !important; }
html[data-theme="light"] .q-cmp-tbl thead tr{ background:#F6F1E7 !important; }
html[data-theme="light"] .q-cmp-tbl th{ color: rgba(10,19,43,.7) !important; }
html[data-theme="light"] .q-cmp-tbl td{ color: rgba(10,19,43,.72) !important; border-bottom-color: rgba(10,19,43,.08) !important; }
html[data-theme="light"] .q-cmp-tbl td:first-child{ color:#0A132B !important; }
html[data-theme="light"] .q-cmp-tbl th.q-cmp-us,
html[data-theme="light"] .q-cmp-tbl td.q-cmp-us{ background: rgba(227,25,55,.09) !important; }

/* Lead-capture form card — clean paper with gold top rule */
html[data-theme="light"] .q-form-wrap{
  background:#FFFFFF !important; border:1px solid rgba(227,25,55,.35) !important;
  box-shadow: 0 24px 60px rgba(10,19,43,.10) !important; backdrop-filter:none !important;
}
html[data-theme="light"] .q-fg label{ color: rgba(10,19,43,.7) !important; }
html[data-theme="light"] .q-fg input,
html[data-theme="light"] .q-fg select,
html[data-theme="light"] .q-fg textarea{
  background:#FFFFFF !important; border:1.5px solid rgba(10,19,43,.14) !important; color:#0A132B !important;
}
html[data-theme="light"] .q-fg input::placeholder,
html[data-theme="light"] .q-fg textarea::placeholder{ color: rgba(10,19,43,.4) !important; }
html[data-theme="light"] .q-fg input:focus,
html[data-theme="light"] .q-fg select:focus,
html[data-theme="light"] .q-fg textarea:focus{
  border-color:#E31937 !important; box-shadow:0 0 0 3px rgba(227,25,55,.14) !important;
}
html[data-theme="light"] .q-fg select option,
html[data-theme="light"] .q-fg select optgroup{ background:#fff !important; color:#0A132B !important; }

/* Section eyebrow / heading legibility on light (generic) */
html[data-theme="light"] .q-faq-side p,
html[data-theme="light"] .q-faq-cta p{ color: rgba(10,19,43,.62) !important; }

/* ───────────────────────── carousels · light edge fades ───────────────── */
html[data-theme="light"] .q-clients-outer::before,
html[data-theme="light"] .q-cs-outer, /* mask fades already transparent-based; leave */
html[data-theme="light"] .q-ptnr-outer::before{ }
html[data-theme="light"] .q-client-item{ border-right-color: rgba(10,19,43,.08) !important; }
html[data-theme="light"] .q-ptnr-item{ border-right-color: rgba(10,19,43,.08) !important; }

/* ───────────────── SERVICES grid — premium light redesign ─────────────── */
/* "Everything Your Business Needs, Under One Roof" cards */
html[data-theme="light"] .svc-card{
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  box-shadow: 0 1px 2px rgba(10,19,43,.04), 0 10px 26px rgba(10,19,43,.05) !important;
}
html[data-theme="light"] .svc-card:hover{
  border-color: rgba(227,25,55,.38) !important;
  box-shadow: 0 20px 46px rgba(10,19,43,.13) !important;
  transform: translateY(-6px);
}
html[data-theme="light"] .svc-card h3{ color:#0A132B !important; }
html[data-theme="light"] .svc-card p{ color: rgba(10,19,43,.62) !important; }
html[data-theme="light"] .svc-icon{
  background: linear-gradient(135deg, rgba(227,25,55,.18), rgba(227,25,55,.05)) !important;
  color:#B45309 !important;
  box-shadow: inset 0 0 0 1px rgba(227,25,55,.14);
}
html[data-theme="light"] .svc-card .tag{
  color:#0A132B !important; background: rgba(14,116,144,.10) !important;
}
html[data-theme="light"] .svc-card .tag.hot{
  color:#B45309 !important; background: rgba(227,25,55,.12) !important;
}

/* ─────────────── CALCULATOR teaser — light (was hardcoded dark) ────────── */
/* The .calc-teaser CARD used a literal dark-navy gradient in quantum.css
   (linear-gradient(135deg,rgba(10,19,43,.75),rgba(18,34,64,.5))). The token
   remap can't catch literal rgba, so the card stayed dark while the text below
   was recoloured to dark navy → dark-on-dark, unreadable. Put it on paper. */
html[data-theme="light"] .calc-teaser{
  background: linear-gradient(135deg,#FFFFFF,#F6F1E7) !important;
  border:1px solid rgba(227,25,55,.20) !important;
  box-shadow: 0 20px 50px rgba(10,19,43,.07) !important;
}
/* "Calculate your liability in real-time" — .calc-mini used rgba(5,16,31,.55) */
html[data-theme="light"] .calc-mini{
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  box-shadow: 0 10px 30px rgba(10,19,43,.06) !important;
}
html[data-theme="light"] .calc-mini input,
html[data-theme="light"] .calc-mini select{
  background:#FFFFFF !important;
  border:1.5px solid rgba(10,19,43,.14) !important;
  color:#0A132B !important;
}
html[data-theme="light"] .calc-mini input:focus,
html[data-theme="light"] .calc-mini select:focus{
  border-color:#E31937 !important; box-shadow:0 0 0 3px rgba(227,25,55,.14) !important;
}
html[data-theme="light"] .calc-mini label{ color: rgba(10,19,43,.5) !important; }
html[data-theme="light"] .calc-mini-label{ color:#B45309 !important; }
html[data-theme="light"] .calc-mini-result{
  background: rgba(227,25,55,.09) !important; border-color: rgba(227,25,55,.22) !important;
}
html[data-theme="light"] .calc-intro h3{ color:#0A132B !important; }
html[data-theme="light"] .calc-intro p,
html[data-theme="light"] .calc-list li{ color: rgba(10,19,43,.66) !important; }


/* ═══════════════════════════════════════════════════════════════════════
   WHY TAXCLUE + TRUST + FAQ — light redesign
   #why and #trust shipped with hardcoded DARK section bands in quantum.css
   (never added to the band-remap list), so they rendered as black stripes on
   the light page. Bring them onto paper and give the cards a premium light
   treatment consistent with the About / Services redesign.
   ═══════════════════════════════════════════════════════════════════════ */

/* ───────── WHY TAXCLUE — dark gradient band → light ───────── */
html[data-theme="light"] #why{
  background: linear-gradient(180deg,#FFFFFF 0%, #F1F5FA 100%) !important;
}
html[data-theme="light"] #why .why-card{
  position:relative;
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  border-radius:16px !important;
  box-shadow:0 1px 2px rgba(10,19,43,.04), 0 10px 26px rgba(10,19,43,.05) !important;
  overflow:hidden;
  transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease !important;
}
/* crimson accent bar that grows in on hover */
html[data-theme="light"] #why .why-card::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:linear-gradient(180deg,#E31937,#B45309);
  transform:scaleY(0); transform-origin:top; transition:transform .28s ease;
}
html[data-theme="light"] #why .why-card:hover{
  transform:translateY(-6px);
  border-color:rgba(227,25,55,.30) !important;
  box-shadow:0 22px 48px rgba(10,19,43,.13) !important;
}
html[data-theme="light"] #why .why-card:hover::before{ transform:scaleY(1); }
html[data-theme="light"] #why .why-icon{
  background:linear-gradient(135deg, rgba(227,25,55,.14), rgba(227,25,55,.03)) !important;
  box-shadow: inset 0 0 0 1px rgba(227,25,55,.16);
}
html[data-theme="light"] #why .why-body h4{ color:#0A132B !important; }
html[data-theme="light"] #why .why-body p{ color: rgba(10,19,43,.62) !important; }

/* ───────── TRUST INDICATORS — dark gradient band → light ───────── */
html[data-theme="light"] #trust{
  background:
    radial-gradient(60% 60% at 50% 0%, rgba(227,25,55,.05), transparent 70%),
    linear-gradient(180deg,#F6F1E7 0%, #FBFAF7 100%) !important;
}
html[data-theme="light"] #trust .trust{
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  box-shadow:0 1px 2px rgba(10,19,43,.04), 0 8px 22px rgba(10,19,43,.05) !important;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease !important;
}
html[data-theme="light"] #trust .trust:hover{
  transform:translateY(-5px);
  border-color:rgba(227,25,55,.30) !important;
  background:linear-gradient(180deg,#FFFFFF, #FFF6F1) !important;
  box-shadow:0 18px 40px rgba(10,19,43,.12) !important;
}
html[data-theme="light"] #trust .trust .num{ color:#E31937 !important; }
html[data-theme="light"] #trust .trust h5{ color:#0A132B !important; }
html[data-theme="light"] #trust .trust p{ color: rgba(10,19,43,.5) !important; }

/* ───────── FAQ — light polish (already on a light band) ───────── */
html[data-theme="light"] #faq .faq-item{
  background:#FFFFFF !important;
  border:1px solid rgba(10,19,43,.08) !important;
  box-shadow:0 1px 2px rgba(10,19,43,.04) !important;
}
html[data-theme="light"] #faq .faq-item[open]{
  border-color:rgba(227,25,55,.28) !important;
  box-shadow:0 12px 30px rgba(10,19,43,.10) !important;
}
html[data-theme="light"] #faq .faq-item summary{ color:#0A132B !important; }
html[data-theme="light"] #faq .faq-item summary:hover{ color:#E31937 !important; }
html[data-theme="light"] #faq .faq-item summary::after{ color:#E31937 !important; }
html[data-theme="light"] #faq .faq-item p{ color: rgba(10,19,43,.64) !important; }
/* "Need Expert Advice?" CTA card — was wrongly painted solid red by the
   button-unify rule (it's a card, not a button). Give it a soft crimson-tinted
   panel so the inner red button stands out. */
html[data-theme="light"] .q-faq-cta{
  background: linear-gradient(180deg,#FFFFFF, #FFF4F1) !important;
  border:1px solid rgba(227,25,55,.20) !important;
  box-shadow:0 10px 30px rgba(10,19,43,.06) !important;
}
html[data-theme="light"] .q-faq-cta h4{ color:#0A132B !important; }

/* Mobile: keep the header→content gap tight too (mythos = +56px) */
@media (max-width:640px){
  html[data-theme="light"] .qhp-hero{
    padding-top: calc(var(--ticker-h,36px) + var(--hdr-h,76px) + 32px) !important;
  }
}

/* ───────────────────────── reduced motion ─────────────────────────────── */
@media (prefers-reduced-motion: reduce){
  html[data-theme="light"] .qhp-hero,
  html[data-theme="light"] .ph-grid-bg,
  html[data-theme="light"] .qhp-hero::before,
  html[data-theme="light"] .ph-sky-stars,
  html[data-theme="light"] .ph-sky-stars2,
  html[data-theme="light"] .ph-float-card,
  html[data-theme="light"] .ph-btn-primary,
  html[data-theme="light"] .ph-btn-veda,
  html[data-theme="light"] .ph-veda-dot,
  html[data-theme="light"] .ph-fc1,
  html[data-theme="light"] .ph-fc2,
  html[data-theme="light"] .ph-fc3,
  html[data-theme="light"] .ph-fc4{
    animation: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   HERO · CONTRAST BOOST (2026-08-15) — copy read dull/muddy on light.
   Loaded after theme-light.css so these win. Applies desktop + mobile.
   ═══════════════════════════════════════════════════════════════════════ */
/* Headline accent — richer amber (was thin/washed) */
html[data-theme="light"] .ph-h1 em{
  -webkit-text-fill-color:#B45309 !important; color:#B45309 !important;
}
/* Tagline triad — was muddy brown #8A4B09 → crisp navy, heavier weight */
html[data-theme="light"] .ph-tagline{
  -webkit-text-fill-color:#0B1D3A !important; color:#0B1D3A !important;
  font-weight:700 !important; letter-spacing:-.2px !important;
}
/* Sub — was ~66% ink (faint) → darker slate for legibility */
html[data-theme="light"] .ph-sub{
  color: rgba(11,29,58,.84) !important;
}
/* Trust bar — lift muted text + numerals */
html[data-theme="light"] .ph-trust-bar{ color: rgba(11,29,58,.66) !important; }
html[data-theme="light"] .ph-trust-bar strong{ color:#0B1D3A !important; }

/* ═══════════════════════════════════════════════════════════════════════
   HOME · PRO PASS (2026-08-16) — bring the About page's editorial polish:
   Fraunces display headings · editorial section kickers · premium light cards.
   ═══════════════════════════════════════════════════════════════════════ */
/* ── Section headers → kicker + Fraunces headline + calm lead ── */
html[data-theme="light"] .sec-header{ margin-bottom:46px; }
html[data-theme="light"] .sec-tag{
  display:inline-flex !important; align-items:center; gap:11px;
  font-family:'JetBrains Mono',ui-monospace,monospace !important;
  font-size:11.5px !important; font-weight:600 !important; letter-spacing:2.4px !important;
  text-transform:uppercase; color:#B4122E !important;
}
html[data-theme="light"] .sec-header .sec-tag::before{
  content:""; width:26px; height:2px; border-radius:2px; flex-shrink:0;
  background:linear-gradient(90deg,#FF9933,#E31937 55%,#138808);
}
html[data-theme="light"] .sec-title{
  font-family:'Fraunces','Fraunces',Georgia,serif !important;
  font-weight:400 !important; font-size:clamp(30px,4vw,46px) !important;
  line-height:1.08 !important; letter-spacing:-.6px !important; color:#0A132B !important;
}
html[data-theme="light"] .sec-title .ital{ font-style:italic; color:#B7831F !important; }
html[data-theme="light"] .sec-sub{
  color:rgba(10,19,43,.62) !important; opacity:1 !important;
  font-size:17px !important; line-height:1.7 !important; max-width:640px;
}

/* ── Premium cards — white paper, Fraunces titles, red hairline hover-lift ── */
html[data-theme="light"] .svc-card,
html[data-theme="light"] .why-card,
html[data-theme="light"] .ind-fcard{
  background:#FFFFFF !important; border:1px solid #E7E3D9 !important;
  box-shadow:0 1px 2px rgba(10,19,43,.04) !important;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease !important;
}
html[data-theme="light"] .svc-card:hover,
html[data-theme="light"] .why-card:hover,
html[data-theme="light"] .ind-fcard:hover{
  transform:translateY(-5px) !important;
  border-color:rgba(227,25,55,.40) !important;
  box-shadow:0 24px 48px -24px rgba(10,19,43,.26) !important;
}
html[data-theme="light"] .svc-card h3,
html[data-theme="light"] .why-body h4,
html[data-theme="light"] .ind-fcard-body h4{
  font-family:'Fraunces','Fraunces',serif !important; font-weight:500 !important; color:#0A132B !important;
}
html[data-theme="light"] .svc-icon{
  background:linear-gradient(135deg,rgba(227,25,55,.12),rgba(227,25,55,.04)) !important;
  color:#B4122E !important;
}
html[data-theme="light"] .svc-card::before{ background:linear-gradient(90deg,transparent,#E31937,transparent) !important; }

/* ── Generous editorial section rhythm (match about's spacing) ── */
html[data-theme="light"] #services,
html[data-theme="light"] #why,
html[data-theme="light"] #industries,
html[data-theme="light"] #comparison,
html[data-theme="light"] #faq{ padding-top:88px !important; padding-bottom:88px !important; }

/* ═══════════════════════════════════════════════════════════════════════
   HOME · OPTION-2 EDITORIAL REBUILD (About `au-` DNA, `hr-` prefix)
   Self-contained (literal colours) so it never collides with quantum/au tokens.
   ═══════════════════════════════════════════════════════════════════════ */
.hr-sec{padding:96px 0}
.hr-warm{background:#F7F3EA}
html[data-theme="light"] #services.hr-warm{background:#F7F3EA !important}  /* beat theme-light band remap */
.hr-kick{display:inline-flex;align-items:center;gap:10px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;font-weight:600;letter-spacing:2.6px;text-transform:uppercase;color:#C01530}
.hr-kick::before{content:"";width:26px;height:2px;border-radius:2px;background:linear-gradient(90deg,#FF9933,#E31937 55%,#138808)}
.hr-h2{font-family:'Fraunces','Fraunces',Georgia,serif;font-weight:400;font-size:clamp(34px,4.6vw,52px);line-height:1.06;letter-spacing:-.8px;color:#0A132B;margin:16px 0 0}
.hr-h2 em{font-style:italic;color:#C01530}
.hr-lead{font-size:19px;line-height:1.7;color:#5C6A80;margin:0;max-width:60ch}
.hr-head-split{display:grid;grid-template-columns:1.1fr .9fr;gap:50px;align-items:end;margin-bottom:52px}
/* category cards */
.hr-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.hr-cat{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid #E9E3D6;border-radius:16px;padding:24px 22px;text-decoration:none;color:inherit;transition:transform .28s,border-color .28s,box-shadow .28s;overflow:hidden}
.hr-cat::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#E31937,#B7831F);transform:scaleY(0);transform-origin:top;transition:transform .28s}
.hr-cat:hover{transform:translateY(-5px);border-color:rgba(227,25,55,.35);box-shadow:0 24px 48px -24px rgba(10,19,43,.24)}
.hr-cat:hover::before{transform:scaleY(1)}
.hr-cat-top{display:flex;align-items:center;justify-content:space-between;min-height:18px}
.hr-cat-no{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:1px;color:#93A0B4}
.hr-cat-badge{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:#C01530;background:rgba(227,25,55,.08);padding:3px 8px;border-radius:20px}
.hr-cat-ic{width:46px;height:46px;border-radius:12px;background:rgba(227,25,55,.10);border:1px solid rgba(227,25,55,.14);display:flex;align-items:center;justify-content:center;font-size:22px;margin:14px 0 16px}
.hr-cat h3{font-family:'Fraunces','Fraunces',serif;font-size:19px;font-weight:500;color:#0A132B;margin:0 0 8px;line-height:1.2}
.hr-cat p{font-size:14px;line-height:1.6;color:#5C6A80;margin:0 0 16px;flex:1}
.hr-cat-link{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:#C01530}
/* immersive navy stat band */
.hr-navy{background:radial-gradient(120% 120% at 12% 0%,#16233F,#060E1F 62%);color:#EAE4D6;position:relative;overflow:hidden}
.hr-navy .hr-kick{color:#FF9933}
.hr-navy .hr-kick::before{background:linear-gradient(90deg,#FF9933,#fff,#138808)}
.hr-navy .hr-h2{color:#F5F0E4}
.hr-navy .hr-h2 em{color:#FF9933}
.hr-stats{display:grid;grid-template-columns:repeat(4,1fr);margin-top:48px;border:1px solid rgba(255,255,255,.1);border-radius:18px;overflow:hidden}
.hr-stat{padding:34px 26px;border-left:1px solid rgba(255,255,255,.08)}
.hr-stat:first-child{border-left:none}
.hr-stat-n{font-family:'Fraunces','Fraunces',serif;font-size:clamp(40px,4.4vw,56px);line-height:1;color:#fff}
.hr-stat-n span{color:#FF9933}
.hr-stat-l{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:600;letter-spacing:1.4px;text-transform:uppercase;color:rgba(234,228,214,.66);margin-top:12px}
@media(max-width:1024px){.hr-cats{grid-template-columns:repeat(2,1fr)}.hr-head-split{grid-template-columns:1fr;gap:22px}}
@media(max-width:768px){.hr-stats{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.hr-cats{grid-template-columns:1fr}.hr-sec{padding:64px 0}}

/* ── Partner-section CTAs — clean primary + ghost (were two heavy red buttons) ── */
html[data-theme="light"] .ptnr-cta-wrap{display:inline-flex;gap:12px;flex-wrap:wrap;justify-content:center}
html[data-theme="light"] .ptnr-cta-outline,
html[data-theme="light"] .ptnr-cta-solid{
  display:inline-flex !important;align-items:center;gap:9px;
  font-family:'DM Sans',system-ui,sans-serif !important;font-size:15px !important;font-weight:600 !important;line-height:1 !important;
  padding:14px 26px !important;border-radius:10px !important;text-decoration:none !important;
  border:1.5px solid transparent !important;transition:.2s ease !important;background-image:none !important;
}
/* Primary — Become a partner */
html[data-theme="light"] .ptnr-cta-solid{background:#E31937 !important;color:#fff !important;border-color:#E31937 !important;box-shadow:0 10px 26px rgba(227,25,55,.24) !important}
html[data-theme="light"] .ptnr-cta-solid:hover{background:#C01530 !important;border-color:#C01530 !important;transform:translateY(-2px);box-shadow:0 16px 34px rgba(227,25,55,.28) !important}
/* Ghost — View all partners */
html[data-theme="light"] .ptnr-cta-outline{background:#fff !important;color:#0A132B !important;border-color:#D7D0C2 !important;box-shadow:0 1px 2px rgba(10,19,43,.05) !important}
html[data-theme="light"] .ptnr-cta-outline:hover{border-color:#0A132B !important;transform:translateY(-2px)}

/* ═══════════════════════════════════════════════════════════════════════
   LINE-ICON SYSTEM (2026-08-16) — replaces emoji in Services / Why / Trust /
   Industries with one 24px stroke set (tc_icon() in home.php). Reads as a
   professional advisory brand instead of a template.
   ═══════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .tc-ic{display:block;stroke-width:1.7}

/* Services category cards — crimson glyph in the tinted tile */
html[data-theme="light"] .hr-cat-ic{color:#C01530}
html[data-theme="light"] .hr-cat-ic .tc-ic{width:24px;height:24px}

/* Why-TaxClue cards — crimson glyph, keep the gradient tile from above */
html[data-theme="light"] #why .why-icon{color:#C01530}
html[data-theme="light"] #why .why-icon .tc-ic{width:24px;height:24px}

/* Industries featured — navy glyph on the pastel banner (drop the dark shadow) */
html[data-theme="light"] .ind-fcard-ico{filter:none !important;color:#0A132B;line-height:0}
html[data-theme="light"] .ind-fcard-ico .tc-ic{width:30px;height:30px}

/* Trust indicators — crimson glyph, aligned with the numeral */
html[data-theme="light"] #trust .trust .ico{color:#E31937;line-height:0;margin-bottom:12px}
html[data-theme="light"] #trust .trust .ico .tc-ic{width:26px;height:26px}