/* ============================================================
 * ClaimDone — Light Theme Override
 * Loaded AFTER main.css + enhancements; redefines design tokens
 * and modernises components without rewriting the structural CSS.
 *
 * Palette: Stripe-clean × Linear-confident.
 *   Surfaces  pure white + soft slate
 *   Text      slate-900 → slate-500 → slate-400
 *   Primary   violet-600 (#7c3aed) — kept close to the old purple
 *             so existing component styling still feels right
 *   Accent    cyan-500 (#06b6d4) — used sparingly for "exciting"
 *             gradients on hero, badges, sale tags
 *   Success   emerald-500 (#10b981)
 * ============================================================ */

:root {
  /* --- Surfaces --- */
  --bg:          #ffffff;
  --bg-2:        #f8fafc;          /* slate-50 — alternating sections */
  --bg-3:        #f1f5f9;          /* slate-100 — subtle accent panels */
  --card:        #ffffff;
  --card-hover:  #ffffff;
  --card-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 1px 3px rgba(15,23,42,0.06);
  --card-shadow-lg: 0 10px 30px -8px rgba(15,23,42,0.10), 0 4px 8px -4px rgba(15,23,42,0.05);
  --card-shadow-xl: 0 24px 48px -12px rgba(15,23,42,0.18);

  /* --- Borders --- */
  --border:        #e2e8f0;        /* slate-200 */
  --border-light:  #f1f5f9;        /* slate-100 */
  --border-strong: #cbd5e1;        /* slate-300 — for inputs on focus */

  /* --- Brand --- */
  --purple:        #7c3aed;        /* violet-600 */
  --purple-hover:  #6d28d9;        /* violet-700 */
  --purple-light:  #8b5cf6;        /* violet-500 */
  --purple-soft:   #ede9fe;        /* violet-100 — for tinted bg blocks */
  --purple-glow:   rgba(124,58,237,0.18);

  /* --- Accents (excitement) --- */
  --cyan:          #06b6d4;
  --cyan-soft:     #cffafe;
  --gradient-hero: linear-gradient(135deg, #7c3aed 0%, #6366f1 50%, #06b6d4 100%);
  --gradient-text: linear-gradient(135deg, #7c3aed 0%, #06b6d4 100%);

  /* --- Text --- */
  --white:        #ffffff;
  --text:         #0f172a;         /* slate-900 — body copy */
  --text-strong:  #020617;         /* slate-950 — headings */
  --text-muted:   #475569;         /* slate-600 */
  --text-dim:     #94a3b8;         /* slate-400 */

  /* --- Status --- */
  --green:        #10b981;
  --green-soft:   #d1fae5;
  --red:          #ef4444;
  --red-soft:     #fee2e2;
  --amber:        #f59e0b;
  --amber-soft:   #fef3c7;

  /* --- Radii / shadows / motion (slightly softer than dark theme) --- */
  --radius-sm:    8px;
  --radius:       14px;
  --radius-lg:    20px;
  --radius-pill:  9999px;
  --shadow:       var(--card-shadow);
  --shadow-glow:  0 0 0 4px rgba(124,58,237,0.10);

  --transition:   200ms cubic-bezier(0.4, 0.0, 0.2, 1);
}

/* ============================================================
 * GLOBAL — body / scrollbar / selection
 * ============================================================ */
html { background: var(--bg); }
body {
  background: var(--bg);
  color: var(--text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
::selection { background: var(--purple-soft); color: var(--text-strong); }
::-webkit-scrollbar { width: 12px; height: 12px; }
::-webkit-scrollbar-track { background: var(--bg-2); }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 6px; border: 3px solid var(--bg-2); }
::-webkit-scrollbar-thumb:hover { background: var(--border-strong); }

/* Hide ugly default link colour */
a { color: inherit; }

/* ============================================================
 * HEADER — top bar with subtle blur backdrop
 * ============================================================ */
.cd-header {
  background: rgba(255,255,255,0.85) !important;
  -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--border-light);
  box-shadow: 0 1px 0 rgba(15,23,42,0.02);
}
.cd-header__logo,
.cd-logo-text { color: var(--text-strong) !important; }
.cd-logo-text span { color: var(--purple); }
.cd-logo-mark {
  background: var(--gradient-hero);
  color: var(--white);
  width: 32px; height: 32px;
  border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(124,58,237,0.25);
}
.cd-header__nav a {
  color: var(--text-muted) !important;
  font-weight: 500;
  transition: color var(--transition);
}
.cd-header__nav a:hover { color: var(--purple) !important; }
.cd-nav-new {
  background: var(--purple-soft);
  color: var(--purple) !important;
  padding: 6px 12px;
  border-radius: 9999px;
  font-size: 13px;
}
.cd-nav-new__price s { color: var(--text-dim); }

/* ============================================================
 * BUTTONS — clean primary, soft secondary
 * ============================================================ */
.cd-btn {
  font-weight: 600;
  letter-spacing: -0.01em;
  transition: transform var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition);
}
.cd-btn--primary {
  background: var(--purple) !important;
  color: var(--white) !important;
  border-color: var(--purple) !important;
  box-shadow: 0 1px 2px rgba(124,58,237,0.15), 0 4px 12px -2px rgba(124,58,237,0.25);
}
.cd-btn--primary:hover {
  background: var(--purple-hover) !important;
  border-color: var(--purple-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(124,58,237,0.2), 0 12px 24px -4px rgba(124,58,237,0.35);
}
.cd-btn--ghost {
  background: var(--white) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.cd-btn--ghost:hover {
  background: var(--bg-2) !important;
  color: var(--purple) !important;
  border-color: var(--border-strong) !important;
}
.cd-btn--outline {
  background: transparent !important;
  color: var(--purple) !important;
  border-color: var(--purple) !important;
}
.cd-btn--outline:hover {
  background: var(--purple) !important;
  color: var(--white) !important;
}

/* ============================================================
 * GRADIENT TEXT — refresh
 * ============================================================ */
.cd-gradient-text {
  background: var(--gradient-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

/* ============================================================
 * HERO — clean, with floating gradient orbs
 * ============================================================ */
.cd-hero {
  background: var(--bg) !important;
  position: relative;
  overflow: hidden;
}
.cd-hero::before {
  content: "";
  position: absolute;
  top: -200px; right: -200px;
  width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(124,58,237,0.18) 0%, transparent 70%);
  filter: blur(40px);
  z-index: 0;
  pointer-events: none;
}
.cd-hero::after {
  content: "";
  position: absolute;
  bottom: -150px; left: -150px;
  width: 500px; height: 500px;
  background: radial-gradient(circle, rgba(6,182,212,0.14) 0%, transparent 70%);
  filter: blur(40px);
  z-index: 0;
  pointer-events: none;
}
.cd-hero .cd-container { position: relative; z-index: 1; }
.cd-hero__noise { display: none; }
.cd-hero__badge {
  background: var(--white);
  border: 1px solid var(--border);
  color: var(--text-muted);
  padding: 8px 16px;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  display: inline-flex; align-items: center; gap: 8px;
  box-shadow: var(--card-shadow);
}
.cd-hero__badge-icon { color: var(--purple); }
.cd-hero__heading {
  color: var(--text-strong) !important;
  font-size: clamp(2.5rem, 5vw + 1rem, 4.5rem) !important;
  line-height: 1.05 !important;
  letter-spacing: -0.03em !important;
  font-weight: 800 !important;
}
.cd-hero__sub {
  color: var(--text-muted) !important;
  font-size: clamp(1rem, 0.5vw + 0.95rem, 1.2rem) !important;
  max-width: 720px;
  line-height: 1.6 !important;
}

/* ============================================================
 * AI Search bar (hero) — soft floating panel
 * ============================================================ */
.cd-hero-search {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow: var(--card-shadow-lg);
  padding: 8px;
}
.cd-hero-search__input {
  background: transparent !important;
  color: var(--text) !important;
  border: none !important;
  font-size: 16px;
}
.cd-hero-search__input::placeholder { color: var(--text-dim); }
.cd-hero-search__btn {
  background: var(--purple) !important;
  color: var(--white) !important;
  border: none !important;
  border-radius: 12px !important;
  width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 12px rgba(124,58,237,0.3);
  transition: transform var(--transition);
}
.cd-hero-search__btn:hover { transform: translateY(-1px); background: var(--purple-hover) !important; }
.cd-hero-search__hints {
  color: var(--text-dim);
  display: flex; flex-wrap: wrap; gap: 6px;
  padding: 8px 4px 0;
}
.cd-hero-search__hint {
  background: var(--bg-2) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 9999px !important;
  padding: 6px 12px !important;
  font-size: 13px;
  cursor: pointer;
  transition: all var(--transition);
}
.cd-hero-search__hint:hover {
  background: var(--purple-soft) !important;
  color: var(--purple) !important;
  border-color: var(--purple-soft) !important;
}

/* ============================================================
 * SECTIONS — alternating bg for vertical rhythm
 * ============================================================ */
section { background: var(--bg); }
section:nth-of-type(even),
.cd-services,
.cd-trust,
.cd-faq-section { background: var(--bg-2) !important; }

.cd-section-header h2,
section h2 {
  color: var(--text-strong) !important;
  font-size: clamp(1.8rem, 2vw + 1rem, 2.6rem);
  letter-spacing: -0.025em;
  font-weight: 800;
}
.cd-section-header p,
section p { color: var(--text-muted); }
.cd-eyebrow {
  color: var(--purple) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
  font-weight: 700;
  background: var(--purple-soft);
  padding: 4px 10px;
  border-radius: 9999px;
  display: inline-block;
}

/* ============================================================
 * CARDS — clean white with subtle lift
 * ============================================================ */
.cd-service-card,
.cd-trust__item,
.cd-pricing-card,
.cd-faq-section__item,
.cd-svc-price-card,
.cd-cr-trust__item,
.cd-vsdiy__col,
.cd-how__step,
.cd-feature {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow);
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.cd-service-card:hover,
.cd-pricing-card:hover,
.cd-feature:hover {
  transform: translateY(-2px);
  box-shadow: var(--card-shadow-lg);
  border-color: var(--purple-light);
}
.cd-service-card h3,
.cd-pricing-card h3,
.cd-trust__item h3 { color: var(--text-strong) !important; }
.cd-service-card p,
.cd-pricing-card p,
.cd-trust__item p { color: var(--text-muted) !important; }
.cd-service-card__badge {
  background: var(--gradient-text);
  color: var(--white);
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 9999px;
  letter-spacing: 0.05em;
}
.cd-service-card--featured {
  border-color: var(--purple) !important;
  box-shadow: 0 8px 24px -8px rgba(124,58,237,0.2), 0 0 0 1px var(--purple-light);
}

/* Card icons — soft tinted background */
.cd-service-card__icon,
.cd-trust__icon,
.cd-feature__icon,
.cd-how__step-num {
  background: var(--purple-soft) !important;
  color: var(--purple) !important;
  border-radius: 12px;
  width: 56px; height: 56px;
  display: inline-flex; align-items: center; justify-content: center;
}

/* ============================================================
 * FAQ — clean expandable rows
 * ============================================================ */
.cd-faq-section__item {
  padding: 20px 24px;
}
.cd-faq-section__item summary {
  color: var(--text-strong) !important;
  font-weight: 600;
  cursor: pointer;
}
.cd-faq-section__item p {
  color: var(--text-muted) !important;
  margin-top: 12px;
}

/* ============================================================
 * PRICING / CTA bands
 * ============================================================ */
.cd-cta-band {
  background: linear-gradient(135deg, #f8fafc 0%, #ede9fe 100%) !important;
  border-top: 1px solid var(--border-light);
  border-bottom: 1px solid var(--border-light);
}
.cd-cta-band h2 { color: var(--text-strong) !important; }
.cd-cta-band p { color: var(--text-muted) !important; }
.cd-cta-band__sub { color: var(--text-dim) !important; }

/* ============================================================
 * DISCLAIMER BAR — soft amber notice
 * ============================================================ */
.cd-disclaimer-bar {
  background: var(--amber-soft) !important;
  border-top: 1px solid #fde68a;
  border-bottom: 1px solid #fde68a;
}
.cd-disclaimer-bar p {
  color: #78350f !important;
  font-size: 13px;
}

/* ============================================================
 * FOOTER — clean light
 * ============================================================ */
.cd-footer {
  background: var(--bg-2) !important;
  border-top: 1px solid var(--border) !important;
  color: var(--text-muted) !important;
}
.cd-footer h4,
.cd-footer strong { color: var(--text-strong) !important; }
.cd-footer a { color: var(--text-muted) !important; transition: color var(--transition); }
.cd-footer a:hover { color: var(--purple) !important; }
.cd-footer__disclaimer {
  color: var(--text-dim) !important;
  font-size: 12px;
}

/* Phone callout in footer — light theme override */
.cd-footer__phone {
  color: var(--text-strong) !important;
  border-color: rgba(34, 197, 94, 0.30) !important;
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.06), rgba(124, 58, 237, 0.04)) !important;
}
.cd-footer__phone:hover { color: var(--text-strong) !important; }
.cd-footer__phone strong { color: var(--text-strong) !important; }
.cd-footer__phone-label,
.cd-footer__phone-hours { color: var(--text-dim) !important; }
.cd-footer__phone-icon { background: rgba(34, 197, 94, 0.14) !important; color: #16a34a !important; }

/* Hero "We Recommend" result card — fix white-on-light invisible heading */
.cd-hero-result {
  background: linear-gradient(135deg, rgba(124,58,237,0.08), rgba(168,85,247,0.04)) !important;
  border-color: rgba(124,58,237,0.30) !important;
}
.cd-hero-result__label { color: #7c3aed !important; }
.cd-hero-result__service { color: #0f172a !important; }
.cd-hero-result__reason { color: #475569 !important; }
.cd-hero-result__price { color: #7c3aed !important; }

/* ============================================================
 * PROMO BANNER — bright gradient stripe at top
 * ============================================================ */
.cd-promo-banner {
  background: var(--gradient-hero) !important;
  color: var(--white) !important;
  border: none !important;
  box-shadow: 0 1px 0 rgba(15,23,42,0.06);
}
.cd-promo-banner__cta {
  background: var(--white) !important;
  color: var(--purple) !important;
  font-weight: 700;
  border-radius: 9999px;
  padding: 6px 14px;
}
.cd-promo-banner__cta:hover { background: var(--bg-2) !important; }
.cd-promo-banner__close { color: rgba(255,255,255,0.8) !important; }
.cd-promo-banner__close:hover { color: var(--white) !important; }

/* ============================================================
 * MOBILE DRAWER — light, professional
 * ============================================================ */
.cd-drawer {
  background: var(--white) !important;
  color: var(--text) !important;
  border-left: 1px solid var(--border);
  box-shadow: -8px 0 32px rgba(15,23,42,0.12);
}
.cd-drawer__head { border-bottom: 1px solid var(--border-light); }
.cd-drawer__nav a {
  color: var(--text) !important;
  border-bottom: 1px solid var(--border-light);
  transition: color var(--transition), background var(--transition);
}
.cd-drawer__nav a:hover { color: var(--purple) !important; background: var(--bg-2); }
.cd-drawer__user {
  background: var(--bg-2);
  border-radius: var(--radius);
}
.cd-drawer__user-avatar {
  background: var(--gradient-hero) !important;
  color: var(--white) !important;
}
.cd-nav-overlay { background: rgba(15,23,42,0.4) !important; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }

/* ============================================================
 * USER MENU DROPDOWN
 * ============================================================ */
.cd-user-menu__avatar {
  background: var(--gradient-hero) !important;
  color: var(--white) !important;
  border: 2px solid var(--white) !important;
  box-shadow: 0 2px 8px rgba(124,58,237,0.25);
}
.cd-user-menu__dropdown {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--card-shadow-xl) !important;
  border-radius: var(--radius);
}
.cd-user-menu__info strong { color: var(--text-strong) !important; }
.cd-user-menu__info span,
.cd-user-menu__dropdown a { color: var(--text-muted) !important; }
.cd-user-menu__dropdown a:hover { background: var(--bg-2); color: var(--purple) !important; }
.cd-user-menu__divider { background: var(--border-light) !important; }
.cd-user-menu__logout { color: var(--red) !important; }

/* ============================================================
 * INTAKE WIZARD — clean form steps
 * ============================================================ */
.cd-wizard,
.cd-wizard__panel,
.cd-wizard__step,
.cd-wizard__pane {
  background: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--card-shadow);
}
.cd-wizard h1, .cd-wizard h2, .cd-wizard h3 { color: var(--text-strong) !important; }
.cd-wizard__sub,
.cd-wizard p,
.cd-wizard label,
.cd-wizard small { color: var(--text-muted) !important; }
.cd-wizard input[type="text"],
.cd-wizard input[type="email"],
.cd-wizard input[type="tel"],
.cd-wizard input[type="number"],
.cd-wizard input[type="date"],
.cd-wizard select,
.cd-wizard textarea {
  background: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: 10px !important;
  padding: 13px 16px !important;
  font-size: 16px !important;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.cd-wizard input:focus,
.cd-wizard select:focus,
.cd-wizard textarea:focus {
  border-color: var(--purple) !important;
  outline: none !important;
  box-shadow: var(--shadow-glow) !important;
}
.cd-wizard input::placeholder,
.cd-wizard textarea::placeholder { color: var(--text-dim) !important; }

/* Step progress bar */
.cd-wizard__progress {
  background: var(--bg-2) !important;
  border-radius: 9999px;
  height: 6px;
  overflow: hidden;
}
.cd-wizard__progress-bar {
  background: var(--gradient-hero) !important;
  border-radius: 9999px;
}

/* ============================================================
 * DASHBOARD — clean cards + table
 * ============================================================ */
.cd-dashboard,
.cd-dashboard__card,
.cd-dashboard__panel,
.cd-dash-card {
  background: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow);
}
.cd-dashboard h1, .cd-dashboard h2, .cd-dashboard h3 { color: var(--text-strong) !important; }
.cd-dashboard__table th {
  color: var(--text-muted) !important;
  background: var(--bg-2) !important;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.cd-dashboard__table td { color: var(--text) !important; border-color: var(--border-light) !important; }

/* ============================================================
 * BADGES, PILLS, INLINE BITS
 * ============================================================ */
.cd-vsdiy__badge {
  background: var(--bg-2);
  color: var(--text);
  border: 1px solid var(--border);
}
.cd-vsdiy__badge--good { background: var(--green-soft); color: #065f46; border-color: #6ee7b7; }
.cd-vsdiy__badge--bad  { background: var(--red-soft);   color: #991b1b; border-color: #fca5a5; }

/* ============================================================
 * EXIT-INTENT / GENERIC MODAL
 * ============================================================ */
/* The fixed-position outer wrapper itself is just a positioning shell —
   leave its background transparent so the backdrop element renders. */
.cd-exit-modal,
.cd-modal {
  background: transparent !important;
}

/* Backdrop: dark veil with blur. Keep both class names supported (the
   markup uses cd-exit-modal__backdrop, the legacy ruleset used __overlay). */
.cd-exit-modal__backdrop,
.cd-exit-modal__overlay,
.cd-modal__overlay {
  background: rgba(15, 23, 42, 0.55) !important;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}

/* The card itself — light, branded, readable */
.cd-exit-modal__card,
.cd-modal__card {
  background: #ffffff !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  color: #0f172a !important;
  box-shadow: 0 32px 64px -12px rgba(15, 23, 42, 0.25) !important;
}
.cd-exit-modal__card h2,
.cd-modal__card h2 {
  color: #0f172a !important;
  font-weight: 800;
}
.cd-exit-modal__card p,
.cd-modal__card p {
  color: #475569 !important;
}
.cd-exit-modal__card p strong { color: #0f172a !important; }

.cd-exit-modal__close {
  color: #94a3b8 !important;
}
.cd-exit-modal__close:hover { color: #0f172a !important; }

.cd-exit-modal__form input[type=email] {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  color: #0f172a !important;
}
.cd-exit-modal__form input[type=email]::placeholder { color: #94a3b8 !important; }
.cd-exit-modal__form input[type=email]:focus {
  border-color: #7c3aed !important;
  box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.15) !important;
  outline: none !important;
}
.cd-exit-modal__form button {
  background: linear-gradient(135deg, #7c3aed, #a855f7) !important;
  color: #fff !important;
  border: none !important;
  font-weight: 700 !important;
}

.cd-exit-modal__footnote { color: #64748b !important; }
.cd-exit-modal__footnote a { color: #7c3aed !important; font-weight: 600; }

.cd-exit-modal__success {
  background: rgba(34, 197, 94, 0.10) !important;
  border: 1px solid rgba(34, 197, 94, 0.30) !important;
  color: #15803d !important;
}

/* ============================================================
 * BLOG / SINGLE POST
 * ============================================================ */
.cd-post,
.cd-archive {
  background: var(--bg) !important;
  color: var(--text) !important;
}
.cd-post h1, .cd-post h2, .cd-post h3 { color: var(--text-strong) !important; }
.cd-post p, .cd-post li { color: var(--text); }
.cd-post a { color: var(--purple); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.cd-post blockquote {
  background: var(--bg-2);
  border-left: 4px solid var(--purple);
  padding: 16px 20px;
  border-radius: 8px;
  color: var(--text-muted);
  font-style: normal;
}
.cd-post code,
.cd-post pre {
  background: var(--bg-3) !important;
  color: var(--text-strong) !important;
  border: 1px solid var(--border-light);
  border-radius: 6px;
}

/* ============================================================
 * GLOBAL: kill any leftover dark backgrounds
 * (catch-all for inline style="background:#0a0a0a" etc.)
 * ============================================================ */
[style*="background:#0a0a0a"],
[style*="background: #0a0a0a"],
[style*="background:#1a1a1a"],
[style*="background: #1a1a1a"],
[style*="background-color:#0a0a0a"],
[style*="background-color: #0a0a0a"] {
  background: var(--white) !important;
  color: var(--text) !important;
}

/* ============================================================
 * RESPONSIVE polish
 * ============================================================ */
@media (max-width: 768px) {
  .cd-hero::before, .cd-hero::after { display: none; }
  .cd-hero__heading { font-size: clamp(2rem, 8vw, 3rem) !important; }
  section { padding-top: 56px; padding-bottom: 56px; }
}

/* ============================================================
 * BUG FIXES — second pass after live inspection
 * ============================================================ */

/* --- Header: scrolled state was still dark from main.css --- */
.cd-header.is-scrolled,
.cd-header--scrolled,
.cd-header.is-scrolled.cd-header,
.cd-header--scrolled.cd-header {
  background: rgba(255,255,255,0.94) !important;
  -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
  -webkit-backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--border) !important;
  box-shadow: 0 1px 3px rgba(15,23,42,0.06), 0 1px 2px rgba(15,23,42,0.04) !important;
  color: var(--text-strong) !important;
}
.cd-header.is-scrolled .cd-header__nav a,
.cd-header--scrolled .cd-header__nav a {
  color: var(--text-muted) !important;
}
.cd-header.is-scrolled .cd-header__nav a:hover,
.cd-header--scrolled .cd-header__nav a:hover { color: var(--purple) !important; }
.cd-header.is-scrolled .cd-logo-text,
.cd-header--scrolled .cd-logo-text { color: var(--text-strong) !important; }
.cd-header.is-scrolled .cd-logo-text span,
.cd-header--scrolled .cd-logo-text span { color: var(--purple) !important; }
.cd-header.is-scrolled .cd-btn--ghost,
.cd-header--scrolled .cd-btn--ghost {
  background: var(--white) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}
.cd-header.is-scrolled .cd-btn--ghost:hover,
.cd-header--scrolled .cd-btn--ghost:hover {
  color: var(--purple) !important;
  border-color: var(--border-strong) !important;
}
.cd-header.is-scrolled .cd-btn--outline,
.cd-header--scrolled .cd-btn--outline {
  background: transparent !important;
  color: var(--purple) !important;
  border-color: var(--purple) !important;
}
.cd-header.is-scrolled .cd-btn--primary,
.cd-header--scrolled .cd-btn--primary {
  background: var(--purple) !important;
  color: var(--white) !important;
  border-color: var(--purple) !important;
}
.cd-header.is-scrolled .cd-hamburger span,
.cd-header--scrolled .cd-hamburger span { background: var(--text-strong) !important; }
/* Nav-new pill stays soft violet */
.cd-header.is-scrolled .cd-nav-new,
.cd-header--scrolled .cd-nav-new {
  background: var(--purple-soft) !important;
  color: var(--purple) !important;
}

/* --- Contract reviewer hero badge: vibrant gradient, not faint --- */
.cd-cr-hero__badge,
.cd-cr-trust__pill,
.cd-cr-section__eyebrow.cd-cr-hero__badge {
  background: var(--gradient-hero) !important;
  background-image: linear-gradient(135deg, #7c3aed 0%, #6366f1 50%, #06b6d4 100%) !important;
  color: var(--white) !important;
  border: none !important;
  padding: 8px 18px !important;
  border-radius: 9999px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.02em !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  box-shadow: 0 6px 16px -4px rgba(124,58,237,0.35) !important;
}
.cd-cr-hero__badge * { color: var(--white) !important; }

/* --- VS DIY comparison: the bare <strong> tags inheriting color:white --- */
.cd-vsdiy,
.cd-vsdiy * { color: var(--text) !important; }
.cd-vsdiy h2 { color: var(--text-strong) !important; }
.cd-vsdiy h3, .cd-vsdiy h4 { color: var(--text-strong) !important; }
.cd-vsdiy strong { color: var(--text-strong) !important; font-weight: 600; }
.cd-vsdiy li { color: var(--text) !important; }
/* Differentiate the two columns by tinted bg + accent stripe */
.cd-vsdiy__col {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--card-shadow);
}
.cd-vsdiy__col--bad,
.cd-vsdiy__col[class*="--bad"] {
  background: var(--white) !important;
}
.cd-vsdiy__col--bad strong { color: #991b1b !important; }
.cd-vsdiy__col--good,
.cd-vsdiy__col[class*="--good"] {
  background: linear-gradient(180deg, #fafaff 0%, #f5f3ff 100%) !important;
  border-color: var(--purple-light) !important;
  box-shadow: 0 8px 24px -8px rgba(124,58,237,0.18), 0 0 0 1px var(--purple-light);
}
.cd-vsdiy__col--good strong { color: #5b21b6 !important; }
.cd-vsdiy__price,
.cd-vsdiy__col [class*="price"] { color: var(--purple) !important; }

/* --- Empty service-card icons: hide rather than show naked purple boxes --- */
.cd-service-card__icon:empty {
  display: none !important;
}
/* When icon is hidden, give the card a little more breathing room at top */
.cd-service-card__icon:empty + h3,
.cd-service-card__icon:empty + .cd-service-card__title { margin-top: 8px; }

/* --- Generic "white text on light bg" rescue for inline strong/p elements --- */
section strong[style*="color:#fff"],
section strong[style*="color: #fff"],
section strong[style*="color:#ffffff"],
section [style*="color:#fff"]:not(.cd-btn):not(.cd-promo-banner *):not(.cd-cr-hero__badge):not([class*="primary"]) {
  color: var(--text-strong) !important;
}

/* --- Reveal animation: ensure visibility doesn't leave items hidden --- */
.cd-reveal:not(.is-visible) { opacity: 0.99; }

/* ============================================================
 * PASS 3 — inner pages, pricing cards, custom login, nav-new pill
 * ============================================================ */

/* --- Inner page hero (about / pricing / how-it-works / etc.) ---
 *   Legacy CSS sets .cd-inner-hero h1 { color: white } — invisible on
 *   the soft-violet inner-hero background. Force dark slate. */
.cd-inner-hero {
  background: linear-gradient(180deg, #f8fafc 0%, #ede9fe 100%) !important;
  border-bottom: 1px solid var(--border-light);
}
.cd-inner-hero h1,
.cd-inner-hero h2 {
  color: var(--text-strong) !important;
  -webkit-text-fill-color: var(--text-strong) !important;
  background: none !important;
  font-size: clamp(2rem, 3vw + 1rem, 3.4rem);
  letter-spacing: -0.025em;
  font-weight: 800;
}
.cd-inner-hero p {
  color: var(--text-muted) !important;
  font-size: clamp(1rem, 0.5vw + 0.95rem, 1.15rem);
  line-height: 1.7;
}
.cd-inner-hero .cd-eyebrow { background: var(--white) !important; box-shadow: 0 1px 3px rgba(15,23,42,0.06); }

/* --- About page: intro tags, quote/note blocks --- */
.cd-about-intro__tags span {
  background: var(--purple-soft) !important;
  color: var(--purple) !important;
  font-weight: 600 !important;
  border: 1px solid #ddd6fe;
  padding: 6px 14px;
  border-radius: 9999px;
}
.cd-about-intro__quote,
.cd-about-intro [class*="quote"],
.cd-about-intro__lead-quote {
  background: var(--purple-soft) !important;
  border-left: 4px solid var(--purple) !important;
  color: var(--text-strong) !important;
  padding: 16px 20px !important;
  border-radius: 8px;
}
.cd-about-intro__quote *,
.cd-about-intro [class*="quote"] * {
  color: var(--text-strong) !important;
}

/* --- Pricing cards: name + price + icon were white/invisible --- */
.cd-pricing-card {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow);
  padding: 28px 24px;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.cd-pricing-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--card-shadow-lg);
  border-color: var(--purple-light);
}
.cd-pricing-card__name {
  color: var(--text-strong) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  margin-bottom: 6px;
}
.cd-pricing-card__price {
  color: var(--purple) !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
  margin: 4px 0 12px;
}
.cd-pricing-card__desc {
  color: var(--text-muted) !important;
  margin-bottom: 14px;
}
.cd-pricing-card__features li {
  color: var(--text) !important;
  padding: 4px 0;
}
.cd-pricing-card__icon { display: none !important; } /* always hide — empty post-emoji-purge */

/* --- Nav "Contract Review" pill: legacy gives it pale lavender bg + white text --- */
.cd-nav-new,
.cd-header__nav a.cd-nav-new {
  background: var(--purple-soft) !important;
  background-image: none !important;
  color: var(--purple) !important;
  border: 1px solid #ddd6fe !important;
  font-weight: 600 !important;
}
.cd-nav-new:hover { background: #ddd6fe !important; }
.cd-nav-new__price {
  color: var(--purple) !important;
  opacity: 0.85;
  font-weight: 600;
  margin-left: 6px;
}
.cd-nav-new__price s { color: var(--text-dim) !important; opacity: 0.7; }

/* --- Custom login page (.cd-auth__card) — separate from wp-login.php --- */
.cd-auth,
.cd-auth__page,
.cd-auth-page,
[class*="auth-page"] {
  background: var(--bg-2) !important;
  min-height: 70vh;
}
.cd-auth__card {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--card-shadow-lg) !important;
  padding: 40px !important;
  color: var(--text) !important;
}
.cd-auth__logo {
  color: var(--text-strong) !important;
  -webkit-text-fill-color: initial !important;
  background: linear-gradient(135deg, #7c3aed 0%, #06b6d4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-family: 'Sora', sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  letter-spacing: -0.025em;
  text-align: center;
  margin-bottom: 4px;
}
.cd-auth__title {
  color: var(--text-strong) !important;
  -webkit-text-fill-color: var(--text-strong) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  text-align: center;
  margin-bottom: 6px;
}
.cd-auth__sub,
.cd-auth__subtitle,
.cd-auth__lede {
  color: var(--text-muted) !important;
  text-align: center;
  margin-bottom: 24px;
}
.cd-auth-form label,
.cd-auth__label {
  color: var(--text) !important;
  font-weight: 600;
  font-size: 13px;
}
.cd-auth-form input,
.cd-auth__input {
  background: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: 10px !important;
  padding: 12px 14px !important;
  font-size: 15px !important;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.cd-auth-form input:focus,
.cd-auth__input:focus {
  border-color: var(--purple) !important;
  outline: none !important;
  box-shadow: var(--shadow-glow) !important;
}
.cd-auth-form input::placeholder,
.cd-auth__input::placeholder { color: var(--text-dim) !important; }
.cd-auth__forgot,
.cd-auth__alt-link,
.cd-auth a { color: var(--purple) !important; }
.cd-auth a:hover { color: var(--purple-hover) !important; text-decoration: underline; }
.cd-auth__divider {
  color: var(--text-dim);
  border-top: 1px solid var(--border-light);
}

/* --- Generic safety net: any element with literal `color:white` inline that
 *   is NOT inside a known coloured surface (button, gradient banner, drawer,
 *   active card) gets dark text. --- */
:not(.cd-btn):not(.cd-promo-banner):not(.cd-promo-banner *):not(.cd-cr-hero__badge):not(.cd-cr-hero__badge *):not(.cd-drawer):not(.cd-drawer *):not(.cd-user-menu__avatar):not(.cd-logo-mark):not(.cd-logo-mark *):not(.cd-service-card__badge):not([class*="vsdiy__badge--good"]):not([class*="vsdiy__badge--bad"]):not([class*="cta-band"] .cd-btn) > [style*="color:#fff"],
:not(.cd-btn) > [style*="color: #fff"],
:not(.cd-btn) > [style*="color:#ffffff"],
:not(.cd-btn) > [style*="color: #ffffff"] {
  color: var(--text-strong) !important;
}

/* --- Drawer is dark/light hybrid; ensure drawer items stay dark on white --- */
.cd-drawer .cd-drawer__logo,
.cd-drawer .cd-drawer__foot-link {
  color: var(--text) !important;
}
.cd-drawer .cd-drawer__cta { color: var(--white) !important; } /* primary button keeps white */

/* ============================================================
 * PASS 4 — featured pricing card was inheriting a dark gradient bg
 * Force it to a clean white card with a subtle violet accent border
 * so the "MOST POPULAR" badge does the lifting, not a dark surface.
 * ============================================================ */
.cd-pricing-card--featured,
.cd-pricing-card.cd-pricing-card--featured {
  background: linear-gradient(180deg, #ffffff 0%, #fafaff 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fafaff 100%) !important;
  border: 2px solid var(--purple) !important;
  box-shadow: 0 12px 32px -8px rgba(124,58,237,0.2), 0 0 0 4px rgba(124,58,237,0.06) !important;
  position: relative;
  color: var(--text) !important;
}
.cd-pricing-card--featured::before {
  /* Override any pseudo-element gradient overlay from main.css */
  background: none !important;
  display: none !important;
}
.cd-pricing-card--featured::after {
  background: none !important;
  display: none !important;
}
.cd-pricing-card--featured .cd-pricing-card__name { color: var(--text-strong) !important; }
.cd-pricing-card--featured .cd-pricing-card__price { color: var(--purple) !important; }
.cd-pricing-card--featured .cd-pricing-card__desc { color: var(--text-muted) !important; opacity: 1 !important; }
.cd-pricing-card--featured .cd-pricing-card__features li { color: var(--text) !important; opacity: 1 !important; }
.cd-pricing-card--featured .cd-pricing-card__badge,
.cd-pricing-card--featured [class*="badge"],
.cd-pricing-card--featured [class*="popular"] {
  background: var(--gradient-hero) !important;
  background-image: linear-gradient(135deg, #7c3aed 0%, #6366f1 50%, #06b6d4 100%) !important;
  color: var(--white) !important;
  font-weight: 700;
  letter-spacing: 0.05em;
  font-size: 11px;
  padding: 5px 12px;
  border-radius: 9999px;
  box-shadow: 0 4px 12px -2px rgba(124,58,237,0.35);
}
.cd-pricing-card--featured .cd-btn--outline {
  background: var(--purple) !important;
  color: var(--white) !important;
  border-color: var(--purple) !important;
}
.cd-pricing-card--featured .cd-btn--outline:hover {
  background: var(--purple-hover) !important;
  border-color: var(--purple-hover) !important;
}
/* Same treatment for any service-card flagged "featured" via existing class */
.cd-service-card--featured {
  background: linear-gradient(180deg, #ffffff 0%, #fafaff 100%) !important;
  background-image: linear-gradient(180deg, #ffffff 0%, #fafaff 100%) !important;
}

/* ============================================================
 * PASS 5 — comprehensive nuke from full-site audit
 * ============================================================ */

/* --- Dashboard case cards + case-detail panels — were dark from old theme --- */
.cd-case-card,
a.cd-case-card,
.cd-case-row,
.cd-case-summary,
.cd-case-detail,
.cd-case-meta,
.cd-case-panel,
.cd-case-info,
[class^="cd-case-"],
.cd-dash__list > a,
.cd-dashboard__list a[href*="case="],
.cd-dashboard a[class*="card"] {
  background: var(--white) !important;
  background-color: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow) !important;
  margin-bottom: 12px;
  display: block;
  text-decoration: none !important;
  padding: 16px 20px;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.cd-case-card:hover,
a.cd-case-card:hover {
  border-color: var(--purple-light) !important;
  box-shadow: var(--card-shadow-lg) !important;
  transform: translateY(-1px);
}
.cd-case-card *, .cd-case-row * { color: inherit; }
.cd-case-card h1, .cd-case-card h2, .cd-case-card h3, .cd-case-card h4,
.cd-case-card strong, .cd-case-row strong {
  color: var(--text-strong) !important;
}
.cd-case-card [class*="status"],
.cd-case-card [class*="badge"],
.cd-case-row [class*="status"] {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 4px 10px;
  border-radius: 9999px;
  display: inline-block;
}
/* Status pill colours */
[class*="status"][class*="awaiting"], [class*="status-awaiting-payment"],
[class*="status"][class*="pending"], [class*="status-pending"] {
  background: #fef3c7 !important; color: #78350f !important;
}
[class*="status"][class*="completed"], [class*="status-completed"],
[class*="status"][class*="ready"], [class*="status-ready"] {
  background: #d1fae5 !important; color: #065f46 !important;
}
[class*="status"][class*="processing"], [class*="status-processing"] {
  background: #dbeafe !important; color: #1e40af !important;
}
[class*="status"][class*="failed"], [class*="status-failed"] {
  background: #fee2e2 !important; color: #991b1b !important;
}

/* --- Service card / pricing card "New / Premium / Best Value" badges --- */
.cd-service-card__badge,
.cd-pricing-card__badge,
.cd-svc-card__badge,
[class*="card__badge"]:not(.cd-vsdiy__badge) {
  background: var(--gradient-hero) !important;
  background-image: linear-gradient(135deg, #7c3aed 0%, #6366f1 50%, #06b6d4 100%) !important;
  color: var(--white) !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em;
  font-size: 11px !important;
  padding: 4px 12px !important;
  border-radius: 9999px !important;
  display: inline-block;
  box-shadow: 0 2px 8px -2px rgba(124,58,237,0.35);
}

/* --- Service single price card --- */
.cd-svc-price-card,
.cd-svc-price-card__inner {
  background: var(--white) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow);
}
.cd-svc-price-card__name {
  color: var(--text-strong) !important;
  font-weight: 700 !important;
  font-size: 18px !important;
}
.cd-svc-price-card__price {
  color: var(--purple) !important;
  font-weight: 800 !important;
  font-size: 32px !important;
  letter-spacing: -0.02em;
}
.cd-svc-price-card__sub,
.cd-svc-price-card__desc {
  color: var(--text-muted) !important;
}

/* --- Section headings — anywhere a bare h3 lands on white bg --- */
section h3,
.cd-trust__item h3,
.cd-feature h3,
.cd-how__step h3,
.cd-faq h3,
.cd-faq-section h3,
.cd-svc-faq h3,
.cd-svc-when h3,
.cd-svc-what h3 {
  color: var(--text-strong) !important;
}

/* --- Naked <strong> tags rescue —
 * Anywhere a bare <strong> isn't inside a button / banner / known-coloured
 * surface, force it to dark. The legacy main.css inherits color: white
 * through cd-vsdiy and other parents. This is a sweep-all rescue. --- */
section strong:not(.cd-btn):not(.cd-btn *):not(.cd-promo-banner):not(.cd-promo-banner *):not(.cd-cr-hero__badge):not(.cd-cr-hero__badge *):not(.cd-logo-mark *):not(.cd-user-menu__avatar):not(.cd-drawer__user-avatar):not(.cd-drawer__cta):not(.cd-drawer__cta *):not(.sig-cursive):not(.doc-table th):not(.doc-table th *):not(.cd-service-card__badge):not(.cd-pricing-card__badge):not([class*="badge--good"]):not([class*="badge--bad"]):not([style*="color"]) {
  color: var(--text-strong) !important;
}

/* --- Welcome / greeting blocks — "Welcome, Op" etc. --- */
.cd-welcome,
.cd-greeting,
.cd-dashboard__greeting,
[class*="welcome"] strong,
[class*="greeting"] strong { color: var(--text-strong) !important; }

/* --- "My Documents" / dashboard h1 — was white-on-white --- */
.cd-dashboard h1,
.cd-dashboard__title,
[class*="dashboard"] h1,
[class*="dashboard"] h2 {
  color: var(--text-strong) !important;
  font-weight: 800;
  letter-spacing: -0.02em;
}

/* --- Contract reviewer hero card now lives in enhancements.css as a clean
       PDF-report mockup (white surface, severity-coloured stat tiles).
       No safe-list rules needed here. --- */

/* --- Contract reviewer hero TEXT — override dark-theme grays so body copy is readable on light bg --- */
.cd-cr-hero {
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  border-top-color: #e2e8f0 !important;
  border-bottom-color: #e2e8f0 !important;
}
.cd-cr-hero__headline { color: #0f172a !important; }
.cd-cr-hero__sub { color: #475569 !important; }
.cd-cr-hero__sub strong { color: #0f172a !important; }
.cd-cr-hero__meta { color: #64748b !important; }
.cd-cr-hero__meta span { color: #64748b !important; }

/* --- Drawer avatar is always white-on-gradient (correct) --- */
.cd-drawer__user-avatar {
  background: var(--gradient-hero) !important;
  color: var(--white) !important;
}

/* --- Trust badges (homepage "Australian Company" / "Secure Upload" etc.) --- */
.cd-trust-bar strong,
.cd-trust-row strong,
.cd-hero-trust strong,
[class*="trust"] strong:not([class*="badge"]) {
  color: var(--text-strong) !important;
}

/* ============================================================
 * PASS 6 — comprehensive design simplification pass
 * Empty containers, button consistency, layout polish, redundant
 * elements removed across every surface.
 * ============================================================ */

/* --- Hide empty icon containers (post-emoji-purge orphans).
   2026-05-14: `.cd-service-detail` grid was changed from `80px 1fr` to a
   single 1fr column in main.css, so the empty icon div can finally be
   hidden safely without leaving a phantom 80px gap. */
.cd-case-detail__icon,
.cd-case-detail__icon:empty,
.cd-pricing-card__icon,
.cd-pricing-card__icon:empty,
.cd-svc-price-card__icon,
.cd-svc-price-card__icon:empty,
.cd-service-card__icon:empty,
.cd-service-detail__icon,
.cd-service-detail__icon:empty,
.cd-trust__icon:empty,
.cd-feature__icon:empty,
.cd-step__icon:empty,
.cd-icon:empty {
  display: none !important;
}

/* --- Hide empty visual cards generally (boxes with no content) --- */
.cd-card:empty,
.cd-panel:empty,
.cd-section:empty,
.cd-tile:empty {
  display: none !important;
}

/* --- Standardise ALL primary buttons to the same shape + size --- */
.cd-btn,
button.cd-btn,
a.cd-btn,
input[type=submit].cd-btn {
  border-radius: 9999px !important;
  font-weight: 600 !important;
  letter-spacing: -0.005em;
  padding: 12px 24px !important;
  font-size: 15px !important;
  line-height: 1.2;
  border-width: 1px !important;
  cursor: pointer;
  transition: transform 200ms cubic-bezier(0.4,0,0.2,1),
              box-shadow 200ms cubic-bezier(0.4,0,0.2,1),
              background-color 200ms cubic-bezier(0.4,0,0.2,1),
              color 200ms cubic-bezier(0.4,0,0.2,1);
}
.cd-btn--xl { padding: 16px 36px !important; font-size: 17px !important; }
.cd-btn--lg { padding: 14px 30px !important; font-size: 16px !important; }
.cd-btn--sm { padding: 8px 16px !important; font-size: 13px !important; }

.cd-btn--primary {
  background: #7c3aed !important;
  color: #ffffff !important;
  border-color: #7c3aed !important;
  box-shadow: 0 1px 2px rgba(124,58,237,0.18), 0 4px 12px -2px rgba(124,58,237,0.28);
}
.cd-btn--primary:hover {
  background: #6d28d9 !important;
  border-color: #6d28d9 !important;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(124,58,237,0.22), 0 12px 24px -4px rgba(124,58,237,0.38);
}
.cd-btn--ghost {
  background: #ffffff !important;
  color: #0f172a !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
}
.cd-btn--ghost:hover {
  background: #f8fafc !important;
  color: #7c3aed !important;
  border-color: #cbd5e1 !important;
}
.cd-btn--outline {
  background: transparent !important;
  color: #7c3aed !important;
  border-color: #7c3aed !important;
}
.cd-btn--outline:hover {
  background: #7c3aed !important;
  color: #ffffff !important;
}

/* --- Case detail page: tighter layout, no empty hero ---
 *   Was: title in own card + full-width status bar + summary table.
 *   Now: title + status pill inline in one card, table follows directly. */
.cd-case-detail__header {
  display: flex !important;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 24px 28px !important;
}
.cd-case-detail__title-block { flex: 1 1 60%; min-width: 240px; }
.cd-case-detail__status-bar {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Status pill — inline, compact */
.cd-case-detail__status,
[class*="case"][class*="status"] {
  display: inline-flex !important;
  align-items: center;
  padding: 6px 14px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* --- Case summary table — tighter, cleaner --- */
.cd-case-summary {
  background: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 14px !important;
  padding: 8px 24px !important;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04), 0 1px 3px rgba(15,23,42,0.06);
}
.cd-case-summary__row,
.cd-case-summary > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid #f1f5f9;
}
.cd-case-summary__row:last-child,
.cd-case-summary > div:last-child { border-bottom: none; }
.cd-case-summary__label { color: #64748b; font-weight: 500; }
.cd-case-summary__value { color: #0f172a; font-weight: 600; }

/* --- Section spacing — consistent across all pages --- */
section { padding-top: 64px; padding-bottom: 64px; }
@media (max-width: 768px) {
  section { padding-top: 40px; padding-bottom: 40px; }
}

/* --- Form elements — consistent across the site --- */
input[type="text"]:not(.cd-hero-search__input),
input[type="email"]:not(.cd-hero-search__input),
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="date"],
select,
textarea {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  padding: 12px 14px;
  font-size: 15px;
  font-family: 'Inter', -apple-system, sans-serif;
  width: 100%;
  box-sizing: border-box;
  transition: border-color 200ms, box-shadow 200ms;
}
input:focus, select:focus, textarea:focus {
  border-color: #7c3aed;
  outline: none;
  box-shadow: 0 0 0 4px rgba(124,58,237,0.12);
}
input::placeholder, textarea::placeholder { color: #94a3b8; }

/* ============================================================
 * WIZARD — YOU vs THEM clearly differentiated step intros
 * Step 2 (YOU)  → violet accent, person icon
 * Step 3 (THEM) → cyan accent, building/recipient icon
 * Big, visual, "5-year-old can use it" framing
 * ============================================================ */
.cd-step-intro {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 24px 28px;
  border-radius: 18px;
  margin: 0 0 28px;
  position: relative;
  overflow: hidden;
}
.cd-step-intro::before {
  content: "";
  position: absolute;
  top: 0; right: 0;
  width: 240px; height: 100%;
  opacity: 0.06;
  background: radial-gradient(circle at 80% 50%, currentColor 0%, transparent 70%);
  pointer-events: none;
}
.cd-step-intro__avatar {
  flex-shrink: 0;
  width: 64px; height: 64px;
  border-radius: 18px;
  display: flex; align-items: center; justify-content: center;
  color: #ffffff;
  box-shadow: 0 8px 20px -6px rgba(0,0,0,0.25);
}
.cd-step-intro__body { flex: 1; min-width: 0; }
.cd-step-intro__eyebrow {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 9999px;
  margin-bottom: 8px;
}
.cd-step-intro__title {
  font-size: clamp(1.5rem, 1vw + 1.2rem, 2rem) !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em;
  color: #020617 !important;
  margin: 0 0 6px !important;
}
.cd-step-intro__title em {
  font-style: normal;
  /* Solid accent colour (was a gradient-text clip that rendered as a solid
     box when background-clip:text failed / was overridden by the contrast fix).
     var(--accent-from) keeps it per-step: purple by default, teal on step 3. */
  color: var(--accent-from, #7c3aed) !important;
  -webkit-text-fill-color: var(--accent-from, #7c3aed) !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  font-weight: 900;
}
.cd-step-intro__sub {
  font-size: 15px !important;
  color: #475569 !important;
  line-height: 1.55 !important;
  margin: 0 !important;
}
.cd-step-intro__sub strong { color: #0f172a !important; font-weight: 700; }
.cd-step-intro__sub a { color: inherit; text-decoration: underline; }

/* YOU variant — violet */
.cd-step-intro--you {
  background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
  border: 1px solid #ddd6fe;
  color: #7c3aed;
  --accent-from: #7c3aed;
  --accent-to: #6366f1;
}
.cd-step-intro--you .cd-step-intro__avatar {
  background: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);
}
.cd-step-intro--you .cd-step-intro__eyebrow {
  background: #7c3aed;
  color: #ffffff;
}

/* THEM variant — cyan/teal */
.cd-step-intro--them {
  background: linear-gradient(135deg, #ecfeff 0%, #cffafe 100%);
  border: 1px solid #a5f3fc;
  color: #0891b2;
  --accent-from: #0891b2;
  --accent-to: #06b6d4;
}
.cd-step-intro--them .cd-step-intro__avatar {
  background: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%);
}
.cd-step-intro--them .cd-step-intro__eyebrow {
  background: #0891b2;
  color: #ffffff;
}

@media (max-width: 600px) {
  .cd-step-intro { flex-direction: column; align-items: flex-start; padding: 20px; }
  .cd-step-intro__avatar { width: 52px; height: 52px; border-radius: 14px; }
  .cd-step-intro__title { font-size: 1.4rem !important; }
}

/* --- Wizard form-grid spacing tightened so the intro doesn't fight the grid --- */
.cd-wizard__step .cd-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 20px;
}
.cd-wizard__step .cd-form-grid .cd-field--full { grid-column: 1 / -1; }
@media (max-width: 600px) {
  .cd-wizard__step .cd-form-grid { grid-template-columns: 1fr; }
}
.cd-field label {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 6px;
}
.cd-field small {
  display: block;
  font-size: 13.5px;
  color: #94a3b8;
  margin-top: 4px;
  line-height: 1.4;
}
.cd-req { color: #dc2626; font-weight: 700; }

/* --- Wizard nav buttons — consistent spacing --- */
.cd-wizard__nav {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid #f1f5f9;
}
@media (max-width: 480px) {
  .cd-wizard__nav { flex-direction: column-reverse; }
  .cd-wizard__nav .cd-btn { width: 100%; }
}

/* ============================================================
 * WIZARD HELP — friendly tips, hints, examples
 * Visible help that explains what to do without calling support.
 * Two variants: --you (violet, sender) and --them (cyan, recipient)
 * to match the step-intro colour coding.
 * ============================================================ */
.cd-tip {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 14px 18px;
  border-radius: 12px;
  margin: 0 0 22px;
  font-size: 14px;
  line-height: 1.55;
}
.cd-tip__icon {
  flex-shrink: 0;
  width: 36px; height: 36px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: #ffffff;
}
.cd-tip__body { color: #334155; }
.cd-tip__body strong { color: #0f172a; display: inline-block; margin-right: 4px; }
.cd-tip__body a { color: inherit; text-decoration: underline; font-weight: 600; }

/* YOU variant */
.cd-tip--you {
  background: linear-gradient(135deg, #faf8ff 0%, #f5f3ff 100%);
  border: 1px solid #e0d5fa;
}
.cd-tip--you .cd-tip__icon { background: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%); }

/* THEM variant */
.cd-tip--them {
  background: linear-gradient(135deg, #f0fdfe 0%, #ecfeff 100%);
  border: 1px solid #b8eef5;
}
.cd-tip--them .cd-tip__icon { background: linear-gradient(135deg, #0891b2 0%, #06b6d4 100%); }

/* Generic info variant for evidence step etc. */
.cd-tip--info {
  background: linear-gradient(135deg, #f8fafc 0%, #eff6ff 100%);
  border: 1px solid #cfe1ff;
}
.cd-tip--info .cd-tip__icon { background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%); }

/* Warning variant for important things */
.cd-tip--warn {
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border: 1px solid #fcd34d;
}
.cd-tip--warn .cd-tip__icon { background: linear-gradient(135deg, #b45309 0%, #f59e0b 100%); }
.cd-tip--warn .cd-tip__body { color: #78350f; }
.cd-tip--warn .cd-tip__body strong { color: #451a03; }

/* --- Field-level hint styling (the <small> below inputs) --- */
.cd-field small {
  display: block;
  font-size: 13.5px;
  line-height: 1.5;
  color: #64748b;
  margin-top: 6px;
}
.cd-field small strong { color: #334155; font-weight: 600; }
.cd-field small a { color: #7c3aed; text-decoration: underline; }

@media (max-width: 600px) {
  .cd-tip { padding: 12px 14px; gap: 10px; }
  .cd-tip__icon { width: 28px; height: 28px; }
}

/* --- Step label + progress bar spacing --- */
.cd-wizard__header {
  margin-bottom: 8px;
}
.cd-wizard__step-label {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #94a3b8;
  margin-top: 8px;
}
.cd-wizard__progress {
  height: 6px;
  background: #f1f5f9;
  border-radius: 9999px;
  overflow: hidden;
}
.cd-wizard__bar {
  height: 100%;
  background: linear-gradient(90deg, #7c3aed 0%, #6366f1 50%, #06b6d4 100%);
  border-radius: 9999px;
  transition: width 400ms cubic-bezier(0.4,0,0.2,1);
}

/* --- Wizard step 1 service-option icon container --- */
.cd-service-option__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 11px;
  background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
  color: #7c3aed;
  margin-bottom: 10px;
  flex-shrink: 0;
  transition: transform 200ms cubic-bezier(0.4,0,0.2,1), background 200ms;
}
.cd-service-option__icon svg { display: block; }
.cd-service-option:hover .cd-service-option__icon {
  background: linear-gradient(135deg, #ddd6fe 0%, #c4b5fd 100%);
  transform: rotate(-3deg) scale(1.05);
}
.cd-service-option input:checked ~ .cd-service-option__icon,
label.cd-service-option:has(input:checked) .cd-service-option__icon {
  background: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);
  color: #ffffff;
}

/* --- Wizard step 1: service option cards were dark from legacy --- */
.cd-service-option,
label.cd-service-option,
.cd-wizard__option,
.cd-svc-option {
  background: var(--white) !important;
  background-color: var(--white) !important;
  color: var(--text) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--card-shadow);
  padding: 18px 20px;
  cursor: pointer;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
}
.cd-service-option:hover,
label.cd-service-option:hover {
  border-color: var(--purple-light) !important;
  box-shadow: var(--card-shadow-lg);
  transform: translateY(-1px);
}
.cd-service-option strong,
.cd-service-option h3,
.cd-service-option h4,
.cd-wizard__option strong,
.cd-wizard__option h3 {
  color: var(--text-strong) !important;
  font-weight: 700;
  font-size: 16px;
}
.cd-service-option p,
.cd-service-option__desc,
.cd-wizard__option p {
  color: var(--text-muted) !important;
  font-size: 14px;
}
/* Price inside the wizard card */
.cd-service-option [class*="price"],
.cd-service-option__price,
.cd-wizard__option [class*="price"] {
  color: var(--purple) !important;
  font-weight: 700;
  font-size: 18px;
}
/* Selected state */
.cd-service-option.is-selected,
label.cd-service-option input:checked ~ *,
label.cd-service-option:has(input:checked) {
  background: linear-gradient(180deg, #ffffff 0%, #fafaff 100%) !important;
  border-color: var(--purple) !important;
  box-shadow: 0 0 0 3px rgba(124,58,237,0.12), var(--card-shadow-lg) !important;
}

/* ============================================================
 * SINGLE BLOG POST — light-theme hero fix
 * enhancements.css styles .cd-post-hero for the OLD dark theme:
 *   background: var(--bg)  +  title color: var(--white)
 * Under the light redesign --bg and --white both resolve to #fff,
 * so the post title rendered white-on-white (invisible hero).
 * Restore contrast for the light theme.
 * ============================================================ */
.cd-post-hero {
  background: linear-gradient(180deg, #faf7ff 0%, #ffffff 100%) !important;
  border-bottom: 1px solid var(--border);
}
.cd-post-hero__title {
  color: #1c1330 !important;   /* near-black, matches page-template heros */
}
.cd-post-hero__excerpt {
  color: #475569 !important;   /* slate-600 — legible sub-text */
}
.cd-post-hero__date {
  color: #64748b !important;   /* slate-500 — was #94a3b8, too faint on white */
}
.cd-post-hero__back {
  color: #7c3aed !important;
}
.cd-post-hero__back:hover { color: #5b21b6 !important; }

/* Reduce motion for users who want it */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    transition: none !important;
    animation: none !important;
  }
}