/* ==========================================================================
   site-v3.css — interior pages restyled to match the homepage (home-v3.css).
   Loaded LAST on every interior page. Both templates are covered:
     A · Tailwind-era pages (styles.css + tailwind-compiled.css)
     B · eco pages (eco-styles.css: .section / .btn / .dv-* / .cy-*)
   The legacy sheets lean hard on !important, so rules here are prefixed with
   `html body.eco-chromed` (0,1,2) and use !important where they must win.
   Colours are scoped to the light theme (`html:not([data-theme="dark"])`) so
   the existing dark-mode rules keep working untouched.
   ========================================================================== */

:root {
  --v3-ink: #07130b; --v3-ink-2: #26352b; --v3-muted: #5b6b60; --v3-line: #e2e8df; --v3-tint: #f3f7f0;
  --v3-green: #0fa24a; --v3-green-dk: #087a35; --v3-forest: #05200d; --v3-lime: #b9f24a; --v3-amber: #ffc53d;
  --v3-display: 'Outfit', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --v3-body: 'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --v3-shadow: 0 1px 2px rgba(7, 19, 11, .05), 0 12px 32px -12px rgba(7, 19, 11, .14);
  --v3-shadow-lg: 0 30px 80px -24px rgba(7, 19, 11, .32);
  --v3-ease: cubic-bezier(.2, .8, .2, 1);
}

