/* KEYTRONIX — Frontend Stylesheet
 * Extracted from index.html Phase 2D
 * DO NOT modify inline — edit this file only
 * Served from: public_html/assets/css/main.css
 */

/* ═══════════════════════════════════════════
   KEYTRONIX2026 — v3
   5 THEMES FROM v1 (White+Navy+Gold base)
   All corrections from spec document applied
═══════════════════════════════════════════ */

/* ── DEFAULT: Classic — White + Navy + Gold ── */
:root {
  --bg:          #FFFFFF;
  --bg-alt:      #F8F7F4;
  --bg-warm:     #F2EFE9;
  --text:        #1A2540;
  --text-mid:    #6B7280;
  --text-light:  #9CA3AF;
  --heading:     #0E2044;
  --primary:     #0E2044;
  --primary-mid: #1A3060;
  --accent:      #B8811F;
  --accent-lt:   #D4A030;
  --accent-pale: #F5E6C8;
  --border:      #E2DDD4;
  --card-bg:     #FFFFFF;
  --card-border: #E2DDD4;
  --nav-bg:      rgba(255,255,255,0.97);
  --nav-border:  #F5E6C8;
  --trust-bg:    #0E2044;
  --trust-text:  rgba(255,255,255,0.88);
  --footer-bg:   #0E2044;
  --footer-text: rgba(255,255,255,0.58);
  --shadow:      rgba(14,32,68,0.09);
  --shadow-md:   rgba(14,32,68,0.15);
  --sticky-bg:   #0E2044;
  --sticky-text: #ffffff;
  --input-bg:    #ffffff;
  --callout-bg:  #0E2044;
  --callout-text:#ffffff;
  --red:         #CC1111;
  --red-glow:    rgba(204,17,17,0.25);
}
/* ── Midnight — Dark Navy + Gold ── */
[data-theme="midnight"] {
  --bg:#0B1628;--bg-alt:#111D33;--bg-warm:#142240;
  --text:#E8E4DC;--text-mid:#8A8F9E;--text-light:#6B7280;
  --heading:#F5F0E8;--primary:#C8952A;--primary-mid:#E8B84B;
  --accent:#C8952A;--accent-lt:#E8B84B;--accent-pale:rgba(200,149,42,0.15);
  --border:rgba(200,149,42,0.2);--card-bg:#111D33;--card-border:rgba(200,149,42,0.2);
  --nav-bg:rgba(11,22,40,0.97);--nav-border:rgba(200,149,42,0.2);
  --trust-bg:#070f1c;--trust-text:rgba(255,255,255,0.8);
  --footer-bg:#070f1c;--footer-text:rgba(255,255,255,0.5);
  --shadow:rgba(0,0,0,0.3);--shadow-md:rgba(0,0,0,0.42);
  --sticky-bg:#C8952A;--sticky-text:#0B1628;
  --input-bg:#0B1628;--callout-bg:#070f1c;--callout-text:#E8E4DC;
  --red:#CC1111;--red-glow:rgba(204,17,17,0.25);
}
/* ── Carbon — Black + Cyan ── */
[data-theme="carbon"] {
  --bg:#0a0a0a;--bg-alt:#111111;--bg-warm:#161616;
  --text:#E8E8E8;--text-mid:#888888;--text-light:#555555;
  --heading:#FFFFFF;--primary:#00D4FF;--primary-mid:#00A8CC;
  --accent:#00D4FF;--accent-lt:#40E0FF;--accent-pale:rgba(0,212,255,0.1);
  --border:rgba(0,212,255,0.15);--card-bg:#111111;--card-border:rgba(0,212,255,0.2);
  --nav-bg:rgba(10,10,10,0.97);--nav-border:rgba(0,212,255,0.15);
  --trust-bg:#000000;--trust-text:rgba(255,255,255,0.8);
  --footer-bg:#000000;--footer-text:rgba(255,255,255,0.45);
  --shadow:rgba(0,212,255,0.07);--shadow-md:rgba(0,212,255,0.14);
  --sticky-bg:#00D4FF;--sticky-text:#000000;
  --input-bg:#0a0a0a;--callout-bg:#000000;--callout-text:#E8E8E8;
  --red:#CC1111;--red-glow:rgba(204,17,17,0.25);
}
/* ── Slate — Grey + Gold ── */
[data-theme="slate"] {
  --bg:#F4F5F7;--bg-alt:#ECEEF2;--bg-warm:#E8EAF0;
  --text:#2D3748;--text-mid:#718096;--text-light:#A0AEC0;
  --heading:#1A202C;--primary:#2D3748;--primary-mid:#4A5568;
  --accent:#C8952A;--accent-lt:#D4A030;--accent-pale:#FFF3DC;
  --border:#CBD5E0;--card-bg:#FFFFFF;--card-border:#CBD5E0;
  --nav-bg:rgba(244,245,247,0.97);--nav-border:#CBD5E0;
  --trust-bg:#2D3748;--trust-text:rgba(255,255,255,0.85);
  --footer-bg:#1A202C;--footer-text:rgba(255,255,255,0.55);
  --shadow:rgba(45,55,72,0.08);--shadow-md:rgba(45,55,72,0.14);
  --sticky-bg:#2D3748;--sticky-text:#ffffff;
  --input-bg:#ffffff;--callout-bg:#2D3748;--callout-text:#ffffff;
  --red:#CC1111;--red-glow:rgba(204,17,17,0.25);
}
/* ── Warm — Amber + Brown ── */
[data-theme="warm"] {
  --bg:#FFFDF8;--bg-alt:#FDF8F0;--bg-warm:#FAF3E6;
  --text:#3D2B1F;--text-mid:#7C5C48;--text-light:#A68070;
  --heading:#2C1A0E;--primary:#5C3317;--primary-mid:#7A4520;
  --accent:#C8761A;--accent-lt:#E08B25;--accent-pale:#FDE8C8;
  --border:#E8D5BC;--card-bg:#FFFDF8;--card-border:#E8D5BC;
  --nav-bg:rgba(255,253,248,0.97);--nav-border:#E8D5BC;
  --trust-bg:#3D2B1F;--trust-text:rgba(255,248,235,0.85);
  --footer-bg:#2C1A0E;--footer-text:rgba(255,240,210,0.55);
  --shadow:rgba(60,30,10,0.08);--shadow-md:rgba(60,30,10,0.14);
  --sticky-bg:#5C3317;--sticky-text:#FDE8C8;
  --input-bg:#FFFDF8;--callout-bg:#3D2B1F;--callout-text:#FDF8F0;
  --red:#CC1111;--red-glow:rgba(204,17,17,0.25);
}

/* ═══════════════════════════════════════════
   GLOBAL RESET & BASE
═══════════════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);color:var(--text);
  font-family:'Source Sans 3',sans-serif;
  font-weight:400;font-size:18px;line-height:1.8;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  transition:background 0.35s,color 0.35s;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{cursor:pointer;border:none;background:none;font-family:inherit;}
h1,h2,h3,h4{font-family:'Playfair Display',serif;line-height:1.15;color:var(--heading);transition:color 0.35s;}

/* ─── BUTTONS ─── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;
  font-family:'Montserrat',sans-serif;font-weight:700;
  border-radius:7px;transition:all 0.2s ease;
  white-space:nowrap;letter-spacing:0.02em;font-size:0.92rem;
}
.btn-primary{background:var(--primary);color:var(--bg);padding:0.85rem 1.9rem;box-shadow:0 4px 16px var(--shadow-md);}
.btn-primary:hover{background:var(--accent);color:var(--bg);transform:translateY(-2px);}
.btn-gold{background:var(--accent-lt);color:var(--primary);padding:0.85rem 1.9rem;font-weight:700;}
.btn-gold:hover{background:var(--accent);transform:translateY(-2px);}
.btn-ghost{background:transparent;color:var(--heading);border:2px solid var(--primary);padding:0.82rem 1.8rem;}
.btn-ghost:hover{background:var(--primary);color:var(--bg);}
.btn-messenger{background:#0084FF;color:#fff;padding:0.85rem 1.9rem;}
.btn-messenger:hover{background:#006acc;transform:translateY(-2px);}
.btn-red{
  background:var(--red);color:#fff;padding:0.88rem 1.9rem;
  box-shadow:0 4px 18px var(--red-glow);
  animation:redPulse 2.5s ease-in-out infinite;
}
.btn-red:hover{background:#aa0e0e;animation:none;transform:translateY(-2px);}
@keyframes redPulse{0%,100%{box-shadow:0 4px 18px var(--red-glow);}50%{box-shadow:0 4px 26px rgba(204,17,17,0.5),0 0 0 5px rgba(204,17,17,0.08);}}
.btn-lg{padding:1rem 2.2rem;font-size:1rem;}
.btn-block{width:100%;}

/* ─── FADE UP ─── */
.fade-up{opacity:0;transform:translateY(22px);transition:opacity 0.58s ease,transform 0.58s ease;}
.fade-up.in{opacity:1;transform:translateY(0);}
.fade-up.d1{transition-delay:0.1s;}.fade-up.d2{transition-delay:0.18s;}
.fade-up.d3{transition-delay:0.26s;}.fade-up.d4{transition-delay:0.34s;}

/* ─── SECTION LABELS ─── */
.eyebrow{font-family:'Share Tech Mono',monospace;font-size:0.76rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent);margin-bottom:0.7rem;transition:color 0.35s;}
.section-title{font-size:clamp(1.8rem,3.4vw,2.8rem);font-weight:800;margin-bottom:1rem;}
.section-sub{font-size:1.1rem;color:var(--text-mid);max-width:560px;line-height:1.85;}
.gold-rule{width:52px;height:3px;background:var(--accent-lt);border-radius:2px;margin:0.75rem 0 1.6rem;transition:background 0.35s;}
.section{padding:80px 5vw;}
.section-inner{max-width:1160px;margin:0 auto;}
.section-alt{background:var(--bg-warm);transition:background 0.35s;}
.page{display:none;}.page.active{display:block;}

/* ═══════════════════════════════════════════
   SPLASH — logo only, fast
═══════════════════════════════════════════ */
#splash{
  position:fixed;inset:0;z-index:9999;
  background:#08111e;
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:0;
  overflow:hidden;
}
/* radial bg glow */
#splash::before{
  content:'';position:absolute;
  width:600px;height:600px;
  background:radial-gradient(circle,rgba(204,17,17,0.08) 0%,transparent 65%);
  border-radius:50%;
  animation:splashGlowPulse 3s ease-in-out infinite;
  pointer-events:none;
}
@keyframes splashGlowPulse{
  0%,100%{transform:scale(1);opacity:0.6;}
  50%{transform:scale(1.15);opacity:1;}
}
/* logo */
.sp-logo{
  width:min(160px,38vw);height:min(160px,38vw);
  border-radius:50%;object-fit:cover;position:relative;z-index:2;
  box-shadow:
    0 0 0px rgba(204,17,17,0),
    0 0 80px rgba(204,17,17,0);
  opacity:0;
  animation:
    spLogoFade 0.7s cubic-bezier(0.22,1,0.36,1) 0.2s forwards,
    spLogoGlow 0.9s ease 0.8s forwards;
  margin-bottom:1.4rem;
}
@keyframes spLogoFade{
  from{opacity:0;transform:scale(0.88);}
  to{opacity:1;transform:scale(1);}
}
@keyframes spLogoGlow{
  from{box-shadow:0 0 0px rgba(204,17,17,0),0 0 0px rgba(204,17,17,0);}
  to{box-shadow:0 0 40px rgba(204,17,17,0.55),0 0 80px rgba(204,17,17,0.2);}
}
/* name — gold shimmer sweep */
.sp-name{
  font-family:'Montserrat',sans-serif;font-weight:900;
  font-size:clamp(2rem,7vw,3.8rem);
  letter-spacing:0.12em;
  position:relative;z-index:2;
  background:linear-gradient(
    105deg,
    #ffffff 0%,#ffffff 30%,
    #FFE070 42%,#FFD040 50%,#FFE070 58%,
    #ffffff 70%,#ffffff 100%
  );
  background-size:250% auto;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  opacity:0;transform:translateY(14px);
  animation:
    spNameIn 0.65s cubic-bezier(0.22,1,0.36,1) 0.9s forwards,
    spShimmer 2.4s linear 1.4s infinite;
}
@keyframes spNameIn{
  to{opacity:1;transform:translateY(0);}
}
@keyframes spShimmer{
  0%{background-position:200% center;}
  100%{background-position:-100% center;}
}
/* divider line */
.sp-divider{
  width:0;height:2px;
  background:linear-gradient(90deg,transparent,rgba(204,17,17,0.7),transparent);
  margin:0.7rem 0;position:relative;z-index:2;
  animation:spDivider 0.6s ease 1.45s forwards;
}
@keyframes spDivider{to{width:min(260px,50vw);}}
/* tagline */
.sp-tag{
  font-family:'Montserrat',sans-serif;font-weight:300;
  font-size:clamp(0.75rem,1.8vw,1rem);
  letter-spacing:0.28em;text-transform:uppercase;
  color:rgba(255,255,255,0.55);
  position:relative;z-index:2;
  opacity:0;transform:translateY(8px);
  animation:spTagIn 0.6s ease 1.6s forwards;
}
@keyframes spTagIn{to{opacity:1;transform:translateY(0);}}
/* welcome whisper */
.sp-welcome{
  font-family:'Source Sans 3',sans-serif;font-style:italic;
  font-size:clamp(0.72rem,1.3vw,0.88rem);
  color:rgba(255,255,255,0.28);letter-spacing:0.04em;
  position:relative;z-index:2;margin-top:0.9rem;
  opacity:0;
  animation:spTagIn 0.7s ease 2.1s forwards;
}
#splash.exit{animation:spOut 0.8s cubic-bezier(0.4,0,1,1) forwards;}
@keyframes spOut{
  0%{opacity:1;transform:scale(1);}
  100%{opacity:0;transform:scale(1.04);pointer-events:none;}
}

