/* ============================================================
   Huminic Motors — TEMPLATE COPY (v2)
   Faithful reproduction of the Revanta Framer template:
   near-black canvas, crimson accent, crimson logo box,
   hamburger-only nav, full-bleed photography, huge medium-
   weight uppercase headings, bracket eyebrows, arrow-link CTAs,
   red script signature, stat counters, enter-from-RIGHT reveals.
   Standalone stylesheet — does not touch the v1 site.
   ============================================================ */

:root {
  --bg:#0a0a0b;
  --bg-2:#101012;
  --surface:#151517;
  --line:rgba(255,255,255,.12);
  --line-soft:rgba(255,255,255,.07);
  --text:#f4f2ef;
  --muted:rgba(244,242,239,.6);
  --muted-2:rgba(244,242,239,.4);
  --accent:#b8201c;          /* Revanta crimson */
  --accent-hover:#d5312b;
  --accent-soft:rgba(184,32,28,.16);
  --accent-ink:#ffffff;
  --radius:2px;
  --wrap:1280px;
  --pad:clamp(20px,5vw,56px);
  --head:'Archivo','Instrument Sans',system-ui,sans-serif;
  --body:'Inter',system-ui,-apple-system,sans-serif;
  --script:'Dancing Script',cursive;
  --ease:cubic-bezier(.22,1,.36,1);
}

* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  background:var(--bg); color:var(--text);
  font-family:var(--body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; color:inherit; background:none; border:none; }

h1,h2,h3 { font-family:var(--head); font-weight:600; line-height:1.0; letter-spacing:-.01em; text-transform:uppercase; }
h1 { font-size:clamp(2.9rem,8vw,6.6rem); font-weight:600; }
h2 { font-size:clamp(2rem,5.2vw,4rem); }
h3 { font-size:clamp(1.1rem,2vw,1.5rem); letter-spacing:0; }
p  { color:var(--muted); }

.wrap { width:100%; max-width:var(--wrap); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }
.section { padding:clamp(72px,10vw,140px) 0; position:relative; }

/* ---- bracket eyebrow: [ Label ] ---- */
.eyebrow {
  display:inline-block; font-family:var(--head); font-size:.82rem; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:22px;
}
.eyebrow::before { content:"[ "; color:var(--accent); }
.eyebrow::after  { content:" ]"; color:var(--accent); }

