/* Layout: van-wrap system. Navy header and footer like the van's side panels; heroes cut by a diagonal navy band
   with a thin silver stripe (the wrap's chrome line); content in a 1120px column on cool-paper and white bands. */
:root{
  --navy:#05216f; --navy-2:#0a2c8a; --blue:#0a44b5; --steel:#c9ced8; --on-navy:#ffffff; --on-navy-dim:#c3cde6;
  --paper:#f3f5f9; --surface:#ffffff; --ink:#0f1626; --muted:#546078; --line:#d8dde8;
  --accent:#0a44b5; --accent-fg:#ffffff; --accent-soft:#e5ecfb; --warn:#8a4b00; --warn-soft:#fdf0d8; --star:#e8a317;
  --font-display:"Bebas Neue","Oswald","Arial Narrow",Impact,sans-serif;
  --font-body:"Rubik","Helvetica Neue",Arial,sans-serif;
  --step--1:0.875rem; --step-0:1rem; --step-1:1.2rem; --step-2:1.6rem; --step-3:2.2rem; --step-4:clamp(2.6rem,6vw,4.4rem);
  --radius:10px; --wrap:1120px;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#080e1c; --surface:#0f182c; --ink:#e6ebf5; --muted:#9daac2; --line:#22304d;
    --accent:#6f99ff; --accent-fg:#06122b; --accent-soft:#15254b; --warn:#f2b552; --warn-soft:#33260c; --star:#f2b552;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --paper:#080e1c; --surface:#0f182c; --ink:#e6ebf5; --muted:#9daac2; --line:#22304d;
  --accent:#6f99ff; --accent-fg:#06122b; --accent-soft:#15254b; --warn:#f2b552; --warn-soft:#33260c; --star:#f2b552;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:var(--step-0);line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:20px}
h1,h2,h3{font-family:var(--font-display);font-weight:400;letter-spacing:.015em;line-height:1;margin:0;text-wrap:balance}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-2)}
p{margin:0}
.eyebrow{font-size:var(--step--1);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.lede{font-size:var(--step-1);color:var(--muted);max-width:60ch}
.muted{color:var(--muted)}
.ic{width:24px;height:24px;flex:none}
.skip{position:absolute;left:-999px;top:8px;background:var(--surface);color:var(--ink);padding:8px 12px;border-radius:6px;z-index:50}
.skip:focus{left:8px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:8px;font:inherit;font-weight:600;text-decoration:none;border:2px solid transparent;cursor:pointer;white-space:nowrap}
.btn-primary{background:var(--accent);color:var(--accent-fg)}
.btn-primary:hover{filter:brightness(1.08)}
.btn-ghost{border-color:currentColor;color:inherit}
.on-navy .btn-primary,.site-head .btn-primary{background:var(--on-navy);color:var(--navy)}
.on-navy .btn-ghost{color:var(--on-navy)}

/* Header */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--navy);color:var(--on-navy);border-bottom:3px solid var(--steel)}
.head-row{display:flex;align-items:center;gap:20px;min-height:72px}
.brand img{height:44px;width:auto}
.site-nav{display:flex;gap:4px;margin-left:auto}
.site-nav a{color:var(--on-navy);text-decoration:none;font-weight:500;padding:8px 12px;border-radius:6px}
.site-nav a:hover,.site-nav a[aria-current=page]{background:var(--navy-2)}
.head-phone{color:var(--on-navy);font-weight:600;text-decoration:none;font-variant-numeric:tabular-nums;white-space:nowrap}
.menu{display:none;margin-left:auto}
.menu summary{list-style:none;cursor:pointer;color:var(--on-navy);font-weight:600;padding:10px 12px;border:1.5px solid var(--on-navy-dim);border-radius:8px}
.menu summary::-webkit-details-marker{display:none}
.menu-panel{position:absolute;left:0;right:0;top:100%;background:var(--navy);border-bottom:3px solid var(--steel);padding:8px 20px 20px;display:grid;gap:4px}
.menu-panel a{color:var(--on-navy);text-decoration:none;font-weight:500;font-size:var(--step-1);padding:10px 0;border-bottom:1px solid var(--navy-2)}
.menu-panel .btn{margin-top:12px}
@media (max-width: 900px){
  .site-nav,.head-cta,.head-phone{display:none}
  .menu{display:block}
  .brand img{height:38px}
}