/* ═══════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════ */
#navbar{
  position:fixed;top:0;left:0;right:0;z-index:500;height:72px;
  display:flex;align-items:center;
  background:var(--nav-bg);
  border-bottom:2px solid var(--nav-border);
  box-shadow:0 2px 16px var(--shadow);
  backdrop-filter:blur(14px);
  transition:background 0.35s,border-color 0.35s,box-shadow 0.3s;
}
#navbar.scrolled{box-shadow:0 4px 24px var(--shadow-md);}
.nav-inner{width:100%;max-width:1400px;margin:0 auto;padding:0 2rem;display:flex;align-items:center;justify-content:space-between;gap:0.5rem;}
.nav-logo{display:flex;align-items:center;gap:0.65rem;text-decoration:none;}
.nav-logo-img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--accent-lt);}
.nav-logo-text{font-family:'Montserrat',sans-serif;font-weight:900;font-size:1.2rem;letter-spacing:0.06em;color:var(--heading);transition:color 0.35s;}
.nav-logo-text span{color:var(--accent);}
.nav-links{display:flex;align-items:center;gap:0.15rem;}
.nav-links a{font-family:'Montserrat',sans-serif;font-size:0.88rem;font-weight:600;color:var(--text-mid);padding:0.45rem 0.8rem;border-radius:6px;letter-spacing:0.03em;transition:color 0.2s,background 0.2s;}
.nav-links a:hover,.nav-links a.active{color:var(--accent);background:var(--accent-pale);}
.nav-cta{display:flex;align-items:center;gap:0.65rem;}
.nav-phone{font-family:'Montserrat',sans-serif;font-weight:700;font-size:0.78rem;color:var(--heading);display:flex;align-items:center;gap:0.3rem;transition:color 0.35s;}
.nav-phone span{color:var(--accent);}
.nav-call{background:var(--red);color:#fff!important;padding:0.5rem 1.1rem;border-radius:6px;font-family:'Montserrat',sans-serif;font-size:0.84rem!important;font-weight:700;letter-spacing:0.06em;white-space:nowrap;animation:redPulse 2.5s ease-in-out infinite;}
.nav-call:hover{background:#aa0e0e;animation:none;}
.hamburger{display:none;flex-direction:column;gap:5px;width:36px;height:36px;align-items:center;justify-content:center;background:var(--bg-alt);border-radius:7px;}
.hamburger span{display:block;width:20px;height:2px;background:var(--heading);border-radius:2px;transition:all 0.3s;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.nav-mob{display:none;position:fixed;top:72px;left:0;right:0;background:var(--bg);border-bottom:2px solid var(--accent-pale);box-shadow:0 8px 32px var(--shadow-md);padding:1.25rem 5vw 1.75rem;z-index:499;flex-direction:column;gap:0.4rem;transition:background 0.35s;}
.nav-mob.open{display:flex;}
.nav-mob a{font-family:'Montserrat',sans-serif;font-size:0.95rem;font-weight:600;color:var(--heading);padding:0.7rem 1rem;border-radius:8px;display:flex;align-items:center;gap:0.5rem;transition:background 0.2s,color 0.2s;}
.nav-mob a:hover{background:var(--accent-pale);color:var(--accent);}
.nav-mob-btns{display:flex;flex-direction:column;gap:0.6rem;margin-top:0.75rem;}

/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
#hero-section{
  min-height:100vh;display:flex;align-items:center;
  padding:100px 5vw 80px;position:relative;overflow:hidden;
  background:var(--bg-alt);transition:background 0.35s;
}
.hero-diagonal{position:absolute;inset:0;background:linear-gradient(160deg,var(--bg) 55%,var(--bg-warm) 100%);transition:background 0.35s;}
.hero-bar{position:absolute;left:0;top:0;bottom:0;width:6px;background:linear-gradient(180deg,var(--accent-pale),var(--accent-lt),var(--accent-pale));}
.hero-inner{position:relative;z-index:2;max-width:700px;}
.hero-badge{
  display:inline-flex;align-items:center;gap:0.6rem;
  background:var(--accent-pale);border:1.5px solid var(--accent-lt);
  color:var(--accent);font-family:'Montserrat',sans-serif;
  font-size:0.75rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  padding:0.4rem 1rem;border-radius:100px;margin-bottom:1.6rem;transition:all 0.35s;
}
.hero-badge-dot{width:7px;height:7px;background:var(--red);border-radius:50%;animation:dotPulse 2s infinite;}
@keyframes dotPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.4;transform:scale(1.5);}}
h1.hero-title{font-size:clamp(2.4rem,5.5vw,4.2rem);font-weight:800;margin-bottom:1.4rem;line-height:1.1;}
h1.hero-title .hl{color:var(--accent);}
h1.hero-title .hl2{color:var(--red);}
.hero-sub{font-size:1.18rem;color:var(--text-mid);max-width:520px;margin-bottom:1.2rem;line-height:1.8;}
.hero-nastf{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-family:'Montserrat',sans-serif;font-size:0.82rem;font-weight:700;
  letter-spacing:0.06em;color:var(--primary);margin-bottom:2rem;
  background:rgba(14,32,68,0.06);border:1px solid rgba(14,32,68,0.1);
  padding:0.4rem 1rem;border-radius:100px;transition:all 0.35s;
}
.hero-actions{display:flex;gap:0.75rem;flex-wrap:wrap;margin-bottom:3rem;}
.hero-stats{display:flex;gap:2.5rem;flex-wrap:wrap;padding-top:2rem;border-top:2px solid var(--border);transition:border-color 0.35s;}
.stat-num{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;color:var(--accent);line-height:1;}
.stat-label{font-size:0.88rem;color:var(--text-mid);margin-top:3px;font-weight:500;}

/* ═══════════════════════════════════════════
   TRUST BAR
═══════════════════════════════════════════ */
.trust-bar{background:var(--trust-bg);padding:1.1rem 5vw;display:flex;align-items:center;justify-content:center;gap:2.5rem;flex-wrap:wrap;transition:background 0.35s;}
.trust-item{display:flex;align-items:center;gap:0.5rem;font-family:'Montserrat',sans-serif;font-size:0.9rem;font-weight:600;color:var(--trust-text);letter-spacing:0.03em;}
.trust-icon{color:var(--accent-lt);}
.trust-sep{width:1px;height:18px;background:rgba(255,255,255,0.15);}

/* ═══════════════════════════════════════════
   SERVICE OVERVIEW CARDS
═══════════════════════════════════════════ */
.svc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1px;background:var(--border);border:1px solid var(--border);border-radius:14px;overflow:hidden;transition:background 0.35s,border-color 0.35s;}
.svc-card{background:var(--card-bg);padding:1.6rem;position:relative;overflow:hidden;transition:background 0.25s;cursor:default;}
.svc-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--accent-lt);transform:scaleX(0);transform-origin:left;transition:transform 0.3s ease;}
.svc-card:hover{background:var(--bg-alt);}
.svc-card:hover::after{transform:scaleX(1);}
.svc-icon{width:44px;height:44px;background:var(--accent-pale);border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;margin-bottom:0.9rem;transition:background 0.25s;}
.svc-card:hover .svc-icon{background:var(--accent-lt);}
.svc-card h3{font-family:'Montserrat',sans-serif;font-size:0.96rem;font-weight:700;color:var(--heading);margin-bottom:0.4rem;letter-spacing:0.01em;}
.svc-card p{font-size:0.88rem;color:var(--text-mid);line-height:1.68;}
.svc-badge{position:absolute;top:12px;right:12px;font-family:'Share Tech Mono',monospace;font-size:0.76rem;letter-spacing:0.08em;text-transform:uppercase;background:var(--accent-pale);color:var(--accent);border:1px solid var(--accent-lt);padding:3px 8px;border-radius:100px;opacity:0.8;}

/* ═══════════════════════════════════════════
   ABOUT
═══════════════════════════════════════════ */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;}
.about-logo-col{display:flex;flex-direction:column;align-items:center;gap:1.5rem;}
.about-logo-img{width:min(230px,55%);height:min(230px,55%);border-radius:50%;object-fit:cover;border:3px solid var(--accent-lt);box-shadow:0 0 50px rgba(204,17,17,0.3),0 8px 32px var(--shadow-md);}
.about-creds{display:flex;flex-direction:column;gap:0.65rem;width:100%;}
.cred{display:flex;align-items:center;gap:0.7rem;background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:8px;padding:0.7rem 1rem;font-size:0.85rem;color:var(--text);font-weight:500;transition:background 0.35s,border-color 0.35s;}
.cred-icon{color:var(--accent);font-size:0.95rem;flex-shrink:0;}
.about-text p{font-size:0.95rem;color:var(--text-mid);line-height:1.8;margin-bottom:1rem;}
.about-text p:last-of-type{margin-bottom:1.6rem;}

/* ═══════════════════════════════════════════
   OEM & AFTERMARKET
═══════════════════════════════════════════ */
.oem-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;}
.oem-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:14px;padding:1.8rem 1.5rem;transition:border-color 0.25s,box-shadow 0.25s,background 0.35s;}
.oem-card:hover{border-color:var(--accent-lt);box-shadow:0 4px 24px var(--shadow-md);}
.oem-card-icon{font-size:1.8rem;margin-bottom:1rem;}
.oem-card h3{font-family:'Montserrat',sans-serif;font-size:0.95rem;font-weight:700;color:var(--heading);margin-bottom:0.5rem;}
.oem-card p{font-size:0.85rem;color:var(--text-mid);line-height:1.65;}
.oem-badge{display:inline-flex;align-items:center;gap:0.3rem;font-size:0.76rem;font-weight:700;letter-spacing:0.05em;padding:0.3rem 0.75rem;border-radius:100px;margin-top:0.9rem;font-family:'Montserrat',sans-serif;}
.obadge-oem{background:var(--accent-pale);color:var(--accent);border:1px solid var(--accent-lt);}
.obadge-am{background:var(--bg-alt);color:var(--text-mid);border:1px solid var(--border);}
.obadge-so{background:rgba(204,17,17,0.08);color:var(--red);border:1px solid rgba(204,17,17,0.2);}
.oem-notice{background:var(--bg-alt);border:1.5px solid var(--accent-lt);border-radius:10px;padding:1.3rem 1.5rem;margin-top:1.8rem;display:flex;gap:1rem;align-items:flex-start;transition:background 0.35s,border-color 0.35s;}
.oem-notice p{font-size:0.87rem;color:var(--text-mid);line-height:1.7;}
.oem-notice strong{color:var(--accent);}

