/* OPTIMUSK.BLOG — Light theme (preview)
   Loaded LAST, after inline <style>. Colors/typography only:
   no layout, no ad slots, no DOM changes. */

:root {
  --color-bg: #f5f5f3;
  --color-bg-2: #ffffff;
  --color-bg-3: #efefec;
  --color-text: #17181b;
  --color-text-muted: #474c57;
  --color-text-dim: #646a77;
  --color-accent: #d42a24;
  --color-border: #e4e4e0;
  --color-border-light: #d6d6d1;
  --color-link: #1a5fd0;
  --font-display: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --border-radius: 12px;
  --shadow-card: 0 1px 2px rgba(20,20,30,.04), 0 4px 16px rgba(20,20,30,.05);
  color-scheme: light;
}

body { background: var(--color-bg); color: var(--color-text); }
body::before { display: none !important; }          /* remove dark scanlines */
p { color: var(--color-text-muted); }

/* ── Headings: bold sans, sentence case (belkins-style) ── */
h1, h2, h3, h4,
.article-hero__title, .article-body h2, .article-body h3, .post-cta h3 {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em !important;
  color: var(--color-text) !important;
  text-transform: none !important;
}
.article-hero__title { font-size: clamp(2rem, 4.6vw, 3.6rem) !important; line-height: 1.08 !important; }
.article-body h2 { font-size: clamp(1.55rem, 2.6vw, 2.1rem) !important; line-height: 1.2 !important; }
.article-body h3 { font-size: clamp(1.15rem, 1.8vw, 1.35rem) !important; line-height: 1.3 !important; }

