/* DRVR themes — light default matched to WorldKey cream / bronze / black */
:root,
html[data-theme="light"] {
  --bg: #FBF9F4;
  --bg-alt: #FFFFFF;
  --panel: #FFFFFF;
  --panel-soft: #F5F2EB;
  --line: #E8E4DC;
  --text: #0A0A0A;
  /* Charcoal secondary — readable on cream (was too light when pages hardcoded #d2d2d2) */
  --text-dim: #3F3C38;
  --muted: #5C5852;
  --gold: #A68A56;
  --gold-bright: #997B4D;
  --gold-rgb: 166, 138, 86;
  --cta-bg: #0A0A0A;
  --cta-text: #FFFFFF;
  --nav-link: rgba(10, 10, 10, 0.72);
  --nav-link-hover: var(--gold);
  --header-bg: rgba(251, 249, 244, 0.94);
  --header-border: rgba(232, 228, 220, 0.95);
  --mobile-menu-bg: #FBF9F4;
  --hero-sub: #E8E8E8;
  --input-bg: #FFFFFF;
  --shadow-soft: 0 12px 40px rgba(0, 0, 0, 0.06);
  color-scheme: light;
}

html[data-theme="dark"] {
  --bg: #0F0F0F;
  --bg-alt: #161616;
  --panel: #1A1A1A;
  --panel-soft: #222222;
  --line: #2A2A2A;
  --text: #F5F5F5;
  --text-dim: #A1A1AA;
  --muted: #8A8A8A;
  /* Dark accents: toned cream (wordsets override to bright white below) */
  --cream: #EDE6D9;
  --cream-rgb: 237, 230, 217;
  --gold: #EDE6D9;
  --gold-bright: #EDE6D9;
  --gold-rgb: 237, 230, 217;
  --cta-bg: rgba(237, 230, 217, 0.1);
  --cta-text: #EDE6D9;
  --nav-link: rgba(245, 245, 245, 0.72);
  --nav-link-hover: var(--cream);
  --header-bg: rgba(15, 15, 15, 0.88);
  --header-border: rgba(42, 42, 42, 0.9);
  --mobile-menu-bg: #0A0A0A;
  --hero-sub: #D8D8D8;
  --input-bg: #0C0C0C;
  --shadow-soft: 0 10px 40px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}

html, body {
  background: var(--bg);
  color: var(--text);
}

.gold { color: var(--gold); }

