/* Shared Project Calculators design system. Concrete calculator is the visual baseline. */
/* Global primitives and theme tokens */
:root {
  color-scheme: dark;
  --font-interface: "Avenir Next", Avenir, "Segoe UI", system-ui, sans-serif;
  --font-display: Georgia, Cambria, "Times New Roman", serif;
  --font-data: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --font-ad: "Trebuchet MS", "Gill Sans", sans-serif;
  --bg: #0b1220;
  --page-top: #07101f;
  --panel: rgba(15, 23, 42, .88);
  --panel-2: rgba(30, 41, 59, .92);
  --panel-bottom: rgba(15, 23, 42, .68);
  --results-bottom: rgba(15, 23, 42, .66);
  --result: rgba(2, 6, 23, .34);
  --soft-text: #cbd5e1;
  --soft-bg: rgba(15, 23, 42, .55);
  --bad: #fca5a5;
  --control: rgba(15, 23, 42, .8);
  --text: #e5eefc;
  --muted: #9fb0cc;
  --label: #dbeafe;
  --brand: #60a5fa;
  --brand-2: #7c3aed;
  --line: rgba(148, 163, 184, .18);
  --shadow: 0 20px 50px rgba(0, 0, 0, .35);
  --ad-bg: #172033;
  --ad-border: rgba(148, 163, 184, .28);
  --ad-accent: #93c5fd;
}
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #f4f7fb;
  --page-top: #fff;
  --panel: rgba(255, 255, 255, .96);
  --panel-2: #edf2f8;
  --panel-bottom: rgba(241, 245, 249, .96);
  --results-bottom: #eef4fb;
  --result: #f1f5f9;
  --soft-text: #334155;
  --soft-bg: rgba(255, 255, 255, .8);
  --bad: #b91c1c;
  --control: #fff;
  --text: #172033;
  --muted: #4b5d78;
  --label: #1e3a5f;
  --brand: #2563eb;
  --brand-2: #6d28d9;
  --line: rgba(30, 64, 175, .2);
  --shadow: 0 18px 45px rgba(30, 64, 175, .12);
  --ad-bg: #f8fafc;
  --ad-border: #cbd5e1;
  --ad-accent: #475569;
}
* { box-sizing: border-box; }
html { min-height: 100%; }
body { min-height: 100vh; margin: 0; font: 1rem/1.55 var(--font-interface); background-color: #0b1220; background-image: radial-gradient(circle at top left, rgba(96,165,250,.2), transparent 30%), radial-gradient(circle at top right, rgba(52,211,153,.14), transparent 30%), linear-gradient(180deg, var(--page-top), var(--bg)); color: var(--text); }
a { color: var(--brand); text-underline-offset: .18em; }
h1, h2, h3 { font-family: var(--font-display); letter-spacing: -.015em; }
p { overflow-wrap: break-word; }
.site-nav, body > nav { max-width: 1160px; margin: 0 auto; padding: 1.25rem; display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; }
.site-nav a:first-child, body > nav a:first-child { margin-right: auto; font-weight: 800; text-decoration: none; color: var(--text); }
.site-nav .theme-toggle, body > nav .theme-toggle { margin-left: auto; }
body > main, body > footer { width: min(100% - 2rem, 760px); margin-inline: auto; }
body > main { padding: 1.25rem 0; }
article, .panel, .card { background-color: #111c30; background-image: linear-gradient(180deg, var(--panel), var(--panel-2)); border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
article { padding: clamp(1.2rem, 4vw, 2.5rem); }
input, select, textarea, button { max-width: 100%; border: 1px solid #475569; border-radius: 12px; padding: 10px 14px; background: #0b1220; color: #e5eefc; font: inherit; }
button { cursor: pointer; font-weight: 700; }
.theme-toggle, #themeToggle { display: block; width: auto; margin-left: auto; }
:focus-visible { outline: 3px solid var(--brand); outline-offset: 3px; }
footer { color: var(--muted); text-align: center; padding: 28px 0 40px; font-size: .92rem; }
.ads { margin-top: 24px; border: 1px solid var(--ad-border); border-radius: 14px; padding: 14px; color: var(--soft-text); background: var(--ad-bg); box-shadow: none; font-family: var(--font-ad); line-height: 1.4; }
.ads strong { display: block; margin-bottom: 4px; font-size: .96rem; letter-spacing: .025em; }
.ads p { margin: 0 0 8px; font-size: .86rem; }
.ads .ad-url { color: var(--ad-accent); font-size: .82rem; font-weight: 800; overflow-wrap: anywhere; }
.ads .affiliate-disclosure { display: block; margin-top: 8px; color: var(--muted); font-size: .74rem; }
@media (max-width: 640px) { .site-nav, body > nav { padding: 1rem; } body > main, body > footer { width: min(100% - 2rem, 760px); } }
@media print { .theme-toggle, #themeToggle, .ads, .no-print, body > nav { display: none !important; } body { background: #fff; color: #000; } article, .panel, .card { background: #fff; color: #000; box-shadow: none; } }

/* Home page layout */
.home-page * { box-sizing: border-box; }
    body.home-page {
      margin: 0;
      font-family: var(--font-interface);
      background-color: #0b1220;
      background-image: radial-gradient(circle at top left, rgba(96,165,250,.22), transparent 30%), radial-gradient(circle at top right, rgba(124,58,237,.18), transparent 30%), linear-gradient(180deg, var(--page-top) 0%, var(--bg) 100%);
      color: var(--text);
      line-height: 1.55;
    }
    .home-page a { color: var(--brand); }
    .home-page .wrap { max-width: 1120px; margin: 0 auto; padding: 24px; }
    .home-page header { padding: 56px 0 28px; }
    .home-page .eyebrow { color: #93c5fd; text-transform: uppercase; letter-spacing: .18em; font-size: .78rem; font-weight: 700; }
    .home-page h1 { font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: 1.03; margin: 12px 0 16px; }
    .home-page .lead { max-width: 62ch; color: var(--muted); font-size: 1.08rem; }
    .home-page .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
    .home-page .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 13px 18px;
      border-radius: 14px;
      text-decoration: none;
      font-weight: 700;
      border: 1px solid var(--line);
      background: var(--soft-bg);
      box-shadow: none;
    }
    .home-page .grid { display: grid; gap: 24px; grid-template-columns: 1.2fr .8fr; }
    .home-page .panel, .home-page .card {
      background: linear-gradient(180deg, var(--panel), var(--panel-2));
      border: 1px solid var(--line);
      border-radius: 24px;
      box-shadow: var(--shadow);
    }
    .home-page .panel { padding: 24px; }
    .home-page .card-list { display: grid; gap: 16px; }
    .home-page .card { padding: 22px; }
    .home-page .card h2, .home-page .card h3 { margin: 0 0 8px; }
    .home-page .card p { margin: 0; color: var(--muted); }
    .home-page .status { display: inline-block; margin-top: 14px; color: var(--brand); font-size: .92rem; }
    .home-page .section { margin-top: 28px; }
    .home-page .section h2 { margin: 0 0 10px; }
    .home-page ul { margin: 12px 0 0; padding-left: 18px; color: var(--muted); }
    .home-page footer { color: var(--muted); text-align: center; padding: 30px 0 42px; font-size: .92rem; }
    @media (max-width: 900px) { .home-page .grid { grid-template-columns: 1fr; } }
    @media (max-width: 640px) { .home-page .wrap { padding: 16px; } .home-page h1 { font-size: 2.4rem; } }

/* Concrete calculator layout */
.concrete-page * { box-sizing: border-box; }
    .concrete-page [hidden] { display: none !important; }
    body.concrete-page { margin:0; font-family:var(--font-interface); background-color:#0b1220; background-image:radial-gradient(circle at top left,rgba(96,165,250,.2),transparent 30%),radial-gradient(circle at top right,rgba(52,211,153,.14),transparent 30%),linear-gradient(180deg,var(--page-top) 0%,var(--bg) 100%); color:var(--text); line-height:1.5; }
    .concrete-page a { color:inherit; }
    .concrete-page .wrap { max-width:1160px; margin:0 auto; padding:24px; }
    .concrete-page .calculator-nav { display:flex; justify-content:space-between; gap:16px; align-items:center; }

    .concrete-page header, .concrete-page main, .concrete-page footer { width:100%; }
    .concrete-page .hero { display:grid; gap:24px; align-items:center; grid-template-columns:1.2fr .8fr; padding:48px 0 24px; }
    .concrete-page .eyebrow { color:#93c5fd; text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; font-weight:700; }
    .concrete-page h1, .concrete-page h2, .concrete-page h3 { font-family:var(--font-display); letter-spacing:-.015em; }
    .concrete-page h1 { font-size:clamp(2.3rem,5vw,4.5rem); line-height:1.02; margin:12px 0 16px; }
    .concrete-page .lead { font-size:1.08rem; color:var(--muted); max-width:62ch; }
    .concrete-page .trust { display:flex; flex-wrap:wrap; row-gap:4px; margin:20px 0 0; padding:0; color:var(--soft-text); font-size:.84rem; font-weight:600; letter-spacing:.01em; list-style:none; }
    .concrete-page .trust li + li::before { content:"•"; margin:0 9px; color:var(--brand); }
    .concrete-page .cta-card, .concrete-page .calc-card, .concrete-page .seo-card, .concrete-page .faq-card { background-color:#0f172a; background-image:linear-gradient(180deg,var(--panel),var(--panel-bottom)); border:1px solid var(--line); box-shadow:var(--shadow); border-radius:24px; backdrop-filter:blur(14px); }
    .concrete-page .cta-card, .concrete-page .calc-card, .concrete-page .seo-card, .concrete-page .faq-card { padding:24px; }
    .concrete-page .cta-card h2, .concrete-page .calc-card h2 { margin:0 0 6px; }
    .concrete-page .cta-card p, .concrete-page .subtle { color:var(--muted); margin:0 0 18px; }
    .concrete-page .cta-btn { display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--brand),#7c3aed); color:white; padding:13px 18px; border-radius:14px; font-weight:700; text-decoration:none; }
    .concrete-page .grid { display:grid; gap:24px; grid-template-columns:1.05fr .95fr; }
    .concrete-page .fields > *, .concrete-page .grid > * { min-width:0; }
    .concrete-page form { display:grid; gap:14px; }
    .concrete-page .fields { display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .concrete-page fieldset { min-width:0; max-width:100%; }
    .concrete-page label { display:grid; gap:6px; font-size:.95rem; color:#dbeafe; }
    .concrete-page input, .concrete-page select, .concrete-page textarea { width:100%; min-width:0; max-width:100%; border-radius:14px; border:1px solid #475569; background:#0b1220; color:#e5eefc; padding:13px 14px; font:inherit; font-size:1rem; outline:none; }

    .concrete-page input:focus, .concrete-page select:focus, .concrete-page textarea:focus { border-color:rgba(96,165,250,.7); box-shadow:0 0 0 4px rgba(96,165,250,.14); }

    .concrete-page input[aria-invalid="true"] { border-color:#f87171; box-shadow:0 0 0 3px rgba(248,113,113,.16); }
    .concrete-page .field-error { min-height:1.1em; margin:4px 0 0; color:#fca5a5; font-size:.82rem; }
    .concrete-page .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
    .concrete-page .results { padding:24px; background-color:#1e293b; background-image:linear-gradient(180deg,var(--panel-2),var(--results-bottom)); border:1px solid var(--line); border-radius:24px; box-shadow:var(--shadow); display:grid; gap:16px; align-content:start; }
    .concrete-page .result-grid { display:grid; gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
    .concrete-page .result { background:#020617; border:1px solid var(--line); border-radius:18px; padding:16px; }

    .concrete-page .result .k { font-size:.85rem; color:var(--muted); }
    .concrete-page .result .v { font-family:var(--font-data); font-size:1.4rem; font-weight:800; font-variant-numeric:tabular-nums; letter-spacing:-.025em; margin-top:6px; overflow-wrap:anywhere; }
    .concrete-page .comparison-intro { margin:-8px 0 0; }
    .concrete-page .comparison-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
    .concrete-page .comparison-grid article { min-width:0; padding-left:14px; border-left:1px solid var(--line); }
    .concrete-page .comparison-grid article:first-child { padding-left:0; border-left:0; }
    .concrete-page .comparison-grid h4 { margin:0 0 8px; font-size:.94rem; }
    .concrete-page .comparison-quantity, .concrete-page .comparison-cost { margin:0; font-family:var(--font-data); font-variant-numeric:tabular-nums; font-weight:800; overflow-wrap:anywhere; }
    .concrete-page .comparison-cost { color:var(--brand); font-size:1.05rem; }
    .concrete-page .comparison-guidance { margin:8px 0 0; color:var(--muted); font-size:.78rem; line-height:1.4; }
    .concrete-page .note { color:var(--muted); font-size:.92rem; margin:0; }
    .concrete-page .ads { margin-top:24px; border:1px solid var(--ad-border); border-radius:14px; padding:14px; color:var(--soft-text); background:var(--ad-bg); box-shadow:none; font-family:var(--font-ad); line-height:1.4; }
    .concrete-page .ads strong { display:block; color:var(--text); margin-bottom:4px; font-family:var(--font-ad); font-size:.96rem; letter-spacing:.025em; }
    .concrete-page .ads p { margin:0 0 8px; font-size:.86rem; }
    .concrete-page .ad-url { color:var(--ad-accent); font-size:.82rem; font-weight:800; overflow-wrap:anywhere; text-underline-offset:3px; }
    .concrete-page .ad-url:focus-visible { outline:3px solid var(--ad-accent); outline-offset:4px; border-radius:3px; }
    .concrete-page .seo-card, .concrete-page .faq-card { margin-top:24px; }
    .concrete-page .seo-grid { display:grid; gap:18px; grid-template-columns:repeat(3,minmax(0,1fr)); }
    .concrete-page .seo-item h3, .concrete-page .faq-item h3 { margin:0 0 8px; font-size:1.05rem; }
    .concrete-page .seo-item p, .concrete-page .faq-item p { margin:0; color:var(--muted); }
    .concrete-page .faq { display:grid; gap:14px; }
    .concrete-page footer { color:var(--muted); text-align:center; padding:28px 0 40px; font-size:.92rem; }
    .concrete-page .actions { display:flex; flex-wrap:wrap; gap:10px; }
    .concrete-page #projectSections p { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:10px 0; border-bottom:1px solid var(--line); }
    .concrete-page #projectSections p > span { flex:1 1 220px; }
    .concrete-page #projectSections .action-btn { padding:7px 10px; font-size:.86rem; }
    .concrete-page .action-btn { border:1px solid #475569; border-radius:12px; padding:10px 14px; background:#0b1220; color:#e5eefc; font:inherit; font-weight:700; cursor:pointer; }
    .concrete-page .action-btn:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
    .concrete-page .theme-control { max-width:180px; margin-left:auto; }
    .concrete-page .mobile-summary { display:none; }
    @media (prefers-color-scheme: light) { .concrete-page :root:not([data-theme]) { color-scheme:light; } }
    @media print { .concrete-page .hero, .concrete-page .calc-card, .concrete-page .ads, .concrete-page .actions, .concrete-page .theme-control, .concrete-page .seo-card, .concrete-page .faq-card, .concrete-page footer, .concrete-page summary, .concrete-page .mobile-summary { display:none !important; } body.concrete-page { background:#fff; color:#000; } .concrete-page .grid { display:block; } .concrete-page .results, .concrete-page .result { color:#000; background:#fff; box-shadow:none; border-color:#777; } .concrete-page .result .k, .concrete-page .note { color:#222; } }
    @media (max-width: 900px) { .concrete-page .hero, .concrete-page .grid, .concrete-page .seo-grid { grid-template-columns:1fr; } }
    @media (max-width: 640px) {
      body.concrete-page { padding-bottom:calc(92px + env(safe-area-inset-bottom)); }
      .concrete-page .wrap {padding:16px} .concrete-page h1 {font-size:2.3rem} .concrete-page .fields, .concrete-page .result-grid, .concrete-page .comparison-grid {grid-template-columns:1fr} .concrete-page .calc-card, .concrete-page .results, .concrete-page .seo-card, .concrete-page .faq-card {padding:18px}
      .concrete-page .comparison-grid article, .concrete-page .comparison-grid article:first-child { padding:12px 0 0; border-left:0; border-top:1px solid var(--line); }
      .concrete-page .mobile-summary { position:fixed; z-index:20; left:0; right:0; bottom:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background:var(--panel-2); border-top:1px solid var(--line); box-shadow:0 -10px 30px rgba(0,0,0,.28); }
      body.concrete-page:has(input:focus, .concrete-page select:focus, .concrete-page textarea:focus) .mobile-summary { display:none; }
      .concrete-page .mobile-summary div { min-width:0; }
      .concrete-page .mobile-summary .k { display:block; color:var(--muted); font-size:.72rem; }
      .concrete-page .mobile-summary .v { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--font-data); font-size:.92rem; font-variant-numeric:tabular-nums; font-weight:800; }
    }
.concrete-page .results-heading { margin: 0; }

/* Gravel calculator layout */
.gravel-page * {box-sizing:border-box}body.gravel-page {margin:0;font:1rem/1.5 var(--font-interface);background-color:#0b1220;color:var(--text)}.gravel-page a {color:var(--brand)}.gravel-page .wrap {max-width:1180px;margin:auto;padding:24px}.gravel-page header {display:flex;justify-content:space-between;gap:16px;align-items:center}.gravel-page .brand {text-decoration:none;font-weight:800}.gravel-page h1 {font-size:clamp(2rem,5vw,3.6rem);line-height:1.05;margin:.5em 0 .25em}.gravel-page .lead, .gravel-page .help {color:var(--muted)}.gravel-page .layout {display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:24px;align-items:start}.gravel-page .panel, .gravel-page fieldset, .gravel-page .tile {border:1px solid var(--line);border-radius:18px;background-color:#111c30;background-image:linear-gradient(180deg,var(--panel),var(--panel-2));box-shadow:0 18px 45px rgba(0,0,0,.2)}.gravel-page .panel {padding:22px}.gravel-page fieldset {margin:0 0 18px;padding:16px}.gravel-page legend {font-weight:800;padding:0 8px}.gravel-page .grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.gravel-page .field {min-width:0}.gravel-page label {display:block;font-weight:700;margin-bottom:5px}.gravel-page input, .gravel-page select, .gravel-page button {width:100%;font:inherit;border:1px solid #475569;border-radius:10px;padding:11px;background:#0b1220;color:#e5eefc}.gravel-page button {cursor:pointer;font-weight:750}.gravel-page .primary {background:linear-gradient(135deg,var(--brand),var(--brand-2));color:white;border:0}.gravel-page .actions {display:grid;grid-template-columns:1fr 1fr;gap:9px}.gravel-page .field-error {display:block;min-height:1.3em;color:var(--bad);font-size:.82rem}.gravel-page .results {display:grid;grid-template-columns:1fr 1fr;gap:12px}.gravel-page .tile {padding:15px}.gravel-page .tile span {display:block;color:var(--muted);font-size:.88rem}.gravel-page .tile strong {font-size:1.15rem}.gravel-page .basis {margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}.gravel-page #resultStatus {min-height:1.5em}.gravel-page .mobile-summary {display:none}.gravel-page .print-only {display:none}.gravel-page :focus-visible {outline:3px solid var(--brand);outline-offset:3px}.gravel-page [hidden] {display:none!important}@media(max-width:800px) {.gravel-page .layout {grid-template-columns:1fr}.gravel-page .wrap {padding:16px 16px 110px}.gravel-page .mobile-summary {display:grid;position:fixed;z-index:5;bottom:0;left:0;right:0;grid-template-columns:repeat(3,1fr);gap:5px;padding:10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:var(--panel);border-top:1px solid var(--line);text-align:center}.gravel-page .mobile-summary span {display:block;color:var(--muted);font-size:.72rem}.gravel-page .mobile-summary strong {font-size:.88rem}body.gravel-page:focus-within .mobile-summary {display:none}}@media(max-width:420px) {.gravel-page .grid, .gravel-page .results, .gravel-page .actions {grid-template-columns:1fr}}@media print {.gravel-page .no-print, .gravel-page form, .gravel-page .mobile-summary {display:none!important}.gravel-page .print-only {display:block}.gravel-page .layout {display:block}.gravel-page .panel {box-shadow:none}}
.concrete-page .brand, .gravel-page .brand { color:var(--text); text-decoration:none; font-weight:800; }
.concrete-page .site-footer, .gravel-page .site-footer { width:min(calc(100vw - 48px), 1112px); margin-inline:auto; color:var(--muted); text-align:center; padding:28px 0 40px; font-size:.92rem; }
.concrete-page .site-footer a, .gravel-page .site-footer a { color:inherit; }
@media print { .concrete-page .site-footer, .gravel-page .site-footer { display:none !important; } }

/* Guide and trust pages */
body.guide-page, body.trust-page { min-height: 100vh; background-color: #0b1220; background-image: radial-gradient(circle at top left, rgba(96,165,250,.16), transparent 32%), linear-gradient(180deg, var(--page-top), var(--bg)); color: var(--text); }
.guide-page main, .trust-page main { width: min(100% - 2rem, 800px); margin: 0 auto; padding: 1.5rem 0 2rem; }
.guide-page article, .trust-page article { padding: clamp(1.25rem, 4vw, 2.75rem); background-color: #111c30; background-image: linear-gradient(180deg, var(--panel), var(--panel-2)); border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow); }
.guide-page article h1, .trust-page article h1 { margin: 0 0 1rem; font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.08; }
.guide-page article h2, .trust-page article h2 { margin: 1.75rem 0 .65rem; }
.guide-page article p, .trust-page article p, .guide-page article li, .trust-page article li { color: var(--muted); }
.guide-page article a, .trust-page article a { font-weight: 700; }
.guide-page code, .trust-page code { padding: .12rem .35rem; border: 1px solid var(--line); border-radius: 6px; background: var(--control); color: var(--text); }
.guide-page footer, .trust-page footer { width: min(100% - 2rem, 800px); margin: 0 auto; padding: 1rem 0 2.5rem; color: var(--muted); text-align: center; }
@media (max-width: 640px) { .guide-page main, .trust-page main, .guide-page footer, .trust-page footer { width: min(100% - 1.5rem, 800px); } .guide-page article, .trust-page article { border-radius: 18px; } }

/* Explicit solid theme surfaces keep contrast reliable in legacy WebKit. */
:root[data-theme="light"] body,
:root[data-theme="light"] body.home-page,
:root[data-theme="light"] body.concrete-page,
:root[data-theme="light"] body.gravel-page,
:root[data-theme="light"] body.guide-page,
:root[data-theme="light"] body.trust-page { background-color: #f4f7fb; }
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea,
:root[data-theme="light"] button { background-color: #fff; color: #172033; border-color: #b4c0cf; }
:root[data-theme="light"] article,
:root[data-theme="light"] .panel,
:root[data-theme="light"] .card,
:root[data-theme="light"] .guide-page article,
:root[data-theme="light"] .trust-page article { background-color: #fff; }
:root[data-theme="light"] .concrete-page .cta-card,
:root[data-theme="light"] .concrete-page .calc-card,
:root[data-theme="light"] .concrete-page .seo-card,
:root[data-theme="light"] .concrete-page .faq-card,
:root[data-theme="light"] .concrete-page .results,
:root[data-theme="light"] .concrete-page .result,
:root[data-theme="light"] .gravel-page .panel,
:root[data-theme="light"] .gravel-page fieldset,
:root[data-theme="light"] .gravel-page .tile { background-color: #fff; }
:root[data-theme="light"] .concrete-page input,
:root[data-theme="light"] .concrete-page select,
:root[data-theme="light"] .concrete-page textarea,
:root[data-theme="light"] .concrete-page .action-btn,
:root[data-theme="light"] .gravel-page input,
:root[data-theme="light"] .gravel-page select,
:root[data-theme="light"] .gravel-page button { background-color: #fff; color: #172033; border-color: #b4c0cf; }
:root[data-theme="light"] .concrete-page label { color: #1e3a5f; }
:root[data-theme="light"] .concrete-page .eyebrow { color: #1e40af; }