/* ═══════════════════════════════════════════
   WHY KEYTRONIX
═══════════════════════════════════════════ */
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.5rem;align-items:start;}
.why-feats{display:flex;flex-direction:column;gap:1.1rem;}
.why-feat{display:flex;gap:1rem;padding:1.35rem;background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:10px;transition:border-color 0.25s,box-shadow 0.25s,background 0.35s;}
.why-feat:hover{border-color:var(--accent-lt);box-shadow:0 4px 18px var(--shadow);}
.why-num{font-family:'Playfair Display',serif;font-size:2rem;font-weight:700;color:var(--accent-pale);line-height:1;min-width:44px;transition:color 0.35s;}
.why-feat h4{font-family:'Montserrat',sans-serif;font-size:0.98rem;font-weight:700;color:var(--heading);margin-bottom:0.3rem;}
.why-feat p{font-size:0.92rem;color:var(--text-mid);line-height:1.7;}
.why-callout{background:var(--callout-bg);border-radius:16px;padding:2.4rem 2rem;text-align:center;box-shadow:0 12px 40px var(--shadow-md);position:sticky;top:86px;transition:background 0.35s;}
.avail-badge{display:inline-flex;align-items:center;gap:0.5rem;background:rgba(34,197,94,0.12);border:1px solid rgba(34,197,94,0.3);color:#4ade80;font-family:'Montserrat',sans-serif;font-size:0.78rem;font-weight:700;padding:0.35rem 0.9rem;border-radius:100px;letter-spacing:0.1em;text-transform:uppercase;margin-bottom:1.2rem;}
.callout-phone{font-family:'Playfair Display',serif;font-size:clamp(1.5rem,3vw,2.2rem);font-weight:700;color:var(--accent-lt);margin:0.8rem 0;}
.callout-p{font-size:0.92rem;color:rgba(255,255,255,0.62);line-height:1.75;margin-bottom:1.4rem;}
[data-theme="classic"] .callout-p,[data-theme="slate"] .callout-p,[data-theme="warm"] .callout-p{color:var(--callout-text);opacity:0.65;}
.callout-btns{display:flex;flex-direction:column;gap:0.6rem;}
.callout-sub{font-size:0.82rem;color:rgba(255,255,255,0.35);text-align:center;margin-top:1rem;line-height:1.6;}
[data-theme="classic"] .callout-sub,[data-theme="slate"] .callout-sub,[data-theme="warm"] .callout-sub{color:var(--callout-text);opacity:0.4;}

/* comparison table */
.cmp-wrap{overflow-x:auto;border-radius:10px;border:1.5px solid var(--border);margin-top:1.5rem;transition:border-color 0.35s;}
.cmp-table{width:100%;border-collapse:collapse;font-size:0.85rem;}
.cmp-table th{padding:0.9rem 1rem;font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:700;letter-spacing:0.07em;text-transform:uppercase;text-align:center;background:var(--bg-alt);color:var(--text-mid);}
.cmp-table th:first-child{text-align:left;}
.cmp-table th.cth-ktx{background:var(--primary);color:#fff;}
.cmp-table td{padding:0.8rem 1rem;border-top:1px solid var(--border);text-align:center;color:var(--text-mid);}
.cmp-table td:first-child{text-align:left;color:var(--text);font-weight:600;}
.cmp-table .cok{color:#22c55e;font-size:1rem;}.cmp-table .cno{color:var(--text-light);}.cmp-table .cpt{color:var(--accent);font-size:0.72rem;font-weight:700;}
.cmp-table tr:hover td{background:var(--bg-alt);}

/* ═══════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════ */
.rev-trust{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:2.5rem;}
.rev-badge{display:flex;align-items:center;gap:0.8rem;background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:10px;padding:0.9rem 1.2rem;transition:background 0.35s,border-color 0.35s;}
.rev-badge-num{font-family:'Playfair Display',serif;font-size:1.7rem;font-weight:700;color:var(--accent);}
.rev-badge-lbl{font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:700;color:var(--heading);}
.rev-badge-src{font-size:0.76rem;color:var(--text-light);}
.rev-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;}
.rev-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:14px;padding:1.8rem;position:relative;overflow:hidden;transition:box-shadow 0.25s,transform 0.2s,background 0.35s,border-color 0.35s;}
.rev-card::before{content:'"';position:absolute;top:-8px;right:14px;font-family:'Playfair Display',serif;font-size:5.5rem;font-weight:800;color:var(--accent-pale);line-height:1;pointer-events:none;transition:color 0.35s;}
.rev-card:hover{box-shadow:0 8px 28px var(--shadow-md);transform:translateY(-2px);}
.rev-stars{color:var(--accent-lt);font-size:0.95rem;margin-bottom:0.85rem;letter-spacing:0.05em;}
.rev-text{font-size:0.95rem;color:var(--text-mid);line-height:1.78;margin-bottom:1.1rem;font-style:italic;}
.rev-author{font-family:'Montserrat',sans-serif;font-weight:700;font-size:0.88rem;color:var(--heading);}
.rev-meta{font-size:0.78rem;color:var(--text-light);margin-top:2px;}
.rev-verified{display:inline-flex;align-items:center;gap:0.3rem;font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--accent);background:var(--accent-pale);border:1px solid var(--accent-lt);padding:3px 8px;border-radius:100px;margin-top:0.55rem;width:fit-content;}
.rev-placeholder{background:var(--bg-alt);border:2px dashed var(--border);border-radius:14px;padding:2rem;text-align:center;font-size:0.88rem;color:var(--text-mid);}
.rev-placeholder strong{color:var(--accent);display:block;margin-bottom:0.4rem;font-family:'Montserrat',sans-serif;}

/* ── LEGAL PAGES ── */
.legal-section{margin-bottom:2.2rem;}
.legal-section h3{
  font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:700;
  color:var(--heading);margin-bottom:0.75rem;
  padding-bottom:0.5rem;border-bottom:1px solid var(--border);
  transition:color 0.35s,border-color 0.35s;
}
.legal-section p{font-size:0.95rem;color:var(--text-mid);line-height:1.8;margin-bottom:0.75rem;}
.legal-section a{color:var(--accent);font-weight:600;}
.legal-section a:hover{color:var(--primary);}
.legal-list{
  list-style:none;display:flex;flex-direction:column;gap:0.5rem;
  margin:0.75rem 0;padding-left:0;
}
.legal-list li{
  font-size:0.93rem;color:var(--text-mid);line-height:1.7;
  padding-left:1.4rem;position:relative;
}
.legal-list li::before{
  content:'›';position:absolute;left:0;
  color:var(--accent);font-weight:700;
}
.legal-list li strong{color:var(--text);}
.legal-notice-box{
  background:var(--accent-pale);border:2px solid var(--accent-lt);
  border-radius:var(--radius-lg);padding:2rem;text-align:center;
  margin-bottom:2.2rem;transition:background 0.35s,border-color 0.35s;
}
.legal-notice-box p{font-size:0.95rem;color:var(--text-mid);line-height:1.75;}

/* ═══════════════════════════════════════════
   SERVICE AREAS
═══════════════════════════════════════════ */
.areas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:0.7rem;}
.area-chip{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:8px;padding:0.8rem 1rem;font-family:'Montserrat',sans-serif;font-size:0.9rem;font-weight:500;color:var(--text);display:flex;align-items:center;gap:0.45rem;transition:all 0.2s;}
.area-chip:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-pale);transform:translateY(-1px);}
.area-chip::before{content:'📍';font-size:0.78rem;}

/* ═══════════════════════════════════════════
   SERVICES PAGE
═══════════════════════════════════════════ */
.svc-hero{background:var(--primary);padding:110px 5vw 55px;text-align:center;transition:background 0.35s;}
.svc-hero h1{color:#fff;font-size:clamp(1.9rem,4vw,3rem);}
.svc-hero p{color:rgba(255,255,255,0.65);font-size:1.05rem;max-width:500px;margin:0.8rem auto 0;line-height:1.8;}
.svc-hero .eyebrow{color:var(--accent-lt);}
.svc-tabs{position:sticky;top:72px;z-index:100;background:var(--bg);border-bottom:2px solid var(--border);padding:0 5vw;display:flex;gap:0;overflow-x:auto;scrollbar-width:none;transition:background 0.35s,border-color 0.35s;}
.svc-tabs::-webkit-scrollbar{display:none;}
.tab-btn{font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:700;letter-spacing:0.06em;text-transform:uppercase;color:var(--text-mid);padding:0.9rem 1.2rem;border-bottom:3px solid transparent;white-space:nowrap;transition:all 0.2s;background:none;border-left:none;border-right:none;border-top:none;}
.tab-btn:hover{color:var(--accent);}
.tab-btn.active{color:var(--accent);border-bottom-color:var(--accent);}
.svc-cat{padding:55px 5vw;background:var(--bg);transition:background 0.35s;}
.svc-cat-inner{max-width:1160px;margin:0 auto;}
.cat-label{font-family:'Share Tech Mono',monospace;font-size:0.76rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent);margin-bottom:1.1rem;display:flex;align-items:center;gap:0.7rem;}
.cat-label::after{content:'';flex:1;height:1px;background:var(--border);}
.svc-full-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(265px,1fr));gap:1.1rem;}
.sfc{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:14px;padding:1.5rem;position:relative;overflow:hidden;transition:border-color 0.25s,box-shadow 0.25s,transform 0.2s,background 0.35s;}
.sfc::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent-lt);transform:scaleX(0);transform-origin:left;transition:transform 0.3s;}
.sfc:hover{border-color:var(--accent-lt);box-shadow:0 6px 24px var(--shadow-md);transform:translateY(-2px);}
.sfc:hover::before{transform:scaleX(1);}
.sfc-icon{width:40px;height:40px;background:var(--accent-pale);border:1px solid var(--accent-lt);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;margin-bottom:0.85rem;transition:background 0.25s;}
.sfc:hover .sfc-icon{background:var(--accent-lt);}
.sfc h3{font-family:'Montserrat',sans-serif;font-size:0.94rem;font-weight:700;color:var(--heading);margin-bottom:0.4rem;}
.sfc p{font-size:0.88rem;color:var(--text-mid);line-height:1.68;}
.sfc-cta{display:inline-flex;align-items:center;gap:0.3rem;font-family:'Montserrat',sans-serif;font-size:0.82rem;font-weight:700;color:var(--accent);margin-top:0.8rem;letter-spacing:0.04em;cursor:pointer;transition:gap 0.2s;}
.sfc:hover .sfc-cta{gap:0.5rem;}
.sfc-adv{position:absolute;top:10px;right:10px;font-family:'Share Tech Mono',monospace;font-size:0.7rem;letter-spacing:0.07em;text-transform:uppercase;background:rgba(204,17,17,0.1);color:var(--red);border:1px solid rgba(204,17,17,0.2);padding:3px 7px;border-radius:100px;}
.sfc-com{position:absolute;top:10px;right:10px;font-family:'Share Tech Mono',monospace;font-size:0.7rem;letter-spacing:0.07em;text-transform:uppercase;background:var(--accent-pale);color:var(--accent);border:1px solid var(--accent-lt);padding:3px 7px;border-radius:100px;}

