/**
 * theme.css — site-wide TaxOptima brand layer (loads on EVERY page, after main.css).
 *
 * This is the migration bridge: main.css is fully token-driven, so re-pointing a
 * few of its design tokens here recolours/re-fonts the whole site to the new
 * brand (navy #06204A + Optima Blue #076BE6 gradients, Inter + Montserrat)
 * WITHOUT touching any template's layout — so nothing breaks. It also makes the
 * redesigned header/footer site-wide.
 *
 * The homepage's full section redesign lives in home.css (scoped under `.tox`,
 * front page only). As inner pages are migrated to `.tox`, main.css can be
 * dropped and this file kept as the single brand layer.
 */

/* ---------------------------------------------------------------------------
   Brand tokens (new design) + re-map of main.css's legacy tokens.
   --------------------------------------------------------------------------- */
:root{
  /* New brand palette / gradients (used by .tox and reusable elsewhere) */
  --navy:#06204A;
  --deep:#04183A;
  --blue:#076BE6;
  --royal:#043F88;
  --soft:#EAF2FC;
  --pale:#F5F8FC;
  --slate:#52627A;
  --line:#DCE7F6;
  --g-primary:linear-gradient(90deg,#06204A 0%,#076BE6 100%);
  --g-primary-d:linear-gradient(135deg,#06204A 0%,#076BE6 100%);
  --g-secondary:linear-gradient(135deg,#04183A 0%,#043F88 100%);
  --g-bright:linear-gradient(125deg,#06204A 0%,#043F88 45%,#076BE6 100%);
  --font-head:"Montserrat",system-ui,sans-serif;
  --font-body:"Inter",system-ui,sans-serif;

  /* --- Re-point main.css's own tokens so every existing page adopts the brand --- */
  --c-accent:#076BE6;                                   /* teal-ish blue -> Optima Blue */
  --c-ink:#06204A;                                      /* near-black -> Optima Navy */
  --font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-display:"Montserrat","Inter",-apple-system,sans-serif;
}

/* ---------------------------------------------------------------------------
   Inside the .tox wrapper, re-light main.css's legacy tokens. Inner pages set a
   dark "ground" (body:not(.home){--bg-main:#0A1922; ...}) which leaks into any
   legacy-styled embed inside .tox — most visibly the ConnecTribe form (its
   inputs use background:var(--bg-main)!important). Re-lighting keeps that form on
   the new light palette on every page.
   --------------------------------------------------------------------------- */
.tox{
  --bg-main:#F5F8FC;
  --surface:#ffffff;
  --surface-hover:#E2E8F0;
  --ink:#06204A;
  --ink-light:#3A4A63;
  --ink-muted:#52627A;
  --border:#DCE7F6;
  --border-light:#EAF2FC;
  --emerald:#076BE6;
  --emerald-dim:rgba(7,107,230,.14);
  --emerald-glow:rgba(7,107,230,.22);
}

/* ---------------------------------------------------------------------------
   Primary button — brand gradient on EVERY page (home + inner), uniform.
   `body .btn.btn-primary` matches main.css's inner-page specificity and wins by
   load order, with no home/inner split.
   --------------------------------------------------------------------------- */
body .btn.btn-primary{
  background:linear-gradient(135deg,#06204A 0%,#076BE6 100%);
  color:#fff;
  box-shadow:0 14px 30px -14px rgba(7,107,230,.5),inset 0 1px 0 rgba(255,255,255,.15);
}
body .btn.btn-primary:hover{
  background:linear-gradient(135deg,#04183A 0%,#043F88 100%);
}
/* Step numbers lead in brand blue, everywhere they appear */
body .steps4 .st .num,
body .steps4 .st .num.num{
  background:linear-gradient(180deg,#0B6FE0,#076BE6);
  color:#fff;
}

/* =========================================================================
   Shared header + footer — brand gradient, site-wide. Selectors mirror main.css
   so these win by load order. (Same rules the homepage used; now global.)
   ========================================================================= */

/* Utility bar */
.topbar{background:var(--deep);color:rgba(255,255,255,.82);font-family:var(--font-body)}
.topbar a.topbar-item{color:rgba(255,255,255,.82)}
.topbar a.topbar-item:hover{color:#8FC2FF}
.topbar svg{color:#8FC2FF}

/* Primary nav — brand gradient */
.navbar{background:var(--g-primary);border-bottom:1px solid rgba(255,255,255,.14);font-family:var(--font-body)}
.navbar .nav-links a{color:#fff}
.navbar .nav-links a:hover{color:#BFDBFF}
.navbar .nav-drop-btn{color:#fff}
.navbar .nav-drop-btn svg{color:#fff}
.nav-toggle{border-color:rgba(255,255,255,.4)}
.nav-toggle span{background:#fff}
/* Book consultation button pops white on the gradient (kept specific so it wins
   over the global brand-gradient primary button). */
.nav-cta .btn.btn-primary{background:#fff;color:var(--navy);border:1.5px solid #fff;box-shadow:none}
.nav-cta .btn.btn-primary:hover{background:var(--soft);color:var(--navy)}
/* Dropdown + mega panels stay light; recolour accents to brand blue */
.nav-drop-menu a:hover{background:var(--soft);color:var(--blue)}
.nav-mega-col h5{color:var(--blue);font-family:var(--font-head)}
.nav-mega-col a:hover{color:var(--blue)}

/* Footer — brand gradient */
.footer{background:var(--g-bright);color:#C3D4EC;font-family:var(--font-body);border-top:4px solid #0A78F0}
.footer-about{color:#B7C8E3}
.footer-col h4{color:#fff;font-family:var(--font-head)}
.footer-col ul a,.footer-col li a{color:#B7C8E3}
.footer-col ul a:hover,.footer-col li a:hover{color:#fff}
.footer-social .social-link{border:1px solid rgba(255,255,255,.22);color:#fff}
.footer-social .social-link:hover{background:rgba(255,255,255,.12)}
.footer-offices{border-top:1px solid rgba(255,255,255,.14)}
.footer-offices .fo-item{color:#B7C8E3}
.footer-offices .fo-item b{color:#7FB6FF}
.footer-offices .fo-item svg{color:#8FC2FF}
.footer a.fo-item:hover{color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.14);color:#9DB4D6}
.footer-legal a{color:#9DB4D6}
.footer-legal a:hover{color:#fff}

/* =========================================================================
   Extra .tox components used by the shared service/detail template
   (template-parts/service.php) — homepage palette.
   ========================================================================= */
/* Checklist (overview + documents lists) */
.tox .checks{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:13px}
.tox .checks li{display:grid;grid-template-columns:24px 1fr;gap:12px;align-items:start;font-size:15px;color:var(--navy)}
.tox .checks li svg{width:22px;height:22px;color:var(--blue);margin-top:1px}

/* Related-services cards */
.tox .relgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.tox .relcard{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;transition:border-color .2s,box-shadow .2s}
.tox .relcard:hover{border-color:var(--blue);box-shadow:0 18px 40px rgba(6,32,74,.08)}
.tox .relcard .ico{width:46px;height:46px;border-radius:12px;background:var(--soft);color:var(--blue);display:grid;place-items:center;margin-bottom:16px}
.tox .relcard .ico svg{width:22px;height:22px}
.tox .relcard h3{margin-bottom:8px}
.tox .relcard p{font-size:14.5px;color:var(--slate);margin-bottom:16px}
.tox .relcard .lnk{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font:600 14px var(--font-body);color:var(--blue)}
.tox .relcard .lnk svg{width:15px;height:15px}
@media (max-width:860px){.tox .relgrid{grid-template-columns:1fr}}

/* Team grid (our-team, about) */
.tox .team{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;margin-top:50px}
.tox .team-card{text-align:center}
.tox .team-card img{width:100%;aspect-ratio:1/1.08;object-fit:cover;border-radius:var(--radius-lg);box-shadow:0 22px 46px -22px rgba(6,32,74,.42);margin-bottom:16px}
.tox .team-card h3{font-size:17px;margin-bottom:4px}
.tox .team-card span{font-size:13.5px;color:var(--slate)}
@media (max-width:900px){.tox .team{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.tox .team{grid-template-columns:1fr}}

/* Comparison table (why-choose-us) */
.tox .compare{width:100%;border-collapse:separate;border-spacing:0;margin-top:44px;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden}
.tox .compare th,.tox .compare td{padding:16px 22px;text-align:left;font-size:15px;border-bottom:1px solid var(--line)}
.tox .compare thead th{background:var(--pale);font:700 12px var(--font-head);color:var(--slate);text-transform:uppercase;letter-spacing:.04em}
.tox .compare thead th.rec{color:var(--blue)}
.tox .compare tbody th{font-weight:600;color:var(--navy);width:34%}
.tox .compare td{color:var(--slate)}
.tox .compare td.rec{background:var(--soft)}
.tox .compare .yes{color:var(--navy);font-weight:600}
.tox .compare tr:last-child th,.tox .compare tr:last-child td{border-bottom:0}
@media (max-width:640px){.tox .compare th,.tox .compare td{padding:12px 12px;font-size:13px}}

/* Legal / long-form reading band */
.tox .prose{max-width:760px;margin:0 auto;color:var(--slate);font-size:16px;line-height:1.78}
.tox .prose h2{font-size:22px;color:var(--navy);margin:36px 0 12px}
.tox .prose h2:first-child{margin-top:0}
.tox .prose p{margin-bottom:16px}
.tox .prose a{color:var(--blue);font-weight:600}
.tox .prose ul{margin:0 0 16px 20px;list-style:disc}
.tox .prose li{margin-bottom:8px}

/* FAQ intro lead + a subheading inside the help box */
.tox .faq .faq-intro{margin:14px 0 26px}
.tox .faq-img .box h4{font:600 16px var(--font-head);color:var(--navy)}

/* Hero feature chips (contact, news) */
.tox .hero-chips{display:flex;flex-wrap:wrap;gap:10px 16px;margin-top:26px}
.tox .hero-chips span{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:#D6E4F7}
.tox .hero-chips svg{width:16px;height:16px;color:#8FC2FF}

/* Office location cards (contact) */
.tox .loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:48px}
.tox .loc-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 18px 40px -24px rgba(6,32,74,.25)}
.tox .loc-card>img{width:100%;height:210px;object-fit:cover}
.tox .loc-card-body{padding:26px}
.tox .loc-tag{display:inline-block;font:600 12px var(--font-body);padding:4px 12px;border-radius:999px;background:var(--soft);color:var(--royal);margin-bottom:10px}
.tox .loc-card-body h3{font-size:19px;margin-bottom:14px}
.tox .loc-line{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:14.5px;color:var(--slate);margin-bottom:10px}
.tox .loc-line svg{width:19px;height:19px;color:var(--blue);margin-top:2px}
.tox .loc-line a{color:var(--slate)}
.tox .loc-line a:hover{color:var(--blue)}
@media (max-width:860px){.tox .loc-grid{grid-template-columns:1fr}}

/* News: card grid + list rows */
.tox .newsgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.tox .ncard{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;transition:border-color .2s,box-shadow .2s}
.tox .ncard:hover{border-color:var(--blue);box-shadow:0 18px 40px rgba(6,32,74,.08)}
.tox .ncard-img{aspect-ratio:16/10;overflow:hidden}
.tox .ncard-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.tox .ncard:hover .ncard-img img{transform:scale(1.04)}
.tox .ncard-body{padding:24px;display:flex;flex-direction:column;gap:9px;flex:1}
.tox .ncard .cat{display:inline-block;font:600 12px var(--font-body);padding:4px 12px;border-radius:999px;background:var(--soft);color:var(--royal);width:max-content}
.tox .ncard .date{font-size:13px;color:var(--slate)}
.tox .ncard h3{font-size:18px;line-height:1.35}
.tox .ncard p{font-size:14.5px;color:var(--slate)}
.tox .ncard .lnk{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font:600 14px var(--font-body);color:var(--blue)}
.tox .ncard .lnk svg{width:15px;height:15px}
@media (max-width:900px){.tox .newsgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.tox .newsgrid{grid-template-columns:1fr}}
.tox .newslist{margin-top:40px;border-top:1px solid var(--line)}
.tox .newsrow{display:grid;grid-template-columns:160px 1fr 40px;gap:20px;align-items:center;padding:22px 8px;border-bottom:1px solid var(--line);color:var(--navy);transition:background .2s}
.tox .newsrow:hover{background:var(--pale)}
.tox .newsrow .news-date{font-size:13px;color:var(--blue);font-weight:600}
.tox .newsrow h3{font-size:17px;margin-bottom:4px}
.tox .newsrow p{font-size:14px;color:var(--slate)}
.tox .newsrow .arw{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;color:var(--slate)}
.tox .newsrow .arw svg{width:15px;height:15px}
@media (max-width:640px){.tox .newsrow{grid-template-columns:1fr;gap:6px}.tox .newsrow .arw{display:none}}

/* Value/expertise cards (about-founder, about) */
.tox .valgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:48px}
.tox .valcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px}
.tox .valcard .ico{width:46px;height:46px;border-radius:12px;background:var(--soft);color:var(--blue);display:grid;place-items:center;margin-bottom:16px}
.tox .valcard .ico svg{width:22px;height:22px}
.tox .valcard h3{margin-bottom:8px}
.tox .valcard p{font-size:14.5px;color:var(--slate)}
.tox .valcard.wide{grid-column:1/-1;text-align:center;background:var(--g-primary-d);color:#fff}
.tox .valcard.wide h3{color:#fff}
.tox .valcard.wide p{color:#D6E4F7;max-width:820px;margin:8px auto 0}
@media (max-width:900px){.tox .valgrid{grid-template-columns:1fr}}

/* Card grid variants + featured card + tag (service hubs) */
.tox .valgrid.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.tox .valgrid.four{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.tox .valgrid.four{grid-template-columns:1fr}}
.tox .valcard .tag{display:inline-block;font:600 11px var(--font-body);padding:3px 10px;border-radius:999px;background:var(--blue);color:#fff;margin-bottom:10px}
.tox .valcard.feat{background:var(--g-primary-d);color:#fff;border-color:transparent}
.tox .valcard.feat h3{color:#fff}
.tox .valcard.feat p{color:#D6E4F7}
.tox .valcard.feat .ico{background:rgba(255,255,255,.16);color:#fff}
/* Two-column checklist + document note */
.tox .checks.two{grid-template-columns:1fr 1fr}
@media (max-width:640px){.tox .checks.two{grid-template-columns:1fr}}
.tox .docnote{background:var(--soft);border-radius:14px;padding:20px 22px;margin:24px 0}
.tox .docnote h4{font:600 16px var(--font-head);color:var(--navy);margin-bottom:6px}
.tox .docnote p{font-size:14.5px;color:var(--slate)}

/* Stat band (about) */
.tox .statband{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;padding:8px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tox .statband div{padding:12px 0}
.tox .statband b{display:block;font:700 40px var(--font-head);line-height:1.1;color:var(--navy)}
.tox .statband span{font-size:14px;color:var(--slate)}
@media (max-width:640px){.tox .statband{grid-template-columns:1fr 1fr;gap:20px}}

/* Blog single post: shorter hero, meta row, prose extras, footer bits */
.tox .hero--post{min-height:clamp(400px,56vh,540px)}
.tox .hero--post .hero-copy{max-width:840px}
.tox .post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px;color:#C3D4EC;font-size:14px}
.tox .post-meta span:not(:last-child)::after{content:"\00b7";margin-left:8px;color:#8FC2FF}
.tox .prose h3{font-size:20px;color:var(--navy);margin:30px 0 10px}
.tox .prose h4{font-size:17px;color:var(--navy);margin:24px 0 8px}
.tox .prose img{border-radius:14px;margin:22px 0;height:auto}
.tox .prose blockquote{border-left:3px solid var(--blue);padding:4px 0 4px 18px;margin:22px 0;color:var(--navy);font-style:italic}
.tox .prose ol{margin:0 0 16px 20px;list-style:decimal}
.tox .prose strong{color:var(--navy)}
.tox .prose figure{margin:22px 0}
.tox .prose figcaption{font-size:13px;color:var(--slate);text-align:center;margin-top:8px}
.tox .post-tags{max-width:760px;margin:24px auto 0;display:flex;flex-wrap:wrap;gap:8px}
.tox .post-tags a{font:600 12px var(--font-body);padding:5px 12px;border-radius:999px;background:var(--soft);color:var(--royal)}
.tox .post-back{max-width:760px;margin:28px auto 0}

/* Brand-kit page components */
.tox .bk-swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:44px}
.tox .bk-swatch{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.tox .bk-swatch .chip{height:140px;display:flex;align-items:flex-end;padding:14px;color:#fff;font:600 12px var(--font-body)}
.tox .bk-swatch .meta{padding:16px 18px}
.tox .bk-swatch h4{margin-bottom:4px}
.tox .bk-swatch code{font-size:13px;color:var(--slate)}
@media (max-width:720px){.tox .bk-swatches{grid-template-columns:1fr}}
.tox .bk-specimen{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px;margin-top:20px}
.tox .bk-specimen .lbl{font:600 12px var(--font-body);color:var(--slate);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;display:block}
.tox .bk-specimen .row{display:flex;align-items:baseline;gap:20px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line)}
.tox .bk-specimen .row:first-of-type{border-top:0}
.tox .bk-specimen .sz{font-size:12px;color:var(--slate);width:110px;flex:none}
.tox .logo-stage{background:var(--pale);border:1px solid var(--line);border-radius:16px;padding:56px;text-align:center;margin-top:44px}
.tox .logo-stage img{height:56px;width:auto;display:inline-block}
.tox .logo-duo{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}
.tox .logo-duo>div{border-radius:16px;padding:44px;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center;justify-content:center}
.tox .logo-duo .on-light{background:#fff;border:1px solid var(--line)}
.tox .logo-duo .on-dark{background:var(--g-primary-d)}
.tox .logo-duo img{height:40px;width:auto}
.tox .logo-duo .cap{font-size:12px;color:var(--slate)}
.tox .logo-duo .on-dark .cap{color:rgba(255,255,255,.7)}
@media (max-width:720px){.tox .logo-duo{grid-template-columns:1fr}}
.tox .voicegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.tox .voice{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px}
.tox .voice h4{margin-bottom:8px}
.tox .voice>p{font-size:14.5px;color:var(--slate);margin-bottom:14px}
.tox .voice .ex{font-size:14px;line-height:1.9;border-top:1px solid var(--line);padding-top:12px}
.tox .voice .ex .g{color:#0A7D3C;font-weight:600}
.tox .voice .ex .b{color:#B0433A;text-decoration:line-through}
@media (max-width:860px){.tox .voicegrid{grid-template-columns:1fr}}
.tox .pillrow{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.tox .pillrow .pill{background:var(--soft);color:var(--royal);padding:7px 16px;border-radius:999px;font:600 13px var(--font-body)}
.tox .bk-num{font:700 14px var(--font-head);color:var(--blue);margin-bottom:6px;display:block}