/* ---- buttons ---- */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  font-family:var(--head); font-weight:500; font-size:.9rem; letter-spacing:.02em;
  padding:16px 30px; border-radius:var(--radius); border:1px solid transparent; transition:.25s var(--ease);
}
.btn svg { width:16px; height:16px; }
.btn-primary { background:var(--accent); color:var(--accent-ink); }
.btn-primary:hover { background:var(--accent-hover); transform:translateY(-2px); }
.btn-outline { background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.btn-outline:hover { border-color:var(--accent); color:var(--accent); }
.btn-ghost { background:rgba(255,255,255,.06); color:#fff; }
.btn-ghost:hover { background:rgba(255,255,255,.12); }

/* ---- enter-from-RIGHT staggered reveal ---- */
@media (prefers-reduced-motion: no-preference) {
  [data-reveal] { opacity:0; transform:translateX(48px); transition:opacity .9s var(--ease), transform .9s var(--ease); will-change:opacity,transform; }
  [data-reveal="up"]    { transform:translateY(34px); }
  [data-reveal="left"]  { transform:translateX(-48px); }
  [data-reveal="zoom"]  { transform:scale(1.04); opacity:0; }
  [data-reveal].is-visible { opacity:1; transform:none; }
}
/* On phones, reveal VERTICALLY — the horizontal enter-from-right offset (±48px) would
   otherwise extend page width and let the viewport pan sideways into empty space. */
@media (prefers-reduced-motion: no-preference) and (max-width:640px) {
  [data-reveal], [data-reveal="left"] { transform:translateY(28px); }
  [data-reveal].is-visible { transform:none; }
}

/* ============================================================ HEADER (stacked logo + desktop nav + hamburger) */
.hdr { position:fixed; top:0; left:0; right:0; z-index:70; transition:background .35s var(--ease), backdrop-filter .35s var(--ease), border-color .35s var(--ease); border-bottom:1px solid transparent; }
.hdr.scrolled { background:rgba(10,10,11,.82); backdrop-filter:blur(12px); border-bottom-color:var(--line-soft); }
.hdr-inner { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; }

/* stacked crimson logo: car icon / Huminic / M O T O R S */
.logo-box { display:inline-flex; flex-direction:column; align-items:center; gap:3px; background:var(--accent); color:#fff; padding:11px 26px 13px; text-transform:none; transition:background .25s var(--ease); }
.logo-box:hover { background:var(--accent-hover); }
.logo-box .lm-icon { line-height:0; }
.logo-box .lm-icon svg { width:26px; height:26px; display:block; }
.logo-box .lm-word { font-family:var(--head); font-weight:700; font-size:1.18rem; line-height:1; letter-spacing:.004em; }
.logo-box .lm-sub { font-family:var(--head); font-weight:600; font-size:.46rem; letter-spacing:.42em; line-height:1; padding-left:.42em; opacity:.92; }

/* desktop nav links */
.hdr-nav { display:flex; align-items:center; gap:30px; margin-top:24px; }
.hdr-nav a { font-family:var(--head); font-size:.92rem; font-weight:500; color:rgba(255,255,255,.82); position:relative; padding:4px 0; transition:color .2s var(--ease); }
.hdr-nav a::after { content:""; position:absolute; left:0; right:0; bottom:-3px; height:2px; background:var(--accent); transform:scaleX(0); transform-origin:right; transition:transform .3s var(--ease); }
.hdr-nav a:hover, .hdr-nav a.active { color:#fff; }
.hdr-nav a:hover::after, .hdr-nav a.active::after { transform:scaleX(1); transform-origin:left; }

.hdr-actions { display:flex; align-items:center; gap:14px; margin-top:20px; }
.btn-sm { padding:11px 22px; font-size:.82rem; }
.burger { width:50px; height:50px; display:none; place-items:center; border:1px solid var(--line); border-radius:var(--radius); transition:.25s var(--ease); background:rgba(10,10,11,.35); }
.burger:hover { border-color:#fff; }
.burger span { display:block; width:22px; height:2px; background:#fff; position:relative; transition:.3s var(--ease); }
.burger span::before, .burger span::after { content:""; position:absolute; left:0; width:22px; height:2px; background:#fff; transition:.3s var(--ease); }
.burger span::before { top:-7px; } .burger span::after { top:7px; }
.burger.open span { background:transparent; }
.burger.open span::before { top:0; transform:rotate(45deg); }
.burger.open span::after  { top:0; transform:rotate(-45deg); }

@media (max-width:980px){
  .hdr-nav { display:none; }
  .hdr-cust { display:none; }
  .burger { display:grid; }
}

/* full-screen menu overlay */
.menu { position:fixed; inset:0; z-index:69; background:rgba(8,8,9,.97); backdrop-filter:blur(6px);
  display:flex; flex-direction:column; justify-content:center; padding:0 var(--pad);
  opacity:0; pointer-events:none; transform:translateX(40px); transition:opacity .4s var(--ease), transform .4s var(--ease); }
.menu.open { opacity:1; pointer-events:auto; transform:none; }
.menu a { font-family:var(--head); font-size:clamp(2rem,7vw,4.4rem); font-weight:600; text-transform:uppercase;
  color:var(--muted); padding:10px 0; transition:color .25s var(--ease), padding-left .25s var(--ease); width:max-content; }
.menu a:hover { color:#fff; padding-left:18px; }
.menu a .idx { font-family:var(--body); font-size:.9rem; color:var(--accent); vertical-align:super; margin-right:14px; }
.menu-foot { position:absolute; bottom:36px; left:var(--pad); right:var(--pad); display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.85rem; color:var(--muted-2); }

/* ============================================================ HERO (car + huge heading, arrow links) */
.hero { min-height:100vh; display:flex; flex-direction:column; justify-content:flex-end; position:relative; padding-bottom:0; overflow:hidden; background:var(--bg); }
.hero__img {
  position:absolute; inset:0; z-index:0;
  background:url('/img/vehicles/hero-alt.jpg') center 58% / cover no-repeat;
  animation:heroDrift 18s ease-in-out infinite alternate;
  will-change:transform; transform-origin:50% 55%;
}
/* legibility scrims (separate layer so they don't drift with the image) */
.hero::before {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(10,10,11,.94) 0%, rgba(10,10,11,.6) 42%, rgba(10,10,11,.22) 78%, rgba(10,10,11,.4) 100%),
    linear-gradient(0deg, rgba(10,10,11,.95) 0%, rgba(10,10,11,.28) 42%, transparent 72%);
}
.hero::after {
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:radial-gradient(120% 90% at 78% 32%, rgba(184,32,28,.18), transparent 55%);
  opacity:.0; animation:heroGlow 7s ease-in-out infinite;
}
@keyframes heroDrift {
  0%   { transform:scale(1.12) translate3d(0%, 0%, 0); }
  100% { transform:scale(1.26) translate3d(-5.5%, -3.5%, 0); }
}
@keyframes heroGlow { 0%,100% { opacity:0; } 50% { opacity:1; } }
@media (prefers-reduced-motion: reduce) { .hero__img { animation:none; } .hero::after { animation:none; } }
.hero .wrap { width:100%; position:relative; z-index:2; }
.hero .scroll-cue { z-index:2; }
.hero h1 { max-width:15ch; margin-bottom:8px; }
.hero h1 em { font-style:normal; color:var(--accent); }
.hero-sub { max-width:44ch; color:var(--muted); font-size:1.1rem; margin:20px 0 0; }
.arrow-links { margin-top:52px; border-top:1px solid var(--line); }
.arrow-link {
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  font-family:var(--head); font-size:clamp(1.05rem,2.4vw,1.55rem); font-weight:500; text-transform:uppercase; color:#fff;
  padding:26px 0; border-bottom:1px solid var(--line); transition:.25s var(--ease); position:relative;
}
.arrow-link:hover { color:var(--accent); padding-left:14px; }
.arrow-link .ar { display:inline-grid; place-items:center; width:40px; height:40px; border:1px solid var(--line); border-radius:50%; transition:.25s var(--ease); }
.arrow-link:hover .ar { border-color:var(--accent); transform:translate(4px,-4px); }
.arrow-link .ar svg { width:18px; height:18px; }
.scroll-cue { position:absolute; right:var(--pad); bottom:36px; font-size:.75rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); writing-mode:vertical-rl; }

/* ============================================================ FULL-BLEED MEDIA */
.fullmedia { position:relative; height:clamp(360px,70vh,720px); overflow:hidden; }
.fullmedia img { width:100%; height:100%; object-fit:cover; }
.fullmedia.tint::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%,rgba(10,10,11,.6)); }

/* ============================================================ FOUNDER / ABOUT */
.about-lede { font-family:var(--head); font-weight:500; text-transform:none; font-size:clamp(1.5rem,3.4vw,2.6rem); line-height:1.25; color:#fff; max-width:22ch; }
.about-lede .accent { color:var(--accent); }
.sig-row { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:44px; padding-top:26px; border-top:1px solid var(--line); flex-wrap:wrap; }
.sig { font-family:var(--script); font-size:2.1rem; color:var(--accent); line-height:1; }
.sig-role { font-family:var(--head); font-size:.85rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:64px; }
.stat b { display:block; font-family:var(--head); font-weight:600; font-size:clamp(2.6rem,6vw,4.6rem); color:#fff; line-height:1; }
.stat b .plus { color:var(--accent); }
.stat span { display:block; margin-top:12px; font-size:.85rem; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); }

/* ============================================================ FEATURED COLLECTION */
.coll-head { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:56px; }
.coll-head h2 { max-width:16ch; }
.veh-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.veh-card { display:block; background:var(--bg); overflow:hidden; transition:background .3s var(--ease); position:relative; }
.veh-card:hover { background:var(--bg-2); }
.veh-photo { position:relative; aspect-ratio:16/11; overflow:hidden; background:var(--bg-2); }
.veh-photo img { width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); filter:saturate(.92); }
.veh-card:hover .veh-photo img { transform:scale(1.06); }
.veh-badge { position:absolute; top:0; left:0; font-family:var(--head); font-size:.68rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; padding:7px 12px; background:var(--accent); color:#fff; }
.veh-badge.cpo { background:#fff; color:#000; }
.veh-badge.used { background:rgba(10,10,11,.8); color:#fff; border:1px solid var(--line); }
.veh-info { padding:24px 24px 26px; }
.veh-title { font-family:var(--head); font-size:1.15rem; text-transform:uppercase; color:#fff; font-weight:600; }
.veh-sub { font-size:.85rem; color:var(--muted); margin-top:6px; }
.veh-foot { display:flex; align-items:center; justify-content:space-between; margin-top:20px; padding-top:18px; border-top:1px solid var(--line-soft); }
.veh-price { font-family:var(--head); font-size:1.3rem; font-weight:600; color:#fff; }
.veh-link { font-family:var(--head); font-size:.82rem; color:var(--muted); display:inline-flex; align-items:center; gap:6px; transition:color .25s var(--ease); }
.veh-card:hover .veh-link { color:var(--accent); }
.veh-link svg { width:14px; height:14px; }
.veh-eta { display:flex; align-items:center; gap:8px; margin-top:16px; font-family:var(--head); font-size:.82rem; color:var(--accent); }
.veh-eta svg { width:15px; height:15px; flex:none; }
.veh-eta b { color:#fff; font-weight:600; }
.veh-stock { display:inline-flex; align-items:center; gap:8px; font-family:var(--head); font-size:.82rem; color:var(--muted); }
.veh-stock .sdot { width:7px; height:7px; border-radius:50%; background:#3fbf6a; box-shadow:0 0 0 3px rgba(63,191,106,.16); flex:none; }
.veh-stock b { color:#fff; }
.veh-stock.low { color:#e0a53d; }
.veh-stock.low .sdot { background:#e0a53d; box-shadow:0 0 0 3px rgba(224,165,61,.16); }

/* ============================================================ SERVICES */
.svc { background:var(--bg-2); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
.svc-list { border-top:1px solid var(--line); }
.svc-row { display:flex; align-items:center; gap:28px; padding:34px 0; border-bottom:1px solid var(--line); transition:.25s var(--ease); }
.svc-row:hover { padding-left:16px; }
.svc-num { font-family:var(--head); font-size:.9rem; color:var(--accent); min-width:52px; }
.svc-name { font-family:var(--head); font-size:clamp(1.3rem,3vw,2.2rem); text-transform:uppercase; font-weight:600; flex:1; color:#fff; }
.svc-desc { max-width:34ch; font-size:.9rem; color:var(--muted); }
.svc-arrow { color:var(--muted-2); transition:.25s var(--ease); }
.svc-row:hover .svc-arrow { color:var(--accent); transform:translateX(6px); }
.svc-arrow svg { width:30px; height:14px; }

/* ============================================================ CTA BAND */
.cta { position:relative; overflow:hidden; text-align:center; padding:clamp(80px,12vw,160px) var(--pad);
  background:linear-gradient(rgba(10,10,11,.62),rgba(10,10,11,.82)), url('/img/vehicles/aurora.jpg') center/cover; background-attachment:fixed; }
.cta h2 { max-width:18ch; margin:0 auto 18px; }
.cta p { max-width:48ch; margin:0 auto 30px; color:rgba(255,255,255,.8); }
.cta-actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
@media (max-width:1000px){ .cta { background-attachment:scroll; } }

/* ============================================================ FOOTER */
.foot { border-top:1px solid var(--line-soft); background:#060607; padding:clamp(56px,8vw,96px) 0 34px; }
.foot-word { font-family:var(--head); font-weight:600; font-size:clamp(1.6rem,5vw,3.2rem); text-transform:uppercase; letter-spacing:-.01em; color:#fff; line-height:1; margin-bottom:36px; }
.foot-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:32px; padding-bottom:40px; border-bottom:1px solid var(--line-soft); }
.foot-brand p { font-size:.9rem; max-width:32ch; margin-top:12px; }
.foot-col h4 { font-family:var(--head); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:16px; }
.foot-col ul { list-style:none; display:flex; flex-direction:column; gap:10px; }
.foot-col a, .foot-col li { font-size:.92rem; color:var(--muted); transition:color .25s var(--ease); }
.foot-col a:hover { color:#fff; }
.foot-bottom { display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding-top:22px; font-size:.82rem; color:var(--muted-2); }
.demo-badge { display:inline-flex; align-items:center; gap:8px; color:var(--accent); }
.demo-badge .dot { width:8px; height:8px; border-radius:50%; background:var(--accent); animation:pulse 2.4s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.foot-actions { display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.foot-dealer { display:inline-flex; align-items:center; gap:6px; font-family:var(--head); font-size:.82rem; color:var(--muted); transition:color .2s var(--ease); }
.foot-dealer:hover { color:#fff; }
.foot-logo { padding:9px 22px; align-self:flex-start; }
.foot-logo .lm-word { font-size:1rem; }
.foot-logo .lm-icon svg { width:20px; height:20px; }
.foot-logo .lm-sub { font-size:.4rem; }

/* version switcher pill */
.ver-switch { position:fixed; left:14px; bottom:14px; z-index:130; display:inline-flex; align-items:center; gap:8px;
  background:rgba(8,8,9,.9); border:1px solid var(--line); border-radius:999px; padding:8px 14px; font-family:var(--head); font-size:.78rem; color:var(--muted); backdrop-filter:blur(8px); }
.ver-switch b { color:var(--accent); }
.ver-switch a { color:#fff; text-decoration:underline; }

/* ============================================================ CAPTURE MODAL */
.modal-overlay { position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; background:rgba(4,4,5,.74); backdrop-filter:blur(6px); padding:20px; }
.modal-overlay.open { display:flex; }
.modal { position:relative; width:100%; max-width:440px; background:var(--surface); border:1px solid var(--line); border-radius:4px; padding:34px 30px 28px; box-shadow:0 30px 80px rgba(0,0,0,.6); animation:pop .28s ease; }
@keyframes pop { from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none} }
.modal-close { position:absolute; top:14px; right:14px; width:34px; height:34px; border-radius:4px; background:rgba(255,255,255,.06); display:grid; place-items:center; }
.modal-close:hover { background:rgba(255,255,255,.14); }
.modal-close svg { width:18px; height:18px; }
.modal .kicker { font-family:var(--head); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); }
.modal h3 { text-transform:uppercase; margin:10px 0 8px; font-size:1.5rem; }
.modal .field { margin-bottom:14px; }
.modal .field label { display:block; font-family:var(--head); font-size:.82rem; color:var(--muted); margin-bottom:6px; }
.modal .field input { width:100%; font-family:var(--body); font-size:.98rem; padding:13px 14px; border-radius:4px; background:var(--bg); border:1px solid var(--line); color:#fff; }
.modal .field input:focus { outline:none; border-color:var(--accent); }
.modal .field .err { display:none; color:#ff6b6b; font-size:.8rem; margin-top:5px; }
.modal .field.invalid input { border-color:#ff6b6b; }
.modal .field.invalid .err { display:block; }
.modal .disclosure { font-size:.82rem; color:var(--muted); background:var(--bg); border:1px solid var(--line-soft); border-radius:4px; padding:12px 14px; margin-top:6px; }
.modal .disclosure b { color:#fff; }
.modal-actions { display:flex; gap:10px; margin-top:18px; }
.modal-actions .btn { flex:1; }
.modal-success { text-align:center; padding:16px 6px 8px; display:none; }
.modal-success .check { width:60px; height:60px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; margin:0 auto 16px; }
.modal-success .check svg { width:28px; height:28px; }
.modal-success h3 { text-transform:uppercase; margin-bottom:8px; }
.empty-state { grid-column:1/-1; text-align:center; padding:60px 20px; color:var(--muted); }

/* ============================================================ PHOTO BAND */
.photo-band { position:relative; overflow:hidden; min-height:clamp(360px,58vh,540px); display:flex; align-items:center;
  background:linear-gradient(90deg, rgba(10,10,11,.92) 0%, rgba(10,10,11,.55) 55%, rgba(10,10,11,.15) 100%), url('/img/vehicles/trail.jpg') center 40% / cover no-repeat; }
.photo-band .wrap { position:relative; z-index:1; }
.photo-band .eyebrow { color:var(--muted); }
.photo-band h2 { max-width:18ch; margin:6px 0 14px; }
.photo-band p { max-width:46ch; color:rgba(255,255,255,.84); margin-bottom:24px; }
@media (max-width:820px){ .photo-band { background-position:center 45%; } }

/* ============================================================ SERVICE MENU */
.svc-menu { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); border-radius:4px; overflow:hidden; margin-top:36px; }
.svc-item { background:var(--bg-2); padding:26px 24px; transition:background .25s var(--ease); }
.svc-item:hover { background:var(--surface); }
.si-ic { width:40px; height:40px; border-radius:9px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; margin-bottom:16px; }
.si-ic svg { width:20px; height:20px; }
.svc-item h3 { text-transform:uppercase; font-size:1.02rem; color:#fff; margin-bottom:8px; }
.svc-item p { font-size:.86rem; color:var(--muted); line-height:1.5; }
.si-from { display:inline-block; margin-top:14px; font-family:var(--head); font-size:.82rem; font-weight:600; color:var(--accent); }
.svc-perks { display:flex; flex-wrap:wrap; gap:14px 26px; margin-top:30px; padding-top:24px; border-top:1px solid var(--line-soft); }
.svc-perks span { font-size:.88rem; color:var(--muted); }
.svc-perks b { color:#fff; font-family:var(--head); font-weight:600; }

/* ============================================================ CONTACT CHANNELS */
.channel-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:14px; margin-top:36px; }
.channel { display:flex; flex-direction:column; align-items:flex-start; text-align:left; background:var(--surface); border:1px solid var(--line-soft); border-radius:8px; padding:22px; transition:.22s var(--ease); cursor:pointer; }
.channel:hover { border-color:var(--accent); transform:translateY(-3px); background:var(--bg-2); }
.ch-ic { width:42px; height:42px; border-radius:10px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; margin-bottom:12px; }
.ch-ic svg { width:20px; height:20px; }
.ch-t { font-family:var(--head); font-size:1.05rem; text-transform:uppercase; color:#fff; }
.ch-d { font-size:.86rem; color:var(--muted); margin-top:4px; }
.contact-meta { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:24px; margin-top:36px; padding-top:30px; border-top:1px solid var(--line-soft); }
.contact-meta h4 { font-family:var(--head); font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); margin-bottom:10px; }
.contact-meta p { font-size:.94rem; color:var(--muted); line-height:1.5; }
.ai-24 { display:inline-flex; align-items:center; gap:8px; color:#fff; }
.ai-24 .ai-dot { width:8px; height:8px; border-radius:50%; background:#3fbf6a; box-shadow:0 0 0 4px rgba(63,191,106,.18); }

/* ============================================================ PRE-QUALIFICATION */
.prequal { position:relative; overflow:hidden; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);
  background:radial-gradient(1000px 380px at 82% -10%, rgba(184,32,28,.14), transparent 60%), var(--bg-2); }
.prequal-grid { display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
.prequal-left h2 { margin:14px 0 16px; }
.prequal-trust { list-style:none; display:flex; gap:24px; flex-wrap:wrap; margin-top:24px; }
.prequal-trust li { display:inline-flex; align-items:center; gap:7px; font-family:var(--head); font-size:.85rem; color:var(--muted); }
.prequal-trust svg { width:15px; height:15px; color:#3fbf6a; }
.prequal-card { background:var(--surface); border:1px solid var(--line); border-radius:4px; padding:clamp(24px,3vw,34px); box-shadow:0 24px 60px rgba(0,0,0,.42); }
.pq-field { margin-bottom:14px; }
.pq-field label { display:block; font-family:var(--head); font-size:.82rem; color:var(--muted); margin-bottom:6px; }
.pq-field label small { color:var(--muted-2); font-weight:400; }
.pq-field input { width:100%; font-family:var(--body); font-size:.98rem; padding:13px 14px; border-radius:4px; background:var(--bg); border:1px solid var(--line); color:#fff; }
.pq-field input:focus { outline:none; border-color:var(--accent); }
.pq-field .err { display:none; color:#ff6b6b; font-size:.8rem; margin-top:5px; }
.pq-field.invalid input { border-color:#ff6b6b; }
.pq-field.invalid .err { display:block; }
.pq-note { font-size:.76rem; color:var(--muted-2); margin-top:12px; }
.btn.full { width:100%; }
.prequal-success { text-align:center; }
.prequal-success .big-check { width:66px; height:66px; margin:0 auto 14px; border-radius:50%; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; animation:pop .4s ease; }
.prequal-success .big-check svg { width:32px; height:32px; }
.prequal-success h3 { text-transform:uppercase; color:#fff; margin-bottom:6px; }
.prequal-success .amt { font-family:var(--head); font-size:2.2rem; font-weight:600; color:var(--accent); margin:4px 0; }
.qual-cars { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top:20px; text-align:left; }
.qual-car { background:var(--bg); border:1px solid var(--line-soft); border-radius:4px; overflow:hidden; position:relative; transition:.2s var(--ease); }
.qual-car:hover { border-color:var(--accent); transform:translateY(-3px); }
.qual-car img { width:100%; aspect-ratio:16/11; object-fit:cover; }
.qual-car .qc-tag { position:absolute; top:0; left:0; font-family:var(--head); font-size:.58rem; font-weight:700; letter-spacing:.06em; padding:4px 8px; background:var(--accent); color:#fff; }
.qual-car .qc-body { padding:9px 11px; }
.qual-car .qc-name { font-family:var(--head); font-size:.85rem; color:#fff; }
.qual-car .qc-price { font-size:.8rem; color:var(--accent); font-family:var(--head); margin-top:2px; }
.qual-car .qc-price s { color:var(--muted-2); font-weight:400; margin-right:5px; }

/* ============================================================ COMPARISON */
.compare-wrap { border:1px solid var(--line-soft); border-radius:4px; overflow-x:auto; background:var(--surface); margin-top:8px; }
.compare-table { width:100%; border-collapse:collapse; min-width:560px; }
.compare-table th, .compare-table td { padding:16px 18px; text-align:center; border-bottom:1px solid var(--line-soft); }
.compare-table thead th { font-family:var(--head); font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.compare-table thead th:first-child, .compare-table td:first-child, .compare-table tbody th { text-align:left; }
.compare-table tbody th { font-family:var(--head); font-weight:600; color:#fff; font-size:1rem; }
.compare-table .us-row { background:rgba(184,32,28,.08); }
.compare-table .us-row th { color:var(--accent); }
.compare-table .us-row td { color:#fff; font-family:var(--head); font-weight:600; font-size:1.12rem; }
.compare-table tr:last-child td, .compare-table tr:last-child th { border-bottom:none; }
.cnum { font-family:var(--head); font-weight:600; }
.cnum.win { color:#3fbf6a; } .cnum.lose { color:#e0553d; }
.us-badge { display:inline-block; margin-left:8px; font-family:var(--head); font-size:.58rem; font-weight:700; letter-spacing:.05em; padding:2px 7px; border-radius:3px; background:var(--accent); color:#fff; vertical-align:middle; }

/* ============================================================ CONFETTI */
.confetti-layer { position:fixed; inset:0; z-index:260; pointer-events:none; overflow:hidden; }
.confetti-bit { position:absolute; top:-12px; width:9px; height:14px; opacity:.95; will-change:transform; animation:confFall linear forwards; }
@keyframes confFall { to { transform:translateY(105vh) rotate(720deg); } }

/* ============================================================ AI ACCOUTREMENTS */

/* subtle intermittent circular glow encircling the AI chat launcher */
.widget-ring { position:fixed; z-index:140; right:14px; bottom:14px; width:60px; height:60px; border-radius:50%; pointer-events:none; }
.widget-ring::before { content:""; position:absolute; inset:-2px; border-radius:50%; box-shadow:0 0 0 0 rgba(184,32,28,0); animation:glowPulse 4s ease-in-out infinite; }
.widget-ring::after { content:""; position:absolute; inset:-6px; border-radius:50%; border:1.5px solid rgba(184,32,28,0); animation:glowRing 4s ease-in-out infinite; }
@keyframes glowPulse { 0%,100% { box-shadow:0 0 0 0 rgba(184,32,28,0); } 50% { box-shadow:0 0 18px 5px rgba(184,32,28,.3); } }
@keyframes glowRing { 0%,100% { border-color:rgba(184,32,28,0); transform:scale(.98); } 50% { border-color:rgba(184,32,28,.32); transform:scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .widget-ring::before, .widget-ring::after { animation:none; } }
.widget-ring.stopped { display:none; }

/* per-card AI quick-actions (top-right on hover) */
.veh-hover { position:absolute; top:12px; right:12px; z-index:3; display:flex; flex-direction:column; align-items:flex-end; gap:6px; opacity:0; transform:translateY(-6px); transition:.22s var(--ease); pointer-events:none; }
.veh-card:hover .veh-hover { opacity:1; transform:none; pointer-events:auto; }
.veh-hover .vh-primary { font-family:var(--head); font-size:.78rem; font-weight:600; padding:7px 12px; border-radius:3px; background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(0,0,0,.45); display:inline-flex; align-items:center; gap:6px; }
.veh-hover .vh-primary svg { width:13px; height:13px; }
.veh-hover .vh-sub { display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.veh-hover .vh-act { font-family:var(--head); font-size:.72rem; font-weight:500; padding:5px 10px; border-radius:3px; background:rgba(8,8,9,.85); color:#fff; border:1px solid var(--line); backdrop-filter:blur(6px); display:inline-flex; align-items:center; gap:6px; transition:.16s; }
.veh-hover .vh-act:hover { background:var(--accent); border-color:transparent; }
.veh-hover .vh-primary svg, .veh-hover .vh-act svg { width:13px; height:13px; flex:none; }
@media (hover:none){ .veh-hover { opacity:1; transform:none; pointer-events:auto; position:static; flex-direction:row; flex-wrap:wrap; margin:12px 24px 0; align-items:flex-start; } }

/* AI-assistant strip under the collection */
.ai-strip { display:flex; align-items:center; gap:18px; flex-wrap:wrap; justify-content:space-between; margin-top:44px; padding:26px 28px; background:var(--accent-soft); border:1px solid rgba(184,32,28,.35); border-radius:3px; }
.ai-strip .ai-dot { width:10px; height:10px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 5px rgba(184,32,28,.2); animation:pulse 2.2s infinite; flex:none; }
.ai-strip .ai-copy { flex:1; min-width:240px; }
.ai-strip .ai-copy b { font-family:var(--head); color:#fff; text-transform:uppercase; letter-spacing:.02em; }
.ai-strip .ai-copy p { font-size:.9rem; margin-top:2px; }
.ai-strip .ai-actions { display:flex; gap:10px; flex-wrap:wrap; }

/* 10s "special deals" AI interstitial */
.special-overlay { position:fixed; inset:0; z-index:210; display:none; align-items:center; justify-content:center; background:rgba(3,3,4,.84); backdrop-filter:blur(8px); padding:20px; }
.special-overlay.open { display:flex; animation:fadeIn .3s ease; }
@keyframes fadeIn { from{opacity:0} to{opacity:1} }
.special-modal { position:relative; width:100%; max-width:480px; text-align:center; background:linear-gradient(180deg,var(--surface),var(--bg-2)); border:1px solid var(--line); border-radius:4px; padding:44px 36px 34px; box-shadow:0 30px 90px rgba(0,0,0,.7); animation:pop .3s ease; }
.special-modal .spark { width:60px; height:60px; margin:0 auto 20px; border-radius:12px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; }
.special-modal .spark svg { width:32px; height:32px; }
.special-modal .kicker { font-family:var(--head); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.special-modal h3 { text-transform:uppercase; font-size:1.7rem; margin:12px 0 12px; line-height:1.1; }
.special-modal p { font-size:1rem; margin-bottom:26px; color:var(--muted); }
.special-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.special-modal .special-close { position:absolute; top:14px; right:14px; width:34px; height:34px; border-radius:4px; background:rgba(255,255,255,.06); display:grid; place-items:center; }
.special-modal .special-close:hover { background:rgba(255,255,255,.14); }
.special-modal .special-close svg { width:18px; height:18px; }
.special-modal .fineprint { margin-top:18px; margin-bottom:0; font-size:.76rem; color:var(--muted-2); }

/* FOMO toasts */
.toast-stack { position:fixed; left:20px; bottom:64px; z-index:150; display:flex; flex-direction:column; gap:10px; width:min(340px,calc(100vw - 40px)); pointer-events:none; }
.toast { pointer-events:auto; display:flex; align-items:flex-start; gap:12px; background:rgba(18,18,20,.95); backdrop-filter:blur(10px); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:4px; padding:13px 14px; box-shadow:0 16px 40px rgba(0,0,0,.5); animation:toastIn .4s cubic-bezier(.2,.9,.3,1); }
.toast.leaving { animation:toastOut .32s ease forwards; }
@keyframes toastIn { from{opacity:0; transform:translateX(-16px)} to{opacity:1; transform:none} }
@keyframes toastOut { to{opacity:0; transform:translateX(-16px)} }
.toast .tico { flex:none; width:34px; height:34px; border-radius:6px; background:var(--accent-soft); color:var(--accent); display:grid; place-items:center; }
.toast .tico svg { width:19px; height:19px; }
.toast .tbody { font-size:.86rem; color:#fff; line-height:1.4; }
.toast .tbody b { color:var(--accent); font-weight:600; }
.toast .ttime { font-size:.72rem; color:var(--muted-2); margin-top:3px; }
.toast .tclose { flex:none; background:none; border:none; color:var(--muted-2); font-size:1.1rem; line-height:1; padding:0 2px; }
.toast .tclose:hover { color:#fff; }

/* ============================================================ RESPONSIVE */
@media (max-width:900px){
  .stats { grid-template-columns:1fr; gap:36px; }
  .foot-grid { grid-template-columns:1fr 1fr; }
  .svc-desc { display:none; }
  .prequal-grid { grid-template-columns:1fr; gap:32px; }
}
@media (max-width:560px){
  .foot-grid { grid-template-columns:1fr; }
  .logo-box { padding:18px 22px; font-size:1rem; }
}