/* ═══════════════════════════════════════════
   CONTACT PAGE
═══════════════════════════════════════════ */
.contact-hero{background:var(--primary);padding:110px 5vw 55px;text-align:center;transition:background 0.35s;}
.contact-hero h1{color:#fff;font-size:clamp(1.8rem,3.8vw,3rem);}
.contact-hero p{color:rgba(255,255,255,0.65);font-size:1.05rem;max-width:480px;margin:0.8rem auto 0;line-height:1.75;}
.contact-layout{display:grid;grid-template-columns:1fr 360px;gap:2.5rem;align-items:start;}
.intake-form{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:16px;padding:2.2rem;box-shadow:0 4px 20px var(--shadow);transition:background 0.35s,border-color 0.35s;}
.fst{font-family:'Share Tech Mono',monospace;font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem;padding-bottom:0.55rem;border-bottom:1px solid var(--border);transition:color 0.35s,border-color 0.35s;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;}
.fg{display:flex;flex-direction:column;gap:0.3rem;margin-bottom:0.85rem;}
.fg label{font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:700;color:var(--text-mid);letter-spacing:0.06em;text-transform:uppercase;}
.fg label .req{color:var(--red);margin-left:2px;}
.fg input,.fg select,.fg textarea{background:var(--input-bg);border:1.5px solid var(--border);border-radius:7px;padding:0.85rem 1rem;color:var(--text);font-family:'Source Sans 3',sans-serif;font-size:1.05rem;outline:none;transition:border-color 0.2s,box-shadow 0.2s,background 0.35s,color 0.35s;-webkit-appearance:none;}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-pale);}
.fg input.err,.fg select.err{border-color:var(--red);box-shadow:0 0 0 3px var(--red-glow);}
.fg .ferr{font-size:0.78rem;color:var(--red);}
.fg textarea{resize:vertical;min-height:95px;}
.fg select option{background:var(--input-bg);}
.cp{display:none;background:var(--bg-alt);border:1.5px solid var(--border);border-radius:9px;padding:1.1rem 1.2rem;margin-top:0.35rem;margin-bottom:0.8rem;animation:cpSlide 0.25s ease;transition:background 0.35s,border-color 0.35s;}
.cp.show{display:block;}
@keyframes cpSlide{from{opacity:0;transform:translateY(-7px);}to{opacity:1;transform:translateY(0);}}
.cp-warn{background:rgba(204,17,17,0.05);border-color:rgba(204,17,17,0.2);}
.cp-info{background:var(--accent-pale);border-color:var(--accent-lt);}
.cp h4{font-family:'Montserrat',sans-serif;font-size:0.85rem;font-weight:700;color:var(--heading);margin-bottom:0.4rem;}
.cp p{font-size:0.83rem;color:var(--text-mid);line-height:1.65;margin-bottom:0.85rem;}
.cp-btns{display:flex;gap:0.6rem;flex-wrap:wrap;}
.cpb{font-size:0.82rem;font-weight:700;letter-spacing:0.04em;padding:0.45rem 0.9rem;border-radius:6px;border:1.5px solid;transition:all 0.2s;cursor:pointer;font-family:'Montserrat',sans-serif;}
.cpb-ok{background:var(--primary);color:var(--bg);border-color:var(--primary);}
.cpb-ok:hover{background:var(--accent);border-color:var(--accent);}
.cpb-no{background:transparent;color:var(--text-mid);border-color:var(--border);}
.cpb-no:hover{border-color:var(--text-mid);color:var(--text);}
.vin-wrap{position:relative;}
.vin-st{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:0.76rem;font-family:'Share Tech Mono',monospace;letter-spacing:0.05em;}
.vs-ok{color:#22c55e;}.vs-no{color:var(--red);}.vs-prog{color:var(--accent);}
.vin-info{display:none;margin-top:0.4rem;padding:0.6rem 0.9rem;background:rgba(34,197,94,0.06);border:1px solid rgba(34,197,94,0.22);border-radius:7px;font-size:0.78rem;color:var(--text-mid);font-family:'Share Tech Mono',monospace;}
.vin-info.show{display:block;}
.fdrop{border:2px dashed var(--border);border-radius:9px;padding:1.1rem;text-align:center;cursor:pointer;transition:border-color 0.2s,background 0.2s;}
.fdrop:hover{border-color:var(--accent-lt);background:var(--accent-pale);}
.fdrop input{display:none;}
.fdrop-lbl{font-size:0.8rem;color:var(--text-mid);cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:0.3rem;}
.fsuccess{display:none;background:rgba(34,197,94,0.07);border:1.5px solid rgba(34,197,94,0.25);border-radius:10px;padding:1.5rem;text-align:center;margin-top:1rem;}
.fsuccess h4{font-family:'Montserrat',sans-serif;color:#15803d;margin-bottom:0.35rem;}
.fsuccess p{font-size:0.85rem;color:var(--text-mid);}
.contact-sidebar{display:flex;flex-direction:column;gap:1.1rem;}
.cscard{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:14px;overflow:hidden;transition:background 0.35s,border-color 0.35s;}
.cscard-head{background:var(--primary);padding:0.95rem 1.4rem;transition:background 0.35s;}
.cscard-head h3{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent-lt);}
.cscard-body{padding:1.1rem 1.4rem;display:flex;flex-direction:column;gap:0.95rem;}
.cs-item{display:flex;gap:0.7rem;align-items:flex-start;}
.cs-icon{font-size:1rem;min-width:22px;margin-top:2px;}
.cs-lbl{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--accent);margin-bottom:2px;}
.cs-val{font-size:0.95rem;color:var(--text);font-weight:500;}
.cs-val a{color:var(--primary);font-weight:600;transition:color 0.2s;}
.cs-val a:hover{color:var(--accent);}
.emerg-card{background:linear-gradient(135deg,var(--red),#900a0a);border-radius:14px;padding:1.6rem;text-align:center;box-shadow:0 8px 32px rgba(204,17,17,0.3);}
.emerg-card h3{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.16em;text-transform:uppercase;color:rgba(255,255,255,0.72);margin-bottom:0.4rem;}
.emerg-ph{font-family:'Playfair Display',serif;font-size:clamp(1.3rem,3vw,1.85rem);font-weight:700;color:#fff;margin:0.55rem 0;}
.emerg-tag{font-size:0.78rem;color:rgba(255,255,255,0.65);margin-bottom:1.1rem;}

/* ═══════════════════════════════════════════
   CTA BANNER
═══════════════════════════════════════════ */
.cta-banner{background:var(--primary);padding:60px 5vw;text-align:center;transition:background 0.35s;}
.cta-banner h2{color:#fff;font-size:clamp(1.5rem,3.5vw,2.4rem);margin-bottom:0.75rem;}
.cta-banner p{color:rgba(255,255,255,0.65);font-size:1rem;max-width:480px;margin:0 auto 1.8rem;line-height:1.75;}
.cta-btns{display:flex;gap:0.75rem;justify-content:center;flex-wrap:wrap;}

/* ═══════════════════════════════════════════
   STICKY MOBILE CALL
═══════════════════════════════════════════ */
.sticky-call{display:none;position:fixed;bottom:0;left:0;right:0;z-index:490;background:var(--sticky-bg);border-top:3px solid var(--accent-lt);padding:0.75rem 5vw;align-items:center;justify-content:space-between;gap:0.75rem;transition:background 0.35s;}
.sticky-call a{font-family:'Montserrat',sans-serif;font-size:0.85rem;font-weight:600;color:var(--sticky-text);display:flex;align-items:center;gap:0.4rem;}
.sticky-call a span{color:var(--accent-lt);}

/* ═══════════════════════════════════════════
   THEME SWITCHER
═══════════════════════════════════════════ */
.tsw{position:fixed;bottom:88px;right:20px;z-index:400;display:flex;flex-direction:column;align-items:flex-end;gap:9px;}
.tsw-callout{background:var(--bg);color:var(--text);border:2px solid var(--accent-lt);font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:600;padding:0.4rem 0.8rem;border-radius:14px 14px 4px 14px;box-shadow:0 4px 18px var(--shadow-md);white-space:nowrap;animation:tswBob 2.5s ease-in-out infinite;pointer-events:none;position:relative;transition:background 0.35s,color 0.35s,border-color 0.35s;}
.tsw-callout::after{content:'';position:absolute;bottom:-7px;right:14px;width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:7px solid var(--accent-lt);}
@keyframes tswBob{0%,100%{transform:translateY(0) rotate(-1deg);}50%{transform:translateY(-4px) rotate(1deg);}}
.tsw-btn{width:56px;height:56px;border-radius:50%;overflow:hidden;cursor:pointer;border:none;padding:0;background:var(--primary);box-shadow:0 4px 18px var(--shadow-md),0 0 0 3px rgba(212,160,48,0.4);animation:tswPulse 3s ease-in-out infinite;transition:transform 0.2s,box-shadow 0.2s;}
.tsw-btn:hover{transform:scale(1.1);box-shadow:0 6px 26px var(--shadow-md),0 0 0 5px rgba(212,160,48,0.6);animation:none;}
.tsw-btn img{width:100%;height:100%;object-fit:cover;display:block;}
@keyframes tswPulse{0%,100%{box-shadow:0 4px 18px var(--shadow-md),0 0 0 3px rgba(212,160,48,0.4);}50%{box-shadow:0 4px 18px var(--shadow-md),0 0 0 7px rgba(212,160,48,0.15);}}
.tsw-wave{position:absolute;top:-5px;right:-7px;font-size:1.1rem;animation:waveHand 1.5s ease-in-out infinite;transform-origin:70% 80%;pointer-events:none;}
@keyframes waveHand{0%,100%{transform:rotate(0);}20%{transform:rotate(20deg);}40%{transform:rotate(-10deg);}60%{transform:rotate(20deg);}80%{transform:rotate(-5deg);}}
.tsw-panel{display:none;flex-direction:column;gap:0.38rem;background:var(--bg);border:1.5px solid var(--border);border-radius:14px;padding:0.85rem 0.95rem;box-shadow:0 8px 32px var(--shadow-md);min-width:200px;animation:cpSlide 0.2s ease;transition:background 0.35s,border-color 0.35s;}
.tsw-panel.open{display:flex;}
.tsw-pt{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--accent);margin-bottom:0.25rem;padding-bottom:0.45rem;border-bottom:1px solid var(--border);}
.tsw-opt{display:flex;align-items:center;gap:0.55rem;padding:0.4rem 0.5rem;border-radius:7px;cursor:pointer;border:none;background:transparent;width:100%;text-align:left;font-family:'Montserrat',sans-serif;font-size:0.88rem;font-weight:500;color:var(--text);transition:background 0.15s;}
.tsw-opt:hover{background:var(--bg-alt);}
.tsw-opt.active{background:var(--accent-pale);color:var(--accent);font-weight:700;}
.sw{width:23px;height:23px;border-radius:50%;border:2px solid rgba(0,0,0,0.1);display:flex;overflow:hidden;flex-shrink:0;}
.sh{width:50%;height:100%;}

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
footer{background:var(--footer-bg);padding:3.2rem 5vw 1.5rem;transition:background 0.35s;}
.footer-grid{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.2rem;margin-bottom:2rem;}
.footer-brand-name{font-family:'Montserrat',sans-serif;font-weight:900;font-size:1.3rem;letter-spacing:0.08em;color:#fff;display:flex;align-items:center;gap:0.6rem;margin-bottom:0.65rem;}
.footer-brand-name img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:1.5px solid rgba(212,160,48,0.45);}
.footer-brand-name span{color:var(--accent-lt);}
.footer-desc{font-size:0.9rem;color:var(--footer-text);line-height:1.75;max-width:270px;}
.footer-nastf{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent-lt);margin-top:0.85rem;}
.footer-col h5{font-family:'Share Tech Mono',monospace;font-size:0.72rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent-lt);margin-bottom:0.9rem;}
.footer-col ul{display:flex;flex-direction:column;gap:0.42rem;}
.footer-col ul li a{font-size:0.9rem;color:var(--footer-text);transition:color 0.2s;}
.footer-col ul li a:hover{color:#fff;}
.footer-bottom{max-width:1160px;margin:0 auto;border-top:1px solid rgba(255,255,255,0.08);padding-top:1.25rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:0.75rem;}
.footer-bottom p{font-size:0.82rem;color:rgba(255,255,255,0.3);}
.footer-legal{display:flex;gap:1.25rem;}
.footer-legal a{font-size:0.8rem;color:rgba(255,255,255,0.3);transition:color 0.2s;}
.footer-legal a:hover{color:var(--accent-lt);}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media(max-width:1024px){
  .why-grid,.about-grid,.contact-layout{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:1.8rem;}
  .why-callout{position:static;}
  .blog-grid{grid-template-columns:repeat(2,1fr);}
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
  .rev-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:900px){
  .nav-links,.nav-cta{display:none;}
  .hamburger{display:flex;}
  .sticky-call{display:flex;}
  .tsw{bottom:72px;}
  .form-row{grid-template-columns:1fr;}
  .contact-sidebar{display:grid;grid-template-columns:1fr 1fr;}
  .cta-btns{flex-direction:column;align-items:center;}
  .cta-btns .btn{width:100%;max-width:320px;}
  .hero-stats{gap:1.5rem;}
  .svc-grid{grid-template-columns:1fr;}
  .vin-result-grid{grid-template-columns:repeat(2,1fr);}
  .vin-decode-header{flex-direction:column;gap:0.5rem;}
}
@media(max-width:600px){
  .section{padding:60px 5vw;}
  h1.hero-title{font-size:2.2rem;}
  .eyebrow{font-size:0.78rem;}
  .section-sub{font-size:1.05rem;}
  .sfc p,.svc-card p{font-size:0.9rem;}
  .svc-full-grid{grid-template-columns:1fr;}
  .areas-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr;}
  .contact-sidebar{grid-template-columns:1fr;}
  .trust-sep{display:none;}
  .blog-grid{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:1fr 1fr;}
  .gallery-thumb{height:140px;}
  .rev-grid{grid-template-columns:1fr;}
  .rev-trust{flex-direction:column;}
  .oem-grid{grid-template-columns:1fr 1fr;}
  .why-feat{flex-direction:column;gap:0.5rem;}
  .why-feat-num{font-size:1.4rem;min-width:auto;}
  .callout-phone{font-size:1.5rem;}
  .hero-phone-wrap{font-size:1.4rem;}
  .legal-section h3{font-size:0.95rem;}
  .cmp-table{font-size:0.78rem;}
  .cmp-table th,.cmp-table td{padding:0.6rem 0.6rem;}
  .splash-brand{font-size:clamp(1.8rem,8vw,3rem);}
  .svc-tabs,.blog-cats{gap:0.4rem;}
  .tab-btn,.blog-cat-btn{font-size:0.75rem;padding:0.5rem 0.75rem;}
  .intake-form{padding:1.4rem 1.2rem;}
  .fst{font-size:0.72rem;}
  .vin-decode-box{padding:1rem;}
  .vin-mandatory-box{padding:1rem;}
}
@media(max-width:420px){
  .hero-actions{flex-direction:column;}
  .hero-actions .btn{width:100%;}
  .oem-grid{grid-template-columns:1fr;}
  .gallery-grid{grid-template-columns:1fr;}
  .gallery-thumb{height:200px;}
  h1.hero-title{font-size:1.95rem;}
  .hero-stats{gap:1rem;}
  .stat-num{font-size:1.6rem;}
  .hero-badge{font-size:0.72rem;padding:0.35rem 0.75rem;}
  .callout-btns .btn{font-size:0.88rem;}
  .cmp-table th:nth-child(3),.cmp-table td:nth-child(3){display:none;}
}

/* ── VIN DECODE BOX (optional) ── */
.vin-decode-box{
  background:var(--bg-alt);border:1.5px solid var(--border);
  border-radius:12px;padding:1.3rem 1.4rem;margin-bottom:0.5rem;
  transition:border-color 0.25s,background 0.35s;
}
.vin-decode-box:focus-within{border-color:var(--accent-lt);}
.vin-decode-header{display:flex;align-items:flex-start;gap:0.75rem;margin-bottom:1rem;}
.vin-decode-icon{font-size:1.5rem;flex-shrink:0;margin-top:2px;}
.vin-decode-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:0.88rem;color:var(--heading);margin-bottom:3px;}
.vin-decode-sub{font-size:0.78rem;color:var(--text-mid);line-height:1.5;}
.vin-result-card{
  background:rgba(34,197,94,0.06);border:1.5px solid rgba(34,197,94,0.25);
  border-radius:10px;padding:1rem 1.2rem;margin-top:0.85rem;
  animation:cpSlide 0.3s ease;
}
.vin-result-header{display:flex;align-items:center;gap:0.5rem;margin-bottom:0.85rem;}
.vin-result-check{color:#22c55e;font-size:1.1rem;font-weight:700;}
.vin-result-title{font-family:'Montserrat',sans-serif;font-weight:700;font-size:0.85rem;color:var(--heading);}
.vin-result-src{font-family:'Share Tech Mono',monospace;font-size:0.7rem;letter-spacing:0.1em;color:var(--text-light);margin-left:auto;background:var(--accent-pale);padding:2px 8px;border-radius:100px;color:var(--accent);}
.vin-result-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));
  gap:0.6rem;margin-bottom:0.85rem;
}
.vin-result-item{background:var(--card-bg);border:1px solid var(--border);border-radius:7px;padding:0.55rem 0.75rem;}
.vin-result-label{font-family:'Share Tech Mono',monospace;font-size:0.7rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--text-light);margin-bottom:2px;}
.vin-result-value{font-family:'Montserrat',sans-serif;font-size:0.82rem;font-weight:700;color:var(--heading);}
.vin-result-actions{display:flex;gap:0.6rem;flex-wrap:wrap;}
.vin-error-card{
  display:flex;align-items:center;gap:0.6rem;
  background:rgba(204,17,17,0.05);border:1px solid rgba(204,17,17,0.2);
  border-radius:8px;padding:0.75rem 1rem;margin-top:0.75rem;
  font-size:0.82rem;color:var(--text-mid);
}
.vin-loading{display:flex;align-items:center;gap:0.6rem;margin-top:0.75rem;font-size:0.82rem;color:var(--text-mid);}
.vin-spinner{
  width:18px;height:18px;border-radius:50%;
  border:2.5px solid var(--border);
  border-top-color:var(--accent);
  animation:spin 0.8s linear infinite;flex-shrink:0;
}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── MANDATORY VIN BOX (All Keys Lost) ── */
.vin-mandatory-box{
  background:rgba(204,17,17,0.04);
  border:2px solid rgba(204,17,17,0.25);
  border-radius:12px;padding:1.3rem 1.4rem;margin-bottom:0.85rem;
  animation:cpSlide 0.3s ease;
}
.vin-mandatory-header{display:flex;align-items:flex-start;gap:0.75rem;margin-bottom:1rem;font-size:1.3rem;}