/* Theme toggle — filled icon, soft pill (no hairline ring) */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: none;
  background: rgba(0, 0, 0, 0.06);
  color: var(--text);
  cursor: pointer;
  padding: 0;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.15s;
  box-sizing: border-box;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  -webkit-tap-highlight-color: transparent;
}
.theme-toggle:hover {
  color: var(--gold);
  background: rgba(0, 0, 0, 0.09);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.theme-toggle:active {
  transform: scale(0.96);
}
.theme-toggle svg { width: 17px; height: 17px; display: block; flex-shrink: 0; }
.theme-toggle .icon-sun { display: none; }
.theme-toggle .icon-moon { display: block; }
html[data-theme="dark"] .theme-toggle .icon-sun { display: block; }
html[data-theme="dark"] .theme-toggle .icon-moon { display: none; }

/* Phone-only: cluster toggle + hamburger so space-between never parks the toggle mid-header */
.nav-end {
  display: none;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  margin-left: auto;
}
.theme-toggle--phone {
  display: none;
}
@media (max-width: 760px) {
  .nav-end {
    display: inline-flex;
  }
  .theme-toggle--phone {
    display: inline-flex;
    margin: 0;
    flex-shrink: 0;
  }
  /* Phone main-site headers: match Why DRVR logo size (64px). Why-pages keep their own rules. */
  header:not(.why-header) .brand-logo:not(.brand-logo--foot) {
    height: 64px !important;
    max-width: 360px !important;
    width: auto;
  }
}

/* Dark mode WORDSETS only: bright white + bold (Book Now, one hour, etc.) */
html[data-theme="dark"] .gold,
html[data-theme="dark"] .value-line .gold,
html[data-theme="dark"] strong.gold,
html[data-theme="dark"] em.gold,
html[data-theme="dark"] span.gold,
html[data-theme="dark"] .menu .cta,
html[data-theme="dark"] a.cta,
html[data-theme="dark"] .nav-cta {
  color: #fff !important;
  font-weight: 600;
}

/* Dark mode other former-gold accents: creamy off-white (not bright white) */
html[data-theme="dark"] .hero-tag,
html[data-theme="dark"] .section-label,
html[data-theme="dark"] .panel-note,
html[data-theme="dark"] .contact-card .label,
html[data-theme="dark"] .pillar h4,
html[data-theme="dark"] .vehicle-card .v-price,
html[data-theme="dark"] .fare strong,
html[data-theme="dark"] .tab.active,
html[data-theme="dark"] .pill.active,
html[data-theme="dark"] .btn,
html[data-theme="dark"] .btn.outline,
html[data-theme="dark"] .panel-cta,
html[data-theme="dark"] .panel-cta.outline,
html[data-theme="dark"] .why-kicker,
html[data-theme="dark"] .why-eyebrow,
html[data-theme="dark"] .why-pronounce,
html[data-theme="dark"] .why-proof strong,
html[data-theme="dark"] .why-button,
html[data-theme="dark"] .why-button.secondary,
html[data-theme="dark"] .pricing-box .price-item .amount,
html[data-theme="dark"] .credits-box h3,
html[data-theme="dark"] .app-store-btn,
html[data-theme="dark"] .app-store-name,
html[data-theme="dark"] .app-store-eyebrow,
html[data-theme="dark"] .book-fab,
html[data-theme="dark"] .book-fab-tip,
html[data-theme="dark"] label,
html[data-theme="dark"] .check a,
html[data-theme="dark"] .menu a:hover,
html[data-theme="dark"] .menu a.nav-active,
html[data-theme="dark"] .mobile-menu a:hover,
html[data-theme="dark"] .mobile-menu a.nav-active,
html[data-theme="dark"] .foot-links a:hover,
html[data-theme="dark"] .why-nav a:hover,
html[data-theme="dark"] .why-nav a[aria-current="page"],
html[data-theme="dark"] .suggest-list button:hover,
html[data-theme="dark"] table.ctbl thead th.drvr,
html[data-theme="dark"] .comp-card table.ctbl thead th.drvr {
  color: var(--cream) !important;
}
/* Headline italic accents count as wordsets */
html[data-theme="dark"] .why-content h1 em {
  color: #fff !important;
  font-weight: 600;
}
html[data-theme="dark"] .theme-toggle {
  color: var(--cream);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
html[data-theme="dark"] .theme-toggle:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
html[data-theme="dark"] .app-store-btn {
  border-color: rgba(var(--cream-rgb), 0.45);
  background: rgba(var(--cream-rgb), 0.08);
}
html[data-theme="dark"] .app-store-btn:hover {
  background: rgba(var(--cream-rgb), 0.14);
  border-color: rgba(var(--cream-rgb), 0.7);
  color: var(--cream) !important;
}
html[data-theme="dark"] .book-fab {
  color: var(--cream) !important;
  border-color: rgba(var(--cream-rgb), 0.55);
  background: rgba(var(--cream-rgb), 0.1);
}
html[data-theme="dark"] .menu .cta,
html[data-theme="dark"] a.cta,
html[data-theme="dark"] .nav-cta {
  border-color: rgba(255, 255, 255, 0.55) !important;
}
html[data-theme="dark"] .btn,
html[data-theme="dark"] .panel-cta,
html[data-theme="dark"] .why-button {
  border-color: rgba(var(--cream-rgb), 0.55) !important;
  background: rgba(var(--cream-rgb), 0.08) !important;
}

/* Light-mode chrome */
html[data-theme="light"] .menu a { color: var(--nav-link); }
html[data-theme="light"] .menu a:hover,
html[data-theme="light"] .menu a.nav-active { color: var(--gold); }
html[data-theme="light"] .menu .cta,
html[data-theme="light"] a.cta {
  background: var(--cta-bg) !important;
  color: var(--cta-text) !important;
  border-color: var(--cta-bg) !important;
}
html[data-theme="light"] .menu .cta:hover,
html[data-theme="light"] a.cta:hover {
  background: #1a1a1a !important;
  color: #fff !important;
}
html[data-theme="light"] .hamburger span { background: var(--text); }
html[data-theme="light"] .mobile-menu { background: var(--mobile-menu-bg); }
html[data-theme="light"] .mobile-menu a { color: var(--text); }
html[data-theme="light"] .why-nav { color: var(--nav-link); }
html[data-theme="light"] .why-nav a:hover,
html[data-theme="light"] .why-nav a[aria-current="page"] { color: var(--gold); }
html[data-theme="light"] .why-header .why-nav {
  color: rgba(245, 245, 245, 0.72);
}
html[data-theme="light"] .why-header .why-nav a:hover,
html[data-theme="light"] .why-header .why-nav a[aria-current="page"] {
  color: #E6D5A8;
}
html[data-theme="light"] .why-header .why-nav-toggle {
  color: #E6D5A8;
  border-color: rgba(230, 213, 168, 0.55);
}
html[data-theme="light"] .why-header .theme-toggle {
  color: #fff;
  background: rgba(255, 255, 255, 0.14);
  box-shadow: none;
}
html[data-theme="light"] .why-header .theme-toggle:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.22);
}
html[data-theme="light"] .why-nav-toggle {
  color: var(--gold-bright);
  border-color: rgba(var(--gold-rgb), 0.55);
}
html[data-theme="light"] .why-nav-wrap .why-nav {
  background: #fff;
  border-color: var(--line);
  box-shadow: var(--shadow-soft);
}
html[data-theme="light"] .why-header .why-nav-wrap .why-nav {
  background: #141414;
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45);
}
html[data-theme="light"] .why-header .why-nav-wrap .why-nav a {
  color: rgba(245, 245, 245, 0.78);
}
html[data-theme="light"] .why-header .why-nav-wrap .why-nav a:hover,
html[data-theme="light"] .why-header .why-nav-wrap .why-nav a[aria-current="page"],
html[data-theme="light"] .why-header .why-nav-book {
  color: #E6D5A8 !important;
}
html[data-theme="light"] .why-nav-book {
  color: var(--cta-text) !important;
  background: var(--cta-bg);
  border-color: var(--cta-bg);
}
html[data-theme="light"] .why-header .why-nav-book {
  background: transparent;
  border-color: rgba(230, 213, 168, 0.55);
}
html[data-theme="light"] .why-page {
  background: radial-gradient(circle at 85% 12%, rgba(166, 138, 86, 0.08), transparent 34%), var(--bg);
}
html[data-theme="light"] .why-lede { color: var(--text-dim); }
html[data-theme="light"] .why-benefit {
  background: var(--panel-soft);
  border-color: var(--line);
}
html[data-theme="light"] .why-button {
  background: var(--cta-bg);
  color: var(--cta-text);
  border-color: var(--cta-bg);
}
html[data-theme="light"] .why-button.secondary {
  background: transparent;
  color: var(--gold);
  border-color: rgba(var(--gold-rgb), 0.55);
}

