/*
 TunLab / Performance Premium v1
 Self-contained visual layer. Does not change application behaviour.
 Centrally adjustable design tokens; scoped to TunLab page.
*/
:root {
  --tl-page:#0b121e;
  --tl-page-alt:#101b2b;
  --tl-panel:#1b293b;
  --tl-panel-hi:#23374c;
  --tl-field:#111f30;
  --tl-edge:rgba(154,186,222,.21);
  --tl-edge-active:rgba(196,158,255,.64);
  --tl-text:#eff4fb;
  --tl-secondary:#b0bfd0;
  --tl-muted:#8b9db2;
  --tl-purple:#a77bff;
  --tl-lime:#c9ff3d;
  --tl-shadow:0 20px 56px rgba(0,3,13,.38);
  color-scheme:dark;
}

html { background:var(--tl-page); }
body { background:var(--tl-page)!important; color:var(--tl-text)!important; }
body > div, main, #root { color:var(--tl-text); }

/* Unified floating navigation, without a separate white strip. */
header > div:first-child {
  background:linear-gradient(125deg,rgba(27,38,57,.93),rgba(13,23,39,.91))!important;
  border-color:rgba(173,199,232,.22)!important;
  box-shadow:0 16px 46px #0008,inset 0 1px #ffffff14!important;
  -webkit-backdrop-filter:blur(22px) saturate(126%);
  backdrop-filter:blur(22px) saturate(126%);
}
header > div:first-child [class*="text-ink"],
header > div:first-child [class*="text-black/"],
header > div:first-child a,
header > div:first-child button { color:var(--tl-text)!important; }
header > div:first-child nav a { color:var(--tl-secondary)!important; }
header > div:first-child nav a:hover,
header > div:first-child nav a:focus-visible { color:var(--tl-text)!important; }
header > div:first-child .text-violet,
header > div:first-child [class*="text-violet"] { color:var(--tl-purple)!important; }
header > div:first-child > a[href="#calculate"].button,
header > div:first-child .button,
header > div:first-child button.bg-ink {
  background:var(--tl-lime)!important;
  color:#111925!important;
  border-color:transparent!important;
  box-shadow:0 7px 24px rgba(154,213,43,.15);
}
header .mobile-menu {
  background:linear-gradient(160deg,#1c2d42,#111e30)!important;
  border-color:var(--tl-edge)!important;
  box-shadow:var(--tl-shadow)!important;
}
header .mobile-menu a,
header .mobile-menu [class*="text-ink"] { color:var(--tl-text)!important; }

/* Hero: keep original composition, unify ambient glow. */
#top {
  background-color:#0c111b!important;
  background-image:radial-gradient(ellipse at 78% 26%,#2f225958,transparent 45%),
    radial-gradient(ellipse at 10% 90%,#1b3a4259,transparent 54%)!important;
}
#top .text-white { color:#f3f6fc; }

/* Performance metrics strip: restrained rather than a flat neon band. */
main > section.bg-acid {
  background:linear-gradient(100deg,#172536,#273c37 50%,#1a2939)!important;
  border-color:rgba(200,255,61,.17)!important;
  box-shadow:inset 0 1px rgba(213,250,178,.09),inset 0 -1px rgba(213,250,178,.08);
  color:var(--tl-text)!important;
}
main > section.bg-acid [class*="text-ink"],
main > section.bg-acid [class*="text-black/"] { color:var(--tl-text)!important; }
main > section.bg-acid strong,
main > section.bg-acid [class*="font-extrabold"] { color:var(--tl-lime)!important; }

/* Section backgrounds: no abrupt cream/white slabs. */
#benefits {
  color:var(--tl-text)!important;
  background:radial-gradient(ellipse at 18% 0%,#24334b 0%,transparent 47%),
    linear-gradient(180deg,#0e1928 0%,#101b2c 100%)!important;
}
#contacts {
  color:var(--tl-text)!important;
  background:radial-gradient(ellipse at 89% 9%,#2a224756,transparent 51%),
    linear-gradient(180deg,#0f1b2a,#111d2d)!important;
}
#faq {
  color:var(--tl-text)!important;
  background:linear-gradient(180deg,#111d2d 0%,#0b1421 100%)!important;
}
main > section.bg-paper:not(#benefits):not(#contacts):not(#faq) {
  background:linear-gradient(180deg,#0d1725,#111b2a)!important;
  color:var(--tl-text)!important;
}
footer {
  background:#0b1421!important;
  color:var(--tl-text)!important;
  border-color:var(--tl-edge)!important;
}

/* Common typography on previously light sections. */
#benefits :is(h1,h2,h3,h4),
#contacts :is(h1,h2,h3,h4),
#faq :is(h1,h2,h3,h4),
main > section.bg-paper :is(h1,h2,h3,h4),
footer [class*="text-ink"] { color:var(--tl-text)!important; }
#benefits [class*="text-ink"],
#contacts [class*="text-ink"],
#faq [class*="text-ink"],
main > section.bg-paper [class*="text-ink"] { color:var(--tl-text)!important; }
#benefits [class*="text-black/"],
#contacts [class*="text-black/"],
#faq [class*="text-black/"],
main > section.bg-paper [class*="text-black/"],
footer [class*="text-black/"] { color:var(--tl-secondary)!important; }
#benefits p, #contacts p, #faq p { color:var(--tl-secondary); }
#benefits [class*="text-violet"],
#contacts [class*="text-violet"],
#faq [class*="text-violet"] { color:var(--tl-purple)!important; }

/* Illustration-led benefit cards with dark glass, subtle accent edge and legible lower text. */
#benefits .benefit-card {
  background:linear-gradient(155deg,#2a3d53 0%,#1b2a3d 48%,#132134 100%)!important;
  border:1px solid var(--tl-edge)!important;
  box-shadow:0 16px 48px #0106114d,inset 0 1px #ffffff0e!important;
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease;
}
#benefits .benefit-card:hover {
  transform:translateY(-4px);
  border-color:rgba(185,154,255,.55)!important;
  box-shadow:0 24px 56px #01061183,0 0 28px #a77bff18!important;
}
#benefits .benefit-card .benefit-image {
  opacity:.42!important;
  filter:saturate(.85) contrast(1.11);
}
#benefits .benefit-card :is(h3,p) { position:relative;z-index:1; }
#benefits .benefit-card h3 { color:var(--tl-text)!important; }
#benefits .benefit-card p { color:var(--tl-secondary)!important; }
#benefits .benefit-card span.bg-white {
  background:rgba(10,22,35,.85)!important;
  color:#e3edfa!important;
  border-color:rgba(212,228,245,.17)!important;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
}
#benefits .benefit-card [class*="bg-violet"] {
  background:linear-gradient(150deg,#9361f1,#6946b5)!important;
  box-shadow:0 10px 20px #2d165c80;
}

/* Service cards retain their strong dark identity; soften borders. */
#services article {
  border-color:var(--tl-edge)!important;
  background-color:rgba(32,45,62,.58)!important;
  box-shadow:inset 0 1px #ffffff0a;
}
#services article:hover {
  border-color:rgba(189,151,252,.50)!important;
  box-shadow:var(--tl-shadow);
}

/* Quote + calculator: replace giant saturated violet and cream form. */
#calculate {
  background:radial-gradient(ellipse at 12% 15%,#4332688a 0%,transparent 40%),
    radial-gradient(ellipse at 96% 68%,#1b485060,transparent 42%),
    linear-gradient(135deg,#171d32 0%,#141c2d 55%,#111928 100%)!important;
  color:var(--tl-text)!important;
}
#calculate form {
  background:linear-gradient(148deg,#233449,#17263b 58%,#152337)!important;
  border:1px solid var(--tl-edge)!important;
  color:var(--tl-text)!important;
  box-shadow:0 26px 70px #02081691,inset 0 1px #ffffff0c!important;
}
#calculate form label,
#calculate form legend,
#calculate form h3,
#calculate form h4 { color:var(--tl-text); }
#calculate form [class*="text-ink"] { color:var(--tl-text)!important; }
#calculate form [class*="text-black/"] { color:var(--tl-secondary)!important; }
#calculate form [class*="text-violet"] { color:var(--tl-purple)!important; }
#calculate form button.field,
#calculate form input.field,
#calculate form textarea.field,
#calculate form select,
#calculate form input:not([type="checkbox"]):not([type="radio"]):not(.sr-only) {
  background:var(--tl-field)!important;
  color:var(--tl-text)!important;
  border:1px solid rgba(159,185,221,.32)!important;
  box-shadow:inset 0 1px 2px #0005!important;
}
#calculate form button.field:disabled,
#calculate form input:disabled { color:#7889a3!important;opacity:.78; }
#calculate form input::placeholder,
#calculate form textarea::placeholder { color:#8ea0b8!important;opacity:1; }
#calculate form :is(button.field,input.field,textarea.field):focus-visible {
  outline:2px solid var(--tl-purple)!important;
  outline-offset:2px;
  border-color:var(--tl-purple)!important;
}
#calculate form fieldset > div,
#calculate form fieldset > section {
  border-color:var(--tl-edge)!important;
}
#calculate form .service-option {
  background:#162537!important;
  color:#d7e3f1!important;
  border:1px solid rgba(155,186,215,.25)!important;
  transition:background .2s,border-color .2s;
}
#calculate form .service-option:hover {
  background:#22354b!important;
  border-color:rgba(191,160,253,.48)!important;
}
#calculate form .service-option-checked {
  background:linear-gradient(100deg,#383052,#232c48)!important;
  border-color:var(--tl-edge-active)!important;
  color:#faf7ff!important;
}
#calculate form .service-option [class*="text-black/"] { color:#c9d5e4!important; }
#calculate form [class*="bg-white"]:not(.service-option),
#calculate form [class*="bg-paper"] {
  background:#18293e!important;
  color:var(--tl-text)!important;
  border-color:var(--tl-edge)!important;
}
#calculate form [class*="bg-black/"] {
  background:rgba(4,13,26,.42)!important;
  border-color:var(--tl-edge)!important;
}
#calculate form [class*="border-black/"] { border-color:var(--tl-edge)!important; }
#calculate form .button-dark {
  background:var(--tl-lime)!important;
  color:#142015!important;
  border-color:transparent!important;
  box-shadow:0 9px 22px #a1e24429;
}
#calculate form .button-dark:hover { filter:brightness(1.05); }
#calculate form :is([role="listbox"],[role="option"]),
#calculate form [data-radix-popper-content-wrapper] {
  background-color:#162639!important;
  color:var(--tl-text)!important;
  border-color:var(--tl-edge)!important;
}
#calculate form :is([role="option"],[cmdk-item]):hover {
  background-color:#293d59!important;
}

