:root {
  --bg: #050b16;
  --text: #eef4fb;
  --muted: #a3b6ca;
  --line: rgba(255, 255, 255, .09);
  --line-hi: rgba(76, 195, 255, .45);
  --glass: rgba(9, 19, 36, .86);
  --blue: #1f6fe0;
  --blue-hi: #4cc3ff;
  --blue-lo: #1450a8;
  --gold: #f2b705;
  --radius: 18px;
  --display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 400 1rem/1.65 var(--body);
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3 { margin: 0 0 .5em; line-height: 1.06; }
h2 { font: 700 clamp(2.2rem, 5.4vw, 3.6rem)/1.04 var(--serif); letter-spacing: -.02em; color: #fff; }
h2 em, h1 em { font-family: var(--serif); font-style: italic; font-weight: 500; color: var(--blue-hi); }
h3 { font: 700 1.45rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .04em; color: #fff; }
p { margin: 0 0 1rem; }
picture { display: contents; }

.wrap { width: min(1160px, 100% - 48px); margin-inline: auto; }
.eyebrow { font: 600 .78rem/1 var(--body); letter-spacing: .24em; text-transform: uppercase; color: var(--blue-hi); margin-bottom: 1.1rem; display: flex; align-items: center; gap: 12px; }
.eyebrow::before { content: ""; width: 32px; height: 1px; background: var(--blue-hi); box-shadow: 0 0 8px var(--blue-hi); }
.section__lede { max-width: 560px; color: var(--muted); font-size: 1.08rem; text-shadow: 0 1px 14px var(--bg); }
.skip { position: absolute; left: -999px; top: 8px; background: var(--blue-hi); color: #000; padding: 8px 14px; z-index: 100; border-radius: 6px; }
.skip:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--blue-hi); outline-offset: 3px; }

/* ---------- Background layers ---------- */
/* Static: deep navy body, a blue glow behind the hero (.hero::before) and a faint dot grid */
.dots { position: fixed; inset: 0; z-index: -3; pointer-events: none; background-image: radial-gradient(rgba(255, 255, 255, .11) 1px, transparent 1.4px); background-size: 26px 26px; -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 70%); mask-image: linear-gradient(90deg, #000 0%, transparent 70%); }

/* Line-art car watermark. JS changes only transform and opacity:
   .car__wipe / .car__wipe-in slide in opposite directions to reveal the outline left to right,
   .car__shine slides across a mask shaped like the body, .car__beam tilts and fades. */
.car { position: fixed; inset: 0; z-index: -1; pointer-events: none; display: grid; place-items: center; opacity: .24; }
.car__stage { position: relative; width: min(1180px, 90vw); aspect-ratio: 3 / 1; transform: translateY(8vh); }
.car__stage > * { position: absolute; inset: 0; width: 100%; height: 100%; }
.car__wipe { overflow: hidden; will-change: transform; }
.car__wipe-in { position: absolute; inset: 0; will-change: transform; }
.car__lines { display: block; width: 100%; height: 100%; overflow: visible; stroke: #9fdcff; stroke-width: 2.2; }
.car__shadow { fill: rgba(76, 195, 255, .18); stroke: none; filter: blur(6px); }
.car__edge { position: absolute; top: 8%; bottom: 4%; right: 0; width: 2px; opacity: 0; background: linear-gradient(transparent, #d8f3ff 30%, #d8f3ff 70%, transparent); box-shadow: 0 0 14px 3px rgba(76, 195, 255, .7); }
.car__beam { overflow: visible; opacity: 0; mix-blend-mode: screen; transform-origin: 94.6% 56.5%; will-change: transform, opacity; }
.car__body {
  overflow: hidden; mix-blend-mode: screen;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'%3E%3Cpath d='M70 270C60 240 70 215 110 205L250 190C330 180 380 120 470 95C560 72 700 72 780 100C830 118 880 160 930 180L1080 200C1130 206 1150 225 1150 255L1145 285C1140 300 1120 305 1100 305L970 305A70 70 0 0 0 830 305L360 305A70 70 0 0 0 220 305L110 305C85 305 72 292 70 270Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'%3E%3Cpath d='M70 270C60 240 70 215 110 205L250 190C330 180 380 120 470 95C560 72 700 72 780 100C830 118 880 160 930 180L1080 200C1130 206 1150 225 1150 255L1145 285C1140 300 1120 305 1100 305L970 305A70 70 0 0 0 830 305L360 305A70 70 0 0 0 220 305L110 305C85 305 72 292 70 270Z'/%3E%3C/svg%3E") 0 0 / 100% 100% no-repeat;
}
.car__shine { position: absolute; top: 0; bottom: 0; left: 0; width: 12%; opacity: 0; background: linear-gradient(90deg, rgba(191, 233, 255, 0), rgba(255, 255, 255, .95), rgba(191, 233, 255, 0)); will-change: transform, opacity; }
/* Start state matches the script's first frame, so the full outline never flashes before JS runs */
.js .car__wipe { transform: translate3d(-94%, 0, 0); }
.js .car__wipe-in { transform: translate3d(94%, 0, 0); }
/* Reduced motion (or no JS): fully drawn, still outline */
.car--static .car__wipe, .car--static .car__wipe-in { transform: none; }
.car--static .car__shine, .car--static .car__edge { display: none; }
.car--static .car__beam { opacity: .35; }

/* ---------- Demo banner ---------- */
.demo { position: relative; z-index: 60; background: var(--gold); color: #2b2200; font: 600 .82rem/1.35 var(--body); text-align: center; padding: 8px 16px; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; text-align: center; text-decoration: none; cursor: pointer;
  font: 700 1.02rem/1 var(--display); text-transform: uppercase; letter-spacing: .1em;
  padding: 17px 30px; border: 1.5px solid transparent; border-radius: 999px;
  background: linear-gradient(135deg, var(--blue-hi), var(--blue) 55%, var(--blue-lo));
  color: #fff; transition: transform .25s var(--ease), box-shadow .3s, background-color .2s, border-color .2s;
}
.btn--ghost { background: rgba(9, 19, 36, .72); border-color: rgba(255, 255, 255, .3); }
.btn--sm { padding: 12px 20px; font-size: .92rem; }
.btn--block { width: 100%; }
.btn[disabled] { opacity: .6; cursor: progress; }
@media (hover: hover) {
  .btn:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(31, 111, 224, .45), 0 0 0 1px rgba(76, 195, 255, .5); }
  .btn--ghost:hover { border-color: var(--blue-hi); box-shadow: 0 0 22px rgba(76, 195, 255, .25); }
}

/* ---------- Nav ---------- */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(5, 11, 22, .82); border-bottom: 1px solid transparent; transition: background .3s, border-color .3s; }
.nav.scrolled, .nav.menu-open { background: rgba(5, 11, 22, .95); border-bottom-color: var(--line); }
.nav__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 76px; }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.brand img { width: 48px; height: 48px; border-radius: 50%; flex: none; box-shadow: 0 0 0 1px rgba(255, 255, 255, .16), 0 0 18px rgba(76, 195, 255, .25); }
.brand__name { font: 800 1.4rem/1 var(--display); text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.brand__name b { color: var(--blue-hi); }
.nav__links { display: flex; align-items: center; gap: 28px; }
.nav__links a:not(.btn) { text-decoration: none; font-size: .74rem; font-weight: 500; letter-spacing: .2em; text-transform: uppercase; color: #cddbea; transition: color .15s; }
.nav__links a:not(.btn):hover { color: var(--blue-hi); }
.nav__toggle { display: none; width: 44px; height: 44px; background: none; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; padding: 0; flex-direction: column; justify-content: center; align-items: center; gap: 5px; }
.nav__toggle span { width: 20px; height: 2px; background: var(--blue-hi); transition: transform .2s, opacity .2s; }
.nav__toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav__toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav__toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: calc(100svh - 110px); display: flex; align-items: center; padding: 44px 0 112px; }
/* Static blue glow behind the hero (sits below the car layer) */
.hero::before { content: ""; position: absolute; inset: -110px 0 0; z-index: -2; pointer-events: none;
  background: radial-gradient(60% 60% at 28% 42%, rgba(31, 111, 224, .30), transparent 70%), radial-gradient(45% 45% at 82% 30%, rgba(76, 195, 255, .14), transparent 70%); }
.pill { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 24px; padding: 9px 16px; border: 1px solid rgba(255, 255, 255, .18); border-radius: 999px; background: rgba(9, 19, 36, .78); color: #d7e8f8; font: 600 .72rem/1 var(--body); letter-spacing: .18em; text-transform: uppercase; }
.pill i { width: 7px; height: 7px; border-radius: 50%; background: var(--blue-hi); box-shadow: 0 0 10px var(--blue-hi); }
.hero h1 { font: 700 clamp(3rem, 8vw, 6.2rem)/.98 var(--serif); letter-spacing: -.03em; color: #fff; max-width: 13ch; margin-bottom: .32em; }
.hero h1 span, .hero h1 em { display: block; }
.hero h1 em { padding-bottom: .04em; }
.hero__line3 { font: 700 clamp(1.5rem, 3.4vw, 2.6rem)/1.15 var(--display); text-transform: uppercase; letter-spacing: .06em; color: #cfe3f5; margin-top: .45em; }
.lede { max-width: 540px; font-size: 1.16rem; color: #c3d3e4; text-shadow: 0 1px 14px var(--bg); }
.hero__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 26px; }
.cta__now { display: none; }
.trust { list-style: none; display: flex; flex-wrap: wrap; gap: 14px 44px; margin: 32px 0 0; padding: 0; color: var(--muted); font-size: .9rem; }
.trust b { display: block; font: 700 2.1rem/1 var(--display); letter-spacing: .02em; color: #fff; margin-bottom: 4px; }
.trust b span { color: var(--gold); }
.hero__strip { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 18px 0; border-top: 1px solid var(--line); background: rgba(5, 11, 22, .84); font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; color: #b9cbde; }
.hero__strip .wrap { display: block; }

@keyframes rise { from { opacity: 0; transform: translate3d(0, 28px, 0); } }
.intro { animation: rise 1s var(--ease) var(--d, 0s) both; }

/* Scroll reveals (JS adds .in when an item enters the viewport) */
.js .reveal { opacity: 0; transform: translate3d(0, 16px, 0); transition: opacity .4s var(--ease) var(--d, 0s), transform .4s var(--ease) var(--d, 0s); }
.js .reveal.now { transition: none; }  /* revealed after a jump: show at once */
.js .reveal.in { opacity: 1; transform: none; }

/* ---------- Sections ---------- */
.section { padding: 120px 0; }

/* Glass surfaces shared by cards, form, steps and reviews */
.svc, .score, .review, .form, .steps li, .hours {
  background: var(--glass); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 24px 50px -30px rgba(0, 0, 0, .8);
}

/* Services */
.services { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 40px; }
.svc { position: relative; display: flex; flex-direction: column; padding: 24px 22px 22px; margin: 0; overflow: hidden; transition: transform .35s var(--ease), border-color .35s, box-shadow .35s; }
.svc::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, var(--blue-hi), transparent); opacity: .55; }
.svc__num { font: 600 .74rem/1 var(--body); letter-spacing: .24em; text-transform: uppercase; color: var(--blue-hi); margin-bottom: 16px; }
.svc h3 { font-size: 1.25rem; margin-bottom: .4em; }
.svc p { color: var(--muted); margin: 0; font-size: .93rem; line-height: 1.55; }
.svc-cta { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: 16px; padding: 18px 18px 18px 26px; border: 1px solid rgba(76, 195, 255, .35); border-radius: var(--radius); background: linear-gradient(110deg, rgba(31, 111, 224, .38), rgba(9, 19, 36, .9) 70%); }
.svc-cta p { margin: 0; color: #cfe3f5; }
.svc-cta b { color: #fff; }
.svc-cta .btn { flex: none; }
@media (hover: hover) {
  .svc:hover { transform: translateY(-6px); border-color: var(--line-hi); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 30px 60px -30px rgba(31, 111, 224, .55); }
}

/* Gallery: bento grid, best photo largest */
.gallery { list-style: none; margin: 44px 0 0; padding: 0; display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 260px 260px; gap: 16px; }
.shot--hero { grid-column: 1; grid-row: 1 / span 2; }
.shot--a { grid-column: 2; grid-row: 1; }
.shot--b { grid-column: 2; grid-row: 2; }
.shot--tall { grid-column: 3; grid-row: 1 / span 2; }
.shot button { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: #0a1424; cursor: zoom-in; transition: border-color .35s, box-shadow .35s; }
.shot img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.shot__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 48px 20px 16px; text-align: left; font: 700 1.1rem/1.15 var(--display); text-transform: uppercase; letter-spacing: .08em; color: #fff; background: linear-gradient(transparent, rgba(2, 6, 14, .88)); }
.shot__cap small { display: block; font: 500 .72rem/1.4 var(--body); letter-spacing: .18em; color: var(--blue-hi); margin-top: 4px; }
@media (hover: hover) {
  .shot button:hover { border-color: var(--line-hi); box-shadow: 0 24px 50px -24px rgba(31, 111, 224, .6); }
  .shot button:hover img { transform: scale(1.05); }
}

/* Lightbox */
.lightbox { border: 0; padding: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100vw; height: 100vh; overflow: hidden; color: #fff; }
.lightbox[open] { display: grid; place-items: center; }
.lightbox::backdrop { background: rgba(2, 6, 12, .96); }
.lightbox img { max-width: min(92vw, 1400px); max-height: 80vh; border-radius: 12px; box-shadow: 0 30px 80px rgba(0, 0, 0, .6); }
.lightbox__cap { position: absolute; left: 0; right: 0; bottom: 4vh; margin: 0; text-align: center; font: 600 .8rem/1.4 var(--body); letter-spacing: .14em; text-transform: uppercase; color: #cfe3f5; padding: 0 70px; }
.lightbox__btn { position: absolute; width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .25); background: rgba(9, 19, 36, .7); color: #fff; font-size: 2rem; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.lightbox__btn:hover { border-color: var(--blue-hi); }
.lightbox__close { top: 18px; right: 18px; }
.lightbox__prev { left: 18px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 18px; top: 50%; transform: translateY(-50%); }

/* Pickup */
.pickup { display: grid; grid-template-columns: 1fr 1.15fr; gap: 56px; align-items: center; }
.pickup__intro .btn { margin-top: 12px; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; counter-reset: s; }
.steps li { counter-increment: s; padding: 26px 24px; color: var(--muted); font-size: .95rem; }
.steps li::before { content: "0" counter(s); display: block; font: 700 2.4rem/1 var(--display); color: transparent; -webkit-text-stroke: 1px var(--blue-hi); margin-bottom: 16px; }
.steps b { display: block; font: 700 1.3rem/1.1 var(--display); text-transform: uppercase; letter-spacing: .04em; color: #fff; margin-bottom: 6px; }

/* Reviews */
.reviews { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 18px; margin-top: 44px; }
.score { padding: 34px 30px; text-align: left; background: linear-gradient(150deg, rgba(31, 111, 224, .35), rgba(9, 19, 36, .9) 75%); }
.score__num { font: 700 5rem/1 var(--serif); color: #fff; margin: 0 0 6px; letter-spacing: -.02em; }
.stars { color: var(--gold); letter-spacing: .2em; font-size: 1.2rem; margin: 0 0 8px; }
.score__count { color: #cfe3f5; margin-bottom: 22px; }
.review { margin: 0; padding: 30px 28px; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
.review blockquote { margin: 0; font: italic 500 1.2rem/1.45 var(--serif); color: var(--text); }
.review figcaption { font-size: .85rem; color: var(--muted); letter-spacing: .06em; }
.placeholder { border-style: dashed; border-color: rgba(242, 183, 5, .45); }
.placeholder blockquote { color: #e8d48f; }

/* Contact + form */
.contact { display: grid; grid-template-columns: 1fr 1.05fr; gap: 56px; align-items: start; }
.info { list-style: none; padding: 0; margin: 28px 0 28px; display: grid; gap: 18px; }
.info span { display: block; font-size: .72rem; letter-spacing: .22em; text-transform: uppercase; color: var(--blue-hi); margin-bottom: 2px; }
.info a, .info address { font-style: normal; font-size: 1.3rem; text-decoration: none; color: #fff; }
.info a:hover { color: var(--blue-hi); }
.hours { padding: 24px 26px; max-width: 420px; }
.hours h3 { font-size: 1.1rem; margin-bottom: 10px; }
.hours dl { margin: 0; }
.hours dl div { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); color: #d6e3f1; }
.hours dl div:last-child { border-bottom: 0; }
.hours dt, .hours dd { margin: 0; }
.form { padding: 36px 32px; }
.form h3 { margin-bottom: 22px; }
.row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.field { margin-bottom: 16px; min-width: 0; }
label { display: block; font-size: .78rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 7px; color: var(--muted); }
input, select, textarea {
  width: 100%; font: inherit; font-size: 1rem; color: var(--text);
  background: rgba(2, 8, 18, .6); border: 1px solid rgba(255, 255, 255, .14); border-radius: 12px; padding: 14px 15px;
  transition: border-color .2s, box-shadow .2s;
}
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--blue-hi) 50%), linear-gradient(135deg, var(--blue-hi) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; }
select option { background: #0b1626; }
input::placeholder, textarea::placeholder { color: #6f849b; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--blue-hi); box-shadow: 0 0 0 3px rgba(76, 195, 255, .2); }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: #ff7a70; }
textarea { resize: vertical; }
.hp { position: absolute; left: -9999px; opacity: 0; height: 0; width: 0; }
.form__status { margin: 14px 0 0; min-height: 1.5em; font-size: .95rem; }
.form__status.ok { color: #7bd88f; }
.form__status.err { color: #ff9a90; }

.map { position: relative; margin-top: 56px; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--line); height: 360px; background: #0a1424; }
.map iframe { display: block; width: 100%; height: 100%; border: 0; filter: invert(.9) hue-rotate(180deg) saturate(.7) brightness(.95); }
.map__dir { position: absolute; left: 16px; bottom: 16px; }

/* Footer */
.footer { background: rgba(2, 6, 12, .96); border-top: 1px solid var(--line); padding: 48px 0; }
.footer__inner { display: grid; grid-template-columns: auto 1fr; gap: 24px 40px; align-items: center; }
.footer .brand img { width: 64px; height: 64px; }
.footer__info { display: grid; gap: 4px; justify-items: end; text-align: right; color: var(--muted); font-size: .95rem; }
.footer__info a, .footer__info address { font-style: normal; text-decoration: none; }
.footer__info a { color: var(--blue-hi); font-weight: 600; font-size: 1.05rem; }
.footer__copy { grid-column: 1 / -1; margin: 0; color: #7f93a9; font-size: .85rem; border-top: 1px solid var(--line); padding-top: 20px; }

/* Sticky Call/Text bar (phones) */
.mobilebar { display: none; }

/* ---------- Tablet ---------- */
@media (max-width: 960px) {
  .section { padding: 96px 0; }
  .services { grid-template-columns: repeat(3, 1fr); }
  .reviews { grid-template-columns: 1fr 1fr; }
  .score { grid-column: 1 / -1; }
  .pickup, .contact { grid-template-columns: 1fr; gap: 36px; }
  .gallery { grid-template-columns: 1fr 1fr; grid-template-rows: 380px 220px 220px; }
  .shot--hero { grid-column: 1 / -1; grid-row: 1; }
  .shot--a { grid-column: 1; grid-row: 2; }
  .shot--b { grid-column: 1; grid-row: 3; }
  .shot--tall { grid-column: 2; grid-row: 2 / span 2; }

  .nav__toggle { display: flex; }
  .nav__links {
    position: absolute; top: 76px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0;
    background: rgba(5, 11, 22, .97); border-bottom: 1px solid var(--line); padding: 8px 24px 22px;
    display: none;
  }
  .nav__links.open { display: flex; }
  .nav__links a:not(.btn) { padding: 15px 4px; font-size: 1rem; border-bottom: 1px solid var(--line); }
  .nav__call { margin-top: 16px; }
}

/* ---------- Phone ---------- */
@media (max-width: 700px) {
  body { padding-bottom: 78px; }
  .wrap { width: calc(100% - 32px); }
  .section { padding: 64px 0; }
  .nav__inner { height: 68px; }
  .nav__links { top: 68px; padding: 8px 16px 20px; }
  .brand img { width: 42px; height: 42px; }
  .brand__name { font-size: 1.2rem; }
  .hero { min-height: auto; padding: 28px 0 104px; }
  .hero h1 { font-size: clamp(2.7rem, 13vw, 3.6rem); }
  .hero__line3 { margin-top: .35em; }
  .lede { font-size: 1rem; }
  .pill { font-size: .6rem; letter-spacing: .07em; padding: 8px 12px; gap: 8px; margin-bottom: 18px; white-space: nowrap; }
  .hero__cta { margin-top: 22px; gap: 10px; }
  .hero__cta .btn { flex: 1 1 0; padding: 16px 12px; }
  .cta__num { display: none; }
  .cta__now { display: inline; }
  .trust { gap: 12px 28px; margin-top: 24px; }
  .trust b { font-size: 1.75rem; }
  .hero__strip { font-size: .64rem; letter-spacing: .1em; padding: 14px 0; }
  .services { grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 28px; }
  .svc { padding: 16px 14px 16px; }
  .svc:last-child { grid-column: 1 / -1; }
  .svc__num { margin-bottom: 10px; font-size: .68rem; }
  .svc h3 { font-size: 1.05rem; }
  .svc p { font-size: .84rem; line-height: 1.45; }
  .svc-cta { flex-direction: column; align-items: stretch; text-align: center; padding: 16px; margin-top: 10px; font-size: .95rem; }
  .reviews, .steps { grid-template-columns: 1fr; }
  .gallery { gap: 10px; grid-template-rows: 260px 170px 170px; }
  .shot__cap { font-size: .95rem; padding: 34px 14px 12px; }
  .contact { gap: 28px; }
  .info { grid-template-columns: 1fr 1fr; gap: 12px; margin: 20px 0; }
  .info a, .info address { font-size: 1.02rem; }
  .hours { padding: 16px 18px; max-width: none; }
  .hours h3 { margin-bottom: 4px; }
  .hours dl div { padding: 7px 0; font-size: .93rem; }
  .row { gap: 10px; }
  .form { padding: 20px 18px; }
  .form h3 { margin-bottom: 14px; }
  .field { margin-bottom: 12px; }
  input, select, textarea { padding: 12px 13px; }
  .score__num { font-size: 4rem; }
  .map { height: 220px; margin-top: 28px; }
  .footer__inner { grid-template-columns: 1fr; }
  .footer__info { justify-items: start; text-align: left; }
  .lightbox__prev, .lightbox__next { top: auto; bottom: 3vh; transform: none; }
  .lightbox__cap { bottom: calc(3vh + 14px); }

  /* Car watermark: smaller and fainter so it doesn't crowd the phone layout */
  .car { opacity: .14; }
  .car__stage { width: 118vw; transform: translateY(18vh); }

  .mobilebar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 40; display: flex; gap: 10px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(5, 11, 22, .96); border-top: 1px solid var(--line); }
  .mobilebar .btn { flex: 1; padding: 15px 10px; }
}

@media (max-width: 360px) {
  .brand__name { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .intro { animation: none; }
  .js .reveal { opacity: 1; transform: none; transition: none; }
  .btn, .svc, .shot img, .shot button { transition: none; }
  .svc:hover, .btn:hover, .shot button:hover img { transform: none; }
}