/* Over-hero header bar — same layout both themes; only colors differ */
html[data-theme="light"] header.over-hero {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  z-index: 20;
  background: #FFFFFF;
  border-bottom: 1px solid #0A0A0A;
  min-height: 94px;
  padding-top: 12px;
  padding-bottom: 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-theme="dark"] header.over-hero {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  z-index: 20;
  background: #0A0A0A;
  border-bottom: 1px solid #FFFFFF;
  min-height: 94px;
  padding-top: 12px;
  padding-bottom: 12px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* Keep header logo sized like why (64px), not the oversized 72px hero mark */
html[data-theme="light"] header.over-hero .brand-logo,
html[data-theme="dark"] header.over-hero .brand-logo {
  filter: none;
  height: 64px;
  max-width: 360px;
  width: auto;
}
/* Location only: lock header row to the left (not centered), 40px from page edge */
html[data-theme="light"] header.over-hero .container.nav,
html[data-theme="dark"] header.over-hero .container.nav {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: 40px;
  padding-right: 24px;
  box-sizing: border-box;
}
html[data-theme="light"] header.over-hero .menu a,
html[data-theme="dark"] header.over-hero .menu a {
  color: var(--nav-link);
}
html[data-theme="light"] header.over-hero .menu a:hover,
html[data-theme="light"] header.over-hero .menu a.nav-active,
html[data-theme="dark"] header.over-hero .menu a:hover,
html[data-theme="dark"] header.over-hero .menu a.nav-active {
  color: var(--gold);
}
html[data-theme="light"] header.over-hero .menu .cta,
html[data-theme="dark"] header.over-hero .menu .cta {
  background: var(--cta-bg) !important;
  color: var(--cta-text) !important;
  border-color: var(--cta-bg) !important;
}
html[data-theme="light"] header.over-hero .hamburger span,
html[data-theme="dark"] header.over-hero .hamburger span { background: var(--text); }
html[data-theme="light"] header.over-hero .theme-toggle {
  color: var(--text);
  background: rgba(0, 0, 0, 0.06);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}
html[data-theme="light"] header.over-hero .theme-toggle:hover {
  color: var(--gold);
  background: rgba(0, 0, 0, 0.09);
}
html[data-theme="dark"] header.over-hero .theme-toggle {
  color: var(--cream);
  background: rgba(255, 255, 255, 0.1);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
html[data-theme="dark"] header.over-hero .theme-toggle:hover {
  color: #fff;
  background: rgba(255, 255, 255, 0.16);
}
/* Header no longer overlays the hero */
html[data-theme="light"] .hero .hero-content,
html[data-theme="dark"] .hero .hero-content {
  padding-top: 24px;
}

/* Solid headers on cream */
html[data-theme="light"] header.solid-header {
  background: var(--header-bg);
  border-bottom: 1px solid var(--header-border);
  backdrop-filter: blur(10px);
}

/* Light surfaces: black wordmark + gold dot (dedicated asset — never brightness(0)) */
html[data-theme="light"] .brand-logo--foot,
html[data-theme="light"] .foot-mark .brand-logo,
html[data-theme="light"] header.solid-header .brand-logo,
html[data-theme="light"] footer .brand-logo {
  filter: none;
}
html[data-theme="light"] .why-brand .brand-logo,
html[data-theme="light"] .why-header .brand-logo {
  filter: none;
}
html[data-theme="light"] .why-header {
  /* Only light mode: dark bar so the night wordmark (same as dark mode) stays readable */
  background: #0A0A0A;
  border-bottom: 1px solid rgba(166, 138, 86, 0.28);
}

/* Index hero sits on night photos in both themes — never charcoal H1 in light mode */
html[data-theme="light"] .hero h1 {
  color: #EDE6D9;
}

/* Forms / panels */
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  background: var(--input-bg);
  border-color: var(--line);
  color: var(--text);
}
html[data-theme="light"] .panel {
  background: var(--panel);
  border-color: var(--line);
  box-shadow: var(--shadow-soft);
}
html[data-theme="light"] .suggest-list {
  background: #fff;
  border-color: var(--line);
}
html[data-theme="light"] .suggest-list button {
  color: var(--text);
  border-bottom-color: var(--line);
}
html[data-theme="light"] .suggest-list button:hover { background: #FAFAF7; }
html[data-theme="light"] .suggest-clear{
  background:rgba(54,69,79,.12);color:#36454F;
}
html[data-theme="light"] .suggest-clear:hover{
  background:rgba(54,69,79,.22);color:#111;
}

html[data-theme="light"] .btn,
html[data-theme="light"] .panel-cta {
  background: var(--cta-bg);
  color: var(--cta-text);
  border-color: var(--cta-bg);
}
html[data-theme="light"] .btn.outline,
html[data-theme="light"] .panel-cta.outline {
  background: transparent;
  color: var(--gold);
  border-color: rgba(var(--gold-rgb), 0.65);
}

/* Light mode store buttons — location-specific (dark mode untouched) */
html[data-theme="light"] .app-store-strip .app-store-btn {
  background: #0A0A0A;
  border-color: #0A0A0A;
  color: #FFFFFF;
}
html[data-theme="light"] .app-store-strip .app-store-btn:hover {
  background: #1A1A1A;
  border-color: #1A1A1A;
  color: #FFFFFF;
}
html[data-theme="light"] .app-store-strip .app-store-eyebrow {
  color: rgba(255, 255, 255, 0.72);
}
html[data-theme="light"] .app-store-strip .app-store-name {
  color: inherit;
}
html[data-theme="light"] .app-store-strip { background: var(--bg); }

/* Bookings (above form): match "Book your ride." heading color */
html[data-theme="light"] .app-store-row--slim .app-store-btn {
  background: transparent;
  border-color: var(--text);
  color: var(--text);
}
html[data-theme="light"] .app-store-row--slim .app-store-btn:hover {
  background: rgba(10, 10, 10, 0.06);
  border-color: var(--text);
  color: var(--text);
}
html[data-theme="light"] .app-store-row--slim .app-store-eyebrow {
  color: var(--text-dim);
}
html[data-theme="light"] .app-store-row--slim .app-store-name {
  color: inherit;
}

/* Why DRVR pages (light only): charcoal store buttons — match bookings form slim row */
html[data-theme="light"] .why-page .why-content .app-store-btn {
  background: transparent !important;
  border-color: var(--text) !important;
  color: var(--text) !important;
}
html[data-theme="light"] .why-page .why-content .app-store-btn:hover {
  background: rgba(10, 10, 10, 0.06) !important;
  border-color: var(--text) !important;
  color: var(--text) !important;
}
html[data-theme="light"] .why-page .why-content .app-store-eyebrow {
  color: var(--text-dim) !important;
}
html[data-theme="light"] .why-page .why-content .app-store-name {
  color: inherit !important;
}

/* Footer store buttons + links: same cream/silver as dark-mode footer */
html[data-theme="light"] footer .app-store-btn,
html[data-theme="light"] .foot-mark .app-store-btn {
  border-color: rgba(237, 230, 217, 0.45);
  background: rgba(237, 230, 217, 0.08);
  color: #EDE6D9;
}
html[data-theme="light"] footer .app-store-btn:hover,
html[data-theme="light"] .foot-mark .app-store-btn:hover {
  background: rgba(237, 230, 217, 0.14);
  border-color: rgba(237, 230, 217, 0.7);
  color: #EDE6D9 !important;
}
html[data-theme="light"] footer .app-store-eyebrow,
html[data-theme="light"] .foot-mark .app-store-eyebrow {
  color: rgba(237, 230, 217, 0.75);
}
html[data-theme="light"] footer .app-store-name,
html[data-theme="light"] .foot-mark .app-store-name {
  color: inherit;
}
/* Bookings footer: match charcoal buttons above the form */
html[data-theme="light"] footer.footer--bookings .app-store-btn,
html[data-theme="light"] footer.footer--bookings .foot-mark .app-store-btn {
  background: transparent;
  border-color: var(--text);
  color: var(--text);
}
html[data-theme="light"] footer.footer--bookings .app-store-btn:hover,
html[data-theme="light"] footer.footer--bookings .foot-mark .app-store-btn:hover {
  background: rgba(10, 10, 10, 0.06);
  border-color: var(--text);
  color: var(--text) !important;
}
html[data-theme="light"] footer.footer--bookings .app-store-eyebrow,
html[data-theme="light"] footer.footer--bookings .foot-mark .app-store-eyebrow {
  color: var(--text-dim);
}
html[data-theme="light"] .foot-links {
  color: #A1A1AA;
}
html[data-theme="light"] .foot-links a:hover {
  color: #EDE6D9;
}
html[data-theme="light"] .copy {
  color: #8A8A8A;
}

html[data-theme="light"] .book-fab {
  background: rgba(255, 255, 255, 0.95);
  color: var(--gold-bright);
  border-color: rgba(var(--gold-rgb), 0.85);
}
html[data-theme="light"] .book-fab-tip {
  background: rgba(255, 255, 255, 0.98);
  color: #0A0A0A;
  border-color: rgba(var(--gold-rgb), 0.55);
}

html[data-theme="light"] .tabs-section,
html[data-theme="light"] .section,
html[data-theme="light"] .pillars,
html[data-theme="light"] .contact {
  background: var(--bg);
}
html[data-theme="light"] .section-alt {
  background: var(--panel-soft);
}

/* Body / list copy left over from dark-theme hardcodes (#d2d2d2) */
html[data-theme="light"] .features li,
html[data-theme="light"] .feat-card p,
html[data-theme="light"] .feat-list .txt p,
html[data-theme="light"] .step p,
html[data-theme="light"] .pillar p,
html[data-theme="light"] .cta-strip p,
html[data-theme="light"] .pricing-box .includes li {
  color: var(--text-dim);
}

/* ── Legal / policy / account subpages ─────────────────────────────────────
   These pages still ship dark-theme hardcodes (#d2d2d2 / #fff strong). On cream
   backgrounds that makes body copy nearly unreadable — force theme tokens. */
html[data-theme="light"] main.container h1 {
  color: var(--text);
}
html[data-theme="light"] main.container h2,
html[data-theme="light"] main.container h3 {
  color: var(--gold-bright);
}
html[data-theme="light"] main.container p,
html[data-theme="light"] main.container li,
html[data-theme="light"] main.container td,
html[data-theme="light"] main.container blockquote,
html[data-theme="light"] main.container .form-status,
html[data-theme="light"] main.container .consent-check label {
  color: var(--text);
}
html[data-theme="light"] main.container strong {
  color: var(--text);
}
html[data-theme="light"] main.container .updated,
html[data-theme="light"] header .nav a,
html[data-theme="light"] header.solid-header .nav a,
html[data-theme="light"] footer,
html[data-theme="light"] footer a {
  color: var(--text-dim);
}
html[data-theme="light"] main.container .highlight,
html[data-theme="light"] main.container .card,
html[data-theme="light"] main.container .form-card,
html[data-theme="light"] main.container blockquote {
  background: var(--panel-soft);
  border-color: var(--line);
  color: var(--text);
}
html[data-theme="light"] main.container .highlight p,
html[data-theme="light"] main.container .card p,
html[data-theme="light"] main.container .form-card p,
html[data-theme="light"] main.container .form-card label,
html[data-theme="light"] main.container label {
  color: var(--text);
}
/* Inline leftovers from the dark-only era */
html[data-theme="light"] main.container [style*="color:#d2d2d2"],
html[data-theme="light"] main.container [style*="color: #d2d2d2"] {
  color: var(--text) !important;
}
html[data-theme="light"] main.container [style*="color:#9a9a9a"],
html[data-theme="light"] main.container [style*="color: #9a9a9a"] {
  color: var(--text-dim) !important;
}
html[data-theme="light"] main.container .warn {
  background: #fef2f2;
  border-color: #fecaca;
  color: var(--text);
}
html[data-theme="dark"] main.container .form-status.error { color: #ff9b9b; }
html[data-theme="dark"] main.container .form-status.success { color: #b8ddaa; }

/* ── Compare tables: light mode colors only (desktop layout unchanged) ── */
html[data-theme="light"] .comp-card {
  background: linear-gradient(145deg, #ffffff 0%, #f7f4ee 55%, #f3efe6 100%);
  border: 1px solid rgba(166, 138, 86, 0.35);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
html[data-theme="light"] .comp-card .tbl-wrap {
  background: transparent;
}
html[data-theme="light"] .comp-card table.ctbl thead th {
  border-bottom-color: rgba(166, 138, 86, 0.28);
  color: #5c5852;
}
html[data-theme="light"] .comp-card table.ctbl thead th.drvr {
  background: linear-gradient(180deg, rgba(166, 138, 86, 0.22), rgba(166, 138, 86, 0.08));
  color: var(--gold-bright);
  border-bottom-color: var(--gold);
  box-shadow: inset 1px 0 rgba(166, 138, 86, 0.2), inset -1px 0 rgba(0, 0, 0, 0.04);
}
html[data-theme="light"] .comp-card table.ctbl thead th.feat {
  color: #6b6760;
  background: rgba(245, 242, 235, 0.85);
}
html[data-theme="light"] .comp-card table.ctbl thead th.comp {
  color: #5c5852;
  background: rgba(255, 255, 255, 0.55);
  border-right: 1px solid rgba(232, 228, 220, 0.95);
}
html[data-theme="light"] .comp-card table.ctbl tbody td {
  color: var(--text-dim);
  border-bottom-color: rgba(232, 228, 220, 0.95);
}
html[data-theme="light"] .comp-card table.ctbl tbody td.feat {
  color: var(--text);
  background: rgba(251, 249, 244, 0.9);
}
html[data-theme="light"] .comp-card table.ctbl tbody td.drvr {
  color: var(--text);
  background: linear-gradient(90deg, rgba(166, 138, 86, 0.16), rgba(166, 138, 86, 0.05));
  box-shadow: inset 1px 0 rgba(166, 138, 86, 0.22), inset -1px 0 rgba(0, 0, 0, 0.03);
}
html[data-theme="light"] .comp-card table.ctbl tbody td.comp-col {
  background: rgba(255, 255, 255, 0.45);
  border-right: 1px solid rgba(232, 228, 220, 0.9);
}
html[data-theme="light"] .comp-card table.ctbl tbody tr:nth-child(even) td {
  background-color: rgba(245, 242, 235, 0.55);
}
html[data-theme="light"] .comp-card table.ctbl tbody tr:nth-child(even) td.drvr {
  background: linear-gradient(90deg, rgba(166, 138, 86, 0.18), rgba(166, 138, 86, 0.07));
}
html[data-theme="light"] .comp-card table.ctbl tbody tr:hover td {
  background-color: rgba(166, 138, 86, 0.08);
}
html[data-theme="light"] table.ctbl tbody tr:hover {
  background: transparent;
}
html[data-theme="light"] table.ctbl tbody td {
  border-bottom-color: var(--line);
}

/* Mobile-only: competitor pill marquee “more” chevron */
.pills-rail {
  position: relative;
  margin-bottom: 32px;
}
.pills-rail .pills-wrap {
  margin-bottom: 0;
}
.pills-more {
  display: none;
}
@media (max-width: 760px) {
  .pills-more {
    display: none;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 2;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(var(--gold-rgb), 0.65);
    background: var(--bg);
    color: var(--gold-bright);
    box-shadow: -12px 0 18px var(--bg);
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    font-size: 20px;
    line-height: 1;
  }
  .pills-rail.has-more .pills-more {
    display: inline-flex;
  }
  .pills-rail.has-more .pills-wrap {
    mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 44px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 44px), transparent 100%);
  }
}