/* ── DROPDOWN STATES ── */
select:disabled{opacity:0.5;cursor:not-allowed;}
select.loading-dd{border-color:var(--accent)!important;box-shadow:0 0 0 3px var(--accent-pale)!important;}


/* ── BLOG PAGE ── */
.blog-hero{background:var(--primary);padding:110px 5vw 55px;text-align:center;transition:background 0.35s;}
.blog-hero h1{color:#fff;font-size:clamp(1.8rem,3.8vw,3rem);}
.blog-hero p{color:rgba(255,255,255,0.65);font-size:1.05rem;max-width:560px;margin:0.8rem auto 0;line-height:1.8;}
.blog-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:1.5rem;
}
.blog-card{
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:var(--radius-lg);overflow:hidden;
  transition:box-shadow 0.25s,transform 0.2s,background 0.35s,border-color 0.35s;
  cursor:pointer;
}
.blog-card:hover{box-shadow:0 8px 32px var(--shadow-md);transform:translateY(-3px);border-color:var(--accent-lt);}
.blog-card-img{
  width:100%;height:180px;
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-mid) 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:3rem;position:relative;overflow:hidden;
  transition:background 0.35s;
}
.blog-card-img::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 50%,rgba(0,0,0,0.25) 100%);
}
.blog-card-body{padding:1.4rem;}
.blog-category{
  display:inline-block;
  font-family:'Share Tech Mono',monospace;
  font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--accent);background:var(--accent-pale);
  border:1px solid var(--accent-lt);
  padding:3px 10px;border-radius:100px;
  margin-bottom:0.75rem;
  transition:color 0.35s,background 0.35s,border-color 0.35s;
}
.blog-card h3{
  font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:700;
  color:var(--heading);margin-bottom:0.6rem;line-height:1.35;
  transition:color 0.35s;
}
.blog-card:hover h3{color:var(--accent);}
.blog-card p{font-size:0.88rem;color:var(--text-mid);line-height:1.7;}
.blog-meta{
  display:flex;align-items:center;justify-content:space-between;
  margin-top:1.1rem;padding-top:0.9rem;
  border-top:1px solid var(--border);
  font-size:0.8rem;color:var(--text-light);
  transition:border-color 0.35s;
}
.blog-meta-read{
  font-family:'Montserrat',sans-serif;font-weight:600;
  color:var(--accent);font-size:0.8rem;
}
.blog-coming-soon{
  text-align:center;padding:3rem 2rem;
  background:var(--bg-alt);border:2px dashed var(--border);
  border-radius:var(--radius-lg);
  transition:background 0.35s,border-color 0.35s;
}
.blog-coming-soon h3{font-size:1.2rem;color:var(--heading);margin-bottom:0.5rem;}
.blog-coming-soon p{font-size:0.9rem;color:var(--text-mid);line-height:1.75;}
/* blog cats filter */
.blog-cats{
  display:flex;gap:0.6rem;flex-wrap:wrap;margin-bottom:2rem;
}
.blog-cat-btn{
  font-family:'Montserrat',sans-serif;font-size:0.8rem;font-weight:600;
  padding:0.45rem 1rem;border-radius:100px;
  border:1.5px solid var(--border);
  color:var(--text-mid);background:var(--card-bg);
  cursor:pointer;transition:all 0.2s;
}
.blog-cat-btn:hover,.blog-cat-btn.active{
  border-color:var(--accent);color:var(--accent);
  background:var(--accent-pale);
}

/* ── GALLERY PAGE ── */
.gallery-hero{background:var(--primary);padding:110px 5vw 55px;text-align:center;transition:background 0.35s;}
.gallery-hero h1{color:#fff;font-size:clamp(1.8rem,3.8vw,3rem);}
.gallery-hero p{color:rgba(255,255,255,0.65);font-size:1.05rem;max-width:560px;margin:0.8rem auto 0;line-height:1.8;}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:1.1rem;
}
.gallery-item{
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:var(--radius-lg);overflow:hidden;
  transition:box-shadow 0.25s,transform 0.2s,border-color 0.25s;
  cursor:pointer;position:relative;
}
.gallery-item:hover{box-shadow:0 8px 32px var(--shadow-md);transform:translateY(-3px);border-color:var(--accent-lt);}
.gallery-thumb{
  width:100%;height:200px;
  background:linear-gradient(135deg,var(--bg-warm) 0%,var(--bg-alt) 100%);
  display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:0.5rem;
  font-size:2.8rem;position:relative;overflow:hidden;
  transition:background 0.35s;
}
.gallery-thumb img{
  width:100%;height:100%;object-fit:cover;
  display:block;
  transition:transform 0.4s ease;
}
.gallery-item:hover .gallery-thumb img{transform:scale(1.04);}
.gallery-thumb-placeholder{
  display:flex;flex-direction:column;align-items:center;gap:0.5rem;
}
.gallery-thumb-placeholder span{font-size:2.5rem;}
.gallery-thumb-placeholder p{
  font-family:'Montserrat',sans-serif;font-size:0.75rem;
  font-weight:600;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--text-light);
}
.gallery-caption{padding:1rem 1.1rem;}
.gallery-caption h4{
  font-family:'Montserrat',sans-serif;font-size:0.93rem;font-weight:700;
  color:var(--heading);margin-bottom:0.3rem;
  transition:color 0.35s;
}
.gallery-item:hover .gallery-caption h4{color:var(--accent);}
.gallery-caption p{font-size:0.83rem;color:var(--text-mid);line-height:1.6;}
.gallery-tag{
  position:absolute;top:10px;left:10px;
  font-family:'Share Tech Mono',monospace;
  font-size:0.7rem;letter-spacing:0.08em;text-transform:uppercase;
  background:var(--primary);color:var(--accent-lt);
  padding:3px 10px;border-radius:100px;
  z-index:2;
}
.gallery-upload-cta{
  background:var(--bg-alt);border:2px dashed var(--border);
  border-radius:var(--radius-lg);padding:2.5rem 2rem;text-align:center;
  transition:background 0.35s,border-color 0.35s;
}
.gallery-upload-cta h3{font-size:1.1rem;color:var(--heading);margin-bottom:0.5rem;}
.gallery-upload-cta p{font-size:0.88rem;color:var(--text-mid);line-height:1.75;margin-bottom:1.2rem;}
/* lightbox */
.lightbox{
  display:none;position:fixed;inset:0;z-index:9000;
  background:rgba(0,0,0,0.9);
  align-items:center;justify-content:center;
  padding:2rem;
}
.lightbox.open{display:flex;}
.lightbox-inner{
  max-width:860px;width:100%;
  background:var(--card-bg);border-radius:var(--radius-lg);
  overflow:hidden;position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,0.5);
}
.lightbox-img{
  width:100%;max-height:55vh;object-fit:cover;display:block;
  background:var(--bg-alt);
}
.lightbox-body{padding:1.4rem 1.6rem;}
.lightbox-body h3{font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:700;color:var(--heading);margin-bottom:0.4rem;}
.lightbox-body p{font-size:0.88rem;color:var(--text-mid);line-height:1.7;}
.lightbox-close{
  position:absolute;top:12px;right:14px;
  background:rgba(0,0,0,0.55);color:#fff;
  border:none;border-radius:50%;
  width:36px;height:36px;cursor:pointer;
  font-size:1.1rem;display:flex;align-items:center;justify-content:center;
  transition:background 0.2s;z-index:10;
}
.lightbox-close:hover{background:var(--red);}
@media(max-width:600px){
  .gallery-grid{grid-template-columns:1fr 1fr;}
  .gallery-thumb{height:150px;}
}
@media(max-width:380px){
  .gallery-grid{grid-template-columns:1fr;}
}

