/* DRIVILY — night theme, taken from the logo: black bodywork, chrome type,
   headlight blue, one brake-light red used only for warnings. */
:root{
  --night:#06090F; --panel:#0E141D; --panel-2:#151D28; --raised:#1B2531;
  --line:#232E3C; --line-2:#31404F;
  --text:#E8EEF5; --muted:#8B99AB; --dim:#5D6B7C;
  --blue:#0A84FF; --blue-2:#2FA8FF; --blue-dk:#0057C7;
  --brake:#E8352A; --go:#19C37D; --amber:#FFB020;
  --chrome:linear-gradient(180deg,#FFFFFF 0%,#D6DEE7 42%,#93A1B1 52%,#F2F6FA 100%);
  --r:12px; --wrap:1180px;
  --display:"Saira",system-ui,sans-serif;
  --body:"Barlow",system-ui,-apple-system,Segoe UI,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--night); color:var(--text);
  font-family:var(--body); font-size:16px; line-height:1.62; -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(1100px 460px at 78% -8%, rgba(10,132,255,.16), transparent 62%);
  background-repeat:no-repeat;
}
img{max-width:100%;display:block}
a{color:var(--text);text-decoration:none}
a:hover{color:#fff;text-decoration:underline}
.wrap{width:min(100% - 32px,var(--wrap));margin-inline:auto}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;background:var(--blue);color:#fff;padding:8px 12px;z-index:99}
:focus-visible{outline:2px solid var(--blue-2);outline-offset:2px}
::selection{background:rgba(10,132,255,.35)}

h1,h2,h3,h4{font-family:var(--display);font-weight:800;font-style:italic;line-height:1.06;letter-spacing:-.015em;margin:0 0 .5em}
h1,h2{background:var(--chrome);-webkit-background-clip:text;background-clip:text;color:transparent}
h1{font-size:clamp(2.1rem,5.4vw,3.5rem);text-transform:uppercase}
h2{font-size:clamp(1.45rem,3.2vw,2.2rem);text-transform:uppercase}
h3{font-size:1.1rem;font-weight:700;font-style:normal;color:var(--text)}
p{margin:0 0 1em}
.muted{color:var(--muted)}
.small{font-size:.86rem}
.mono{font-family:var(--mono);font-size:.78rem;letter-spacing:.02em}
.eyebrow{font-family:var(--mono);font-size:.7rem;text-transform:uppercase;letter-spacing:.22em;color:var(--blue-2);margin-bottom:.7em}
.lead{font-size:1.08rem;color:#C3CDDA;max-width:52ch}

/* header */
.site-head,.portal-head{position:sticky;top:0;z-index:40;background:rgba(6,9,15,.86);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.head-inner{display:flex;align-items:center;gap:20px;min-height:70px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px}
.brand:hover{text-decoration:none}
.brand img{height:34px;width:auto}
.area-tag{font-family:var(--mono);border:1px solid var(--line-2);border-radius:999px;padding:3px 10px;text-transform:uppercase;letter-spacing:.14em;font-size:.64rem;color:var(--muted)}
.main-nav{display:flex;gap:22px;margin-inline:auto;flex-wrap:wrap}
.main-nav a{font-size:.92rem;color:#C3CDDA;padding:5px 0;border-bottom:2px solid transparent;text-transform:uppercase;letter-spacing:.06em;font-weight:500}
.main-nav a:hover{color:#fff;text-decoration:none}
.main-nav a.on{color:#fff;border-bottom-color:var(--blue)}
.head-cta{display:flex;gap:10px;align-items:center}
.nav-toggle{display:none;font-family:var(--mono);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;background:none;color:var(--text);border:1px solid var(--line-2);border-radius:999px;padding:8px 15px;cursor:pointer}

.btn{display:inline-block;background:var(--raised);color:#fff;border:1px solid var(--line-2);border-radius:999px;padding:10px 20px;font-family:var(--body);font-size:.9rem;font-weight:600;letter-spacing:.02em;cursor:pointer;text-align:center;transition:transform .12s ease,border-color .12s ease}
.btn:hover{text-decoration:none;border-color:var(--blue);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:#C3CDDA}
.btn.blue{background:linear-gradient(180deg,var(--blue-2),var(--blue));border-color:transparent;box-shadow:0 8px 24px -10px rgba(10,132,255,.9)}
.btn.blue:hover{background:linear-gradient(180deg,var(--blue),var(--blue-dk))}
.btn.danger{background:var(--brake);border-color:var(--brake)}
.btn.wide{width:100%}
.btn.small{padding:6px 14px;font-size:.8rem}
.btn[disabled]{opacity:.4;pointer-events:none}

/* hero */
.hero{padding:56px 0 34px}
.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:40px;align-items:center}
.lane{height:5px;margin:24px 0;background:repeating-linear-gradient(90deg,#8A97A6 0 26px,transparent 26px 46px);opacity:.28}
.hero-card{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:20px;box-shadow:0 30px 70px -34px #000}
.hero-card h3{font-family:var(--mono);font-weight:600;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.qr-demo{display:flex;gap:16px;align-items:center;margin:14px 0}
.qr-box{width:96px;height:96px;flex:0 0 96px;border-radius:10px;background:#fff;display:grid;place-items:center}

/* finder */
.finder{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:0 30px 70px -34px #000}
.finder-bar{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.finder-bar .mono{color:var(--muted)}
#map,.map{height:400px;background:var(--panel)}
.leaflet-container{background:#0A0F16!important;font-family:var(--body)}
.leaflet-tile{filter:invert(1) hue-rotate(185deg) brightness(.82) contrast(1.05) saturate(.7)}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--raised);color:var(--text);border-radius:8px}
.leaflet-control-attribution{background:rgba(6,9,15,.7)!important;color:var(--dim)!important}
.leaflet-control-attribution a{color:var(--muted)!important}
.near-list{max-height:400px;overflow:auto;border-left:1px solid var(--line)}
.near-item{display:flex;gap:12px;padding:12px 14px;border-bottom:1px solid var(--line);align-items:center;cursor:pointer}
.near-item:hover{background:var(--panel-2)}
.near-item img{width:74px;height:50px;object-fit:cover;border-radius:6px}
.near-item .dist{font-family:var(--mono);font-size:.75rem;color:var(--blue-2)}
.finder-split{display:grid;grid-template-columns:1.5fr 1fr}

/* sections + cards */
.section{padding:52px 0;border-top:1px solid var(--line)}
.section.plain{border-top:none}
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.card.tight{padding:14px;background:var(--panel-2)}
.car-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s ease,transform .15s ease}
.car-card:hover{border-color:var(--line-2);transform:translateY(-2px)}
.car-card img{aspect-ratio:16/10;object-fit:cover;width:100%;background:#0A0F16}
.car-card .body{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1}
.car-card h3{margin:0;font-size:1.02rem}
.tags{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.tag{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.1em;border:1px solid var(--line-2);border-radius:999px;padding:3px 9px;color:var(--muted)}
.tag.ev{border-color:var(--go);color:var(--go)}
.price{font-family:var(--display);font-style:italic;font-weight:800;font-size:1.25rem;color:#fff}
.price span{font-family:var(--body);font-style:normal;font-weight:400;font-size:.8rem;color:var(--muted)}
.rowline{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line)}
.rowline:last-child{border-bottom:none}

/* forms */
.form{display:grid;gap:14px;max-width:520px}
.form.wide{max-width:none}
label{font-size:.84rem;font-weight:600;display:block;margin-bottom:5px;color:#C3CDDA}
input,select,textarea{width:100%;font:inherit;padding:11px 13px;border:1px solid var(--line-2);border-radius:10px;background:#0A101899;color:var(--text)}
input:focus,select:focus,textarea:focus{border-color:var(--blue);background:#0A1018}
input[disabled]{opacity:.55}
textarea{min-height:120px;resize:vertical}
option{background:var(--panel)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.hint{font-size:.78rem;color:var(--muted);margin-top:4px}
.flash{border-radius:10px;padding:12px 16px;margin:16px 0;border:1px solid var(--go);background:rgba(25,195,125,.1);font-size:.92rem}
.flash.warn{border-color:var(--amber);background:rgba(255,176,32,.1)}
.flash.err{border-color:var(--brake);background:rgba(232,53,42,.12)}
.steps{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px;font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.12em}
.steps span{border:1px solid var(--line-2);border-radius:999px;padding:5px 12px;color:var(--dim)}
.steps span.on{background:var(--blue);color:#fff;border-color:var(--blue)}
.steps span.done{border-color:var(--go);color:var(--go)}
details summary{color:var(--text)}

/* strip + plate */
.strip{display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#080C12;border:1px solid var(--line);color:#9FB0C4;border-radius:8px;padding:9px 12px;font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
.strip .sep{color:var(--line-2)}
.led{width:8px;height:8px;border-radius:50%;background:var(--go);display:inline-block;margin-right:7px}
.led.off{background:var(--dim)}
.led.on{box-shadow:0 0 0 0 rgba(25,195,125,.7);animation:pulse 2.4s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(25,195,125,0)}100%{box-shadow:0 0 0 0 rgba(25,195,125,0)}}
.plate{display:inline-block;background:#F7D93B;border:1px solid #C7AC17;border-radius:4px;padding:2px 9px;font-family:var(--mono);font-weight:600;font-size:.8rem;letter-spacing:.06em;color:#111}

/* tables */
table{width:100%;border-collapse:collapse;font-size:.9rem}
th,td{text-align:left;padding:11px 10px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:600}
.badge{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.09em;border-radius:999px;padding:3px 9px;border:1px solid var(--line-2);color:var(--muted)}
.badge.live,.badge.active,.badge.completed{border-color:var(--go);color:var(--go)}
.badge.pending{border-color:var(--amber);color:var(--amber)}
.badge.cancelled,.badge.suspended{border-color:var(--brake);color:var(--brake)}
.scroll{overflow-x:auto}

/* portals */
.portal{background:var(--night)}
.portal-main{padding:26px 0 60px}
.stat{background:linear-gradient(180deg,var(--panel-2),var(--panel));border:1px solid var(--line);border-radius:var(--r);padding:18px}
.stat .n{font-family:var(--display);font-style:italic;font-weight:800;font-size:1.9rem;line-height:1;color:#fff}
.stat .l{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}

/* footer */
.site-foot{background:#04070B;border-top:1px solid var(--line);margin-top:60px;padding:48px 0 24px}
.site-foot a{color:var(--muted);font-size:.9rem;display:block;padding:3px 0}
.site-foot a:hover{color:#fff}
.site-foot h4{color:#fff;font-size:.7rem;font-family:var(--mono);text-transform:uppercase;letter-spacing:.18em;margin-bottom:10px;font-style:normal}
.foot-logo{height:38px;width:auto;margin-bottom:12px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:28px}
.foot-base{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);margin-top:32px;padding-top:16px}

@media(max-width:900px){
  .hero-grid,.g3,.g2,.foot-grid,.field-row,.finder-split{grid-template-columns:1fr}
  .g4{grid-template-columns:repeat(2,1fr)}
  .near-list{border-left:none;border-top:1px solid var(--line);max-height:300px}
  .nav-toggle{display:block;margin-left:auto;order:2}
  .main-nav{display:none;width:100%;order:4;flex-direction:column;gap:2px;padding-bottom:12px;margin:0}
  .main-nav.open{display:flex}
  .head-cta{order:3}
  .hide-sm{display:none}
  #map,.map{height:320px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