/* Hero: photo with a diagonal navy band and a silver stripe */
.hero{position:relative;background:var(--navy);color:var(--on-navy);overflow:hidden}
.hero-photo{position:absolute;inset:0 0 0 38%}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 60%}
/* The band starts at the page column's left edge, so hero copy lines up with every section below it. */
.hero-band{--gutter:calc(max(0px,(100% - var(--wrap)) / 2) + 20px);position:relative;width:min(100%,calc(var(--gutter) + 700px));background:var(--navy);clip-path:polygon(0 0,100% 0,84% 100%,0 100%);padding-block:72px 84px;padding-left:var(--gutter);padding-right:24px}
.hero-band::after{content:"";position:absolute;top:0;bottom:0;right:9%;width:14px;background:var(--steel);transform:skewX(-9.5deg);opacity:.9}
.hero-copy{display:grid;gap:20px;max-width:520px;position:relative}
.hero-copy .eyebrow{color:var(--on-navy-dim)}
.hero-copy .lede{color:var(--on-navy-dim)}
/* The motto, stacked like the van wrap: big condensed white caps, one phrase per line */
.hero-copy{max-width:600px}
.motto{font-size:clamp(2.9rem,7.2vw,5.6rem);line-height:.92;letter-spacing:.01em;text-transform:uppercase}
.motto > span{display:block}
.hero-sub{font-size:var(--step-1);font-weight:500;color:var(--on-navy-dim);border-left:3px solid var(--steel);padding-left:14px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.chips li{display:inline-flex;align-items:center;gap:6px;font-size:var(--step--1);font-weight:500;padding:6px 12px;border-radius:999px;background:var(--navy-2);color:var(--on-navy)}
.chips .ic{width:16px;height:16px}
@media (max-width: 900px){
  .hero-photo{position:relative;inset:auto;aspect-ratio:3/2;max-width:100%}
  .hero-band{width:100%;clip-path:polygon(0 28px,100% 0,100% 100%,0 100%);margin-top:-28px;padding-block:56px 48px;padding-right:20px}
  .hero-band::after{display:none}
}

/* Page heroes (inner pages) */
.page-hero{background:var(--navy);color:var(--on-navy);position:relative;overflow:hidden;border-bottom:3px solid var(--steel)}
.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:32px;align-items:center;padding-block:56px}
.page-hero .lede{color:var(--on-navy-dim)}
.page-hero .eyebrow{color:var(--on-navy-dim)}
.page-hero-copy{display:grid;gap:16px;min-width:0}
.page-hero figure{margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.35)}
.page-hero figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
.crumbs{font-size:var(--step--1);color:var(--on-navy-dim)}
.crumbs a{color:var(--on-navy-dim)}
/* Portrait photos: narrower, taller frame on desktop; a 4:3 crop on phones */
.page-hero figure.tall{width:100%;max-width:360px;justify-self:end}
.page-hero figure.tall img{aspect-ratio:4/5}
@media (max-width: 800px){
  .page-hero .wrap{grid-template-columns:1fr;padding-block:40px}
  .page-hero figure img,.page-hero figure.tall img{aspect-ratio:3/2}
  .page-hero figure.tall{max-width:none;justify-self:stretch}
  .page-hero figure.tall img{aspect-ratio:4/3}
}

/* Bands */
.band{padding-block:72px}
.band.alt{background:var(--surface);border-block:1px solid var(--line)}
.band-head{display:grid;gap:12px;margin-bottom:36px;max-width:720px}
@media (max-width: 700px){ .band{padding-block:52px} }

/* Steps: a real sequence, so numbered */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;counter-reset:step;list-style:none;margin:0;padding:0}
.steps li{display:grid;gap:8px;align-content:start;min-width:0}
.steps li::before{counter-increment:step;content:counter(step);font-family:var(--font-display);font-size:3.4rem;line-height:1;color:var(--accent)}
.steps h3{font-size:var(--step-2)}
@media (max-width: 800px){ .steps{grid-template-columns:1fr} }

/* Service grid */
.svc-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.svc{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:18px;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--ink);text-decoration:none;min-width:0}
.svc:hover{border-color:var(--accent)}
.svc .tile{width:46px;height:46px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:grid;place-items:center}
.svc b{display:block;font-size:var(--step-1);font-weight:600;line-height:1.25}
.svc small{display:block;color:var(--muted);font-size:var(--step--1);line-height:1.4;margin-top:2px}
.svc .arrow{color:var(--muted)}
@media (max-width: 960px){ .svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 620px){ .svc-grid{grid-template-columns:1fr} }