/* ════════════════════════════════════════
   KNOWLEDGE BASE — Phase 5
════════════════════════════════════════ */

/* ── KB Search ── */
.kb-search-wrap{margin-bottom:1.2rem;}
.kb-search-bar{
  display:flex;align-items:center;gap:0.75rem;
  background:var(--surface,var(--card-bg));
  border:1.5px solid var(--border);border-radius:12px;
  padding:0.75rem 1.1rem;
  transition:border-color 0.2s,box-shadow 0.2s;
}
.kb-search-bar:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-pale);
}
.kb-search-icon{font-size:1rem;flex-shrink:0;}
.kb-search-input{
  flex:1;background:none;border:none;outline:none;
  font-family:'Source Sans 3',sans-serif;font-size:1rem;
  color:var(--text);
}
.kb-search-input::placeholder{color:var(--text-light);}
.kb-search-clear{
  background:none;border:none;color:var(--text-light);
  font-size:0.9rem;cursor:pointer;padding:0 0.25rem;
  transition:color 0.15s;
}
.kb-search-clear:hover{color:var(--text);}

/* ── KB Article Cards (index view) ── */
.kb-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
  gap:1.4rem;
}
.kb-card{
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:var(--radius-lg,14px);overflow:hidden;
  transition:box-shadow 0.25s,transform 0.2s,border-color 0.25s;
  cursor:pointer;display:flex;flex-direction:column;
}
.kb-card:hover{
  box-shadow:0 8px 32px var(--shadow-md,rgba(0,0,0,0.2));
  transform:translateY(-3px);border-color:var(--accent-lt);
}
.kb-card-thumb{
  width:100%;height:180px;
  background:linear-gradient(135deg,var(--primary) 0%,var(--primary-mid,#1a3060) 100%);
  display:flex;align-items:center;justify-content:center;
  font-size:3rem;position:relative;overflow:hidden;
  transition:background 0.35s;flex-shrink:0;
}
.kb-card-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.kb-card-body{padding:1.3rem 1.4rem;display:flex;flex-direction:column;gap:0.5rem;flex:1;}
.kb-card-cat{
  display:inline-flex;align-items:center;gap:0.3rem;
  font-family:'Share Tech Mono',monospace;
  font-size:0.7rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--accent);background:var(--accent-pale);
  border:1px solid var(--accent-lt);
  padding:3px 10px;border-radius:100px;
  width:fit-content;
}
.kb-card h3{
  font-family:'Montserrat',sans-serif;font-size:0.98rem;font-weight:700;
  color:var(--heading);line-height:1.35;
  transition:color 0.2s;
}
.kb-card:hover h3{color:var(--accent);}
.kb-card-excerpt{font-size:0.86rem;color:var(--text-mid);line-height:1.7;flex:1;}
.kb-card-meta{
  display:flex;align-items:center;justify-content:space-between;
  padding-top:0.9rem;margin-top:auto;
  border-top:1px solid var(--card-border);
  font-size:0.78rem;color:var(--text-light);
}
.kb-card-read{
  font-family:'Montserrat',sans-serif;font-weight:700;
  color:var(--accent);font-size:0.78rem;
}
.kb-card-status{
  font-size:0.72rem;font-weight:700;letter-spacing:0.07em;
  text-transform:uppercase;padding:2px 8px;border-radius:100px;
}
.kb-status-published{background:rgba(34,197,94,0.1);color:#22c55e;border:1px solid rgba(34,197,94,0.2);}
.kb-status-soon{background:rgba(148,163,184,0.1);color:#94a3b8;border:1px solid rgba(148,163,184,0.15);}

/* ── KB Article View (full article) ── */
.kb-article-wrap{display:none;}
.kb-article-wrap.open{display:grid;grid-template-columns:1fr 280px;gap:2rem;align-items:start;}
.kb-article-back{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-size:0.82rem;font-weight:600;color:var(--text-mid);
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:8px;padding:0.5rem 1rem;cursor:pointer;
  transition:all 0.15s;margin-bottom:1.5rem;
}
.kb-article-back:hover{border-color:var(--accent);color:var(--accent);}
.kb-article-main{min-width:0;}
.kb-article-cat{
  font-family:'Share Tech Mono',monospace;
  font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--accent);margin-bottom:0.75rem;display:block;
}
.kb-article-title{
  font-family:'Montserrat',sans-serif;font-size:clamp(1.4rem,3vw,2rem);
  font-weight:900;color:var(--heading);line-height:1.25;margin-bottom:1rem;
}
.kb-article-byline{
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  font-size:0.8rem;color:var(--text-light);margin-bottom:2rem;
  padding-bottom:1rem;border-bottom:1px solid var(--card-border);
}
.kb-article-body{font-size:1rem;color:var(--text);line-height:1.85;}
.kb-article-body h2{
  font-family:'Montserrat',sans-serif;font-size:1.2rem;font-weight:700;
  color:var(--heading);margin:2rem 0 0.75rem;
  padding-bottom:0.4rem;border-bottom:1px solid var(--card-border);
}
.kb-article-body h3{
  font-family:'Montserrat',sans-serif;font-size:1rem;font-weight:700;
  color:var(--heading);margin:1.5rem 0 0.5rem;
}
.kb-article-body p{margin-bottom:1rem;}
.kb-article-body ul,.kb-article-body ol{
  margin:0.75rem 0 1rem 1.5rem;display:flex;flex-direction:column;gap:0.4rem;
}
.kb-article-body li{font-size:0.95rem;line-height:1.75;color:var(--text-mid);}
.kb-article-body strong{color:var(--text);font-weight:700;}
.kb-article-body a{color:var(--accent);font-weight:600;}
.kb-article-body blockquote{
  border-left:3px solid var(--accent);
  background:var(--accent-pale);
  padding:0.9rem 1.2rem;border-radius:0 8px 8px 0;
  margin:1.2rem 0;font-style:italic;
  color:var(--text-mid);
}

/* ── KB FAQ section ── */
.kb-faq{margin-top:2.5rem;}
.kb-faq-title{
  font-family:'Montserrat',sans-serif;font-size:1.1rem;font-weight:700;
  color:var(--heading);margin-bottom:1.2rem;
  display:flex;align-items:center;gap:0.5rem;
}
.kb-faq-item{
  border:1.5px solid var(--card-border);border-radius:10px;
  margin-bottom:0.6rem;overflow:hidden;
  transition:border-color 0.2s;
}
.kb-faq-item.open{border-color:var(--accent-lt);}
.kb-faq-q{
  display:flex;align-items:center;justify-content:space-between;
  padding:0.9rem 1.1rem;cursor:pointer;
  font-family:'Montserrat',sans-serif;font-size:0.9rem;
  font-weight:700;color:var(--heading);
  background:var(--card-bg);transition:background 0.2s;
}
.kb-faq-q:hover{background:var(--bg-alt,var(--bg));}
.kb-faq-chevron{
  font-size:0.75rem;color:var(--text-light);
  transition:transform 0.25s;flex-shrink:0;
}
.kb-faq-item.open .kb-faq-chevron{transform:rotate(180deg);}
.kb-faq-a{
  display:none;padding:0.9rem 1.1rem 1rem;
  font-size:0.88rem;color:var(--text-mid);line-height:1.8;
  background:var(--bg-alt,var(--bg));
  border-top:1px solid var(--card-border);
}
.kb-faq-item.open .kb-faq-a{display:block;}

/* ── KB Local History Note ── */
.kb-history-note{
  background:linear-gradient(135deg,rgba(212,160,48,0.06) 0%,rgba(14,32,68,0.3) 100%);
  border:1.5px solid var(--accent-lt);
  border-radius:14px;padding:1.4rem 1.6rem;
  margin-top:2.5rem;
  transition:background 0.35s,border-color 0.35s;
}
.kb-history-header{
  display:flex;align-items:center;gap:0.75rem;
  margin-bottom:0.75rem;
}
.kb-history-flag{font-size:1.6rem;}
.kb-history-label{
  font-family:'Share Tech Mono',monospace;
  font-size:0.73rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--accent);
}
.kb-history-title{
  font-family:'Montserrat',sans-serif;font-size:0.92rem;
  font-weight:700;color:var(--heading);margin-top:2px;
}
.kb-history-body{font-size:0.88rem;color:var(--text-mid);line-height:1.8;}

/* ── KB Media Panel (right side) ── */
.kb-media-panel{
  position:sticky;top:80px;
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:14px;padding:1.1rem;
  transition:background 0.35s,border-color 0.35s;
}
.kb-media-title{
  font-family:'Share Tech Mono',monospace;
  font-size:0.73rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--text-light);margin-bottom:0.9rem;
  padding-bottom:0.6rem;border-bottom:1px solid var(--card-border);
}
.kb-media-item{
  margin-bottom:0.75rem;cursor:pointer;
  border-radius:8px;overflow:hidden;
  border:1.5px solid var(--card-border);
  transition:border-color 0.2s,transform 0.15s;
}
.kb-media-item:hover{border-color:var(--accent-lt);transform:scale(1.01);}
.kb-media-thumb{
  width:100%;height:140px;
  background:var(--bg-alt,var(--bg));
  display:flex;align-items:center;justify-content:center;
  font-size:2rem;
}
.kb-media-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.kb-media-caption{
  padding:0.5rem 0.7rem;
  font-size:0.75rem;color:var(--text-mid);line-height:1.5;
  background:var(--card-bg);
}

/* ── KB Lightbox ── */
.kb-lightbox{
  display:none;position:fixed;inset:0;z-index:9500;
  background:rgba(0,0,0,0.92);
  align-items:center;justify-content:center;
  padding:1.5rem;
}
.kb-lightbox.open{display:flex;}
.kb-lightbox-inner{
  max-width:900px;width:100%;
  background:var(--card-bg);border-radius:14px;
  overflow:hidden;position:relative;
  box-shadow:0 20px 60px rgba(0,0,0,0.6);
  max-height:90vh;display:flex;flex-direction:column;
}
.kb-lightbox-img{
  width:100%;max-height:60vh;object-fit:contain;
  background:var(--bg);display:block;
}
.kb-lightbox-body{padding:1.2rem 1.4rem;}
.kb-lightbox-caption{font-size:0.9rem;color:var(--text-mid);line-height:1.7;}
.kb-lightbox-close{
  position:absolute;top:10px;right:12px;
  background:rgba(0,0,0,0.6);color:#fff;
  border:none;border-radius:50%;
  width:36px;height:36px;cursor:pointer;
  font-size:1rem;display:flex;align-items:center;justify-content:center;
  z-index:10;transition:background 0.2s;
}
.kb-lightbox-close:hover{background:var(--red);}

/* ── KB Article CTA ── */
.kb-article-cta{
  background:var(--primary);border-radius:14px;
  padding:1.8rem;text-align:center;margin-top:2.5rem;
  color:#fff;
}
.kb-article-cta h3{
  font-family:'Montserrat',sans-serif;font-size:1.1rem;
  font-weight:700;margin-bottom:0.5rem;
}
.kb-article-cta p{font-size:0.88rem;color:rgba(255,255,255,0.7);margin-bottom:1.1rem;}
.kb-article-cta .btn{margin:0 0.3rem;}

/* ── Responsive ── */
@media(max-width:900px){
  .kb-article-wrap.open{grid-template-columns:1fr;}
  .kb-media-panel{position:static;}
}
@media(max-width:600px){
  .kb-grid{grid-template-columns:1fr;}
  .kb-card-thumb{height:150px;}
}

