/* AutoYolo USA theme — navy / red / white. Loads after theme.css */
:root{--paper:#F4F6FB;--ink:#0B1B3D;--steel:#55627A;--line:#DDE3EE;--pit:#002868;--hivis:#BF0A30;--hivis-dark:#9B0826;--glow:#EAF0FB;--navy-2:#0A3A8C;--red-lt:#FF5C72;--r:14px;--shadow:0 1px 2px rgba(11,27,61,.06),0 14px 34px -16px rgba(11,27,61,.28)}
html{scroll-behavior:smooth}
/* dark surfaces: accent text becomes light red */
.topbar,footer,.final-cta,.stats,.warehouses,.hero,.mbar,#cookieBanner,.payban,.chat-panel{--hivis:var(--red-lt);--hivis-dark:var(--red-lt)}
.quote,.lp-card,.mnav{--hivis:#BF0A30;--hivis-dark:#9B0826}
/* buttons */
.btn-hivis,.btn.btn-hivis{background:#C8102E;border-color:#C8102E;color:#fff;box-shadow:0 10px 24px -10px rgba(200,16,46,.75)}
.btn-hivis:hover,.btn.btn-hivis:hover{background:#9B0826;border-color:#9B0826;color:#fff}
.btn-dark{background:var(--pit);color:#fff}
input:focus,select:focus,textarea:focus{border-color:var(--pit);box-shadow:0 0 0 4px rgba(0,40,104,.15)}
:focus-visible{outline-color:#0A3A8C}
/* topbar + stripe */
.topbar{background:#071A45;position:relative}
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:repeating-linear-gradient(90deg,#BF0A30 0 36px,#fff 36px 72px)}
.topbar .promo{background:#C8102E;color:#fff;border-radius:6px}
.open-badge{display:inline-flex;align-items:center;gap:6px;margin-left:10px;font-weight:600;font-size:.8rem;color:#fff;opacity:.95}
.open-badge i{width:8px;height:8px;border-radius:50%;background:#33D17A;box-shadow:0 0 0 0 rgba(51,209,122,.6);animation:pulse 2s infinite}
.open-badge.closed i{background:#F5A524;animation:none}
@keyframes pulse{70%{box-shadow:0 0 0 7px rgba(51,209,122,0)}100%{box-shadow:0 0 0 0 rgba(51,209,122,0)}}
header{border-bottom:1px solid rgba(0,40,104,.1);transition:box-shadow .2s}
header.scrolled{box-shadow:0 10px 30px -18px rgba(0,40,104,.45)}
nav a:hover,nav a.active{color:var(--pit);border-bottom-color:#BF0A30}
nav a.active{font-weight:600}
.brand-word .nx{color:var(--pit)}
.brand-word .ap{color:#BF0A30}
.header-phone strong{color:var(--pit)}
/* hero: navy with stars */
.hero{position:relative;color:#fff;background:
 radial-gradient(760px 380px at 92% -5%,rgba(191,10,48,.34),transparent 62%),
 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cpath fill='%23fff' fill-opacity='.07' d='M24 14l2.6 7.4h7.9l-6.4 4.6 2.5 7.6-6.6-4.7-6.6 4.7 2.5-7.6-6.4-4.6h7.9zM72 62l2.6 7.4h7.9l-6.4 4.6 2.5 7.6-6.6-4.7-6.6 4.7 2.5-7.6-6.4-4.6h7.9z'/%3E%3C/svg%3E"),
 linear-gradient(160deg,#071A45 0%,#002868 55%,#0A3A8C 100%)}
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:8px;background:repeating-linear-gradient(90deg,#BF0A30 0 48px,#fff 48px 96px)}
.hero h1{color:#fff}
.hero h1 em{color:var(--red-lt)}
.hero p.lead{color:#C9D6F2}
.hero .eyebrow{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.28);color:#fff}
.hero .btn-line{background:transparent!important;border-color:rgba(255,255,255,.55)!important;color:#fff!important}
.hero .btn-line:hover{background:#fff!important;color:var(--pit)!important}
.hero .proof li,.hero .bul li{color:#fff}
.proof li::before,.bul li::before{background:#BF0A30;color:#fff}
.quote,.lp-card{color:var(--ink);border-radius:20px;box-shadow:0 30px 60px -24px rgba(0,0,0,.55)}
.quote::before{background:linear-gradient(90deg,#BF0A30 0 50%,#002868 50%)}
.lp-card{border-top:5px solid #BF0A30}
/* sections */
.eyebrow{color:#BF0A30}
.section-head h2,section h2{color:var(--pit)}
.final-cta h2,.warehouses h2,footer h2,footer h4{color:#fff}
.trustbar{background:#fff;border-bottom:1px solid var(--line)}
.tb b{color:var(--pit)}
.cat,.step,.stat,.tb,.cmp-wrap,.faq details{border-radius:var(--r)}
.cat{background:#fff;border:1px solid var(--line);transition:transform .18s,box-shadow .18s,border-color .18s}
.cat:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#BF0A30}
.step{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}
.step .n,.qt-num{background:#C8102E;color:#fff}
.stat b{color:var(--pit)}
.stats .stat b{color:#fff}
.stats .stat b::after{content:'';display:block;width:28px;height:3px;background:#FF5C72;margin:10px auto 0;border-radius:3px}
.cmp thead .us,.payban{background:#C8102E;color:#fff}
.cmp .us{background:#EAF0FB}
.faq summary{color:var(--pit)}
.faq details[open]{border-color:#BF0A30}
.mbar a.acc{background:#C8102E;color:#fff}
.fab-dot{background:#C8102E}
.chat-head .ico{background:#C8102E;color:#fff}
.chat-foot button,#cookieBanner .btn-cookie-accept{background:#C8102E;color:#fff}
footer{background:#071A45}
footer a:hover{color:#fff}
.foot-logo .ap{color:var(--red-lt)}
/* form progress + quick makes */
.fp{margin:0 0 14px}
.fp-top{display:flex;justify-content:space-between;font-size:.78rem;font-weight:600;color:var(--steel);margin-bottom:6px}
.fp-bar{height:6px;border-radius:99px;background:#E6EBF5;overflow:hidden}
.fp-bar i{display:block;height:100%;width:0;border-radius:99px;background:linear-gradient(90deg,#BF0A30,#0A3A8C);transition:width .35s}
.fp.done .fp-top span:last-child{color:#1B7F4B}
.qm{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 14px;font-size:.78rem;color:var(--steel)}
.qm button{font:600 .78rem "Inter",sans-serif;padding:5px 11px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--pit);cursor:pointer;transition:all .15s}
.qm button:hover,.qm button.on{background:var(--pit);color:#fff;border-color:var(--pit)}
/* floating quote pill + reveal */
.quote-pill{position:fixed;left:20px;bottom:22px;z-index:60;display:none;align-items:center;gap:8px;background:#C8102E;color:#fff;font:700 .95rem "Space Grotesk",sans-serif;padding:13px 20px;border-radius:999px;text-decoration:none;box-shadow:0 14px 30px -10px rgba(200,16,46,.8);opacity:0;transform:translateY(14px);transition:opacity .25s,transform .25s}
.quote-pill.show{opacity:1;transform:none}
@media(min-width:821px){.quote-pill{display:inline-flex}}
.js .rv{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s ease}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .rv{opacity:1;transform:none;transition:none}.open-badge i{animation:none}}

.hero .wrap>div:first-child{position:sticky;top:120px;align-self:start}
@media(max-width:820px){.hero .wrap>div:first-child{position:static}}
.hero .wrap{align-items:start}
.footer-pay svg,.footer-pay .lock{stroke:#FF5C72}
.hero .crumbs,.hero .crumbs a{color:#C9D6F2}
.hero .crumbs a:hover{color:#fff}
/* photo-ready category cards: icon shows until a photo exists, then the photo replaces it */
.cat{overflow:hidden}
.cat:has(.cat-img){padding:0;gap:0;align-items:stretch}
.cat:has(.cat-img) svg{display:none}
.cat-img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .5s ease;background:#E6EBF5}
.cat:hover .cat-img{transform:scale(1.06)}
.cat:has(.cat-img) b{padding:14px 12px;background:#fff;position:relative}
.cat:has(.cat-img) b::after{content:"\2192";float:right;color:#BF0A30}
.cats:has(.cat-img){grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:600px){.cats:has(.cat-img){grid-template-columns:repeat(2,1fr);gap:12px}}

/* language switcher */
.lang-sw{display:inline-flex;align-items:center;gap:6px;flex:none;margin-left:4px}
.lang-sw a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:34px;padding:0 12px;border-radius:999px;border:1.5px solid #CBD5EA;background:#fff;color:#002868;font:700 13px/1 "Space Grotesk",system-ui,sans-serif;letter-spacing:.05em;text-decoration:none;transition:all .15s}
.lang-sw a:hover{border-color:#002868;background:#EAF0FB}
.lang-sw a[aria-current="true"]{background:#002868;border-color:#002868;color:#fff;box-shadow:0 2px 6px rgba(0,40,104,.25)}
@media(max-width:600px){.lang-sw{gap:4px}.lang-sw a{min-width:36px;height:32px;padding:0 9px;font-size:12px}}
@media(min-width:821px){.hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}}
.hero-cta-row{flex-wrap:wrap}
.hero h1,.hero h1 em{white-space:normal;overflow-wrap:break-word}
.hero h1 em{display:inline}
@media(max-width:1700px){.header-phone{display:none}}
@media(max-width:1320px){header .brand-word .brand-tag{display:none!important}}
@media(max-width:1180px){header nav>ul{gap:14px!important}header nav>ul a{font-size:.88rem!important}header .header-actions{gap:8px!important}header .header-actions .btn-sm{padding:10px 16px!important;font-size:.85rem!important}}

/* QA fixes: mobile */
.vin-hint-row{margin:-4px 0 12px}.menu-toggle{min-height:44px}.payban h3{margin:0 0 8px}.payban p{margin:0}@media(max-width:560px){#quoteForm .row2 select{font-size:14.5px!important;padding-right:34px!important;text-overflow:ellipsis;background-position:right 10px center!important}.row2 input{font-size:15px}#q-vin::placeholder{text-transform:none;letter-spacing:0;font-size:14px}}@media(max-width:380px){header .wrap{gap:6px}.lang-sw a{padding-left:8px;padding-right:8px;min-width:34px}.menu-toggle{width:40px;padding:0}header .brand-word{font-size:1.2rem}}#cookieBanner button{min-height:40px;padding-left:18px;padding-right:18px}.lang-sw a{min-height:36px;display:inline-flex;align-items:center}
.mbar{padding-bottom:env(safe-area-inset-bottom)}
.qm button,.quick-makes button{min-height:36px}
@media(max-width:820px){
 .fab-stack,.chat-panel{display:none!important}
 #cookieBanner{bottom:68px;padding:10px 14px;gap:8px;max-height:46vh;overflow:auto}
 #cookieBanner p{font-size:.78rem;line-height:1.4}
 #cookieBanner button{padding:7px 14px;font-size:.8rem}
 .btn{max-width:100%;white-space:normal;text-align:center}
}
@media(max-width:560px){
 .row2 label>span{display:block}
 .row2 input,.row2 select{padding-left:12px;padding-right:8px;font-size:16px}
 .row2{gap:10px}
}
@media(max-width:380px){
 .lang-sw{gap:3px;margin-left:0}
 .lang-sw a{min-width:32px;height:32px;padding:0 6px;font-size:11px}
 header .brand svg,header .brand img{height:34px!important;width:auto!important}
 header .wrap{padding-left:12px;padding-right:12px}
 .hero h1{font-size:clamp(1.55rem,8.4vw,2.2rem);overflow-wrap:anywhere;hyphens:auto}
 .hero-cta-row .btn{width:100%}
}