/* Contact cards and address strip. */
#contacts .contact-card {
  background:linear-gradient(160deg,#24374b,#18283c 57%,#152437)!important;
  color:var(--tl-text)!important;
  border:1px solid var(--tl-edge)!important;
  box-shadow:inset 0 1px #ffffff0d,0 16px 37px #0003;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
#contacts .contact-card:hover {
  transform:translateY(-3px);
  border-color:rgba(184,154,255,.55)!important;
  box-shadow:var(--tl-shadow);
}
#contacts .contact-card :is(h3,strong) { color:var(--tl-text)!important; }
#contacts .contact-card p,
#contacts .contact-card span[class*="text-black"] { color:var(--tl-secondary)!important; }
#contacts [class*="bg-white"]:not(.contact-card) {
  background:linear-gradient(130deg,#223449,#162538)!important;
  color:var(--tl-text)!important;
  border-color:var(--tl-edge)!important;
}
#contacts [class*="border-black/"] { border-color:var(--tl-edge)!important; }

/* Questions: retain accessible accordion states with readable contrast. */
#faq [class*="bg-white"],
#faq [class*="bg-paper"] {
  background:linear-gradient(160deg,#213147,#16263a)!important;
  color:var(--tl-text)!important;
  border-color:var(--tl-edge)!important;
}
#faq [class*="border-black/"] { border-color:var(--tl-edge)!important; }
#faq :is(button,summary) {
  color:var(--tl-text)!important;
}
#faq :is(button,summary):focus-visible {
  outline:2px solid var(--tl-purple)!important;
  outline-offset:2px;
}
footer [class*="border-black/"] { border-color:var(--tl-edge)!important; }