/* ════════════════════════════════════════
   M18 PROMOTIONS BANNER
════════════════════════════════════════ */
#promotions-section{
  display:none; /* shown by JS when active */
}
.promo-banner{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--primary) 0%,#1a3575 100%);
  border-bottom:3px solid var(--accent);
  padding:1.2rem 1.5rem;
  transition:all 0.35s;
}
.promo-banner::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 80% 50%,
    rgba(212,160,48,0.12) 0%,transparent 65%);
  pointer-events:none;
}
.promo-inner{
  max-width:900px;margin:0 auto;
  display:flex;align-items:center;gap:1.2rem;
  flex-wrap:wrap;
}
.promo-badge{
  flex-shrink:0;
  background:var(--accent);color:#000;
  font-family:'Montserrat',sans-serif;
  font-size:0.68rem;font-weight:800;
  letter-spacing:0.12em;text-transform:uppercase;
  padding:4px 12px;border-radius:100px;
  white-space:nowrap;
}
.promo-text{flex:1;min-width:200px;}
.promo-headline{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(0.95rem,2vw,1.1rem);
  font-weight:700;color:#fff;
  margin-bottom:0.2rem;
}
.promo-sub{
  font-size:0.82rem;color:rgba(255,255,255,0.75);
  line-height:1.5;
}
.promo-countdown{
  font-family:'Share Tech Mono',monospace;
  font-size:0.78rem;color:var(--accent);
  font-weight:700;white-space:nowrap;
  flex-shrink:0;
}
.promo-cta{
  flex-shrink:0;
  background:var(--accent);color:#000;
  font-family:'Montserrat',sans-serif;
  font-size:0.78rem;font-weight:700;
  padding:0.5rem 1.1rem;border-radius:8px;
  border:none;cursor:pointer;
  transition:background 0.2s,transform 0.15s;
  white-space:nowrap;
}
.promo-cta:hover{background:#e6b828;transform:scale(1.03);}
.promo-dismiss{
  position:absolute;top:0.5rem;right:0.75rem;
  background:none;border:none;
  color:rgba(255,255,255,0.4);
  font-size:0.9rem;cursor:pointer;
  transition:color 0.15s;padding:0.25rem;
}
.promo-dismiss:hover{color:rgba(255,255,255,0.8);}

/* Services page badge */
.svc-promo-badge{
  position:absolute;top:0.6rem;right:0.6rem;
  background:var(--accent);color:#000;
  font-size:0.65rem;font-weight:800;
  letter-spacing:0.08em;text-transform:uppercase;
  padding:2px 8px;border-radius:100px;
  animation:pulse 2s infinite;
}
@keyframes pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(212,160,48,0.4);}
  50%{box-shadow:0 0 0 6px rgba(212,160,48,0);}
}

@media(max-width:600px){
  .promo-inner{flex-direction:column;align-items:flex-start;gap:0.75rem;}
  .promo-cta{width:100%;text-align:center;}
}

/* ════════════════════════════════════════
   M17 DIY DIAGNOSTIC TOOL
════════════════════════════════════════ */
.diy-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.2rem;}
.diy-flow-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:var(--radius-lg,14px);padding:1.4rem 1.5rem;cursor:pointer;transition:box-shadow 0.25s,transform 0.2s,border-color 0.25s;display:flex;flex-direction:column;gap:0.6rem;}
.diy-flow-card:hover{box-shadow:0 8px 30px rgba(0,0,0,0.2);transform:translateY(-3px);border-color:var(--accent-lt);}
.diy-flow-icon{font-size:2rem;}.diy-flow-title{font-family:'Montserrat',sans-serif;font-size:0.95rem;font-weight:700;color:var(--heading);}
.diy-flow-desc{font-size:0.83rem;color:var(--text-mid);line-height:1.6;}
.diy-flow-meta{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:0.75rem;border-top:1px solid var(--card-border);font-size:0.75rem;color:var(--text-light);}
.diy-start-btn{font-family:'Montserrat',sans-serif;font-size:0.75rem;font-weight:700;color:var(--accent);}
.diy-runner{display:none;}.diy-runner.open{display:block;}
.diy-runner-back{display:inline-flex;align-items:center;gap:0.5rem;font-size:0.82rem;font-weight:600;color:var(--text-mid);background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:8px;padding:0.5rem 1rem;cursor:pointer;transition:all 0.15s;margin-bottom:1.5rem;}
.diy-runner-back:hover{border-color:var(--accent);color:var(--accent);}
.diy-progress-wrap{margin-bottom:1.5rem;}
.diy-progress-label{display:flex;justify-content:space-between;font-size:0.72rem;color:var(--text-dim);margin-bottom:0.4rem;}
.diy-progress-bar{background:var(--card-border);border-radius:100px;height:6px;overflow:hidden;}
.diy-progress-fill{height:100%;border-radius:100px;background:linear-gradient(90deg,var(--accent-lt),var(--accent));transition:width 0.5s ease;}
.diy-question-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:var(--radius-lg);padding:1.8rem;margin-bottom:1.2rem;}
.diy-question-eyebrow{font-family:'Share Tech Mono',monospace;font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:0.75rem;}
.diy-question-text{font-family:'Montserrat',sans-serif;font-size:1.1rem;font-weight:700;color:var(--heading);line-height:1.35;margin-bottom:1.4rem;}
.diy-answers{display:flex;flex-direction:column;gap:0.65rem;}
.diy-answer-btn{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:10px;padding:0.9rem 1.1rem;text-align:left;font-family:'Source Sans 3',sans-serif;font-size:0.9rem;color:var(--text);cursor:pointer;transition:all 0.15s;display:flex;align-items:center;gap:0.75rem;}
.diy-answer-btn:hover{border-color:var(--accent);background:var(--accent-pale);color:var(--heading);transform:translateX(4px);}
.diy-answer-arrow{margin-left:auto;color:var(--text-light);transition:transform 0.15s,color 0.15s;flex-shrink:0;}
.diy-answer-btn:hover .diy-answer-arrow{transform:translateX(3px);color:var(--accent);}
.diy-outcome-card{background:var(--card-bg);border:1.5px solid var(--card-border);border-radius:var(--radius-lg);padding:1.8rem;margin-bottom:1.2rem;}
.diy-outcome-type{display:inline-flex;align-items:center;gap:0.4rem;font-family:'Share Tech Mono',monospace;font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;padding:3px 10px;border-radius:100px;margin-bottom:1rem;font-weight:700;}
.diy-outcome-diy{background:rgba(34,197,94,0.1);color:#22c55e;border:1px solid rgba(34,197,94,0.2);}
.diy-outcome-call{background:rgba(212,160,48,0.1);color:var(--accent);border:1px solid var(--accent-lt);}
.diy-outcome-title{font-family:'Montserrat',sans-serif;font-size:1.2rem;font-weight:800;color:var(--heading);margin-bottom:1rem;}
.diy-outcome-body{font-size:0.9rem;color:var(--text-mid);line-height:1.85;white-space:pre-line;}
.diy-outcome-actions{display:flex;gap:0.75rem;flex-wrap:wrap;margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid var(--card-border);}
.diy-restart-btn{background:none;border:1.5px solid var(--card-border);border-radius:8px;padding:0.5rem 1rem;font-size:0.78rem;font-weight:600;color:var(--text-mid);cursor:pointer;transition:all 0.15s;}
.diy-restart-btn:hover{border-color:var(--accent);color:var(--accent);}
.diy-breadcrumb{display:flex;gap:0.3rem;align-items:center;flex-wrap:wrap;font-size:0.72rem;color:var(--text-dim);margin-bottom:1rem;}
.diy-breadcrumb-item{cursor:pointer;transition:color 0.15s;}
.diy-breadcrumb-item:hover{color:var(--accent);}
@media(max-width:600px){.diy-grid{grid-template-columns:1fr;}.diy-question-text{font-size:1rem;}.diy-answer-btn{font-size:0.85rem;padding:0.8rem;}}

/* ════════════════════════════════════════
   M19 GALLERY SYSTEM — Full Rebuild
════════════════════════════════════════ */

/* ── Tab bar ── */
.gal-tabs{display:flex;gap:0.5rem;flex-wrap:wrap;margin-bottom:1.8rem;}
.gal-tab{
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:100px;padding:0.45rem 1.1rem;
  font-family:'Montserrat',sans-serif;font-size:0.75rem;
  font-weight:700;color:var(--text-mid);cursor:pointer;
  transition:all 0.18s;white-space:nowrap;
}
.gal-tab:hover{border-color:var(--accent-lt);color:var(--text);}
.gal-tab.active{
  background:var(--accent);border-color:var(--accent);
  color:#000;
}

/* ── Search bar ── */
.gal-search-wrap{margin-bottom:1.4rem;}
.gal-search-bar{
  display:flex;align-items:center;gap:0.75rem;
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:12px;padding:0.7rem 1.1rem;
  transition:border-color 0.2s,box-shadow 0.2s;
}
.gal-search-bar:focus-within{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-pale);
}
.gal-search-input{
  flex:1;background:none;border:none;outline:none;
  font-family:'Source Sans 3',sans-serif;font-size:0.95rem;
  color:var(--text);
}
.gal-search-input::placeholder{color:var(--text-light);}
.gal-search-clear{
  background:none;border:none;color:var(--text-light);
  font-size:0.85rem;cursor:pointer;padding:0;transition:color 0.15s;
}
.gal-search-clear:hover{color:var(--text);}

/* ── Grid ── */
.gal-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:1.2rem;
}
.gal-item{
  background:var(--card-bg);
  border:1.5px solid var(--card-border);
  border-radius:var(--radius-lg,14px);
  overflow:hidden;cursor:pointer;
  transition:box-shadow 0.25s,transform 0.2s,border-color 0.25s;
}
.gal-item:hover{
  box-shadow:0 8px 32px rgba(0,0,0,0.25);
  transform:translateY(-3px);
  border-color:var(--accent-lt);
}
.gal-thumb{
  width:100%;height:220px;
  background:linear-gradient(135deg,var(--primary) 0%,#1a3060 100%);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;position:relative;
  flex-shrink:0;
}
.gal-thumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform 0.4s ease;
}
.gal-item:hover .gal-thumb img{transform:scale(1.04);}
.gal-thumb-placeholder{
  display:flex;flex-direction:column;align-items:center;
  gap:0.5rem;color:rgba(255,255,255,0.3);
}
.gal-thumb-placeholder span{font-size:2.5rem;}
.gal-thumb-placeholder p{
  font-size:0.75rem;font-weight:600;
  letter-spacing:0.08em;text-transform:uppercase;
}
.gal-type-badge{
  position:absolute;top:0.6rem;left:0.6rem;
  background:rgba(0,0,0,0.65);backdrop-filter:blur(6px);
  color:#fff;font-size:0.65rem;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;
  padding:3px 9px;border-radius:100px;
}
.gal-body{padding:1rem 1.1rem;}
.gal-title{
  font-family:'Montserrat',sans-serif;font-size:0.88rem;
  font-weight:700;color:var(--heading);margin-bottom:0.25rem;
}
.gal-meta{
  font-size:0.78rem;color:var(--text-mid);line-height:1.5;
}
.gal-tags{
  display:flex;gap:0.35rem;flex-wrap:wrap;margin-top:0.6rem;
}
.gal-tag-chip{
  font-size:0.65rem;font-weight:700;letter-spacing:0.06em;
  text-transform:uppercase;color:var(--accent);
  background:var(--accent-pale);border:1px solid var(--accent-lt);
  padding:2px 7px;border-radius:100px;
}

/* ── Lightbox ── */
.gal-lightbox{
  display:none;position:fixed;inset:0;z-index:9500;
  background:rgba(0,0,0,0.94);
  align-items:center;justify-content:center;
  padding:1.5rem;
}
.gal-lightbox.open{display:flex;}
.gal-lb-inner{
  max-width:960px;width:100%;
  background:var(--card-bg);border-radius:16px;
  overflow:hidden;position:relative;
  box-shadow:0 24px 80px rgba(0,0,0,0.7);
  max-height:92vh;display:flex;flex-direction:column;
}
.gal-lb-img-wrap{
  flex:1;overflow:hidden;
  background:var(--primary);
  display:flex;align-items:center;justify-content:center;
  min-height:200px;
}
.gal-lb-img{
  max-width:100%;max-height:60vh;
  object-fit:contain;display:block;
}
.gal-lb-placeholder{
  display:flex;flex-direction:column;align-items:center;
  gap:0.75rem;padding:3rem;color:rgba(255,255,255,0.2);
}
.gal-lb-placeholder span{font-size:3rem;}
.gal-lb-body{padding:1.4rem 1.6rem;}
.gal-lb-badge{
  display:inline-block;font-size:0.68rem;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;
  color:var(--accent);background:var(--accent-pale);
  border:1px solid var(--accent-lt);
  padding:3px 10px;border-radius:100px;margin-bottom:0.75rem;
}
.gal-lb-title{
  font-family:'Montserrat',sans-serif;font-size:1.1rem;
  font-weight:800;color:var(--heading);margin-bottom:0.4rem;
}
.gal-lb-desc{
  font-size:0.88rem;color:var(--text-mid);line-height:1.75;
}
.gal-lb-close{
  position:absolute;top:0.75rem;right:0.9rem;
  background:rgba(0,0,0,0.6);color:#fff;
  border:none;border-radius:50%;
  width:38px;height:38px;cursor:pointer;
  font-size:1.1rem;display:flex;align-items:center;justify-content:center;
  z-index:10;transition:background 0.2s;
}
.gal-lb-close:hover{background:var(--red);}
.gal-lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(0,0,0,0.55);color:#fff;
  border:none;border-radius:50%;
  width:44px;height:44px;cursor:pointer;
  font-size:1.3rem;display:flex;align-items:center;justify-content:center;
  transition:background 0.2s;z-index:10;
}
.gal-lb-nav:hover{background:rgba(212,160,48,0.7);}
.gal-lb-prev{left:0.75rem;}
.gal-lb-next{right:0.75rem;}