/* ── Header ── */
.site-disclaimer, .top-bar { background: #ecece8 !important; color: var(--color-text-dim) !important; border-color: var(--color-border) !important; }
.site-header { background: rgba(255,255,255,.92) !important; border-bottom: 1px solid var(--color-border) !important; }
.site-nav a {
  font-family: var(--font-body) !important; text-transform: none !important;
  letter-spacing: 0 !important; font-size: .9rem !important; font-weight: 500;
  color: #2b2e35 !important; border-radius: 999px !important;
}
.site-nav a:hover, .site-nav a[aria-current], .site-nav a.active { background: #f0f0ed !important; border-color: transparent !important; color: #000 !important; }
.site-nav a.nav-cta, .nav-cta {
  background: var(--color-accent) !important; color: #fff !important;
  border-color: var(--color-accent) !important; border-radius: 10px !important; font-weight: 600;
}
.menu-toggle { color: var(--color-text) !important; border-color: var(--color-border-light) !important; border-radius: 10px; }

/* ── Mono labels: softer, sentence case ── */
.mono, .breadcrumbs, .post-meta-row, .share-label, .section-label, .toc__title, .toc__toggle {
  color: var(--color-text-dim) !important;
}
.breadcrumbs a { color: var(--color-text-dim) !important; }
.breadcrumbs__current { color: var(--color-text) !important; }
.post-meta-tag, .related-card__tag, .bdg {
  background: #f0f0ed !important; color: #2b2e35 !important;
  border: 1px solid var(--color-border) !important; border-radius: 999px !important;
}

/* ── Cards / panels: white, rounded, soft shadow ── */
.toc, .article-sidebar .toc, .snippet-box, .stat-card, .post-faq, .post-cta, .post-intro,
.author-box, .related-card, .share-btn, .post-card, .tool-card, .calc-card {
  background: var(--color-bg-2) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: var(--border-radius) !important;
}
.toc, .snippet-box, .post-cta, .author-box { box-shadow: var(--shadow-card); }
.share-btn { border-radius: 999px !important; color: #2b2e35 !important; box-shadow: none; }
.share-btn:hover { border-color: #bdbdb7 !important; }
.toc__item, .toc a { color: var(--color-text-muted) !important; }
.toc a:hover, .toc .active, .toc__item.active { color: var(--color-accent) !important; }

.related-card__title, .author-info__name { color: var(--color-text) !important; }

/* ── Article body ── */
.article-body p, .article-body li, .post-intro p, .snippet-box > p, .snippet-list li,
.post-faq-a, .post-checklist li, .post-timeline li { color: #33363d !important; }
.article-body strong, .box-takeaway strong, .box-insight strong { color: #0f1013 !important; }
.article-body a, .src-note a { color: var(--color-link) !important; }
.article-body a:hover { color: #0d3f94 !important; }
.post-faq-q, .stat-num { color: var(--color-text) !important; }
.post-faq-item { border-color: var(--color-border) !important; }
.post-hr, hr { border-color: var(--color-border) !important; background: var(--color-border) !important; }

.box-takeaway, .box-insight, .box-warning { border-radius: 10px !important; }
.box-takeaway { background: #fff5f4 !important; }
.box-insight  { background: #f2f6ff !important; }
.box-warning  { background: #fff8e6 !important; }
.box-takeaway p, .box-insight p, .box-warning p { color: #33363d !important; }
.box-warning strong { color: #8a5a00 !important; }

/* Tables */
.article-body table { background: #fff; border-radius: 10px; overflow: hidden; }
.article-body th { background: #f0f0ed !important; color: var(--color-text) !important; }
.article-body td { color: #33363d !important; border-color: var(--color-border) !important; }

/* Inline-styled blocks written for dark bg */
[style*="color:#f0f2f5"]:not([style*="background"]), [style*="color: #f0f2f5"]:not([style*="background"]), [style*="color:#fff"]:not([style*="background"]), [style*="color:#ffffff"]:not([style*="background"]) { color: var(--color-text) !important; }
[style*="color:#cdd5e2"], [style*="color:#c8d0dc"], [style*="color:#d0d8e0"] { color: #33363d !important; }
[style*="color:#7ab4ff"] { color: var(--color-link) !important; }
[style*="border-left:3px solid #7ab4ff"] { background: #f2f6ff !important; border-radius: 10px !important; }

/* ── Footer ── */
.site-footer { background: #ffffff !important; border-top: 1px solid var(--color-border) !important; }
.site-footer a { color: var(--color-text-muted) !important; }
.site-footer a:hover { color: var(--color-accent) !important; }

/* ── Pass 2: sans labels instead of terminal mono ── */
.mono, .breadcrumbs, .breadcrumbs a, .post-meta-row, .post-meta-item, .post-meta-tag, .share-label, .share-btn,
.section-label, .toc__title, .toc__toggle, .related-card__tag, .menu-toggle, .site-disclaimer,
.site-footer, .site-footer a, .site-footer p, .site-footer div {
  font-family: var(--font-body) !important;
  letter-spacing: 0 !important;
}
.breadcrumbs, .post-meta-row, .share-label, .toc__title, .toc__toggle, .share-btn, .menu-toggle { text-transform: none !important; font-size: .85rem !important; }
.site-footer a { font-size: .875rem !important; }
.site-footer p { font-size: .8rem !important; }
.site-footer [style*="text-transform:uppercase"] { font-size: .75rem !important; letter-spacing: .06em !important; font-weight: 700; color: var(--color-text) !important; }

/* ── Pass 3 ── */
:root { --font-mono: 'DM Sans', system-ui, sans-serif; }

/* Hairline grids (gap:1px on border-colored bg): keep the layout, round the
   outer frame, make cells white and flat. */
.posts-grid, .related-grid, .rel-grid, .tool-grid, .city-grid, .status-grid, .popular-grid,
.faq-list, .providers-grid, .districts-grid, .stat-grid, .stats-strip, .cmp-grid, .info-cards,
.dual-cta, .stat-row, .buy-grid, .compare-grid, .three-way, .tasks-grid, .opt-grid, .charge-grid,
.charger-grid, .carrier-grid, .apr-grid, .habit-grid, .milestone-strip, .savings-breakdown,
.tco-breakdown, [style*="gap:1px"] {
  border-radius: 14px; overflow: hidden;
  background: #fff !important; border-color: var(--color-border) !important;
}
.posts-grid > *, .related-grid > *, .rel-grid > *, .tool-grid > *, .city-grid > *, .status-grid > *,
.popular-grid > *, .faq-list > *, .providers-grid > *, .districts-grid > *, .stat-grid > *,
.stats-strip > *, .cmp-grid > *, .info-cards > *, .dual-cta > *, .stat-row > *, .buy-grid > *,
.compare-grid > *, .three-way > *, .tasks-grid > *, .opt-grid > *, .charge-grid > *, .charger-grid > *,
.carrier-grid > *, .apr-grid > *, .habit-grid > *, .milestone-strip > *, .savings-breakdown > *,
.tco-breakdown > *, [style*="gap:1px"] > * {
  background: #fff !important; border-radius: 0 !important; border: 0 !important;
  box-shadow: 0 0 0 1px var(--color-border) !important;
}
.post-card:hover, .related-card:hover, .tool-card:hover, .city-card:hover { background: #fafaf8 !important; }
.post-card__title { font-size: clamp(1.15rem, 1.6vw, 1.4rem) !important; line-height: 1.25 !important; }
.post-card__tag, .related-card__tag { color: var(--color-accent) !important; }

/* Buttons */
.btn { border-radius: 10px !important; font-family: var(--font-body) !important; letter-spacing: 0 !important; text-transform: none !important; font-weight: 600; }
.btn--primary { background: #17181b !important; color: #fff !important; border-color: #17181b !important; }
.btn--primary:hover { background: var(--color-accent) !important; border-color: var(--color-accent) !important; }
.btn--outline { color: var(--color-text) !important; border-color: var(--color-border-light) !important; background: #fff !important; }
.btn--accent { background: var(--color-accent) !important; color: #fff !important; }

/* Home hero stays a dark photo island */
.hero-fullbleed h1, .hero-fullbleed .hero-site-name { color: rgba(255,255,255,.6) !important; font-size: clamp(.75rem,1.5vw,1rem) !important; letter-spacing: .3em !important; font-weight: 500 !important; }
.hero-fullbleed .hero-big-title { color: #fff !important; font-family: var(--font-display) !important; font-weight: 700 !important; letter-spacing: -0.03em !important; line-height: .98 !important; }
.hero-fullbleed .hero-subtitle-text { color: rgba(255,255,255,.75) !important; }
.hero-fullbleed .btn--primary { background: #fff !important; color: #17181b !important; border-color: #fff !important; }
.hero-fullbleed .btn--outline { background: rgba(255,255,255,.08) !important; color: #fff !important; border-color: rgba(255,255,255,.35) !important; }
.hero-fullbleed .hero-stats { border-radius: 12px; }
.hero-fullbleed .hero-stat__num { font-family: var(--font-display) !important; font-weight: 700; }
.hero-fullbleed .trust-chip { border-radius: 999px !important; }

/* ── Pass 4: leftovers hardcoded for dark ── */
.topic-tab { border-radius: 999px !important; }
.topic-tab.active { color: #fff !important; background: var(--color-accent) !important; border-color: var(--color-accent) !important; }
.topic-tab.active span { color: rgba(255,255,255,.8) !important; }
.calc-peek { background: #fff !important; border-radius: 12px; box-shadow: var(--shadow-card); }
.calc-peek__v { color: var(--color-text) !important; font-family: var(--font-display) !important; font-weight: 700; }
.article-body blockquote, .article-body td, .compare-table td { color: #33363d !important; }
.compare-table td strong, .alert-update strong, .alert-breaking strong { color: #0f1013 !important; }
.share-btn--copy.copied { color: #0a7a40 !important; border-color: #0a7a40 !important; }
.site-nav a.nav-cta:hover { color: #fff !important; background: #b8211c !important; }
.disclaimer { color: #7a5200 !important; background: #fff8e6 !important; border-radius: 8px; }
.article-layout .related-card:hover .related-card__title { color: var(--color-accent) !important; }
.hero-fullbleed__overlay-bottom { background: linear-gradient(to bottom, transparent 0%, #0c0e13 100%) !important; }

/* ── Pass 5: status colors (were neon on dark) ── */
.alert-label,
.badge-med,
.badge-soon,
.demo-card__badge.badge-disputed,
.grade-c,
.job-card__risk.risk-mid,
.provider-card__badge.provider-card__badg,
.provider-card__status,
.r-row__val.am,
.r-row__val.ye,
.skill-badge.badge-demo,
.stat-cell__num.am,
.tw-card__val.mid { color: #8a5d00 !important; }
.badge-low,
.badge-yes,
.cmp-card__cost.gr,
.demo-card__badge.badge-autonomous,
.grade-a,
.r-row__val.gr,
.sb-cell__val.gr,
.skill-badge.badge-confirmed,
.specs-tag-confirmed,
.stat-cell__num.gr,
.tw-card__val.best { color: #0a7a40 !important; }
.grade-b { color: var(--color-link) !important; }
.provider-card__badge--waiting, .specs-tag-tbc, .skill-badge.badge-roadmap, .job-card__risk.risk-lo { color: #8a5d00 !important; }
.provider-card__badge--waiting { border-color: rgba(138,93,0,.35) !important; background: #fff8e6 !important; border-radius: 999px; }
/* numbers whose color JS sets (green/red by result): darken, keep hue */
.gauge-grade, .gauge-num, .mult-num, .r-big__num, .cb-val, .stat-cell__num, .sav-bar-val { filter: brightness(.72) saturate(1.15); }
/* inline / JS-set neon colors: darken, keep hue */
[style*="#3ecf6c"], [style*="62, 207, 108"], [style*="#00c864"], [style*="0, 200, 100"], [style*="#ffb400"],
[style*="255, 180, 0"], [style*="#ffaa44"], [style*="255, 170, 68"], [style*="#d4a800"], [style*="#4caf50"], [style*="#44cc44"] { filter: brightness(.72) saturate(1.15); }

/* ── Pass 6: dark/light rhythm (belkins-style) ──
   Dark: header, disclaimer, home hero, hub heroes, home tools band, article CTA, footer.
   Light: all reading content, cards, calculators. */
:root { --ink: #101217; --ink-2: #181b22; --ink-line: rgba(255,255,255,.1); --ink-text: #f2f3f5; --ink-muted: rgba(242,243,245,.68); }

.site-disclaimer { background: #0a0b0e !important; color: rgba(255,255,255,.55) !important; border-color: transparent !important; }
.site-header { background: rgba(16,18,23,.96) !important; border-bottom: 1px solid var(--ink-line) !important; }
.site-nav a { color: rgba(242,243,245,.82) !important; }
.site-nav a:hover, .site-nav a[aria-current], .site-nav a.active { background: rgba(255,255,255,.1) !important; color: #fff !important; }
.site-nav a.nav-cta { color: #fff !important; }
.menu-toggle { color: #fff !important; border-color: rgba(255,255,255,.25) !important; background: transparent !important; }
@media (max-width: 860px) {
  .site-nav { background: var(--ink) !important; border-color: var(--ink-line) !important; }
}

/* Hub heroes (blog, tools, usa, about, buy, contact, legal) */
section.hero { background: var(--ink) !important; border-bottom: 0 !important; position: relative; }
section.hero::after { content:''; position:absolute; right:-120px; top:-160px; width:520px; height:520px; border-radius:50%;
  background: radial-gradient(circle at 35% 35%, rgba(212,42,36,.55), rgba(212,42,36,0) 65%); pointer-events:none; }
section.hero > * { position: relative; z-index: 1; }
section.hero h1, section.hero h2, section.hero .hero__title { color: var(--ink-text) !important; }
section.hero p, section.hero .hero__subtitle, section.hero li { color: var(--ink-muted) !important; }
section.hero .hero__label, section.hero .mono { color: #ff6b63 !important; }
section.hero a:not(.btn) { color: #fff !important; }
section.hero [style*="color"] { color: var(--ink-muted) !important; }

/* Home: tools band dark */
.hero-fullbleed ~ section.section:nth-of-type(4) { background: var(--ink) !important; border-color: transparent !important; }
.hero-fullbleed ~ section.section:nth-of-type(4) h2,
.hero-fullbleed ~ section.section:nth-of-type(4) > .container > p,
.hero-fullbleed ~ section.section:nth-of-type(4) .section-label { color: var(--ink-text) !important; }
.hero-fullbleed ~ section.section:nth-of-type(4) > .container > p { color: var(--ink-muted) !important; }
.hero-fullbleed ~ section.section:nth-of-type(4) [style*="gap:1px"] { border-color: transparent !important; }

/* Article end CTA */
.post-cta { background: var(--ink) !important; border-color: var(--ink) !important; color: var(--ink-text) !important; }
.post-cta h3 { color: #fff !important; }
.post-cta p, .post-cta .mono { color: var(--ink-muted) !important; }
.post-cta .btn--primary, .post-cta .btn { background: #fff !important; color: var(--ink) !important; border-color: #fff !important; }

/* Footer */
.site-footer { background: var(--ink) !important; border-top: 0 !important; color: var(--ink-muted) !important; }
.site-footer a, .site-footer p, .site-footer div, .site-footer span { color: var(--ink-muted) !important; }
.site-footer a:hover { color: #fff !important; }
.site-footer [style*="text-transform:uppercase"] { color: #ff6b63 !important; }
.site-footer button { color: var(--ink-muted) !important; border-color: var(--ink-line) !important; background: transparent !important; }
.hero-fullbleed ~ section.section:nth-of-type(4) a[style*="border"] { border-radius: 14px !important; overflow: hidden; }
.post-faq-a a, .faq-a a { color: var(--color-link) !important; }
.faq-a { color: #33363d !important; }
@media (max-width: 860px) {
  .site-nav a { border-color: transparent !important; }
  .site-header { background: #101217 !important; }
}
.hero-fullbleed { background-color: #0a0b10 !important; border-bottom: 0 !important; }