/* Shared customer-page accents; calculation and payment states stay local. */
body {
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #e8f7f2;
  --text: #203c38;
  --muted: #526660;
  --line: #c6dfd8;
  --primary: #007b78;
  --primary-strong: #163c38;
  --primary-soft: #d8f4e9;
  --panel-top: #164d44;
  --panel-mid: #163c38;
  --panel-bottom: #12332e;
  --panel-glow-1: transparent;
  --panel-glow-2: transparent;
  background: #fff;
}
body:not(.guided-page), body.guided-page { background: #fff; }
body:not(.guided-page) { --bg: #fff; --surface-soft: #e8f7f2; --text: #203c38; --muted: #526660; --line: #c6dfd8; --primary: #007b78; --primary-strong: #163c38; --primary-soft: #d8f4e9; }
body :is(h1, h2, h3) { letter-spacing: 0; }
body .nav { border-color: #b9ded6; box-shadow: 0 5px 0 #e1f3ec; }
body .brand-mark { background: #007b78; color: #fff; }
body .hero-copy h1 { color: #163c38; text-decoration: underline; text-decoration-color: #ffe36b; text-decoration-thickness: 6px; text-underline-offset: 7px; }
body .tool-page-copy h1 { font-size: 40px; line-height: 1.2; max-width: 24ch; }
body:not(.guided-page) :is(.eyebrow, .panel-tag, .result-label) { color: #006b68; }
body .button.primary { background: #007b78; border-color: #007b78; color: #fff; }
body .button.secondary { background: #e2efff; border-color: #a1c3e8; color: #245d94; }
body .button { transition: background-color 180ms ease, box-shadow 180ms ease; }
body .button:hover { box-shadow: 0 4px 0 #c6dfd8; }
body :is(.tool-form-card, .tool-side-card, .tool-result-card) { border-radius: 8px; border-color: #c6dfd8; box-shadow: none; }
body .tool-side-card { background: #e8f7f2; }
body .tool-result-card { border-top: 4px solid #e4c33a; }
body :is(.booking-type-card, .booking-service-card) { background: #e2efff; border-color: #a1c3e8; border-radius: 8px; }
body .booking-type-card:nth-child(2n) { background: #fff0b3; border-color: #d9c568; }
body :is(.booking-type-card, .booking-service-card):has(input:checked) { background: #d8f4e9; border-color: #007b78; box-shadow: 0 0 0 2px #007b78; }
body :is(.booking-type-card, .booking-service-card):has(input:focus-visible) { outline: 3px solid #245d94; outline-offset: 5px; }
body .booking-service-tag { background: #fff; color: #006b68; }
body .booking-service-price { color: #163c38; font-size: 18px; }
body .pass-item { background: #e8f7f2; border-color: #b9ded6; border-radius: 8px; }
body .pass-item:nth-child(3n + 2) { background: #e2efff; border-color: #a1c3e8; }
body .pass-item:nth-child(3n) { background: #fff0b3; border-color: #d9c568; }
body .pass-item .tick { background: #fff; color: #006b68; }
body a.pass-item:hover { border-color: #007b78; box-shadow: 0 3px 0 #c6dfd8; }
body .pass-value-note { background: #e2efff; border-color: #a1c3e8; border-radius: 8px; color: #244e7b; }
body .pass-price-strip { padding: 20px 0; border-top: 3px solid #e4c33a; border-bottom: 1px solid #c6dfd8; }
body :is(.tool-form, .tool-summary-form) :is(input, select, textarea):focus-visible { outline: 3px solid #007b78; outline-offset: 2px; }
body :is(a, button):focus-visible { outline: 3px solid #007b78; outline-offset: 4px; }
body.nl-page { --paper: #fff; --paper-2: #fff; --line: #c6dfd8; --pink-wash: #ffe6ec; --muted: #626963; background: #fff; }
body .nl-page-title, body .nl-hero h1 { text-decoration: underline; text-decoration-color: #ffe36b; text-underline-offset: 7px; }
body .rei-card, body .rei-results { border-radius: 8px; box-shadow: none; }
body .rei-step-head > span { border-radius: 50%; background: #007b78; }
body .rei-hero h1 { text-decoration: underline; text-decoration-color: #ffe36b; text-underline-offset: 7px; }
body .rei-hero-note { background: #163c38; }
body .rei-hero-note::after { display: none; }
body #root > .min-h-screen { background: #fff; }
body #root header { border-bottom: 4px solid #ffe36b; box-shadow: 0 5px 0 #d8f4e9; }
body[data-premium-product="paint-calculator"] #root header.bg-red-700 { background: #007b78; }
/* The brief's introductory panel is separate from its form and validation UI. */
body[data-premium-product="architectural-brief"] #root main > section:first-child { border-radius: 0; box-shadow: none; border-color: #b9ded6; }
body[data-premium-product="architectural-brief"] #root main > section:first-child > div > div:first-child { background: #d8f4e9; color: #163c38; }
body[data-premium-product="architectural-brief"] #root main > section:first-child > div > div:first-child :is(p, ul, span) { color: #203c38; }
body[data-premium-product="architectural-brief"] #root main > section:first-child > div > div:first-child .backdrop-blur-sm { background: transparent; border: 0; border-top: 2px solid #83b7a8; border-radius: 0; }
body[data-premium-product="architectural-brief"] #root header .bg-gradient-to-br { background: #007b78; }
body .paint-home-shortcut { color: #006b68; border-color: #b9ded6; }
@media (max-width: 640px) { body .tool-page-copy h1 { font-size: 30px; } }
@media (prefers-reduced-motion: reduce) { body .button, body .booking-type-card, body .booking-service-card { transition: none; transform: none; } }
@media print { body .hero-copy h1, body .rei-hero h1 { text-decoration: none; } }