/* Proof strip */
.proof{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;list-style:none;margin:0;padding:0}
.proof li{display:grid;gap:6px;align-content:start;min-width:0}
.proof .ic{width:30px;height:30px;color:var(--accent)}
.proof b{font-weight:600;font-size:var(--step-1);line-height:1.3}
.proof span{color:var(--muted);font-size:.95rem}
@media (max-width: 900px){ .proof{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 520px){ .proof{grid-template-columns:1fr} }

/* Split: image + copy */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center}
.split figure{margin:0;border-radius:var(--radius);overflow:hidden}
.split figure img{width:100%;aspect-ratio:4/3;object-fit:cover}
.split .copy{display:grid;gap:16px;min-width:0}
@media (max-width: 860px){ .split{grid-template-columns:1fr;gap:28px} }

.checks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.checks li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:start}
.checks .ic{width:20px;height:20px;color:var(--accent);margin-top:3px}

/* Reviews */
.reviews{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:32px;align-items:start}
.rating{display:grid;gap:10px;padding:24px;border-radius:var(--radius);background:var(--navy);color:var(--on-navy)}
.rating .stars{display:flex;gap:4px;color:var(--star)}
.rating .stars svg{width:26px;height:26px}
.rating .big{font-family:var(--font-display);font-size:3.2rem;line-height:1}
.rating a{color:var(--on-navy)}
.rating .eyebrow{color:var(--on-navy-dim)}
.review-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.review{padding:18px;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface);display:grid;gap:8px;min-width:0}
.review .stars{display:flex;gap:2px;color:var(--star)}
.review .stars svg{width:16px;height:16px}
.review footer{font-size:var(--step--1);color:var(--muted)}
.review-slot{border:1.5px dashed var(--line);border-radius:var(--radius);padding:24px;display:grid;gap:10px;background:var(--surface)}
@media (max-width: 860px){ .reviews{grid-template-columns:1fr} .review-list{grid-template-columns:1fr} }

/* Areas */
.town-list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.town-list li a,.town-list li span{display:inline-block;padding:8px 14px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);text-decoration:none;font-size:.95rem}
.town-list li a{border-color:var(--accent);color:var(--accent);font-weight:600}
.zip-list{display:flex;flex-wrap:wrap;gap:6px 14px;list-style:none;margin:0;padding:0;font-variant-numeric:tabular-nums;color:var(--muted)}
.area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.area-card{display:grid;gap:6px;padding:20px;border-radius:var(--radius);border:1.5px solid var(--line);background:var(--surface);text-decoration:none;color:var(--ink)}
.area-card:hover{border-color:var(--accent)}
.area-card b{font-family:var(--font-display);font-weight:400;font-size:var(--step-2);letter-spacing:.02em;line-height:1}
.area-card span{color:var(--muted);font-size:.95rem}
@media (max-width: 860px){ .area-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 520px){ .area-grid{grid-template-columns:1fr} }

/* Tables */
.tbl{overflow-x:auto;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface)}
table{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line)}
tr:last-child td{border-bottom:0}
th{font-size:var(--step--1);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
td.num{white-space:nowrap;font-weight:600}

/* FAQ */
.faq{display:grid;gap:10px;max-width:820px}
.faq details{border:1.5px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.faq summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:600;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1;color:var(--accent)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 18px 18px;color:var(--muted);max-width:65ch}

/* Notes */
.note{display:grid;grid-template-columns:auto 1fr;gap:12px;padding:16px 18px;border-radius:var(--radius);background:var(--accent-soft)}
.note.warn{background:var(--warn-soft)}
.note.warn strong{color:var(--warn)}
.note .ic{color:var(--accent)}
.note.warn .ic{color:var(--warn)}

/* Two-column page body */
.cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.cols > div{display:grid;gap:16px;align-content:start;min-width:0}
@media (max-width: 800px){ .cols{grid-template-columns:1fr} }
.prose{display:grid;gap:16px;max-width:68ch}
.prose h2{margin-top:12px}

/* Makes */
.makes{columns:4 160px;gap:24px;list-style:none;margin:0;padding:0;color:var(--muted)}
.makes li{padding:3px 0;break-inside:avoid}

/* CTA band */
.cta{background:var(--navy);color:var(--on-navy);border-top:3px solid var(--steel)}
.cta .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding-block:48px}
.cta p{color:var(--on-navy-dim)}
.cta-copy{display:grid;gap:8px;min-width:0}

/* Footer */
.site-foot{background:var(--navy);color:var(--on-navy-dim);border-top:1px solid var(--navy-2);font-size:.95rem}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:32px;padding-block:48px}
.foot-grid h3{font-family:var(--font-body);font-size:var(--step--1);font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--on-navy);margin-bottom:12px}
.foot-grid ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.foot-grid a{color:var(--on-navy-dim);text-decoration:none}
.foot-grid a:hover{color:var(--on-navy);text-decoration:underline}
.foot-brand{display:grid;gap:12px;align-content:start}
.foot-brand img{height:56px;width:auto}
.foot-base{border-top:1px solid var(--navy-2);padding-block:18px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:var(--step--1)}
@media (max-width: 860px){ .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .foot-brand{grid-column:1/-1} }
@media (max-width: 480px){ .foot-grid{grid-template-columns:1fr} }