/* ─── Type ─────────────────────────────────────────────────────────────── */
html body.eco-chromed { font-family: var(--v3-body) !important; -webkit-font-smoothing: antialiased; }
html:not([data-theme="dark"]) body.eco-chromed { background: #fff !important; color: var(--v3-ink); }
html body.eco-chromed main h1, html body.eco-chromed main h2, html body.eco-chromed main h3 { font-family: var(--v3-display) !important; }
html body.eco-chromed main h1 { font-weight: 900 !important; font-size: clamp(40px, 6vw, 78px) !important; line-height: .96 !important; letter-spacing: -.045em !important; text-wrap: balance; }
html body.eco-chromed main h2 { font-weight: 800 !important; font-size: clamp(30px, 3.8vw, 52px) !important; line-height: 1.04 !important; letter-spacing: -.035em !important; text-wrap: balance; }
html body.eco-chromed main h3 { font-weight: 800 !important; letter-spacing: -.02em !important; line-height: 1.2 !important; }
html body.eco-chromed main :is(.prose, .dv-prose, .cy-prose) { font-size: 17.5px !important; line-height: 1.72 !important; }
html body.eco-chromed main :is(.prose, .dv-prose, .cy-prose, .s26-answer-a) a:not([class*="btn"]):not(.pill) { color: var(--v3-green-dk) !important; font-weight: 700; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: rgba(15, 162, 74, .35); }
html[data-theme="dark"] body.eco-chromed main :is(.prose, .dv-prose, .cy-prose, .s26-answer-a) a:not([class*="btn"]):not(.pill) { color: var(--v3-lime) !important; }
html body.eco-chromed ::selection { background: var(--v3-lime); color: var(--v3-forest); }

/* ─── Hero (shared .vbg-hero on both templates) ────────────────────────── */
html body.eco-chromed .vbg-hero { position: relative; isolation: isolate; padding-top: clamp(56px, 8vw, 110px) !important; padding-bottom: clamp(64px, 9vw, 120px) !important; background: var(--v3-forest) !important; overflow: hidden; }
html body.eco-chromed .vbg-hero .vbg-scrim { background: linear-gradient(180deg, rgba(5, 20, 10, .82) 0%, rgba(5, 20, 10, .55) 45%, rgba(5, 20, 10, .9) 100%), radial-gradient(900px 500px at 12% 80%, rgba(15, 162, 74, .38), transparent 70%) !important; }
html body.eco-chromed .vbg-hero::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: .1; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
html body.eco-chromed .vbg-hero h1 { color: #fff !important; font-size: clamp(42px, 6.4vw, 88px) !important; }
html body.eco-chromed .vbg-hero :is(.eco-highlight, h1 .text-emerald-600, h1 .text-emerald-500, h1 span[class*="emerald"]) { color: var(--v3-lime) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
html body.eco-chromed .vbg-hero :is(p, .lead, .text-slate-600, .text-slate-700, .text-lg) { color: rgba(255, 255, 255, .84) !important; }
html body.eco-chromed .vbg-hero :is(.crumb, .vbg-crumb, nav[aria-label="Breadcrumb"]) { font-size: 14px !important; color: rgba(255, 255, 255, .7) !important; }
html body.eco-chromed .vbg-hero :is(.crumb, .vbg-crumb) a, html body.eco-chromed .vbg-hero nav[aria-label="Breadcrumb"] a { color: var(--v3-lime) !important; font-weight: 600; text-decoration: none !important; }
html body.eco-chromed .vbg-hero :is(.badge, .free-badge) { display: inline-flex !important; align-items: center; gap: 8px; padding: 8px 14px !important; border-radius: 999px !important; background: rgba(255, 255, 255, .12) !important; border: 1px solid rgba(255, 255, 255, .24) !important; color: #fff !important; font: 700 13.5px/1.2 var(--v3-body) !important; letter-spacing: 0 !important; text-transform: none !important; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: none !important; }
html body.eco-chromed .vbg-hero .gr-pill { background: rgba(255, 255, 255, .1) !important; border: 1px solid rgba(255, 255, 255, .22) !important; border-radius: 999px !important; color: #fff !important; backdrop-filter: blur(12px); }
html body.eco-chromed .vbg-hero .gr-pill .gr-stars { color: var(--v3-amber) !important; }
html body.eco-chromed .vbg-hero :is(.picture-frame, .dv-hero-mascot, .cy-hero-mascot) img { border-radius: 26px; }
html body.eco-chromed .vbg-hero .picture-frame img { box-shadow: 0 40px 90px -30px rgba(0, 0, 0, .7), 0 0 0 1px rgba(255, 255, 255, .08); }

/* Answer box (AI/voice summary) — glass in the hero, clean card elsewhere */
html body.eco-chromed .s26-answer { border-radius: 24px !important; padding: clamp(20px, 2.6vw, 30px) !important; border: 1px solid var(--v3-line) !important; border-left: 5px solid var(--v3-green) !important; box-shadow: var(--v3-shadow) !important; }
html:not([data-theme="dark"]) body.eco-chromed .s26-answer { background: #fff !important; }
html body.eco-chromed .vbg-hero .s26-answer { background: rgba(255, 255, 255, .07) !important; border-color: rgba(255, 255, 255, .14) !important; border-left-color: var(--v3-lime) !important; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: none !important; }
html body.eco-chromed .s26-answer-q { font-family: var(--v3-display) !important; font-weight: 800 !important; letter-spacing: -.02em !important; }
html body.eco-chromed .s26-facts li::marker { color: var(--v3-green); }

/* ─── Buttons ──────────────────────────────────────────────────────────── */
html body.eco-chromed main :is(.btn, a.bg-emerald-600, a.bg-emerald-700, button.bg-emerald-600, a.bg-slate-900, a.btn-ghost, a.btn-primary, .cy-hero-actions a, .dv-hero-actions a) {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 9px;
  min-height: 52px !important; padding: 0 24px !important; border-radius: 999px !important;
  font: 700 15.5px/1 var(--v3-body) !important; letter-spacing: -.005em !important; text-decoration: none !important;
  transition: transform .25s var(--v3-ease), box-shadow .25s var(--v3-ease), background .2s, border-color .2s !important;
}
html body.eco-chromed main :is(.btn-bright, .btn-primary, a.bg-emerald-600, a.bg-emerald-700, button.bg-emerald-600, a.cta-glow) {
  background: var(--v3-green-dk) !important; background-image: none !important; color: #fff !important; border: 0 !important;   /* green-dk: white text passes 4.5:1 (the brighter green is 3.3:1) */
  box-shadow: 0 10px 28px -10px rgba(15, 162, 74, .75) !important;
}
html body.eco-chromed main :is(.btn-bright, .btn-primary, a.bg-emerald-600, a.bg-emerald-700, button.bg-emerald-600, a.cta-glow):hover { background: #066a2d !important; transform: translateY(-2px) !important; }
html body.eco-chromed main a.bg-slate-900 { background: var(--v3-ink) !important; color: #fff !important; border: 0 !important; }
html body.eco-chromed main :is(.btn-outline, a.btn-ghost) { background: transparent !important; border: 1.5px solid var(--v3-line) !important; color: var(--v3-ink) !important; box-shadow: none !important; }
html body.eco-chromed main :is(.btn-outline, a.btn-ghost):hover { border-color: var(--v3-ink) !important; transform: translateY(-2px) !important; }
html body.eco-chromed main .btn-white { background: #fff !important; color: var(--v3-forest) !important; border: 0 !important; }
/* On dark backgrounds (heroes, CTA bands) outline buttons go glass */
html body.eco-chromed :is(.vbg-hero, .dv-cta-section, .cy-cta-section, .section-green, section.bg-slate-900, [class*="from-emerald-"], [class*="bg-gradient"]) :is(.btn-outline, a.btn-ghost, a.border-2, a[class*="border-white"]) {
  background: rgba(255, 255, 255, .1) !important; border: 1.5px solid rgba(255, 255, 255, .3) !important; color: #fff !important; backdrop-filter: blur(10px);
}
html body.eco-chromed :is(.vbg-hero, .dv-cta-section, .cy-cta-section, .section-green) :is(.btn-bright, a.bg-emerald-600) { background: var(--v3-lime) !important; color: var(--v3-forest) !important; box-shadow: 0 12px 36px -10px rgba(185, 242, 74, .55) !important; }

/* ─── Sections ─────────────────────────────────────────────────────────── */
html body.eco-chromed main :is(section.section, section.py-14, section.py-12, section.py-16):not(.vbg-hero) { padding-top: clamp(72px, 8.5vw, 124px) !important; padding-bottom: clamp(72px, 8.5vw, 124px) !important; border-top: 0 !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.section-cream, section.bg-slate-50, section.bg-emerald-50):not(.vbg-hero) { background: var(--v3-tint) !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.section-paper, section.bg-white):not(.vbg-hero) { background: #fff !important; }
html body.eco-chromed main :is(.max-w-7xl, .wrap) { max-width: 1240px !important; }
/* Section heads */
html body.eco-chromed main .section-header { margin-bottom: clamp(32px, 4.5vw, 56px) !important; }
html body.eco-chromed main .section-tag {
  display: inline-flex !important; align-items: center; gap: 10px; margin-bottom: 18px !important;
  padding: 0 !important; background: none !important; border: 0 !important; box-shadow: none !important;
  font: 700 13px/1 var(--v3-body) !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--v3-green-dk) !important;
}
html body.eco-chromed main .section-tag::before { content: ""; width: 28px; height: 2px; border-radius: 2px; background: currentColor; }
html body.eco-chromed main .section-tag .tag-ic { display: none !important; }
html[data-theme="dark"] body.eco-chromed main .section-tag { color: var(--v3-lime) !important; }
html body.eco-chromed main .section-title .eco-highlight, html body.eco-chromed main h2 .eco-highlight {
  background: linear-gradient(100deg, var(--v3-green-dk), var(--v3-green) 45%, #6bd12a) !important; -webkit-background-clip: text !important; background-clip: text !important; color: transparent !important; -webkit-text-fill-color: transparent !important;
}
html body.eco-chromed main :is(.section-desc, .section-header p) { font-size: clamp(17px, 1.5vw, 19.5px) !important; line-height: 1.6 !important; }

/* ─── Cards ────────────────────────────────────────────────────────────── */
html body.eco-chromed main :is(.info-card, .rounded-xl.border, .rounded-2xl.border, .rounded-2xl.shadow-lg, .dv-pair-card, .dv-step, .cy-why-card, .cy-accept-card, .cy-stat, .step-card, .nf-link-card) {
  border-radius: 24px !important; border: 1.5px solid var(--v3-line) !important; box-shadow: none !important;
  transition: transform .4s var(--v3-ease), box-shadow .4s var(--v3-ease), border-color .3s !important;
}
html:not([data-theme="dark"]) body.eco-chromed main :is(.info-card, .rounded-xl.border, .rounded-2xl.border, .dv-pair-card, .dv-step, .cy-why-card, .cy-accept-card, .step-card, .nf-link-card) { background: #fff !important; }
html body.eco-chromed main :is(.info-card, .rounded-xl.border, .rounded-2xl.border, .dv-step, .cy-why-card, .cy-accept-card, .step-card, .nf-link-card):hover { transform: translateY(-5px) !important; box-shadow: var(--v3-shadow-lg) !important; border-color: transparent !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.rounded-xl.border, .rounded-2xl.border) :is(h3, .font-bold, .font-extrabold) { color: var(--v3-ink); }
/* Numbered step badges */
html body.eco-chromed main :is(.dv-step .num, .step-card .num, .cy-stat .num) { font-family: var(--v3-display) !important; font-weight: 900 !important; letter-spacing: -.04em !important; }
html body.eco-chromed main .dv-step .num { width: 52px !important; height: 52px !important; border-radius: 16px !important; background: var(--v3-lime) !important; color: var(--v3-forest) !important; box-shadow: none !important; display: inline-flex !important; align-items: center; justify-content: center; font-size: 22px !important; }
/* Icon chips */
html body.eco-chromed main :is(.eco-tile-ic, .dv-pair-card .ic, .icon-wrap, .cy-why-card .ic) { border-radius: 16px !important; background: var(--v3-tint) !important; color: var(--v3-green-dk) !important; box-shadow: none !important; }
html body.eco-chromed main :is(.info-card, .cy-why-card):hover :is(.eco-tile-ic, .ic) { background: var(--v3-lime) !important; color: var(--v3-forest) !important; }
/* Tailwind emerald accents → brand */
html:not([data-theme="dark"]) body.eco-chromed main :is(.text-emerald-600, .text-emerald-700, .text-emerald-800) { color: var(--v3-green-dk) !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(div, aside).bg-emerald-50 { background: var(--v3-tint) !important; border-color: var(--v3-line) !important; border-radius: 24px !important; }

/* ─── FAQ accordions ───────────────────────────────────────────────────── */
html body.eco-chromed main :is(.dv-faq, .cy-faq) { display: grid !important; gap: 10px !important; }
html body.eco-chromed main :is(.dv-faq, .cy-faq) details { border-radius: 22px !important; border: 1.5px solid var(--v3-line) !important; box-shadow: none !important; overflow: hidden; transition: box-shadow .25s, border-color .25s; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.dv-faq, .cy-faq) details { background: #fff !important; }
html body.eco-chromed main :is(.dv-faq, .cy-faq) details[open] { box-shadow: var(--v3-shadow) !important; }
html body.eco-chromed main :is(.dv-faq, .cy-faq) summary { padding: 22px 24px !important; }
html body.eco-chromed main :is(.dv-faq, .cy-faq) .q-h { font-size: 19px !important; font-weight: 700 !important; letter-spacing: -.01em !important; }

/* ─── Reviews ──────────────────────────────────────────────────────────── */
html body.eco-chromed main :is(.dv-review, .cy-review) { border-radius: 28px !important; padding: 30px !important; border: 1.5px solid var(--v3-line) !important; box-shadow: none !important; transition: transform .4s var(--v3-ease), box-shadow .4s var(--v3-ease) !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):hover { transform: translateY(-6px) rotate(-.5deg) !important; box-shadow: var(--v3-shadow-lg) !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+1) { background: #fff !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+2) { background: var(--v3-lime) !important; border-color: var(--v3-lime) !important; color: var(--v3-forest) !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+3) { background: var(--v3-forest) !important; border-color: var(--v3-forest) !important; color: #fff !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+2) :is(.quote, .author, p) { color: var(--v3-forest) !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+3) :is(.quote, .author, p) { color: #fff !important; }
html body.eco-chromed main :is(.dv-review, .cy-review) .quote { font: 700 clamp(19px, 1.8vw, 23px)/1.38 var(--v3-display) !important; letter-spacing: -.015em !important; font-style: normal !important; }
html body.eco-chromed main :is(.dv-review, .cy-review):nth-child(3n+2) .stars { color: var(--v3-forest) !important; }

/* ─── Pills / link grids / related ─────────────────────────────────────── */
html body.eco-chromed main :is(.pill, .dv-related a, .cy-related a, .dv-cities a, .s26-linkgrid a) { border-radius: 999px !important; border: 1.5px solid var(--v3-line) !important; box-shadow: none !important; font-weight: 600 !important; transition: background .2s, border-color .2s, transform .2s var(--v3-ease) !important; }
html:not([data-theme="dark"]) body.eco-chromed main :is(.pill, .dv-related a, .cy-related a, .dv-cities a, .s26-linkgrid a) { background: #fff !important; color: var(--v3-ink-2) !important; }
html body.eco-chromed main :is(.pill, .dv-related a, .cy-related a, .dv-cities a, .s26-linkgrid a):hover { background: var(--v3-lime) !important; border-color: var(--v3-lime) !important; color: var(--v3-forest) !important; transform: translateY(-2px) !important; }

/* TV policy callout */
html body.eco-chromed main .s26-tvpolicy { border-radius: 24px !important; border: 1.5px solid #f3dc92 !important; background: #fff8e3 !important; box-shadow: none !important; }
html[data-theme="dark"] body.eco-chromed main .s26-tvpolicy { background: rgba(255, 197, 61, .08) !important; border-color: rgba(255, 197, 61, .3) !important; }

/* ─── Dark CTA bands ───────────────────────────────────────────────────── */
html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section) { position: relative; overflow: hidden; isolation: isolate; background: var(--v3-forest) !important; }
html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section)::before { content: ""; position: absolute; inset: -40%; z-index: -1; background: conic-gradient(from 0deg, #05200d, #0fa24a, #05200d, #0a5d29, #05200d); filter: blur(80px); opacity: .55; animation: v3Spin 26s linear infinite; }
@keyframes v3Spin { to { transform: rotate(360deg); } }
html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section) h2 { color: #fff !important; font-size: clamp(38px, 6vw, 84px) !important; line-height: .95 !important; letter-spacing: -.05em !important; }
html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section) .section-tag { color: var(--v3-lime) !important; }

/* Google rating band */
html body.eco-chromed .gr-band { background: var(--v3-forest) !important; border: 0 !important; }
html body.eco-chromed .gr-band .gr-band-score { font-family: var(--v3-display) !important; font-weight: 900 !important; color: #fff !important; }
html body.eco-chromed .gr-band .gr-band-stars { color: var(--v3-amber) !important; }
html body.eco-chromed .gr-band .gr-band-sub { color: rgba(255, 255, 255, .72) !important; }
html body.eco-chromed .gr-band .gr-band-btn { background: var(--v3-lime) !important; color: var(--v3-forest) !important; border-radius: 999px !important; border: 0 !important; font-weight: 800 !important; }

/* Forms (contact / schedule pickup) */
html body.eco-chromed main :is(input[type="text"], input[type="email"], input[type="tel"], input[type="date"], input[type="number"], select, textarea) { border-radius: 14px !important; border: 1.5px solid var(--v3-line) !important; min-height: 50px; font-family: var(--v3-body) !important; transition: border-color .2s, box-shadow .2s !important; }
html body.eco-chromed main :is(input, select, textarea):focus { border-color: var(--v3-green) !important; box-shadow: 0 0 0 5px rgba(15, 162, 74, .12) !important; outline: 0 !important; }
html body.eco-chromed main textarea { min-height: 110px; }

/* Maps / media frames */
html body.eco-chromed main iframe[src*="google.com/maps"] { border-radius: 24px !important; }

/* Scroll reveal is kept from site-2026.js; just soften it to match the homepage */
@media (prefers-reduced-motion: reduce) {
  html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section)::before { animation: none; }
  html body.eco-chromed main * { transition: none !important; }
}
@media (max-width: 640px) {
  html body.eco-chromed main h1 { font-size: clamp(36px, 10.5vw, 52px) !important; }
  html body.eco-chromed .vbg-hero h1 { font-size: clamp(38px, 11vw, 56px) !important; }
  html body.eco-chromed main h2 { font-size: clamp(28px, 8vw, 40px) !important; }
  html body.eco-chromed main :is(.btn, a.bg-emerald-600, a.bg-slate-900, a.btn-ghost, .cy-hero-actions a, .dv-hero-actions a) { width: 100%; }
}

/* ─── Dark sections (.section-green on eco pages) — homepage forest look ─── */
html body.eco-chromed main .section-green { background: var(--v3-forest) !important; color: #fff; position: relative; isolation: isolate; }
html body.eco-chromed main .section-green::after { content: ""; position: absolute; z-index: -1; width: 900px; height: 900px; right: -300px; top: -350px; border-radius: 50%; background: radial-gradient(circle, rgba(15, 162, 74, .4), transparent 65%); pointer-events: none; }
html body.eco-chromed main .section-green { overflow: hidden; }
html body.eco-chromed main .section-green :is(h2, h3) { color: #fff !important; }
html body.eco-chromed main .section-green .section-tag { color: var(--v3-lime) !important; }
html body.eco-chromed main .section-green :is(.section-desc, p, li) { color: rgba(255, 255, 255, .74) !important; }
html body.eco-chromed main .section-green :is(h2, .section-title) .eco-highlight { background: none !important; color: var(--v3-lime) !important; -webkit-text-fill-color: var(--v3-lime) !important; }
html body.eco-chromed main .section-green a:not([class*="btn"]) { color: var(--v3-lime) !important; }
html body.eco-chromed main .section-green :is(.card, [class*="-card"], article) { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(255, 255, 255, .1) !important; border-radius: 26px !important; box-shadow: none !important; }
html body.eco-chromed main .section-green :is(.card, [class*="-card"], article):hover { background: rgba(255, 255, 255, .08) !important; transform: translateY(-5px) !important; }
/* Tailwind dark strips (bg-slate-900 trust bars): brand forest, keep their compact size */
html body.eco-chromed main section.bg-slate-900 { background: var(--v3-forest) !important; }

/* Hero buttons on Tailwind-era pages (.btn-primary/.btn-secondary/.btn-ghost).
   site-2026.css paints every hero link green at (0,4,1) — these win at (0,4,4). */
html body.eco-chromed main .vbg-hero :is(a.btn-primary, a.btn-secondary, a.btn-ghost, a.bg-emerald-600, a.bg-slate-900):not(.v3-x) {
  display: inline-flex !important; align-items: center; justify-content: center; gap: 9px;
  min-height: 54px !important; padding: 0 24px !important; border-radius: 999px !important;
  font: 700 15.5px/1 var(--v3-body) !important; text-decoration: none !important;
  transition: transform .25s var(--v3-ease), background .2s, border-color .2s !important;
}
html body.eco-chromed main .vbg-hero :is(a.btn-primary, a.bg-emerald-600):not(.v3-x) { background: var(--v3-lime) !important; color: var(--v3-forest) !important; border: 0 !important; box-shadow: 0 12px 36px -10px rgba(185, 242, 74, .55) !important; }
html body.eco-chromed main .vbg-hero :is(a.btn-secondary, a.btn-ghost, a.bg-slate-900):not(.v3-x) { background: rgba(255, 255, 255, .1) !important; color: #fff !important; border: 1.5px solid rgba(255, 255, 255, .3) !important; box-shadow: none !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
html body.eco-chromed main .vbg-hero :is(a.btn-primary, a.btn-secondary, a.btn-ghost, a.bg-emerald-600, a.bg-slate-900):not(.v3-x):hover { transform: translateY(-2px) !important; }

/* ==========================================================================
   MOTION LAYER v3.1 (2026-09-27) — the services.html treatment, sitewide.
   Paired with assets/js/site-v3.js, which injects the decor (hero grid/orbs,
   marquee, CTA rings, card glow, progress bar) and tags reveal targets.
   All motion is gated on html.v3-js, set inline in <head> only when the
   visitor has not asked for reduced motion.
   ========================================================================== */

/* Scroll progress */
.v3-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 1002; transform-origin: left; transform: scaleX(0); background: linear-gradient(90deg, var(--v3-green), var(--v3-lime)); pointer-events: none; }

/* Hero headline: solid white (gradient text + text-shadow read as grey) */
html body.eco-chromed .vbg-hero h1 { -webkit-text-fill-color: #fff !important; text-shadow: 0 2px 30px rgba(0, 0, 0, .35) !important; }
html body.eco-chromed .vbg-hero h1 :is(.eco-highlight, .text-emerald-600, .text-emerald-500, span[class*="emerald"]) { -webkit-text-fill-color: var(--v3-lime) !important; }

/* Hero decor (injected) */
html body.eco-chromed .vbg-hero > :is(.v3-grid, .v3-orb) { position: absolute !important; z-index: 1 !important; pointer-events: none; }
.v3-grid { inset: 0; opacity: .55;
  background-image: linear-gradient(rgba(185, 242, 74, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(185, 242, 74, .08) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(70% 80% at 72% 40%, #000 15%, transparent 75%); mask-image: radial-gradient(70% 80% at 72% 40%, #000 15%, transparent 75%); }
.v3-orb { border-radius: 50%; filter: blur(70px); }
.v3-orb--a { width: 520px; height: 520px; right: -140px; top: -180px; background: radial-gradient(circle, rgba(15, 162, 74, .5), transparent 65%); }
.v3-orb--b { width: 400px; height: 400px; left: 28%; bottom: -240px; background: radial-gradient(circle, rgba(185, 242, 74, .26), transparent 65%); }
html.v3-js .v3-grid { animation: v3Grid 22s linear infinite; }
html.v3-js .v3-orb--a { animation: v3Drift 14s ease-in-out infinite alternate; }
html.v3-js .v3-orb--b { animation: v3Drift 18s ease-in-out -6s infinite alternate-reverse; }
@keyframes v3Grid { to { background-position: 64px 64px; } }
@keyframes v3Drift { to { transform: translate(-80px, 60px) scale(1.15); } }

/* Hero entrance — pure CSS so it runs on first paint with no flash */
html.v3-js body.eco-chromed .vbg-hero h1 { animation: v3H1 1.1s var(--v3-ease) .08s both; }
html.v3-js body.eco-chromed .vbg-hero :is(.crumb, .vbg-crumb, nav[aria-label="Breadcrumb"], .badge, .free-badge) { animation: v3Rise .8s var(--v3-ease) both; }
html.v3-js body.eco-chromed .vbg-hero h1 ~ * { animation: v3Rise .9s var(--v3-ease) .35s both; }
html.v3-js body.eco-chromed .vbg-hero h1 ~ * ~ * { animation-delay: .45s; }
html.v3-js body.eco-chromed .vbg-hero h1 ~ * ~ * ~ * { animation-delay: .55s; }
html.v3-js body.eco-chromed .vbg-hero h1 ~ * ~ * ~ * ~ * { animation-delay: .65s; }
html.v3-js body.eco-chromed .vbg-hero h1 ~ * ~ * ~ * ~ * ~ * { animation-delay: .75s; }
html.v3-js body.eco-chromed .vbg-hero :is(.picture-frame, .page-hero-mascot, .dv-hero-mascot, .cy-hero-mascot, [class*="hero-mascot"]) { animation: v3Pop 1.2s var(--v3-ease) .25s both; }
html.v3-js body.eco-chromed .vbg-hero :is(.page-hero-mascot, .dv-hero-mascot, .cy-hero-mascot, [class*="hero-mascot"]) img { animation: v3Float 6s ease-in-out 1.4s infinite; }
html body.eco-chromed .vbg-hero .picture-frame img { transition: transform .8s var(--v3-ease) !important; }
html body.eco-chromed .vbg-hero .picture-frame:hover img { transform: perspective(900px) rotateY(-6deg) rotateX(3deg) scale(1.02); }
@keyframes v3H1 { from { opacity: 0; transform: translateY(40px); clip-path: inset(0 -10% 100% -10%); } to { opacity: 1; transform: none; clip-path: inset(-20% -10% -30% -10%); } }
@keyframes v3Rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes v3Pop { from { opacity: 0; transform: scale(.88) translateY(30px); } to { opacity: 1; transform: none; } }
@keyframes v3Float { 50% { translate: 0 -12px; } }

/* Marquee (injected after the hero) */
.v3-marquee { position: relative; z-index: 3; background: var(--v3-lime); color: var(--v3-forest); overflow: hidden; border-block: 1px solid rgba(5, 32, 13, .12); }
.v3-marquee-track { display: flex; width: max-content; }
html.v3-js .v3-marquee-track { animation: v3Marq 40s linear infinite; }
.v3-marquee:hover .v3-marquee-track { animation-play-state: paused; }
.v3-marquee ul { display: flex; margin: 0; padding: 0; list-style: none; }
.v3-marquee li { display: flex; align-items: center; gap: 26px; margin: 0; padding: 18px 0 18px 26px; font: 800 clamp(20px, 2.4vw, 30px)/1 var(--v3-display); letter-spacing: -.03em; white-space: nowrap; }
.v3-marquee li::after { content: ""; width: 12px; height: 12px; border-radius: 3px; background: var(--v3-forest); transform: rotate(45deg); }
@keyframes v3Marq { to { transform: translateX(-50%); } }

/* Scroll reveals (tagged by site-v3.js, class removed once played) */
html.v3-js .v3-rv { opacity: 0 !important; transform: translateY(34px) !important; }
html.v3-js .v3-rv.is-in { opacity: 1 !important; transform: none !important; transition: opacity .85s var(--v3-ease) var(--v3d, 0s), transform .85s var(--v3-ease) var(--v3d, 0s) !important; }

/* Pointer spotlight on cards */
.v3-card { position: relative; isolation: isolate; }
.v3-glow { position: absolute; inset: 0; z-index: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .35s;
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(15, 162, 74, .14), transparent 70%); }
.v3-card:hover > .v3-glow { opacity: 1; }
html[data-theme="dark"] .v3-glow, :is(.section-green, [class*="stats-strip"]) .v3-glow { background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(185, 242, 74, .16), transparent 70%); }
html body.eco-chromed main .v3-card:hover { border-color: rgba(15, 162, 74, .45) !important; }
html body.eco-chromed main .v3-card :is(.eco-tile-ic, .ic, .icon-wrap, .service-icon-wrap) { transition: transform .5s var(--v3-ease), background .3s, color .3s !important; }
html body.eco-chromed main .v3-card:hover :is(.eco-tile-ic, .ic, .icon-wrap, .service-icon-wrap) { transform: translateY(-4px) rotate(-6deg); }

/* Button shine */
html body.eco-chromed main :is(.btn, .btn-primary, .btn-bright, .btn-white, .btn-outline-white, a.bg-emerald-600, a.bg-white) { position: relative; overflow: hidden; isolation: isolate; }
html body.eco-chromed main :is(.btn, .btn-primary, .btn-bright, .btn-white, a.bg-emerald-600, a.bg-white)::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .5) 50%, transparent 70%); transform: translateX(-120%); }
html body.eco-chromed main :is(.btn, .btn-primary, .btn-bright, .btn-white, a.bg-emerald-600, a.bg-white):hover::after { transform: translateX(120%); transition: transform .8s var(--v3-ease); }

/* CTA bands: .cta-glow (section + card variants) and every *-cta-section */
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) { position: relative; overflow: hidden; isolation: isolate; background: var(--v3-forest) !important; background-image: radial-gradient(60% 70% at 50% 115%, rgba(15, 162, 74, .55), transparent 70%) !important; color: #fff !important; border: 0 !important; box-shadow: none !important; }
html body.eco-chromed main .cta-glow { display: block !important; min-height: 0 !important; }
html body.eco-chromed main section.cta-glow { padding: clamp(88px, 11vw, 150px) 0 !important; border-radius: 0 !important; }
html body.eco-chromed main div.cta-glow { border-radius: 32px !important; padding: clamp(40px, 6vw, 72px) clamp(24px, 4vw, 56px) !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) h2 { color: #fff !important; -webkit-text-fill-color: #fff !important; }
html body.eco-chromed main section.cta-glow h2 { font-size: clamp(40px, 6vw, 84px) !important; line-height: .95 !important; letter-spacing: -.05em !important; }
html body.eco-chromed main div.cta-glow h2 { font-size: clamp(30px, 4vw, 52px) !important; line-height: 1 !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) p { color: rgba(255, 255, 255, .8) !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) > :not(.v3-rings) { position: relative; z-index: 1; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) > .v3-rings { position: absolute; z-index: 0; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-white, a.bg-white) { display: inline-flex !important; align-items: center; justify-content: center; gap: 9px; min-height: 54px !important; padding: 0 26px !important; border-radius: 999px !important; background: var(--v3-lime) !important; color: var(--v3-forest) !important; border: 0 !important; font: 800 15.5px/1 var(--v3-body) !important; text-decoration: none !important; box-shadow: 0 14px 34px -14px rgba(185, 242, 74, .8) !important; transition: transform .3s var(--v3-ease) !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-outline-white, a.border-2) { display: inline-flex !important; align-items: center; justify-content: center; gap: 9px; min-height: 54px !important; padding: 0 26px !important; border-radius: 999px !important; background: rgba(255, 255, 255, .08) !important; color: #fff !important; border: 1.5px solid rgba(255, 255, 255, .3) !important; font: 700 15.5px/1 var(--v3-body) !important; text-decoration: none !important; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform .3s var(--v3-ease), background .2s !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-white, a.bg-white, .btn-outline-white, a.border-2):hover { transform: translateY(-3px) !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-outline-white, a.border-2):hover { background: rgba(255, 255, 255, .16) !important; }
.v3-rings { left: 50%; top: 50%; width: 0; height: 0; pointer-events: none; }
.v3-rings span { position: absolute; left: -380px; top: -380px; width: 760px; height: 760px; border-radius: 50%; border: 1.5px solid rgba(185, 242, 74, .22); opacity: 0; }
html.v3-js .v3-rings span { animation: v3Ring 7.5s linear infinite; }
html.v3-js .v3-rings span:nth-child(2) { animation-delay: 2.5s; }
html.v3-js .v3-rings span:nth-child(3) { animation-delay: 5s; }
@keyframes v3Ring { 0% { transform: scale(.2); opacity: 0; } 15% { opacity: 1; } 100% { transform: scale(1.5); opacity: 0; } }
html body.eco-chromed main :is(.dv-cta-section, .cy-cta-section)::before { opacity: .35; }

/* Stat strips (city / ITAD / service-area pages) */
html body.eco-chromed main [class*="stats-strip"] { background: var(--v3-forest) !important; padding: 34px 0 !important; border: 0 !important; }
html body.eco-chromed main :is(.cy-stat, .it-stat, .sa-stat) { background: rgba(255, 255, 255, .05) !important; border: 1px solid rgba(185, 242, 74, .16) !important; border-radius: 22px !important; color: #fff !important; padding: 20px 22px !important; text-align: left !important; }
html body.eco-chromed main :is(.cy-stat, .it-stat, .sa-stat) :is(.v, .num, strong) { display: block; color: var(--v3-lime) !important; font: 900 clamp(26px, 2.6vw, 38px)/1 var(--v3-display) !important; letter-spacing: -.04em !important; }
html body.eco-chromed main :is(.cy-stat, .it-stat, .sa-stat) :is(.l, .lbl) { color: rgba(255, 255, 255, .72) !important; font: 600 13px/1.3 var(--v3-body) !important; letter-spacing: .06em; text-transform: uppercase; margin-top: 8px; }

/* Tables (pricing comparisons etc.) */
html body.eco-chromed main table { border-collapse: separate !important; border-spacing: 0 !important; width: 100%; border: 1.5px solid var(--v3-line) !important; border-radius: 22px !important; overflow: hidden; font-size: 15px; }
html body.eco-chromed main table :is(th, td) { padding: 13px 16px !important; border: 0 !important; border-bottom: 1px solid var(--v3-line) !important; text-align: left; vertical-align: top; }
html body.eco-chromed main table tr:last-child > :is(td, th) { border-bottom: 0 !important; }
html body.eco-chromed main table thead th:not(.v3-a):not(.v3-b) { background: var(--v3-forest) !important; color: #fff !important; font: 700 13px/1.2 var(--v3-body) !important; letter-spacing: .08em; text-transform: uppercase; }
html:not([data-theme="dark"]) body.eco-chromed main table tbody tr:nth-child(even) { background: #f7faf5; }
html body.eco-chromed main table tbody tr { transition: background .2s; }
html:not([data-theme="dark"]) body.eco-chromed main table tbody tr:hover { background: #eef8e6; }
html[data-theme="dark"] body.eco-chromed main table { border-color: rgba(255, 255, 255, .1) !important; }
html[data-theme="dark"] body.eco-chromed main table :is(th, td) { border-bottom-color: rgba(255, 255, 255, .08) !important; }
html[data-theme="dark"] body.eco-chromed main table tbody tr:hover { background: rgba(185, 242, 74, .06); }

/* Answer card under the hero lifts on hover */
html body.eco-chromed main .s26-answer { transition: transform .5s var(--v3-ease), box-shadow .5s var(--v3-ease) !important; }
html body.eco-chromed main .s26-answer:hover { transform: translateY(-4px); }

@media (max-width: 760px) {
  .v3-orb--a { width: 340px; height: 340px; }
  html body.eco-chromed main div.cta-glow { border-radius: 26px !important; }
  html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-white, a.bg-white, .btn-outline-white, a.border-2) { width: 100%; }
  html body.eco-chromed main table { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .v3-marquee-track, .v3-grid, .v3-orb, .v3-rings span { animation: none !important; }
  .v3-glow { display: none; }
}

/* h2 used as a card title (battery/TV item pages) — card-sized, not section-sized */
html body.eco-chromed main :is(.rounded-2xl, .rounded-xl, .rounded-3xl, [class*="-card"]):not(.cta-glow) h2 { font-size: clamp(22px, 2vw, 28px) !important; line-height: 1.1 !important; letter-spacing: -.03em !important; }
/* The small CTA card keeps the glow low so it reads forest, not bright green */
html body.eco-chromed main div.cta-glow { background-image: radial-gradient(70% 90% at 50% 150%, rgba(15, 162, 74, .5), transparent 70%) !important; box-shadow: 0 40px 80px -40px rgba(5, 32, 13, .7) !important; }

/* Legacy inline .cta-glow::before paints a bright green gradient over the card — the rings replace it */
html body.eco-chromed main .cta-glow::before { display: none !important; }
/* Dark theme: eco-chrome.css turns .page-hero h1 into green gradient text at (0,3,2) — keep the white headline */
html body.eco-chromed main .vbg-hero h1:not(.v3-a) { background: none !important; color: #fff !important; -webkit-text-fill-color: #fff !important; }
html body.eco-chromed main .vbg-hero h1:not(.v3-a) :is(.eco-highlight, .text-emerald-600, .text-emerald-500, span[class*="emerald"]) { color: var(--v3-lime) !important; -webkit-text-fill-color: var(--v3-lime) !important; background: none !important; }

/* ─── Guides / articles (body split out of the hero into section.v3-article) ─── */
html body.eco-chromed main .vbg-hero + .v3-marquee + .v3-article, html body.eco-chromed main .vbg-hero + .v3-article { padding-top: clamp(48px, 6vw, 80px) !important; }
html body.eco-chromed main .v3-article .article-body { font-size: 18px; line-height: 1.78; color: var(--v3-ink-2); }
html[data-theme="dark"] body.eco-chromed main .v3-article .article-body { color: #c4d3c8; }
html body.eco-chromed main .v3-article .article-body h2 { position: relative; margin: 2.2em 0 .6em !important; padding-top: 22px; font-size: clamp(26px, 3vw, 38px) !important; line-height: 1.08 !important; }
html body.eco-chromed main .v3-article .article-body h2::before { content: ""; position: absolute; left: 0; top: 0; width: 44px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--v3-green), var(--v3-lime)); }
html body.eco-chromed main .v3-article .article-body h3 { margin: 1.6em 0 .5em !important; font-size: clamp(20px, 2vw, 24px) !important; }
html body.eco-chromed main .v3-article .article-body :is(ul, ol) { padding-left: 1.3em; }
html body.eco-chromed main .v3-article .article-body li { margin: .35em 0; }
html body.eco-chromed main .v3-article .article-body li::marker { color: var(--v3-green); font-weight: 800; }
html body.eco-chromed main .v3-article .article-body a:not([class*="btn"]) { color: var(--v3-forest) !important; font-weight: 700; text-decoration: none !important; background: linear-gradient(rgba(185, 242, 74, .55), rgba(185, 242, 74, .55)) 0 100% / 100% 30% no-repeat; transition: background-size .3s var(--v3-ease); }
html body.eco-chromed main .v3-article .article-body a:not([class*="btn"]):hover { background-size: 100% 100%; color: var(--v3-forest) !important; }
html[data-theme="dark"] body.eco-chromed main .v3-article .article-body a:not([class*="btn"]) { color: var(--v3-lime) !important; background-image: linear-gradient(rgba(185, 242, 74, .2), rgba(185, 242, 74, .2)); }
html body.eco-chromed main .v3-article .article-body blockquote { margin: 1.6em 0; padding: 22px 26px; border-radius: 22px; border-left: 5px solid var(--v3-lime); background: var(--v3-tint); font: 700 20px/1.45 var(--v3-display); }
html[data-theme="dark"] body.eco-chromed main .v3-article .article-body blockquote { background: rgba(255, 255, 255, .05); }
html body.eco-chromed main .v3-article .s26-answer { margin-bottom: 28px; }

/* ─── "For businesses, on request" note (inside answer boxes + standalone) ─── */
html body.eco-chromed .s26-answer .s26-onreq, html body.eco-chromed .v3-onreq { display: block; position: relative; margin: 16px 0 0 !important; padding: 14px 16px 14px 50px; border-radius: 14px; background: rgba(185, 242, 74, .16); border: 1px dashed rgba(15, 162, 74, .45); color: var(--v3-ink-2) !important; font-size: 14.5px !important; line-height: 1.55 !important; }
html body.eco-chromed .s26-answer .s26-onreq::before, html body.eco-chromed .v3-onreq::before { content: ""; position: absolute; left: 16px; top: 15px; width: 22px; height: 22px; border-radius: 6px; background: var(--v3-forest) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b9f24a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3Cpath d='m9 15 2 2 4-4'/%3E%3C/svg%3E") center/14px no-repeat; }
html body.eco-chromed .s26-onreq strong, html body.eco-chromed .v3-onreq strong { color: var(--v3-ink) !important; }
html[data-theme="dark"] body.eco-chromed .s26-answer .s26-onreq, html[data-theme="dark"] body.eco-chromed .v3-onreq { background: rgba(185, 242, 74, .08); border-color: rgba(185, 242, 74, .35); color: #cfe0d4 !important; }
html[data-theme="dark"] body.eco-chromed .s26-onreq strong, html[data-theme="dark"] body.eco-chromed .v3-onreq strong { color: var(--v3-lime) !important; }
html body.eco-chromed .vbg-hero .s26-answer .s26-onreq { background: rgba(185, 242, 74, .1); border-color: rgba(185, 242, 74, .35); color: rgba(255, 255, 255, .85) !important; }
html body.eco-chromed .vbg-hero .s26-onreq strong { color: var(--v3-lime) !important; }
html body.eco-chromed .v3-onreq { max-width: 920px; margin: 26px auto 0 !important; }
html body.eco-chromed .v3-onreq p { margin: 0; }

/* ─── Contrast fixes (2026-09-28 sitewide audit) ─────────────────────────── */
/* Outline / ghost buttons carry ink text; on dark surfaces they need light text */
html[data-theme="dark"] body.eco-chromed main :is(.btn-outline, a.btn-ghost, .btn.btn-outline) { color: #eef5ef !important; border-color: rgba(255, 255, 255, .24) !important; }
html[data-theme="dark"] body.eco-chromed main :is(.btn-outline, a.btn-ghost):hover { border-color: var(--v3-lime) !important; color: var(--v3-lime) !important; }
/* FAQ questions and card headings follow the theme */
html[data-theme="dark"] body.eco-chromed main details summary, html[data-theme="dark"] body.eco-chromed main details summary .q-h { color: #eef5ef !important; }
html[data-theme="dark"] body.eco-chromed main :is(.rounded-xl.border, .rounded-2xl.border, .info-card) :is(h2, h3, h4, .font-bold, .font-extrabold, .text-slate-900, .text-slate-800) { color: #eef5ef !important; }
/* Tailwind green links/buttons with white text use the deeper green */
html body.eco-chromed main a.inline-flex:is(.bg-emerald-500, .bg-emerald-600, .bg-green-600) { background-color: var(--v3-green-dk) !important; }
/* Every dark CTA band (.cta-glow and all *-cta-section variants): light labels, glass outlines, lime primary */
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) .section-tag { color: var(--v3-lime) !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-outline, a.btn-ghost) { background: rgba(255, 255, 255, .1) !important; border: 1.5px solid rgba(255, 255, 255, .3) !important; color: #fff !important; }
html body.eco-chromed main :is(.cta-glow, .cta-section, [class*="-cta-section"]) :is(.btn-bright, .btn-primary, a.bg-emerald-600) { background: var(--v3-lime) !important; color: var(--v3-forest) !important; }
/* Grey helper text on dark bands (video strips, forest sections, CTA bands) */
html body.eco-chromed main :is(section.bg-slate-900, .section-green, [class*="-cta-section"], .cta-glow, [class*="stats-strip"]) :is(.text-slate-400, .text-slate-500, .text-slate-600, .text-gray-400, .text-gray-500, .text-gray-600) { color: rgba(255, 255, 255, .74) !important; }
/* Pale fine print on light backgrounds: #5b6b60 clears 4.5:1 on white and the tint */
html:not([data-theme="dark"]) body.eco-chromed main :is(.text-slate-400, .text-slate-500, .text-gray-400, .text-gray-500):not(.sv-dark *):not(.sv-hero *):not(.vbg-hero *) { color: #5b6b60 !important; }