/* Weather chat symbol: premium metallic finish without changing its behavior. */
#tlw-root .tlw-button {
  background:radial-gradient(ellipse at 30% 18%,#ffffff32,transparent 50%),
    linear-gradient(151deg,#536a84,#263a53 43%,#111c2e)!important;
  border-color:rgba(169,195,222,.65)!important;
  box-shadow:0 16px 37px #0009,inset 0 1px #ffffff30!important;
}
#tlw-root .tlw-button svg {
  filter:drop-shadow(0 3px 3px #0009);
}
#tlw-root .tlw-cloud {
  background:linear-gradient(160deg,#dce7f3,#aec5dc 57%,#7d9bb6)!important;
  box-shadow:0 12px 20px #050b1980,inset 0 2px 3px #ffffff94!important;
}
#tlw-root .tlw-sun {
  box-shadow:0 0 17px #ffd57191,0 0 34px #efc05948!important;
}
#tlw-root .tlw-rain {
  filter:drop-shadow(0 0 4px #a3dafa48);
}

/* Avoid mobile viewport overflow, honor reduced motion. */
@media(max-width:640px) {
  header > div:first-child {
    border-radius:18px!important;
  }
  #benefits .benefit-card { min-height:345px; }
  #calculate form { box-shadow:0 14px 38px #01061170!important; }
  #tlw-root .tlw-unit { width:100px;height:153px; }
}
@media(prefers-reduced-motion:reduce) {
  #benefits .benefit-card,
  #contacts .contact-card { transition:none!important;transform:none!important; }
}

/* Dropdown accessibility: the floating weather control must not cover car choices. */
#calculate form [role="option"]:focus-visible,
#calculate form [role="option"][aria-selected="true"] {
  outline:2px solid var(--tl-purple)!important;
  outline-offset:-2px;
  background:#2a3d58!important;
}
@media(max-width:640px) {
  body:has(#calculate [role="listbox"]) #tlw-root .tlw-unit {
    opacity:.05;
    pointer-events:none;
  }
  body:has(#calculate [role="listbox"]) #tlw-root .tlw-unit * {
    animation-play-state:paused!important;
  }
}