/* ── No results ── */
.gal-no-results{
  grid-column:1/-1;text-align:center;
  padding:3rem 1rem;color:var(--text-dim);
}

@media(max-width:700px){
  .gal-grid{grid-template-columns:1fr 1fr;}
  .gal-thumb{height:160px;}
}
@media(max-width:480px){
  .gal-grid{grid-template-columns:1fr;}
  .gal-thumb{height:200px;}
}

/* ════════════════════════════════════════
   KVIS — Vehicle Intelligence System
   Rolls-Royce aesthetic: weighted,
   deliberate, never frantic
════════════════════════════════════════ */

/* ── VIN Input ── */
.kvis-input-wrap{
  max-width:560px;margin:0 auto 2rem;
}
.kvis-vin-form{
  background:var(--card-bg);
  border:1.5px solid var(--card-border);
  border-radius:14px;
  padding:1.8rem 2rem;
}
.kvis-vin-label{
  font-family:'Share Tech Mono',monospace;
  font-size:0.68rem;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--accent);
  margin-bottom:0.6rem;display:block;
}
.kvis-vin-input-row{
  display:flex;gap:0.75rem;align-items:stretch;
}
.kvis-vin-input{
  flex:1;background:var(--bg);
  border:1.5px solid var(--card-border);
  border-radius:10px;padding:0.85rem 1.1rem;
  font-family:'Share Tech Mono',monospace;
  font-size:1rem;letter-spacing:0.12em;
  color:var(--text);text-transform:uppercase;
  transition:border-color 0.2s,box-shadow 0.2s;
  outline:none;
}
.kvis-vin-input:focus{
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-pale);
}
.kvis-vin-input::placeholder{
  color:var(--text-light);letter-spacing:0.06em;
  text-transform:none;
}
.kvis-vin-btn{
  background:var(--accent);color:#000;
  border:none;border-radius:10px;
  padding:0 1.4rem;
  font-family:'Montserrat',sans-serif;
  font-size:0.82rem;font-weight:800;
  letter-spacing:0.06em;text-transform:uppercase;
  cursor:pointer;transition:background 0.2s,transform 0.15s;
  white-space:nowrap;
}
.kvis-vin-btn:hover{background:#e6b828;transform:scale(1.02);}
.kvis-vin-btn:disabled{opacity:0.5;cursor:not-allowed;transform:none;}
.kvis-vin-note{
  font-size:0.75rem;color:var(--text-dim);
  margin-top:0.75rem;line-height:1.6;
}

/* ── Loading experience ── */
.kvis-loading{
  display:none;max-width:560px;margin:0 auto;
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:14px;padding:2.2rem 2rem;
  text-align:center;
}
.kvis-loading.open{display:block;}
.kvis-loading-brand{
  font-family:'Montserrat',sans-serif;
  font-size:0.75rem;font-weight:800;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--text-dim);margin-bottom:0.5rem;
}
.kvis-loading-rule{
  width:40px;height:1px;
  background:var(--accent);margin:0 auto 1.2rem;
}
.kvis-loading-headline{
  font-family:'Montserrat',sans-serif;
  font-size:1rem;font-weight:600;
  color:var(--text);margin-bottom:0.4rem;
  min-height:1.4em;
}
.kvis-vehicle-reveal{
  font-family:'Montserrat',sans-serif;
  font-size:1.1rem;font-weight:700;
  margin-bottom:1.5rem;min-height:1.5em;
  opacity:0;transition:opacity 0.6s ease;
}
.kvis-vehicle-reveal.visible{opacity:1;}
.kvis-vehicle-reveal .yr{color:var(--text-mid);}
.kvis-vehicle-reveal .mk{color:var(--accent);}
.kvis-vehicle-reveal .md{color:var(--text);}

/* Gold pulse dot */
.kvis-pulse-wrap{
  display:flex;align-items:center;justify-content:center;
  gap:0.5rem;margin-bottom:1.8rem;
}
.kvis-pulse-dot{
  width:10px;height:10px;border-radius:50%;
  background:var(--accent);
  animation:kvis-breathe 2s ease-in-out infinite;
}
@keyframes kvis-breathe{
  0%,100%{opacity:0.25;transform:scale(0.8);}
  50%{opacity:1;transform:scale(1.15);
    box-shadow:0 0 12px rgba(212,160,48,0.5);}
}
.kvis-pulse-line{
  flex:1;max-width:60px;height:1px;
  background:linear-gradient(90deg,transparent,var(--card-border),transparent);
}

/* Steps */
.kvis-steps{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:0.5rem;
  text-align:left;max-width:320px;margin:0 auto 1rem;
}
.kvis-step{
  display:flex;align-items:center;gap:0.75rem;
  font-size:0.82rem;color:var(--text-dim);
  transition:color 0.4s;
}
.kvis-step.active{color:var(--text);}
.kvis-step.done{color:var(--text-mid);}
.kvis-step-dot{
  width:18px;height:18px;border-radius:50%;
  background:var(--card-border);flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:0.65rem;transition:background 0.4s,color 0.4s;
  color:transparent;
}
.kvis-step.active .kvis-step-dot{
  background:rgba(212,160,48,0.15);
  border:1.5px solid var(--accent);color:transparent;
}
.kvis-step.done .kvis-step-dot{
  background:var(--accent);color:#000;font-size:0.7rem;
}
.kvis-loading-note{
  font-size:0.72rem;color:var(--text-dim);margin-top:1rem;
}

/* ── Result card ── */
.kvis-result{
  display:none;max-width:760px;margin:0 auto;
  opacity:0;transform:translateY(12px);
  transition:opacity 0.5s ease,transform 0.5s ease;
}
.kvis-result.reveal{
  display:block;opacity:1;transform:translateY(0);
}
.kvis-result-header{
  background:linear-gradient(135deg,var(--primary) 0%,#1a3060 100%);
  border:1.5px solid var(--card-border);
  border-radius:14px 14px 0 0;
  padding:1.6rem 2rem;
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:1rem;
}
.kvis-result-vehicle{
  font-family:'Montserrat',sans-serif;
}
.kvis-result-year{
  font-size:0.78rem;font-weight:600;
  color:rgba(255,255,255,0.5);
  letter-spacing:0.1em;margin-bottom:0.25rem;
}
.kvis-result-make-model{
  font-size:1.3rem;font-weight:800;
  color:#fff;line-height:1.2;
}
.kvis-result-make{color:var(--accent);}
.kvis-result-trim{
  font-size:0.8rem;color:rgba(255,255,255,0.5);
  margin-top:0.2rem;
}
.kvis-tier-badge{
  font-family:'Share Tech Mono',monospace;
  font-size:0.65rem;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;
  padding:4px 12px;border-radius:100px;
  border:1px solid;flex-shrink:0;
}
.kvis-tier-public{color:var(--text-dim);border-color:var(--text-dim);}
.kvis-tier-customer{color:var(--accent);border-color:var(--accent-lt);}
.kvis-tier-subscriber{
  color:#000;background:var(--accent);border-color:var(--accent);
}

/* Attribute sections */
.kvis-result-body{
  background:var(--card-bg);
  border:1.5px solid var(--card-border);
  border-top:none;
  border-radius:0 0 14px 14px;
  padding:1.6rem 2rem;
}
.kvis-attr-section{margin-bottom:1.4rem;}
.kvis-attr-section:last-child{margin-bottom:0;}
.kvis-attr-title{
  font-family:'Share Tech Mono',monospace;
  font-size:0.65rem;font-weight:700;
  letter-spacing:0.15em;text-transform:uppercase;
  color:var(--accent);margin-bottom:0.75rem;
  padding-bottom:0.4rem;
  border-bottom:1px solid var(--card-border);
}
.kvis-attr-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:0.6rem;
}
.kvis-attr-item{
  background:var(--bg);border:1px solid var(--card-border);
  border-radius:8px;padding:0.6rem 0.8rem;
}
.kvis-attr-name{
  font-size:0.68rem;color:var(--text-dim);
  text-transform:uppercase;letter-spacing:0.08em;
  margin-bottom:0.2rem;
}
.kvis-attr-value{
  font-size:0.88rem;font-weight:600;color:var(--text);
}

/* Service flags */
.kvis-flags{
  display:flex;gap:0.5rem;flex-wrap:wrap;
  margin-top:1.2rem;padding-top:1.2rem;
  border-top:1px solid var(--card-border);
}
.kvis-flag{
  display:flex;align-items:center;gap:0.4rem;
  background:var(--bg);border:1px solid var(--card-border);
  border-radius:8px;padding:0.4rem 0.75rem;
  font-size:0.75rem;font-weight:600;color:var(--text-mid);
}
.kvis-flag.available{border-color:rgba(34,197,94,0.3);color:#22c55e;}
.kvis-flag.contact{border-color:var(--accent-lt);color:var(--accent);}

/* Not in database state */
.kvis-not-found{
  background:var(--card-bg);border:1.5px solid var(--card-border);
  border-radius:14px;padding:2rem;text-align:center;max-width:560px;margin:0 auto;
}
.kvis-not-found-vehicle{
  font-family:'Montserrat',sans-serif;
  font-size:1rem;font-weight:700;color:var(--text);margin-bottom:0.5rem;
}
.kvis-not-found-sub{
  font-size:0.85rem;color:var(--text-dim);
  margin-bottom:1.2rem;line-height:1.7;
}

/* Upgrade prompt */
.kvis-upgrade{
  background:linear-gradient(135deg,var(--primary),#1a2d6b);
  border:1.5px solid var(--accent-lt);
  border-radius:10px;padding:1.2rem 1.4rem;
  margin-top:1.2rem;display:flex;
  align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:0.75rem;
}
.kvis-upgrade-text{font-size:0.82rem;color:rgba(255,255,255,0.8);}
.kvis-upgrade-text strong{color:var(--accent);}
.kvis-upgrade-btn{
  background:var(--accent);color:#000;border:none;
  border-radius:8px;padding:0.45rem 1.1rem;
  font-family:'Montserrat',sans-serif;font-size:0.75rem;
  font-weight:800;letter-spacing:0.06em;
  text-transform:uppercase;cursor:pointer;
  transition:background 0.2s;white-space:nowrap;
}
.kvis-upgrade-btn:hover{background:#e6b828;}

/* Reset link */
.kvis-reset{
  text-align:center;margin-top:1.2rem;
}
.kvis-reset-btn{
  background:none;border:none;
  font-size:0.78rem;color:var(--text-dim);
  cursor:pointer;transition:color 0.15s;
}
.kvis-reset-btn:hover{color:var(--accent);}

@media(max-width:600px){
  .kvis-vin-input-row{flex-direction:column;}
  .kvis-vin-btn{padding:0.85rem;text-align:center;}
  .kvis-result-header{flex-direction:column;}
  .kvis-attr-grid{grid-template-columns:1fr 1fr;}
}

.nav-quote{
  background:transparent;color:var(--accent);
  border:2px solid var(--accent);
  padding:0.35rem 0.9rem;border-radius:6px;
  font-size:0.78rem;font-weight:700;letter-spacing:0.05em;
  text-decoration:none;transition:all 0.2s;white-space:nowrap;
}
.nav-quote:hover{background:var(--accent);color:#000;}
@media(max-width:900px){.nav-quote{display:none;}}