.preview-bar{background:var(--warn-soft);color:var(--ink);font-size:var(--step--1);text-align:center;padding:8px 16px}

/* Pictures: <picture> wrappers stay out of layout so img rules apply as if the img were direct */
picture{display:contents}
.pos-top img{object-position:center 18%}
.pos-mid img{object-position:center 55%}

/* Inner-page heroes without a photo */
.page-hero.solo .wrap{grid-template-columns:minmax(0,1fr)}
.page-hero.solo .page-hero-copy{max-width:760px}
.actions{display:flex;gap:12px;flex-wrap:wrap}

/* Section helpers */
.stack{display:grid;gap:16px;align-content:start;min-width:0}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:600;text-decoration:none}
.more:hover{text-decoration:underline}
.more .ic{width:18px;height:18px}
.band-foot{margin-top:28px}

/* Grouped service lists */
.groups{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.groups h3{font-size:var(--step-2)}
.groups ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px;color:var(--muted)}
@media (max-width: 900px){ .groups{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 480px){ .groups{grid-template-columns:1fr} }

/* Photo gallery */
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.gallery figure{margin:0;display:grid;gap:8px;min-width:0}
.gallery img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius)}
.gallery figcaption{font-size:var(--step--1);color:var(--muted)}
@media (max-width: 700px){ .gallery{grid-template-columns:1fr 1fr} .gallery figure:last-child{display:none} }

/* Ordered how-to list (fleet booking) */
.howto{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:how}
.howto li{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start}
.howto li::before{counter-increment:how;content:counter(how);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--accent);color:var(--accent-fg);font-weight:600}
.howto b{display:block}

/* Contact rows */
.contact{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.contact li{display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:center}
.contact .ic{color:var(--accent);width:20px;height:20px}
.on-navy .contact .ic{color:var(--on-navy-dim)}
.contact a{font-weight:600}
/* Links on navy default to white; more specific rules (footer, crumbs) can dim them */
:where(.on-navy) a{color:var(--on-navy)}

/* Live Google reviews (filled by reviews.js on the live site) */
.reviews-live{display:grid;gap:14px}
.reviews-live .review p{color:var(--ink)}
.review-who{display:flex;align-items:center;gap:10px}
.review-who img{width:32px;height:32px;border-radius:50%}
.attrib{font-size:var(--step--1);color:var(--muted)}
.big-404{font-family:var(--font-display);font-size:clamp(5rem,18vw,9rem);line-height:.9;color:var(--on-navy-dim)}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none!important;animation:none!important} }
.review-list .attrib{grid-column:1/-1}

/* Six-item grids (Why choose us, credentials) */
.proof.three{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 28px}
@media (max-width: 900px){ .proof.three{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width: 520px){ .proof.three{grid-template-columns:1fr} }

/* Full service list from the original site */
.svc-list{columns:3 220px;column-gap:28px;list-style:none;margin:0;padding:0}
.svc-list li{display:flex;gap:10px;align-items:flex-start;padding:5px 0;break-inside:avoid;font-weight:500}
.svc-list .ic{width:20px;height:20px;color:var(--accent);margin-top:2px}

/* Fluid write-ups */
.fluids{display:grid;gap:14px;max-width:860px}
.fluid{display:grid;gap:10px;padding:20px 22px;border:1.5px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--radius);background:var(--surface)}
.fluid h3{font-size:var(--step-2)}
.rec{display:flex;gap:10px;align-items:flex-start;font-weight:600}
.rec .ic{width:20px;height:20px;color:var(--accent);margin-top:2px}
.copy h2 + p,.copy h3 + p{margin-top:-6px}

.foot-grid .dir-row{display:grid;grid-template-columns:58px minmax(0,1fr);gap:6px;align-items:baseline}
.foot-grid .dir{font-size:.75rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--on-navy)}

/* Policy pages */
.quote{margin:0;padding:12px 16px;border-left:4px solid var(--accent);background:var(--surface);border-radius:0 8px 8px 0;color:var(--ink)}
.shot{margin:4px 0;max-width:480px;display:grid;gap:8px}
.shot img{border:1.5px solid var(--line);border-radius:10px;background:#fff}
.shot figcaption{font-size:var(--step--1);color:var(--muted)}
/* A prose column inside the page wrap stays left-aligned with the hero, with readable line lengths */
.wrap.prose{max-width:var(--wrap)}
.wrap.prose > *{max-width:68ch}