/* ScanCar shared glass theme — loaded LAST on every page so the whole
   site shares one background and one surface language. Page-specific
   layout styles stay in each page's own <style>. */
:root{--glass-border:rgba(255,255,255,.10)}

body{
  background:
    radial-gradient(circle at 22% 30%,rgba(255,45,45,.14),transparent 45%),
    radial-gradient(circle at 85% 12%,rgba(90,120,255,.10),transparent 40%),
    radial-gradient(circle at 70% 85%,rgba(255,45,45,.07),transparent 45%),
    linear-gradient(180deg,#0c0d13 0%,#07070b 60%,#050508 100%);
  background-attachment:fixed;
}

header{
  background:rgba(12,13,19,.62);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}

/* Static glass surfaces: section containers stay still on hover. */
.card,.box{
  background:linear-gradient(150deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
  border:1px solid var(--glass-border);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 14px 40px rgba(0,0,0,.38),inset 0 1px 0 rgba(255,255,255,.08);
}

/* Form controls get the same glass feel */
input,select,textarea{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.12);
  color:#fff;
}
input:focus,select:focus,textarea:focus{
  border-color:var(--accent,#ff2d2d);
  box-shadow:0 0 0 3px rgba(255,45,45,.12);
}

/* Consistent action feedback across all Web pages that load the shared auth
   runtime. Async actions keep the indicator until their button is re-enabled. */
button.scancar-loading{
  position:relative;pointer-events:none;cursor:wait;
}
button.scancar-loading::before{
  content:"";display:inline-block;width:.9em;height:.9em;margin-inline-end:.55em;
  vertical-align:-.12em;border:2px solid currentColor;border-left-color:transparent;
  border-radius:50%;animation:scancar-button-spin .7s linear infinite;
}
@keyframes scancar-button-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){button.scancar-loading::before{animation-duration:1.8s}}

/* Justified prose on every page. This sheet loads last, and the selector is a
   bare element selector on purpose: any class rule a page already uses (centred
   headings, .sub, .hint, table cells, the footer bar) keeps winning, so nothing
   that is deliberately centred or right-aligned is disturbed. Short lines are
   unaffected too, because the last line of a justified block stays start-aligned. */
p,li{
  text-align:justify;
  text-justify:inter-word;
}

/* Shared footer for every page except the home page, which keeps its own
   three-column footer. Width follows --page-max so it lines up with each
   page's own content column. Per user spec: all footer text is WHITE and
   ONLY the phone numbers keep the red accent; on mobile the rows stack
   vertically, one column under the other. */
.footer-lite{
  margin-top:48px;padding:22px 20px;
  border-top:1px solid rgba(255,255,255,.09);
  background:rgba(8,8,12,.55);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  color:#fff;font-size:13px;
}
.footer-lite-inner{
  max-width:var(--page-max,1100px);margin:0 auto;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 22px;
}
.fl-brand{font-weight:800;font-size:17px;color:#fff;text-decoration:none}
.fl-brand span{color:#fff}
.fl-links{display:flex;flex-wrap:wrap;gap:6px 14px}
.fl-links a{color:#fff;text-decoration:none}
.fl-links a:hover{text-decoration:underline}
.fl-phones{display:flex;flex-wrap:wrap;gap:6px 14px}
.fl-phones a{color:var(--accent,#ff2d2d);text-decoration:none;font-variant-numeric:tabular-nums}
.fl-phones a:hover{text-decoration:underline}
.fl-copy{margin:14px auto 0;padding-top:12px;max-width:var(--page-max,1100px);
  border-top:1px solid rgba(255,255,255,.07);text-align:center;font-size:12px;color:#fff}
@media(max-width:640px){
  .footer-lite-inner{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px}
  .fl-links{flex-direction:column;align-items:center;gap:10px}
  .fl-phones{flex-direction:column;align-items:center;gap:8px}
}