/* Handsfree design system: navy chapters, one light canvas, contained contrast.
   This replaces the preceding layered palette passes, rather than appending one. */
:root {
  --hf-ink: #0e1624;
  --hf-ink-soft: #172438;
  --hf-blue: #006fd7;
  --hf-cyan: #007a87;
  --hf-mist: #f7f8fa;
  --hf-muted: #52657d;
  --hf-light-blue: #81c2ff;
  --hf-light-teal: #43c7cb;
  --hf-light-text: #cbd5e1;
  --hf-dark-border: rgba(203,213,225,.18);
  --hf-light-border: #dce3eb;
  --hf-dark-card-shadow: 0 12px 30px rgba(0,0,0,.14);
  --hf-light-card-shadow: 0 8px 24px rgba(14,22,36,.05);
  --hf-section-space: 72px;
  --primary: #006fd7;
  --primary-foreground: #fff;
  --ring: #006fd7;
  --secondary: #f7f8fa;
  --muted: #f7f8fa;
  --muted-foreground: #52657d;
  --hf-offer-ink: #0e1624;
  --hf-offer-panel: #172438;
  --hf-offer-teal: #43c7cb;
  --hf-offer-blue: #81c2ff;
}

/* Full-width surface roles. White belongs to cards/product UI, not stripes. */
main > .hf-surface-light, .hf-websites-section, .hf-fleetpilot-section,
.hf-simple-pricing-section, .hf-reviews-section { background: var(--hf-mist); }
main > .hf-surface-dark, .hf-reality-section, .hf-about-section,
.hf-contact-section, footer { background-color: var(--hf-ink); }
main > .hf-surface-light, .hf-fleetpilot-section, .hf-simple-pricing-section,
.hf-reviews-section { padding-block: var(--hf-section-space); border-top: 0; border-bottom: 0; }
main > .hf-chapter-start, .hf-reviews-section { padding-top: 104px; }
main > .hf-chapter-end { padding-bottom: 104px; }
.hf-about-section { padding-block: 104px; }
#why-choose-us { border: 0; }
.hf-pricing-shell { max-width: 1280px; }
.hf-reviews-section::before, .hf-section-orb { display: none; }
main > .hf-surface-light > .road-pattern, #how-it-works .road-pattern { display: none; }
.hf-about-diamond-pattern { opacity: .12; }
.hf-about-section::before { display: none; }

