/* LegalScapes site theme: light header + light hero + alternating light/dark sections.
   Loaded on every page right after /css/site-chrome.css, so it overrides page <style> blocks.
   Scoped to body.theme-light: removing that class from a page restores its original look.

   HOW TO USE (future edits happen here, not in page <style> blocks):
   - Put a tone class on each top-level section to set its band color:
       .tone-light  white band        .tone-alt    light slate band (#F1F5F9)
       .tone-dark   navy band (#0F172A)   .tone-accent  green CTA band (#76a240)
   - Page rhythm: light hero -> then alternate dark / light bands -> final CTA band
     (green .tone-accent or light) -> dark footer. Avoid two dark bands touching.
   - Shared components (breadcrumb, page heroes, CTA strips...) are converted below
     by class name, so every page that uses them changes together.
   Brand: brand/DESIGN.md. Green for text on light backgrounds is #587a30 (AA contrast). */

body.theme-light {
  --ink: #0F172A;
  --ink-2: #334155;
  --ink-muted: #64748B;
  --green-ink: #587a30;
  --tone-dark-bg: #0F172A;
  --tone-dark-card: #1E293B;
  --tone-dark-line: #334155;
  --tone-alt-bg: #F1F5F9;
  --hairline: #E2E8F0;
}

/* =============================================
   1. TONE BANDS
============================================= */
.theme-light .tone-light { background: #fff; color: var(--ink-2); }
.theme-light .tone-alt { background: var(--tone-alt-bg); color: var(--ink-2); }
.theme-light .tone-light :is(h1, h2, h3, h4),
.theme-light .tone-alt :is(h1, h2, h3, h4) { color: var(--ink); }
.theme-light :is(.tone-light, .tone-alt) :is(.eyebrow, .eyebrow--light, .section-eyebrow, .section-label) { color: var(--green-ink); }
.theme-light :is(.tone-light, .tone-alt) :is(.text-lead, .text-lead--light, .section-header p) { color: var(--ink-muted); }
.theme-light :is(.tone-light, .tone-alt) .text-white { color: var(--ink); }
.theme-light :is(.tone-light, .tone-alt) .btn-outline-white { color: var(--ink); border-color: rgba(15,23,42,.28); background: #fff; }
.theme-light :is(.tone-light, .tone-alt) .btn-outline-white:hover { border-color: var(--ink); background: #fff; color: var(--ink); }

/* Navy boxes that sit inside a light band keep white headings.
   Add .on-dark to any new navy card/box placed in a light band. */
.theme-light :is(.tone-light, .tone-alt) :is(.on-dark, .practice-card-header) :is(h1, h2, h3, h4) { color: #fff; }

.theme-light .tone-dark { background: var(--tone-dark-bg); color: rgba(241,245,249,.75); }
.theme-light .tone-dark > .container > :is(h1, h2, h3),
.theme-light .tone-dark :is(.section-header, .section-head) :is(h1, h2, h3),
.theme-light .tone-dark .text-white { color: #fff; }
.theme-light .tone-dark :is(.eyebrow, .section-eyebrow, .section-label) { color: var(--green-light, #8fbf4d); }
.theme-light .tone-dark :is(.section-header, .section-head) p,
.theme-light .tone-dark > .container > p,
.theme-light .tone-dark .text-lead { color: rgba(241,245,249,.68); }

.theme-light .tone-accent { background: var(--green, #76a240); color: #fff; }
.theme-light .tone-accent :is(h1, h2, h3, h4, p) { color: #fff; }

/* =============================================
   2. SHARED COMPONENTS (light hero + breadcrumb)
============================================= */
/* Breadcrumb bar sitting under the fixed header */
.theme-light .breadcrumb { background: #fff; }
.theme-light .breadcrumb-inner,
.theme-light .breadcrumb-inner a { color: var(--ink-muted); }
.theme-light .breadcrumb-inner a:hover { color: var(--ink); }
.theme-light .breadcrumb-inner span { color: var(--ink-2); }

/* Page heroes: white -> slate wash with a soft green glow */
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) {
  background: linear-gradient(180deg, #fff 0%, #F8FAFC 100%);
  border-bottom: 1px solid var(--hairline);
}
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light)::before { background: radial-gradient(circle, rgba(118,162,64,.10) 0%, transparent 65%); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light)::after { background: radial-gradient(circle, rgba(118,162,64,.05) 0%, transparent 65%); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) :is(h1, h2) { color: var(--ink); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) h1 :is(em, .accent, .text-green) { color: var(--green-ink); }
.theme-light .pricing-hero h1 span { color: var(--green-ink); }
.theme-light .pricing-hero .pricing-trust span { color: var(--ink-muted); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) :is(p, .page-hero-desc, .hero-desc, .hero-sub) { color: var(--ink-2); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) :is(.eyebrow, .eyebrow--light, .hero-eyebrow) { color: var(--green-ink); }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) :is(.page-hero-badge, .hero-badge) {
  background: #F3F8EC; border-color: rgba(118,162,64,.45); color: var(--green-ink);
}
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) .btn-outline-white { color: var(--ink); border-color: rgba(15,23,42,.28); background: #fff; }
.theme-light :is(.page-hero, .policy-hero, .pricing-hero, .hero-light) .btn-outline-white:hover { border-color: var(--ink); background: #fff; color: var(--ink); }

/* =============================================
   3. TEMPLATE GROUPS (one block per page family)
   Each block below is owned by one page family; keep rules scoped to that family's classes.
============================================= */

/* == GROUP: services (services/*) == */
/* Bands: hero light > what-is dark > cta-strip slate > process dark > why white >
   comparison dark > who slate (dark when no comparison) > mid-cta green > faq white > cta-banner green */
.theme-light .what-is-section.tone-dark .two-col-text p { color: rgba(241,245,249,.75); }
.theme-light .what-is-section.tone-dark h2 { color: #fff; }
.theme-light .what-is-section.tone-dark .highlight-box { background: var(--tone-dark-card); }
.theme-light .what-is-section.tone-dark .highlight-box p { color: rgba(241,245,249,.85); }
.theme-light .what-is-section.tone-dark a:not(.btn) { color: #8fbf4d; }
.theme-light .what-is-section.tone-dark :is(.platform-visual, [class*="-visual"]) { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .cta-strip.tone-alt { background: var(--tone-alt-bg); border-color: var(--hairline); }
.theme-light .cta-strip.tone-alt .cta-strip-text h3 { color: var(--ink); }
.theme-light .cta-strip.tone-alt .cta-strip-text p { color: var(--ink-muted); }
.theme-light .process-section.tone-dark h2 { color: #fff; }
.theme-light .process-section.tone-dark .process-card { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .process-section.tone-dark .process-card h3 { color: #fff; }
.theme-light .process-section.tone-dark .process-card p { color: rgba(241,245,249,.7); }
.theme-light .process-section.tone-dark .process-step-num { color: rgba(143,191,77,.35); }
.theme-light .why-section.tone-light .why-icon svg { color: var(--green-ink); }
.theme-light .comparison-section.tone-dark h2 { color: #fff; }
.theme-light .comparison-section.tone-dark .comparison-table { border: 1px solid var(--tone-dark-line); }
.theme-light .comparison-section.tone-dark .comparison-table thead tr { background: var(--tone-dark-card); }
.theme-light .comparison-section.tone-dark .comparison-table tbody tr { background: var(--tone-dark-card); border-bottom-color: var(--tone-dark-line); }
.theme-light .comparison-section.tone-dark .comparison-table tbody td { color: rgba(241,245,249,.75); }
.theme-light .comparison-section.tone-dark .comparison-table tbody td:first-child { color: #fff; }
.theme-light .comparison-section.tone-dark .comparison-table .check { color: #8fbf4d; }
.theme-light .comparison-section.tone-dark .comparison-table .partial { color: rgba(241,245,249,.55); }
.theme-light .who-section:is(.tone-alt, .tone-light)::before { background: radial-gradient(ellipse, rgba(118,162,64,.06) 0%, transparent 70%); }
.theme-light .who-section:is(.tone-alt, .tone-light) .who-card { background: #fff; border-color: var(--hairline); }
.theme-light .who-section:is(.tone-alt, .tone-light) .who-card h3 { color: var(--ink); }
.theme-light .who-section:is(.tone-alt, .tone-light) .who-card p { color: var(--ink-muted); }
.theme-light .who-section:is(.tone-alt, .tone-light) .who-card-icon svg { color: var(--green-ink); }
.theme-light .who-section.tone-dark h2 { color: #fff; }
.theme-light .cta-banner.tone-accent::before { background: radial-gradient(ellipse, rgba(255,255,255,.10) 0%, transparent 70%); }
.theme-light .cta-banner.tone-accent p { color: rgba(255,255,255,.85); }
.theme-light .cta-banner.tone-accent .eyebrow { color: #fff; }
.theme-light :is(.cta-banner, .mid-cta).tone-accent .btn-primary { background: #fff; color: var(--ink); border-color: #fff; }
.theme-light :is(.cta-banner, .mid-cta).tone-accent .btn-outline-white { color: #fff; border-color: rgba(255,255,255,.7); }
/* == END services == */

/* == GROUP: practice (personal-injury-marketing, who-we-help/*) == */
/* Green CTA bands: primary button flips to white so it does not vanish on green */
.theme-light :is(.mid-cta, .cta-banner, .final-cta).tone-accent { background: var(--green, #76a240); }
.theme-light :is(.mid-cta, .cta-banner, .final-cta).tone-accent::before { background: radial-gradient(circle, rgba(255,255,255,.08) 0%, transparent 65%); }
.theme-light .tone-accent :is(.eyebrow, .eyebrow--light) { color: #fff; opacity: .9; }
.theme-light .tone-accent :is(p, .cta-banner-inner p) { color: rgba(255,255,255,.88); }
.theme-light .tone-accent .btn-primary { background: #fff; color: var(--green-ink); border-color: #fff; }
.theme-light .tone-accent .btn-primary:hover { background: #F3F8EC; color: var(--green-ink); border-color: #F3F8EC; }
/* who-we-help hub: why-cards on dark bands */
.theme-light .tone-dark .why-card { background: var(--tone-dark-card); border: 1px solid var(--tone-dark-line); }
.theme-light .tone-dark .why-card h3 { color: #fff; }
.theme-light .tone-dark .why-card p { color: rgba(241,245,249,.75); }
.theme-light .tone-dark .why-card a { color: var(--green-light, #8fbf4d); }
.theme-light .tone-dark .why-card-icon { color: var(--green-light, #8fbf4d); }
/* FAQ on a dark band (family/estate template): white question cards stay, sidebar flips */
.theme-light .faq-section.tone-dark .faq-sidebar h2 { color: #fff; }
.theme-light .faq-section.tone-dark .faq-sidebar p { color: rgba(241,245,249,.75); }
.theme-light .faq-section.tone-dark .faq-sidebar a:not(.btn) { color: var(--green-light, #8fbf4d); }
.theme-light .faq-section.tone-dark .btn-outline-dark { color: #fff; border-color: rgba(255,255,255,.4); }
/* == END practice == */

/* == GROUP: company (about/*, contact, how-it-works, pricing pages, intake-playbook) == */
/* Company pages: about, about/brian-craig, contact, how-it-works, pricing pages, intake-playbook.
   Band order is set by tone-* classes in the HTML; rules below fix components inside those bands. */

/* Shared: dark-band text and cards */
.theme-light .tone-dark :is(.section-head, .section-header) h2 { color: #fff; }
.theme-light .tone-accent .btn-primary { background: #fff; border-color: #fff; color: var(--ink); }
.theme-light .tone-accent .btn-primary:hover { background: #F1F5F9; border-color: #F1F5F9; color: var(--ink); }
.theme-light .tone-accent .btn-outline-white { color: #fff; border-color: rgba(255,255,255,.7); background: transparent; }
.theme-light .tone-accent .btn-outline-white:hover { background: rgba(255,255,255,.12); border-color: #fff; color: #fff; }

/* About: diff cards on dark, value cards on slate */
.theme-light .diff-section.tone-dark .diff-card { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .diff-section.tone-dark .diff-card h3 { color: #fff; }
.theme-light .diff-section.tone-dark .diff-card p { color: rgba(241,245,249,.72); }
.theme-light .diff-section.tone-dark .diff-icon svg { color: #8fbf4d; }
.theme-light .values-section.tone-alt .value-card { background: #fff; }

/* Contact: dark proof strip, white cards on slate */
.theme-light .proof-strip.tone-dark { border-color: var(--tone-dark-line); }
.theme-light .proof-strip.tone-dark .proof-stat-num { color: #8fbf4d; }
.theme-light .proof-strip.tone-dark .proof-stat-label { color: rgba(241,245,249,.7); }
.theme-light .fit-section.tone-alt :is(.fit-card, .fit-callout) { background: #fff; }
.theme-light .fit-section.tone-alt .fit-card--yes { background: #F3F8EC; border-color: rgba(118,162,64,.45); }

/* Pricing: dark FAQ cards */
.theme-light .pfaq-section.tone-dark .pfaq-item { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .pfaq-section.tone-dark .pfaq-item h3 { color: #fff; }
.theme-light .pfaq-section.tone-dark .pfaq-item p { color: rgba(241,245,249,.75); }
.theme-light .pfaq-section.tone-dark .pfaq-item a { color: #8fbf4d; }

/* Intake playbook: light hero, dark bands */
.theme-light .hero.hero-light { color: var(--ink-2); }
.theme-light .hero.hero-light .hero-note { color: var(--ink-muted); }
.theme-light .band.tone-dark { border-color: var(--tone-dark-line); }
.theme-light .band.tone-dark :is(h2, h3) { color: #fff; }
.theme-light .band.tone-dark :is(p, li, td) { color: rgba(241,245,249,.75); }
.theme-light .band.tone-dark :is(.card, .step) { background: var(--tone-dark-card); border-color: var(--tone-dark-line); box-shadow: none; }
.theme-light .band.tone-dark .step-num,
.theme-light .band.tone-dark .cadence h3,
.theme-light .band.tone-dark a:not(.btn) { color: #8fbf4d; }
.theme-light .band.tone-dark .code-inline { background: var(--tone-dark-line); border-color: #475569; color: #fff; }
.theme-light .band.tone-dark .metric-table th { color: rgba(241,245,249,.6); border-bottom-color: #8fbf4d; }
.theme-light .band.tone-dark .metric-table td { border-bottom-color: var(--tone-dark-line); }
.theme-light .band.tone-dark .metric-table td:first-child { color: #fff; }
.theme-light .band.tone-dark .btn-outline { color: #fff; border-color: rgba(255,255,255,.35); }
.theme-light .band:is(.tone-light, .tone-alt) .cta p { color: rgba(255,255,255,.82); }
.theme-light .band:is(.tone-light, .tone-alt) .cta h2 { color: #fff; }

/* How It Works (migrated from the page inline block) */
.theme-light .hiw-hero.hero-light .hiw-hero-desc { color: var(--ink-2); }
.theme-light .hiw-hero.hero-light .hiw-hero-img img { box-shadow: 0 24px 50px -20px rgba(15,23,42,.25); }
.theme-light .hiw-system.tone-dark :is(h2, h3) { color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-flow li { background: var(--tone-dark-card); border-color: var(--tone-dark-line); color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-flow b { color: #8fbf4d; }
.theme-light .hiw-system.tone-dark .hiw-flow small { color: rgba(241,245,249,.6); }
.theme-light .hiw-system.tone-dark .hiw-flow li.is-last { background: var(--green, #76a240); border-color: var(--green, #76a240); color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-flow li.is-last b { color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-flow li.is-last small { color: rgba(255,255,255,.88); }
.theme-light .hiw-system.tone-dark .hiw-loop { color: rgba(241,245,249,.6); }
.theme-light .hiw-system.tone-dark .hiw-loop span { color: #8fbf4d; }
.theme-light .hiw-system.tone-dark .hiw-step { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .hiw-system.tone-dark .hiw-num { color: #8fbf4d; }
.theme-light .hiw-system.tone-dark .hiw-tag { color: rgba(241,245,249,.6); }
.theme-light .hiw-system.tone-dark .hiw-list li { border-color: var(--tone-dark-line); color: rgba(241,245,249,.8); }
.theme-light .hiw-system.tone-dark .hiw-list li::before { background: #8fbf4d; }
.theme-light .hiw-system.tone-dark .hiw-list a { color: #8fbf4d; }
.theme-light .hiw-system.tone-dark .hiw-list a:hover { color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-metric { background: var(--tone-dark-bg); }
.theme-light .hiw-system.tone-dark .hiw-metric .k { color: rgba(241,245,249,.6); }
.theme-light .hiw-system.tone-dark .hiw-metric .v { color: #fff; }
.theme-light .hiw-system.tone-dark .hiw-step--final { background: rgba(118,162,64,.12); border-color: rgba(143,191,77,.5); }
.theme-light .hiw-system.tone-dark .hiw-step--final .hiw-metric .v { color: #8fbf4d; }

/* Contact hero (light): left column copy */
.theme-light .page-hero .hero-left h1 { color: var(--ink); }
.theme-light .page-hero .hero-left h1 em { color: var(--green-ink); }
.theme-light .page-hero .what-to-expect h3 { color: var(--ink-muted); }
.theme-light .page-hero .expect-text strong { color: var(--ink); }
.theme-light .page-hero .expect-text span,
.theme-light .page-hero .trust-pill { color: var(--ink-muted); }
.theme-light .page-hero :is(.expect-icon svg, .trust-pill svg) { color: var(--green-ink); }
.theme-light .page-hero .trust-row { border-top-color: var(--hairline); }

/* Fixes for dark boxes inside light bands and headings in dark bands */
.theme-light .diff-section.tone-dark h2 { color: #fff; }
.theme-light .tone-light .hiw-own-card--us h3,
.theme-light .tone-alt .hiw-cta-box h2 { color: #fff; }
/* == END company == */

/* == GROUP: content (blog index + posts, podcast, resources/guides/*, policy pages) == */
/* Blog post + podcast hero: dark -> light */
.theme-light .post-hero.tone-light { background: linear-gradient(180deg, #fff 0%, #F8FAFC 100%); border-bottom: 1px solid var(--hairline); }
.theme-light .post-hero.tone-light h1 { color: var(--ink); }
.theme-light .post-hero.tone-light :is(.post-date, .post-author) { color: var(--ink-muted); }
.theme-light .post-hero.tone-light .post-excerpt { color: var(--ink-2); }
.theme-light .post-hero.tone-light a:not(.btn):not(.post-cat-badge) { color: var(--green-ink); }

/* Related posts: slate -> dark band (light .tone-alt when it is the last band) */
.theme-light .related-posts.tone-dark h2 { color: #fff; }
.theme-light .related-posts.tone-dark .related-card { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .related-posts.tone-dark .related-card-body h3 { color: #fff; }
.theme-light .related-posts.tone-dark .related-card-body .post-date { color: rgba(241,245,249,.6); }
.theme-light .related-posts.tone-dark .related-card-body a.read-more { color: #8fbf4d; }
.theme-light .related-posts.tone-alt .related-card-body a.read-more { color: var(--green-ink); }

/* Blog listing: light hero with search, dark sticky category strip */
.theme-light .blog-hero.tone-light { background: linear-gradient(180deg, #fff 0%, #F8FAFC 100%); }
.theme-light .blog-hero.tone-light h1 { color: var(--ink); }
.theme-light .blog-hero.tone-light p { color: var(--ink-2); }
.theme-light .blog-hero .search-input-wrap { background: #fff; border-color: #CBD5E1; }
.theme-light .blog-hero .search-input-wrap:focus-within { background: #fff; border-color: var(--green, #76a240); }
.theme-light .blog-hero .search-input-wrap input { color: var(--ink); }
.theme-light .blog-hero .search-input-wrap input::placeholder { color: var(--ink-muted); }
.theme-light .blog-hero :is(.search-icon, .search-clear) { color: var(--ink-muted); }
.theme-light .blog-hero .search-clear:hover { color: var(--ink); }
.theme-light .blog-hero .search-hint { background: #fff; border-color: var(--hairline); color: var(--ink-2); }
.theme-light .blog-hero .search-hint:hover { background: #F3F8EC; border-color: rgba(118,162,64,.45); color: var(--green-ink); }
.theme-light .cat-filter.tone-dark { border-bottom-color: var(--tone-dark-line); }
.theme-light .cat-filter.tone-dark .cat-btn { background: var(--tone-dark-card); border-color: var(--tone-dark-line); color: rgba(241,245,249,.75); }
.theme-light .cat-filter.tone-dark .cat-btn:hover { border-color: #8fbf4d; color: #8fbf4d; }
.theme-light .cat-filter.tone-dark .cat-btn.active { background: var(--green, #76a240); border-color: var(--green, #76a240); color: #fff; }

/* Guides: light hero, dark table of contents, light final CTA */
.theme-light .guide-hero.tone-light { background: linear-gradient(180deg, #fff 0%, #F8FAFC 100%); border-bottom: 1px solid var(--hairline); }
.theme-light .guide-hero.tone-light h1 { color: var(--ink); }
.theme-light .guide-hero.tone-light p { color: var(--ink-2); }
.theme-light .guide-hero.tone-light p a { color: var(--green-ink); }
.theme-light .guide-hero.tone-light p a:hover { color: var(--ink); }
.theme-light .guide-hero.tone-light .guide-badge { background: #F3F8EC; border-color: rgba(118,162,64,.45); color: var(--green-ink); }
.theme-light .guide-hero.tone-light .guide-meta-item { color: var(--ink-muted); }
.theme-light .guide-hero.tone-light .guide-meta-item svg { color: var(--green-ink); }
.theme-light .toc-section.tone-dark :is(h2, .display-md) { color: #fff; }
.theme-light .toc-section.tone-dark .toc-item { background: var(--tone-dark-card); border-color: var(--tone-dark-line); }
.theme-light .toc-section.tone-dark .toc-item a { color: #fff; }
.theme-light .toc-section.tone-dark .toc-item:hover a { color: #8fbf4d; }
.theme-light .toc-section.tone-dark .toc-num { color: #8fbf4d; background: rgba(143,191,77,.14); }
.theme-light .guide-cta-section.tone-alt .guide-cta-inner h2 { color: var(--ink); }
.theme-light .guide-cta-section.tone-alt .guide-cta-inner p { color: var(--ink-2); }

/* Policy pages: hero is converted in section 2; body bands are .tone-light */
/* Navy cards inside light bands keep white headings */
.theme-light :is(.tone-light, .tone-alt) :is(.sidebar-cta, .sidebar-card--dark, .callout--dark, .community-card, .guide-cta, .stat-strip, .tracking-tier.best, .trigger-card) :is(h1, h2, h3, h4) { color: #fff; }
/* == END content == */