html{scroll-behavior:smooth;scrollbar-color:#0B63A8 #05080D;scrollbar-width:thin}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#05080D}
::-webkit-scrollbar-thumb{background:#0B63A8;border-radius:6px;border:2px solid #05080D}
::-webkit-scrollbar-thumb:hover{background:#1E7FDB}
body{margin:0;background:#000;color:#fff;font-family:'IBM Plex Sans',Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:#5EB1FF;text-decoration:none}a:hover{color:#fff}
*{box-sizing:border-box}
input,select,textarea,button{font-family:inherit}
input::placeholder,textarea::placeholder{color:#5F6D7B}
@keyframes phoneRing{0%,55%,100%{transform:rotate(0)}60%{transform:rotate(-16deg)}65%{transform:rotate(14deg)}70%{transform:rotate(-12deg)}75%{transform:rotate(10deg)}80%{transform:rotate(-6deg)}85%{transform:rotate(4deg)}90%{transform:rotate(0)}}
@keyframes dropSway{0%,100%{transform:translateY(0)}50%{transform:translateY(-1px) scale(1.04)}}
@keyframes dripFall{0%,35%{transform:translateY(-3px) scale(.4);opacity:0}45%{transform:translateY(0) scale(1);opacity:1}80%{transform:translateY(7px) scale(1,1.3);opacity:1}86%,100%{transform:translateY(8px) scale(0);opacity:0}}
@keyframes dripRipple{0%,80%{transform:scale(.2);opacity:0}84%{opacity:1}100%{transform:scale(1.4);opacity:0}}
@keyframes boltFlicker{0%,100%{opacity:1;filter:drop-shadow(0 0 3px rgba(94,177,255,.6))}8%{opacity:.35}10%{opacity:1;color:#fff;filter:drop-shadow(0 0 8px #BFE3FF)}13%{opacity:.5}15%{opacity:1;filter:drop-shadow(0 0 6px #5EB1FF)}52%{opacity:1}54%{opacity:.4}56%{opacity:1;color:#fff;filter:drop-shadow(0 0 9px #BFE3FF)}60%{filter:drop-shadow(0 0 3px rgba(94,177,255,.6))}}
@keyframes sparkFlash{0%,7%,17%,53%,62%,100%{opacity:0}10%,15%,56%{opacity:1}}
@keyframes selIn{0%{opacity:0;transform:translateY(6px) scale(.98);filter:brightness(1.6)}100%{opacity:1;transform:none;filter:none}}
@keyframes heroScale{from{transform:scale(1.08)}to{transform:scale(1)}}
@keyframes streak{0%{transform:translateX(-120%)}100%{transform:translateX(220%)}}
@keyframes pulse{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:1;transform:scale(1.25)}}
@keyframes marqueeL{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes marqueeR{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes sheen{0%{transform:translateX(-160%) skewX(-18deg)}55%,100%{transform:translateX(320%) skewX(-18deg)}}
@keyframes ringSpin{to{transform:rotate(360deg)}}
@keyframes textShine{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes roadDrive{0%{left:0;opacity:0}8%,92%{opacity:1}100%{left:calc(100% - 1.05em);opacity:0}}
@keyframes wordShine{0%{background-position:150% 0,0 0}55%,100%{background-position:-50% 0,0 0}}
@keyframes dashFlow{to{stroke-dashoffset:-24}}
@keyframes blipMove{0%{transform:translateX(0);opacity:0}15%,85%{opacity:1}100%{transform:translateX(72px);opacity:0}}
@keyframes rvTrace{from{stroke-dashoffset:0}to{stroke-dashoffset:-200}}
@keyframes rvPing{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.2);opacity:0}}
@keyframes rvShine{0%,70%{transform:translateX(-120%) skewX(-20deg)}100%{transform:translateX(320%) skewX(-20deg)}}
@keyframes rvGlint{0%,80%,100%{filter:drop-shadow(0 0 0 rgba(242,214,117,0));transform:scale(1)}88%{filter:drop-shadow(0 0 6px rgba(242,214,117,.95));transform:scale(1.22)}}
@keyframes rvDot{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-1.5px)}}
@keyframes rvBar{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes rvSpark{0%{opacity:0;transform:translateY(0) scale(.4)}30%{opacity:1}100%{opacity:0;transform:translateY(-26px) scale(1)}}
@keyframes pkPulse{0%,100%{box-shadow:inset 0 0 0 1.5px var(--pk),inset 0 0 14px -2px var(--pk);opacity:.75}50%{box-shadow:inset 0 0 0 2px var(--pk),inset 0 0 30px 2px var(--pk);opacity:1}}
@keyframes pkPop{0%{transform:scale(0) rotate(-45deg);opacity:0}60%{transform:scale(1.25) rotate(0);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes pkRing{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.4);opacity:0}}
@keyframes pkFlash{0%{opacity:.55}100%{opacity:0}}
@keyframes drift{0%{transform:translate(-10%,-10%)}50%{transform:translate(8%,6%)}100%{transform:translate(-10%,-10%)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
select{color-scheme:dark}
select option,select optgroup{background:#000!important;color:#fff!important}
select option:checked,select option:hover{background:#1a1a1a!important;color:#fff!important}
/* hover/focus states */
.scp0:hover{color:#fff !important;background-size:100% 1px !important;background-color:rgba(94,177,255,.08) !important;text-shadow:0 0 12px rgba(94,177,255,.8) !important}
.scp1:hover{border-color:#5EB1FF !important;box-shadow:0 0 24px rgba(94,177,255,.3) !important;color:#fff !important}
.scp2:hover{background:linear-gradient(135deg,#1E7FDB,#5EB1FF) !important;color:#fff !important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.8),inset 0 0 20px rgba(255,255,255,.2) !important}
.scp3:hover{background:#1E7FDB !important;box-shadow:0 0 0 1px rgba(94,177,255,.7),0 0 48px rgba(30,127,219,.65) !important;transform:translateY(-1px) !important}
.scp4:hover{border-color:#5EB1FF !important;background:rgba(94,177,255,.08) !important;transform:translateY(-1px) !important}
.scp5:hover{color:#FFE9A0 !important;gap:14px !important;border-color:rgba(242,214,117,.5) !important;background:rgba(242,214,117,.08) !important;box-shadow:0 0 24px rgba(242,214,117,.25) !important;text-shadow:0 0 12px rgba(242,214,117,.6) !important}
.scp6:hover{transform:translateY(-6px) !important;box-shadow:0 30px 80px -20px rgba(191,199,205,.45) !important}
.scp7:hover{border-color:#F0F2F3 !important;background:rgba(240,242,243,.12) !important}
.scp8:hover{transform:translateY(-6px) !important;box-shadow:0 30px 80px -20px rgba(216,181,74,.45) !important}
.scp9:hover{background:#1E7FDB !important;border-color:#1E7FDB !important;transform:translateY(-1px) !important}
.scpa:hover{transform:translateY(-6px) !important;box-shadow:0 30px 80px -20px rgba(169,196,240,.45) !important}
.scpb:hover{border-color:#fff !important;background:rgba(169,196,240,.12) !important}
.scpc:hover{transform:scale(1.03) !important}
.scpd:hover{color:#fff !important}
.scpe:hover{border-color:rgba(94,177,255,.6) !important;box-shadow:0 0 40px rgba(11,99,168,.35) !important}
.scpf:hover{transform:scale(1.05) !important}
.scpg:hover{background:#1E7FDB !important;transform:translate(-50%,-50%) scale(1.06) !important}
.scph:hover{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 48px rgba(94,177,255,.7) !important;transform:translateY(-1px) !important;color:#fff !important}
.scpi:hover{border-color:#5EB1FF !important;background:rgba(11,99,168,.18) !important;color:#fff !important}
.scpj:hover{transform:translateY(-2px) !important;border-color:rgba(94,177,255,.8) !important;box-shadow:0 0 0 1px rgba(94,177,255,.25) inset,0 14px 40px rgba(11,99,168,.35) !important}
.scpk:hover{border-color:rgba(94,177,255,.6) !important}
.scpl:focus{border-color:#5EB1FF !important;box-shadow:0 0 0 3px rgba(94,177,255,.18),0 0 18px rgba(94,177,255,.25) !important;background:rgba(11,99,168,.08) !important}
.scpm:hover{background:#1E7FDB !important;transform:translateY(-1px) !important}
.scpn:hover{color:#5EB1FF !important}
.scpo:hover{box-shadow:0 0 0 1px rgba(255,255,255,.8),0 0 44px rgba(94,177,255,.6) !important;color:#fff !important}
.scpp:hover{border-color:#3DDC97 !important;background:rgba(61,220,151,.16) !important;box-shadow:0 0 28px rgba(61,220,151,.35) !important;color:#fff !important}
.scpq:hover{border-color:#5EB1FF !important;background:rgba(11,99,168,.22) !important;color:#fff !important}

/* ================= production additions ================= */
[hidden]{display:none!important}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#0B63A8;color:#fff;padding:10px 14px}
.skip:focus{left:8px}
a:focus-visible,button:focus-visible,[role=button]:focus-visible{outline:2px solid #8FC8FF;outline-offset:2px}
input[type=range]:focus-visible{outline:none}
[data-x="ba"]:focus-within{outline:2px solid #8FC8FF;outline-offset:2px}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
img,video{max-width:100%}

/* header after scroll */
[data-x="hdr"].is-scrolled{background:rgba(0,0,0,.72)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom-color:rgba(94,177,255,.18)!important}

/* review marquee */
.rv-feed{display:flex;flex-direction:column;gap:14px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.rv-row{display:flex;gap:14px;width:max-content}
.rv-feed:hover .rv-row{animation-play-state:paused!important}
.rv-card{flex:0 0 auto;width:380px;max-width:82vw;padding:20px 22px;background:rgba(10,14,20,.8);border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);display:flex;flex-direction:column;gap:12px}
.rv-top{display:flex;justify-content:space-between;align-items:center}
.rv-stars{display:flex;gap:2px}
.rv-when{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;color:#8A98A6}
.rv-text{margin:0;font-size:14px;line-height:1.55;color:#C9D4DE;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rv-name{font-size:13px;font-weight:600;color:#fff}

/* booking form error */
.form-err{margin:0 18px 18px;padding:12px 14px;border:1px solid rgba(181,66,66,.6);background:rgba(181,66,66,.12);color:#FFD7D7;font-size:14px;line-height:1.5}
.form-err a{color:#fff;text-decoration:underline}

/* ---------- responsive (replaces the prototype's JS width checks) ---------- */
[data-x="gal"]{grid-template-columns:repeat(4,minmax(0,1fr))}
[data-g="0"]{grid-column:span 2;grid-row:span 2}
[data-g="1"]{grid-column:span 1;grid-row:span 1}
[data-g="2"]{grid-column:span 1;grid-row:span 2}
[data-g="3"]{grid-column:span 1;grid-row:span 1}
[data-x="about-grid"]{grid-template-columns:minmax(0,1fr) minmax(260px,400px)}
[data-x="foot-grid"]{grid-template-columns:minmax(0,1fr) minmax(0,1.7fr) minmax(0,.75fr) minmax(0,.9fr)}
[data-x="foot-span"]{grid-column:auto}
[data-x~="m-only"],[data-x="mbar"]{display:none!important}

@media (max-width:1023px){
  [data-x~="d-only"]{display:none!important}
  [data-x~="m-only"]{display:block!important}
  [data-x="mbar"]{display:grid!important}
  [data-x="gal"]{grid-template-columns:repeat(2,minmax(0,1fr))}
  [data-g="2"]{grid-column:span 1;grid-row:span 1}
  [data-g="3"]{grid-column:span 2;grid-row:span 1}
  [data-x="foot-grid"]{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  [data-x="foot-span"]{grid-column:1 / -1}
  [data-x="footer"]{padding-bottom:calc(100px + env(safe-area-inset-bottom))!important}
}
@media (max-width:899px){
  [data-x="about-grid"]{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:480px){
  .rv-card{width:300px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .rv-row{animation:none!important}
}
/* narrow phones: the sticky CALL | TEXT | BOOK bar carries booking, so the header CTA steps aside */
@media (max-width:479px){
  [data-x="hdr-cta"]{display:none!important}
  select[name="year"],select[name="make"],select[name="model"]{padding-left:10px!important;padding-right:24px!important;background-position:right 8px center!important}
}
/* phones/tablets: every service step shows its photo first, then the text */
@media (max-width:1023px){
  [data-x="st-img"]{order:1!important}
  [data-x="st-text"]{order:2!important}
}
/* package tiles: selected-state effects only on the pressed tile (display toggle restarts the pop/flash animations) */
[data-pkg][aria-pressed="false"] [data-x="pkfx"]{display:none}