/* Common contained surfaces. */
.hf-plan-card, main > .hf-surface-light .glass-card, .hf-featured-review,
.hf-review-card { background: white; border-color: var(--hf-light-border); box-shadow: var(--hf-light-card-shadow); }
.hf-plan-card--pro, .hf-turo-spotlight, .hf-featured-review-profile,
.hf-founder-proof > div { background: var(--hf-ink-soft); }
.hf-plan-card--pro, .hf-turo-spotlight, .hf-founder-proof,
.hf-founder-portrait-frame { border-color: var(--hf-dark-border); box-shadow: var(--hf-dark-card-shadow); }
.hf-turo-spotlight { border-left-color: var(--hf-blue); }
.hf-turo-spotlight::before { display: none; }
.hf-founder-note, .hf-founder-proof span, .hf-team-disclosure { color: #aebdd0; }
.hf-about-copy blockquote { border-color: var(--hf-light-teal); }
.hf-featured-review-profile { border-right: 1px solid var(--hf-dark-border); }

/* How It Works now belongs to the light information chapter. Keep blue steps. */
#how-it-works h2, #how-it-works h3 { color: var(--hf-ink); }
#how-it-works [data-loc="client/src/pages/Home.tsx:759"] { background: white; border-color: var(--hf-light-border); box-shadow: var(--hf-light-card-shadow); backdrop-filter: none; }
#how-it-works [data-loc="client/src/pages/Home.tsx:759"]:hover { background: white; border-color: #b6cfea; }
#how-it-works [data-loc="client/src/pages/Home.tsx:761"] { color: var(--hf-muted); }
#how-it-works [data-loc="client/src/pages/Home.tsx:753"] { background: var(--hf-blue); box-shadow: 0 5px 14px rgba(0,111,215,.14); }

/* Brand treatments and purposeful partnership emphasis. */
.gradient-text { background-image: linear-gradient(110deg,#006fd7,#007a87); }
#home .gradient-text { background-image: linear-gradient(110deg,#3a9eff,#43c7cb); }
.hf-eyebrow--dark, .hf-reality-content > .hf-eyebrow { color: var(--hf-light-blue); }
.hf-combined-benefit { background: #eaf5f5; border-color: #d2e5e6; }
.hf-combined-benefit .hf-plan-kicker { color: #007a87; }
.hf-combined-benefit h3, .hf-combined-benefit strong { color: #172438; }
.hf-combined-benefit > div > p:not(.hf-plan-kicker) { color: var(--hf-muted); }
.hf-combined-benefit a { color: #0067c6; }
.hf-pricing-estimator { background: white; border-color: #cad9e9; }
.hf-pricing-estimator summary:hover { background: #edf3fa; }
.hf-estimator-action { background: #eaf1fb; border-color: #c3d5ea; }
.hf-fleetpilot-product { background: white; border-color: var(--hf-light-border); }
.hf-fleetpilot-dashboard { box-shadow: var(--hf-light-card-shadow); }
.hf-fleetpilot-partner-copy { flex: 1 1 0; min-width: 0; max-width: 850px; }
.hf-fleetpilot-partner-copy .hf-fleetpilot-partner-context { margin-top: 13px; }
.hf-fleetpilot-partner-links { flex: 0 0 auto; max-width: 235px; }

/* Preserve the opening imagery and brand navy beneath its shade. */
.hf-reality-shade { background: linear-gradient(90deg,#0e1624 5%,rgba(14,22,36,.97) 26%,rgba(14,22,36,.86) 45%,rgba(14,22,36,.20) 80%),linear-gradient(0deg,#0e1624,transparent 22%,transparent 75%,#0e1624); }
.hf-reality-clock { background: var(--hf-ink-soft); border-color: var(--hf-dark-border); }
.hf-header-hero-type small { color: #b6c3d3; }

/* The compact header switches contrast, not the page's design language. */
header[data-hf-active-nav]:not([class*="bg-white"]) a.nav-link { color: var(--hf-light-text) !important; }
header[data-hf-active-nav]:not([class*="bg-white"]) a.nav-link:hover,
header[data-hf-active-nav]:not([class*="bg-white"]) a.nav-link[aria-current="location"] { color: var(--hf-light-blue) !important; }
header[data-hf-active-nav]:not([class*="bg-white"]) a.nav-link[aria-current="location"]::after { background: var(--hf-light-blue); }
header[data-hf-active-nav][class*="bg-white"] a.nav-link { color: var(--hf-muted) !important; }
header[data-hf-active-nav][class*="bg-white"] a.nav-link:hover,
header[data-hf-active-nav][class*="bg-white"] a.nav-link[aria-current="location"] { color: var(--hf-blue) !important; }
header[data-hf-active-nav][class*="bg-white"] a.nav-link[aria-current="location"]::after { background: var(--hf-blue); }
header:not([class*="bg-white"]) button[aria-label="Toggle menu"] { color: #e2e8f0; }
header[class*="bg-white"] button[aria-label="Toggle menu"] { color: var(--hf-ink-soft); }
header #hf-mobile-navigation { background: white; }
header[data-hf-active-nav] #hf-mobile-navigation a[href^="#"] { color: var(--hf-muted) !important; background: transparent !important; }
header[data-hf-active-nav] #hf-mobile-navigation a[href^="#"][aria-current="location"] { color: var(--hf-blue) !important; background: #eaf1fb !important; }
header a:focus-visible, header button:focus-visible { outline: 3px solid var(--hf-light-blue); outline-offset: 3px; }
header[class*="bg-white"] a:focus-visible, header[class*="bg-white"] button:focus-visible,
header #hf-mobile-navigation a:focus-visible { outline-color: var(--hf-blue); }

/* Recognizable, restrained actions and a separate current-location state. */
button[class*="bg-[oklch(0.55_0.22_255)]"], .hf-websites-cta,
.hf-credibility-button--primary, .hf-pricing-shared-terms > a, .hf-fleetpilot-cta { background-color: var(--hf-blue); box-shadow: 0 6px 16px rgba(0,111,215,.14); }
button[class*="bg-[oklch(0.55_0.22_255)]"]:hover, .hf-websites-cta:hover,
.hf-credibility-button--primary:hover, .hf-pricing-shared-terms > a:hover { background-color: #005eb8; box-shadow: 0 8px 20px rgba(0,111,215,.18); }
button[aria-label="Book a Discovery Call"] { box-shadow: 0 8px 22px rgba(0,111,215,.18); }
header button.hf-booking-action[data-hf-booking-active="true"],
button[aria-label="Book a Discovery Call"].hf-booking-action[data-hf-booking-active="true"] { background-color: #005eb8; box-shadow: 0 0 0 2px white,0 0 0 4px #006fd7,0 8px 22px rgba(0,111,215,.23); }
header button.hf-booking-action[data-hf-booking-active="true"]:hover,
button[aria-label="Book a Discovery Call"].hf-booking-action[data-hf-booking-active="true"]:hover { background-color: #0053a3; }
header button.hf-booking-action:focus-visible,
button[aria-label="Book a Discovery Call"].hf-booking-action:focus-visible { outline: 3px solid #43c7cb; outline-offset: 7px; }
footer { border-top: 1px solid var(--hf-dark-border); }
footer a[class*="text-white/50"], footer p[class*="text-white/40"] { color: #b6c3d3; }
footer a[class*="text-white/50"]:hover { color: white; }

@media (max-width: 900px) { .hf-featured-review-profile { border-right: 0; } .hf-fleetpilot-partner-links { max-width: none; } }
@media (max-width: 760px) {
  :root { --hf-section-space: 52px; }
  main > .hf-chapter-start, .hf-reviews-section { padding-top: 76px; }
  main > .hf-chapter-end { padding-bottom: 76px; }
  .hf-about-section { padding-block: 76px; }
  .hf-reality-shade { background: linear-gradient(90deg,rgba(14,22,36,.96),rgba(14,22,36,.66)),linear-gradient(0deg,#0e1624,transparent 40%,#0e1624); }
}
@media (prefers-reduced-motion: reduce) { .hf-booking-action { transition: none !important; } }