/* Road Ready Crew — shared styles. No framework, no build step. Mobile-first. */
@font-face{font-family:"Barlow Condensed";font-weight:600;font-style:normal;font-display:swap;src:url("fonts/barlow-condensed-600.woff2") format("woff2")}
@font-face{font-family:"Barlow Condensed";font-weight:800;font-style:normal;font-display:swap;src:url("fonts/barlow-condensed-800.woff2") format("woff2")}

:root{
  --asphalt:#0f1114;
  --charcoal:#171a1f;
  --panel:#1f242b;
  --panel-2:#272d35;
  --line:#353c46;
  --text:#f3f1ec;
  --muted:#b4bac2;
  --orange:#ff7a1a;
  --orange-2:#ff9440;
  --yellow:#ffc21a;
  --ok:#3ecf8e;
  --err:#ff6b5b;
  --radius:14px;
  --head:"Barlow Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --wrap:1180px;
  --shadow:0 18px 50px rgba(0,0,0,.45);
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;background:var(--asphalt);color:var(--text);font:400 1.0625rem/1.6 var(--body)}
img,svg{max-width:100%;display:block}
a{color:var(--yellow);text-underline-offset:3px}
a:hover{color:#ffd65c}
:focus-visible{outline:3px solid var(--yellow);outline-offset:3px;border-radius:4px}
h1,h2,h3,h4{font-family:var(--head);font-weight:800;line-height:1.02;letter-spacing:.01em;text-transform:uppercase;margin:0 0 .5em}
h1{font-size:clamp(3rem,11vw,6.6rem)}
h2{font-size:clamp(2.1rem,6vw,3.6rem)}
h3{font-size:clamp(1.4rem,3.4vw,1.75rem);letter-spacing:.02em}
p{margin:0 0 1em}
.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:1rem;top:-100px;z-index:100;background:var(--yellow);color:#111;padding:.6rem 1rem;border-radius:8px;font-weight:700}
.skip:focus{top:1rem}
.accent{color:var(--orange)}
.accent-y{color:var(--yellow)}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font:600 1rem/1 var(--head);letter-spacing:.16em;text-transform:uppercase;color:var(--yellow);margin-bottom:1rem}
.eyebrow::before{content:"";width:28px;height:4px;background:var(--orange);border-radius:2px}
.lead{font-size:clamp(1.1rem,2.4vw,1.3rem);color:#e2e0da;max-width:40ch}
.muted{color:var(--muted)}
.small{font-size:.9rem}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(12,14,17,.86);backdrop-filter:saturate(140%) blur(10px);-webkit-backdrop-filter:saturate(140%) blur(10px);border-bottom:1px solid rgba(255,255,255,.07)}
.site-header .wrap{display:flex;align-items:center;gap:1rem;min-height:66px}
.brand{white-space:nowrap;display:flex;align-items:center;gap:.6rem;color:var(--text);text-decoration:none;font:800 1.45rem/1 var(--head);text-transform:uppercase;letter-spacing:.03em;margin-right:auto}
.brand svg{width:36px;height:36px;flex:none}
.brand span b{color:var(--orange);font-weight:800}
.nav{display:none}
.nav a{color:var(--text);text-decoration:none;font:600 1.12rem/1 var(--head);text-transform:uppercase;letter-spacing:.06em;padding:.6rem .7rem;border-radius:8px}
.nav a:hover,.nav a[aria-current="page"]{color:var(--yellow)}
.menu-btn{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer}
.menu-btn svg{width:22px;height:22px}
.site-header .header-cta{display:none}
@media (min-width:480px){.site-header .header-cta{display:inline-flex}}
@media (max-width:400px){.brand{font-size:1.3rem}}
.nav.open{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:#0d0f12;border-bottom:1px solid var(--line);padding:.5rem 1.25rem 1.25rem}
.nav.open a{padding:.9rem .25rem;border-bottom:1px solid rgba(255,255,255,.06);font-size:1.3rem}
@media (min-width:960px){
  .menu-btn{display:none}
  .nav,.nav.open{display:flex;flex-direction:row;position:static;background:none;border:0;padding:0;gap:.15rem}
  .nav.open a{border:0;padding:.6rem .7rem;font-size:1.12rem}
}

/* ---------- Buttons ---------- */
.btn{--bg:var(--orange);--fg:#140a02;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:54px;padding:.85rem 1.6rem;border-radius:10px;border:2px solid var(--bg);background:var(--bg);color:var(--fg);font:800 1.3rem/1 var(--head);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;box-shadow:0 8px 24px rgba(255,122,26,.25)}
.btn:hover{transform:translateY(-2px);color:var(--fg);background:var(--orange-2);border-color:var(--orange-2);box-shadow:0 12px 30px rgba(255,122,26,.35)}
.btn svg{width:22px;height:22px}
.btn-yellow{--bg:var(--yellow);--fg:#161100;box-shadow:0 8px 24px rgba(255,194,26,.22)}
.btn-yellow:hover{background:#ffd34f;border-color:#ffd34f}
.btn-ghost{--bg:transparent;--fg:var(--text);border-color:rgba(255,255,255,.55);box-shadow:none}
.btn-ghost:hover{background:rgba(255,255,255,.08);border-color:#fff;color:#fff}
.btn-sm{min-height:42px;padding:.5rem 1rem;font-size:1.05rem}
.btn-block{width:100%}
.btn-row{display:flex;flex-wrap:wrap;gap:.9rem}
@media (max-width:520px){.hero .btn-row .btn{flex:1 1 100%}}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:min(92vh,860px);display:flex;align-items:center;padding:6rem 0 5.5rem;background:#141015}
.hero-media{position:absolute;inset:0;z-index:-2;background-color:#141015;background-image:var(--img,url("img/hero.webp")),var(--fallback,url("img/hero-fallback.svg"));background-size:cover;background-position:62% 50%;transform-origin:70% 60%;animation:kenburns 16s ease-out both}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(8,9,11,.93) 0%,rgba(8,9,11,.74) 38%,rgba(8,9,11,.18) 70%,rgba(8,9,11,0) 100%),
  linear-gradient(0deg,rgba(15,17,20,1) 0%,rgba(15,17,20,0) 26%)}
@media (max-width:700px){
  .hero{display:block;min-height:auto;padding:0 0 3.5rem}
  .hero-media{position:relative;inset:auto;height:290px;background-position:76% 74%}
  .hero::after{background:linear-gradient(180deg,rgba(8,9,11,.25) 0,rgba(8,9,11,0) 110px,rgba(15,17,20,.75) 220px,#0f1114 290px,#0f1114 100%)}
  .hero-inner{margin-top:-64px}
  .hero-sub .hero-media{height:220px}
}
.hero-sub{min-height:auto;padding:5rem 0 4rem}
.hero-inner{position:relative;z-index:2;max-width:900px}
.hero h1{margin-bottom:.25em;text-shadow:0 4px 30px rgba(0,0,0,.5)}
.hero h1 .line{display:block}
.hero h1 .stripe{color:var(--yellow)}
.hero .lead{margin-bottom:2rem}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;margin:2rem 0 0;padding:0;list-style:none}
.chips li{display:inline-flex;align-items:center;gap:.5rem;background:rgba(15,17,20,.65);border:1px solid rgba(255,255,255,.16);padding:.5rem .85rem;border-radius:999px;font-weight:600;font-size:.95rem;backdrop-filter:blur(4px)}
.chips svg{width:18px;height:18px;color:var(--yellow)}
/* Motion (disabled for prefers-reduced-motion) */
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes kenburns{from{transform:scale(1.09)}to{transform:scale(1)}}
@keyframes dash{to{background-position:-160px 0}}
.rise{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.08s}.d2{animation-delay:.2s}.d3{animation-delay:.34s}.d4{animation-delay:.5s}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}

/* Highway stripe divider */
.stripe-band{height:14px;background:
  repeating-linear-gradient(90deg,var(--yellow) 0 80px,transparent 80px 160px) center/auto 4px no-repeat,
  var(--asphalt);animation:dash 3s linear infinite}

/* ---------- Sections ---------- */
section{padding:clamp(4rem,9vw,7rem) 0}
.section-head{max-width:780px;margin-bottom:2.75rem}
.section-head p{color:var(--muted);font-size:1.15rem}
.alt{background:var(--charcoal)}
.grid{display:grid;gap:1.25rem}
@media (min-width:700px){.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1040px){.g4{grid-template-columns:repeat(4,1fr)}}
.card{background:linear-gradient(180deg,var(--panel),#1a1e24);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;position:relative}
.card p:last-child{margin-bottom:0}
.card .icon{width:56px;height:56px;border-radius:12px;display:grid;place-items:center;background:rgba(255,122,26,.12);color:var(--orange);margin-bottom:1rem;border:1px solid rgba(255,122,26,.3)}
.card .icon svg{width:30px;height:30px}
.card p{color:#cfd3d8}
.card.hot{border-color:rgba(255,194,26,.55);box-shadow:inset 0 0 0 1px rgba(255,194,26,.18)}

/* Split media sections */
.split{display:grid;gap:2.5rem;align-items:center}
@media (min-width:900px){.split{grid-template-columns:1.05fr 1fr;gap:4rem}.split.flip>:first-child{order:2}}
.media{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.08);background-color:#151820;background-size:cover;background-position:center;background-image:linear-gradient(0deg,rgba(10,11,13,.55),rgba(10,11,13,0) 50%),var(--img),var(--fallback)}
.media .tag{position:absolute;left:1rem;bottom:1rem;background:var(--yellow);color:#151000;font:800 1.05rem/1 var(--head);letter-spacing:.08em;text-transform:uppercase;padding:.5rem .8rem;border-radius:6px}
.media-driver{--img:url("img/driver.webp");--fallback:url("img/driver-fallback.svg")}
.media-fleet{--img:url("img/fleet.webp");--fallback:url("img/fleet-fallback.svg")}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;gap:1rem;counter-reset:s}
.steps li{display:grid;grid-template-columns:64px 1fr;gap:1.1rem;align-items:start;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem 1.3rem}
.steps li::before{counter-increment:s;content:counter(s);display:grid;place-items:center;width:64px;height:64px;border-radius:12px;background:var(--orange);color:#140a02;font:800 2.4rem/1 var(--head)}
.steps h3{margin:.2rem 0 .3rem}
.steps p{margin:0;color:#cfd3d8}

/* Route types */
.route{overflow:hidden}
.route .route-art{height:96px;margin:-1.6rem -1.6rem 1.25rem;background:#12151a;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--yellow)}
.route .route-art svg{width:100%;height:100%}
.route .meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.route .meta span{font:600 .95rem/1 var(--head);letter-spacing:.06em;text-transform:uppercase;background:#2c333c;color:#e7e3da;padding:.4rem .6rem;border-radius:6px}

/* Night band */
.band{position:relative;isolation:isolate;background:#0b0d11;overflow:hidden}
.band::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.9;background-image:
  linear-gradient(180deg,rgba(11,13,17,.9),rgba(11,13,17,.6) 50%,rgba(11,13,17,.95)),
  url("img/night.webp"),
  radial-gradient(1200px 300px at 70% 120%,rgba(255,122,26,.28),transparent 70%),
  repeating-linear-gradient(100deg,transparent 0 120px,rgba(255,194,26,.07) 120px 124px,transparent 124px 260px),
  radial-gradient(2px 2px at 20% 30%,rgba(255,255,255,.5),transparent),radial-gradient(2px 2px at 80% 20%,rgba(255,255,255,.4),transparent),radial-gradient(1.5px 1.5px at 55% 12%,rgba(255,255,255,.45),transparent);
  background-size:cover,cover,auto,auto,auto,auto,auto}

/* Lists with checks */
.checks{list-style:none;padding:0;margin:0;display:grid;gap:.75rem}
.checks li{position:relative;padding-left:2.1rem}
.checks li::before{content:"";position:absolute;left:0;top:.2em;width:1.35rem;height:1.35rem;border-radius:6px;background:var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23140a02' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/70% no-repeat}
.checks.y li::before{background-color:var(--yellow)}

/* Tool widgets */
.tool{background:linear-gradient(180deg,#20252c,#191d23);border:1px solid var(--line);border-radius:18px;padding:clamp(1.25rem,3vw,2rem);box-shadow:var(--shadow)}
.calc-out{display:grid;gap:1rem;margin-top:1.5rem}
@media (min-width:560px){.calc-out{grid-template-columns:1fr 1fr}}
.readout{background:#0e1013;border:1px solid #2f363f;border-radius:12px;padding:1rem 1.2rem}
.readout .k{font:600 1rem/1 var(--head);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.readout .v{font:800 clamp(2.2rem,6vw,3rem)/1.1 var(--head);color:var(--yellow);font-variant-numeric:tabular-nums}
.share-box{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.share-box input{flex:1 1 260px}

/* Follow row */
.follow{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.follow a{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .9rem;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);text-decoration:none;font-weight:600}
.follow a:hover{border-color:var(--yellow);color:var(--yellow)}
.follow svg{width:20px;height:20px}

/* FAQ */
.faq{display:grid;gap:.75rem;max-width:880px}
.faq details{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:0 1.25rem}
.faq summary{cursor:pointer;list-style:none;padding:1.1rem 2rem 1.1rem 0;font:800 1.35rem/1.2 var(--head);text-transform:uppercase;letter-spacing:.02em;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:2rem;color:var(--orange)}
.faq details[open] summary::after{content:"–"}
.faq details p{color:#cfd3d8}

/* CTA band */
.cta-band{background:linear-gradient(100deg,#ff7a1a,#ff9a2e 55%,#ffc21a);color:#160b02;padding:clamp(3rem,7vw,5rem) 0}
.cta-band h2{color:#160b02}
.cta-band p{font-size:1.2rem;max-width:52ch}
.cta-band .btn{--bg:#121417;--fg:#fff;box-shadow:none}
.cta-band .btn:hover{background:#000;border-color:#000;color:#fff}
.cta-band .btn-ghost{--bg:transparent;--fg:#160b02;border-color:#160b02}
.cta-band .btn-ghost:hover{background:rgba(0,0,0,.08);color:#160b02;border-color:#160b02}

/* ---------- Forms ---------- */
.form{display:grid;gap:1.4rem}
fieldset{border:1px solid var(--line);border-radius:var(--radius);padding:1rem;margin:0;background:rgba(255,255,255,.015)}
legend{font:800 1.4rem/1 var(--head);text-transform:uppercase;letter-spacing:.04em;padding:0 .5rem;color:var(--yellow)}
.fields{display:grid;gap:1rem;align-items:start}
.fields.three{align-items:end}
@media (min-width:700px){.fields.two{grid-template-columns:1fr 1fr}.fields.three{grid-template-columns:repeat(3,1fr)}.span-2{grid-column:1/-1}}
.field{display:grid;gap:.4rem}
label,.label{font-weight:700;font-size:1rem}
.req{color:var(--orange)}
.hint{font-size:.9rem;color:var(--muted);font-weight:400}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],input[type=url],select,textarea{width:100%;min-height:52px;padding:.75rem .9rem;border-radius:10px;border:1px solid #47505c;background:#0e1013;color:var(--text);font:inherit;font-size:1.05rem}
textarea{min-height:120px;resize:vertical}
select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffc21a' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;background-size:18px;padding-right:2.6rem}
input::placeholder,textarea::placeholder{color:#7d8590}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--yellow);box-shadow:0 0 0 3px rgba(255,194,26,.3)}
input[type=date]{color-scheme:dark}
.was-validated input:invalid,.was-validated select:invalid,.was-validated textarea:invalid{border-color:var(--err)}
.opts{display:grid;gap:.6rem;grid-template-columns:repeat(auto-fill,minmax(132px,1fr))}
.opts.wide{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.opt{display:flex;align-items:center;gap:.65rem;padding:.7rem .85rem;border-radius:10px;background:#0e1013;border:1px solid #3b434e;cursor:pointer;font-weight:600;line-height:1.25;min-height:52px}
.opt:hover{border-color:#6b7480}
.opt:has(input:checked){border-color:var(--yellow);background:rgba(255,194,26,.08)}
.opt small{display:block;font-weight:400;color:var(--muted);font-size:.82rem}
input[type=checkbox],input[type=radio]{width:22px;height:22px;accent-color:var(--orange);flex:none;margin:0}
.consent{display:flex;gap:.85rem;align-items:flex-start;padding:1rem 1.1rem;border-radius:12px;background:#0e1013;border:1px solid #3b434e;cursor:pointer;font-weight:500;line-height:1.45}
.consent input{margin-top:.15rem}
.consent.key{border-color:rgba(255,122,26,.6);background:rgba(255,122,26,.06)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-note{font-size:.92rem;color:var(--muted);border-left:3px solid var(--orange);padding:.25rem 0 .25rem 1rem}
.notice{border-radius:14px;padding:1.5rem;border:1px solid;display:none}
.notice.show{display:block}
.notice h3{margin-bottom:.4rem}
.notice.ok{background:rgba(62,207,142,.08);border-color:rgba(62,207,142,.5)}
.notice.warn{background:rgba(255,194,26,.08);border-color:rgba(255,194,26,.55)}
.notice.err{background:rgba(255,107,91,.1);border-color:rgba(255,107,91,.5)}
.ref-banner{display:none;background:rgba(255,194,26,.1);border:1px solid rgba(255,194,26,.5);padding:.8rem 1rem;border-radius:10px;margin-bottom:1rem}
.ref-banner.show{display:block}
.form-wrap{display:grid;gap:2.5rem}
@media (min-width:1040px){.form-wrap{grid-template-columns:1.6fr .9fr;align-items:start}.form-aside{position:sticky;top:90px}}

/* Pills / fee */
.fee-grid .card h3{color:var(--yellow)}
.timeline{display:grid;gap:0;margin:1.5rem 0 0;padding:0;list-style:none;border-left:3px dashed var(--yellow);margin-left:.6rem}
.timeline li{position:relative;padding:0 0 1.4rem 1.6rem}
.timeline li::before{content:"";position:absolute;left:-11px;top:.3rem;width:19px;height:19px;border-radius:50%;background:var(--orange);border:3px solid var(--asphalt)}
.timeline b{font:800 1.3rem/1.1 var(--head);text-transform:uppercase;letter-spacing:.03em;display:block}

/* Legal page */
.legal{max-width:820px}
.legal h2{font-size:clamp(1.7rem,4vw,2.3rem);margin-top:2.4rem}
.legal li{margin-bottom:.4rem}
.draft-flag{display:inline-block;background:var(--yellow);color:#161100;font:800 1rem/1 var(--head);letter-spacing:.1em;padding:.45rem .7rem;border-radius:6px;text-transform:uppercase}

/* ---------- Footer ---------- */
.site-footer{background:#0a0b0d;border-top:4px solid var(--orange);padding:3.5rem 0 2rem;color:var(--muted)}
.foot-grid{display:grid;gap:2rem}
@media (min-width:820px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr}}
.site-footer h4{color:var(--text);font-size:1.25rem;letter-spacing:.06em;margin-bottom:.8rem}
.site-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.45rem}
.site-footer a{color:#e6e3dc;text-decoration:none}
.site-footer a:hover{color:var(--yellow);text-decoration:underline}
.foot-bottom{margin-top:2.5rem;padding-top:1.4rem;border-top:1px solid #23272d;display:flex;flex-wrap:wrap;gap:.75rem 2rem;justify-content:space-between;font-size:.9rem}
.placeholder{border-bottom:1px dashed #8a8f96}

@media (min-width:700px){fieldset{padding:1.25rem}}
.hero-sub::after{background:
  linear-gradient(90deg,rgba(8,9,11,.95) 0%,rgba(8,9,11,.86) 42%,rgba(8,9,11,.4) 80%,rgba(8,9,11,.25) 100%),
  linear-gradient(0deg,rgba(15,17,20,1) 0%,rgba(15,17,20,0) 30%)}
@media (max-width:700px){.hero-sub::after{background:linear-gradient(180deg,rgba(8,9,11,.25) 0,rgba(8,9,11,0) 90px,rgba(15,17,20,.8) 170px,#0f1114 220px,#0f1114 100%)}}