
:root{
  --orange:#FF7A00;
  --text:#0f172a;
  --muted:#64748b;
  --border:rgba(15,23,42,.12);
  --bg:#ffffff;
  --soft:#f8fafc;
  --radius:18px;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;background:var(--bg);color:var(--text);}
a{color:inherit;text-decoration:none}
.container{max-width:1150px;margin:0 auto;padding:0 16px}

header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--border);}
.nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;}
.brand{display:flex;align-items:center;gap:10px;font-weight:900}
.logo{width:38px;height:38px;border-radius:14px;border:1px solid var(--border);display:grid;place-items:center;background:var(--soft);}
.menu{display:flex;gap:10px;flex-wrap:wrap}
.menu a{padding:10px 12px;border-radius:14px;color:rgba(15,23,42,.82);}
.menu a:hover{background:rgba(15,23,42,.04);}
.menu a.active{background:rgba(255,122,0,.10);border:1px solid rgba(255,122,0,.22);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 14px;border-radius:14px;border:1px solid var(--border);background:#fff;font-weight:800;cursor:pointer}
.btn:hover{background:rgba(15,23,42,.04)}
.btn-primary{background:var(--orange);border-color:var(--orange);color:#fff}
.btn-primary:hover{filter:brightness(1.02)}
.btn-ghost{border-color:transparent;background:rgba(15,23,42,.04);}

.hero{padding:28px 0 18px 0;}
.hero-card{border:1px solid var(--border);border-radius:calc(var(--radius) + 6px);background:linear-gradient(180deg, rgba(255,122,0,.06), rgba(15,23,42,.02));padding:22px;display:grid;gap:14px}
.h1{font-size:34px;line-height:1.08;font-weight:950;letter-spacing:-.03em}
.sub{color:var(--muted);font-size:15px;max-width:70ch}
.pills{display:flex;gap:8px;flex-wrap:wrap}
.pill{font-size:12px;color:rgba(15,23,42,.75);border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:999px;padding:7px 10px;display:inline-flex;align-items:center;gap:8px}
.dot{width:10px;height:10px;border-radius:999px;background:var(--orange);}

.section{padding:18px 0 34px 0;}
.section h2{margin:0 0 10px 0;font-size:22px;font-weight:950}
.section .desc{margin:0 0 16px 0;color:var(--muted)}

.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.input,select,textarea{padding:12px 12px;border-radius:14px;border:1px solid var(--border);outline:none;background:#fff;min-width:180px}
.input:focus,select:focus,textarea:focus{box-shadow:0 0 0 4px rgba(255,122,0,.18);border-color:rgba(255,122,0,.7);}

.grid{display:grid;gap:12px}
.grid.cars{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1000px){.grid.cars{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.grid.cars{grid-template-columns:1fr} .h1{font-size:28px} }

.card{border:1px solid var(--border);border-radius:var(--radius);background:#fff;box-shadow:0 12px 28px rgba(15,23,42,.06);padding:16px}
.card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}
.title{font-weight:950}
.meta{color:var(--muted);font-size:13px;margin-top:4px}
.badge{font-size:12px;font-weight:900;border-radius:999px;padding:7px 10px;border:1px solid rgba(255,122,0,.30);background:rgba(255,122,0,.10);}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tag{font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.03);border-radius:999px;padding:6px 10px;color:rgba(15,23,42,.75);}
.price{margin-top:12px;font-size:20px;font-weight:950}
.price small{font-size:12px;color:var(--muted);font-weight:700}

/* Image box: file:// guaranteed */
.car-media{position:relative;border-radius:16px;overflow:hidden;border:1px solid rgba(15,23,42,.12);background:#fff;min-height:160px}
.car-media:before{content:"";display:block;padding-top:62.5%} /* 16:10 */
.car-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:12px;display:block}

footer{border-top:1px solid var(--border);background:#fff;padding:18px 0;margin-top:18px}
footer .f{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.small{font-size:12px;color:var(--muted)}


/* =========================
   Header (enhanced)
   ========================= */
.topbar{background:linear-gradient(180deg, rgba(255,122,0,.10), rgba(255,255,255,1));border-bottom:1px solid var(--border);}
.topbar .row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 0;flex-wrap:wrap}
.topbar .left,.topbar .right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 10px;border-radius:999px;border:1px solid rgba(15,23,42,.12);background:#fff;font-size:12px;color:rgba(15,23,42,.78)}
.chip b{color:rgba(15,23,42,.92)}
.ico{width:16px;height:16px;display:inline-block}
.sep{width:1px;height:16px;background:rgba(15,23,42,.14)}
.nav{padding:12px 0} /* slightly denser */
.cta-wrap{display:flex;align-items:center;gap:10px}
.mobile-toggle{display:none}
@media(max-width:860px){
  .menu{display:none}
  .mobile-toggle{display:inline-flex}
}
/* Mobile drawer */
.drawer{position:fixed;inset:0;z-index:120;display:none}
.drawer.open{display:block}
.drawer .backdrop{position:absolute;inset:0;background:rgba(2,6,23,.45)}
.drawer .sheet{position:absolute;right:0;top:0;bottom:0;width:min(360px,92vw);background:#fff;border-left:1px solid var(--border);padding:16px;display:grid;gap:12px}
.drawer .sheet .head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.drawer .sheet nav{display:grid;gap:8px}
.drawer .sheet nav a{padding:12px 12px;border-radius:14px;border:1px solid rgba(15,23,42,.10);background:rgba(15,23,42,.02)}
.drawer .sheet nav a:hover{background:rgba(15,23,42,.04)}
.drawer .sheet .actions{display:grid;gap:10px;margin-top:auto}

/* =========================
   Footer (enhanced)
   ========================= */
.footer{border-top:1px solid var(--border);background:#fff;padding:26px 0;margin-top:18px}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.2fr;gap:16px}
@media(max-width:980px){.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.footer-grid{grid-template-columns:1fr}}
.f-title{font-weight:950;margin:0 0 10px 0}
.f-list{display:grid;gap:8px}
.f-list a{color:rgba(15,23,42,.78)}
.f-list a:hover{color:rgba(15,23,42,1)}
.f-note{color:var(--muted);font-size:13px;line-height:1.5}
.news{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.news input{flex:1;min-width:220px}
.badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.badges .pill{background:rgba(15,23,42,.02)}
.bottom{margin-top:18px;padding-top:14px;border-top:1px solid rgba(15,23,42,.10);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.social{display:flex;gap:8px;flex-wrap:wrap}
.sbtn{width:42px;height:42px;border-radius:14px;border:1px solid rgba(15,23,42,.12);background:#fff;display:grid;place-items:center}
.sbtn:hover{background:rgba(15,23,42,.04)}

/* =========================
   Home Conversion Add-ons
   ========================= */
.hero-split{display:grid;grid-template-columns:1.15fr .85fr;gap:14px;align-items:stretch}
@media(max-width:900px){.hero-split{grid-template-columns:1fr}}

.hero-card{position:relative;overflow:hidden}
.hero-bg-lines{position:absolute;inset:-40px;opacity:.12;pointer-events:none;background:
  radial-gradient(600px 300px at 20% 20%, rgba(255,122,0,.65), transparent 60%),
  radial-gradient(520px 260px at 80% 30%, rgba(15,23,42,.55), transparent 62%);
}
.hero-card .content{position:relative;z-index:2}

.bookbar{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px;box-shadow:0 14px 30px rgba(15,23,42,.08)}
.bookbar h3{margin:0;font-size:14px;font-weight:950}
.book-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:10px}
.book-grid .full{grid-column:1/-1}
@media(max-width:520px){.book-grid{grid-template-columns:1fr}}
.help{font-size:12px;color:var(--muted);line-height:1.5;margin-top:10px}
.secure{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.secure .chip{font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;color:rgba(15,23,42,.78)}

.trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
@media(max-width:900px){.trust{grid-template-columns:repeat(2,1fr)}}
.trust .tcard{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:18px;padding:12px}
.trust .tcard b{display:block;font-weight:950}
.trust .tcard span{display:block;color:var(--muted);font-size:12px;margin-top:4px}
.star{color:rgba(255,122,0,.95);font-weight:950}

.sticky-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:110;display:none}
.sticky-cta .bar{display:flex;gap:10px;align-items:center;justify-content:space-between;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:18px;padding:10px;box-shadow:0 18px 42px rgba(15,23,42,.16)}
.sticky-cta .bar .mini{display:grid}
.sticky-cta .bar .mini b{font-size:12px}
.sticky-cta .bar .mini span{font-size:12px;color:var(--muted)}
.sticky-cta .bar .actions{display:flex;gap:8px}
.sticky-cta .bar .actions a{padding:10px 12px;border-radius:14px;border:1px solid rgba(15,23,42,.12);font-weight:900}
.sticky-cta .bar .actions a.primary{background:var(--orange);border-color:var(--orange);color:#fff}
@media(max-width:860px){.sticky-cta{display:block} body{padding-bottom:90px}}

.how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media(max-width:900px){.how{grid-template-columns:1fr}}
.how .step{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:18px;padding:12px}
.how .step .n{width:34px;height:34px;border-radius:14px;display:grid;place-items:center;font-weight:950;background:rgba(255,122,0,.14);border:1px solid rgba(255,122,0,.28);margin-bottom:10px}

/* =========================
   Cars Page Sales + Compare
   ========================= */
.filters{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px;box-shadow:0 12px 26px rgba(15,23,42,.06);display:grid;gap:12px}
.filters .grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:10px}
@media(max-width:980px){.filters .grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.filters .grid{grid-template-columns:1fr}}
.range{display:grid;gap:6px}
.range .row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.range input[type="range"]{width:100%}
.kpi-mini{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.kpi-mini .chip{font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;color:rgba(15,23,42,.78)}

.card .compare-line{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.ck{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:rgba(15,23,42,.78);user-select:none}
.ck input{width:16px;height:16px}
.card .cta2{display:grid;gap:10px;margin-top:12px}

.comparebar{position:fixed;left:12px;right:12px;bottom:12px;z-index:115;display:none}
.comparebar.show{display:block}
.comparebar .bar{display:flex;gap:10px;align-items:center;justify-content:space-between;background:#fff;border:1px solid rgba(15,23,42,.12);border-radius:18px;padding:10px;box-shadow:0 18px 42px rgba(15,23,42,.16)}
.comparebar .bar .left{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.comparebar .tag{font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;color:rgba(15,23,42,.78)}
.comparebar .actions{display:flex;gap:8px;flex-wrap:wrap}
@media(max-width:860px){.comparebar{display:none}} /* mobile already has sticky CTA */

.modal-compare{position:fixed;inset:0;z-index:160;display:none}
.modal-compare.open{display:block}
.modal-compare .back{position:absolute;inset:0;background:rgba(2,6,23,.55)}
.modal-compare .box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(980px,94vw);max-height:86vh;overflow:auto;border-radius:24px;border:1px solid rgba(15,23,42,.14);background:#fff;box-shadow:0 26px 70px rgba(2,6,23,.35);padding:16px}
.modal-compare .head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.modal-compare .head h3{margin:0;font-size:16px;font-weight:950}
.c-table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:12px}
.c-table th{font-size:12px;color:var(--muted);text-align:left;padding:0 10px}
.c-table td{padding:12px 10px;border:1px solid rgba(15,23,42,.10);border-left:none;border-right:none}
.c-table tr td:first-child{border-left:1px solid rgba(15,23,42,.10);border-top-left-radius:16px;border-bottom-left-radius:16px}
.c-table tr td:last-child{border-right:1px solid rgba(15,23,42,.10);border-top-right-radius:16px;border-bottom-right-radius:16px}
.c-name{font-weight:950}
.c-img{width:100%;max-width:220px;height:120px;object-fit:contain;background:#fff;border:1px solid rgba(15,23,42,.10);border-radius:16px;padding:10px}

/* =========================
   Car Detail Page
   ========================= */
.detail-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;align-items:start}
@media(max-width:980px){.detail-hero{grid-template-columns:1fr}}
.gallery{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:12px;box-shadow:0 12px 26px rgba(15,23,42,.06)}
.gallery .main{border:1px solid rgba(15,23,42,.10);border-radius:18px;background:#fff;min-height:280px;display:grid;place-items:center;padding:12px}
.gallery img{max-width:100%;max-height:320px;object-fit:contain}
.thumbs{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}
.thumbs button{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:14px;padding:8px;cursor:pointer}
.thumbs img{width:86px;height:54px;object-fit:contain}
.specs{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px;box-shadow:0 12px 26px rgba(15,23,42,.06)}
.specs .h{font-size:20px;font-weight:950;margin:0}
.specs .meta{color:var(--muted);margin-top:6px}
.spec-table{width:100%;border-collapse:separate;border-spacing:0 10px;margin-top:12px}
.spec-table td{padding:12px 10px;border:1px solid rgba(15,23,42,.10)}
.spec-table tr td:first-child{border-top-left-radius:16px;border-bottom-left-radius:16px;color:var(--muted);width:40%}
.spec-table tr td:last-child{border-top-right-radius:16px;border-bottom-right-radius:16px;font-weight:900}
.box-white{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px}
.faq{display:grid;gap:10px}
.faq details{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:18px;padding:12px}
.faq summary{cursor:pointer;font-weight:950}

/* =========================
   Campaigns Page Upgrade
   ========================= */
.camp-wrap{display:grid;grid-template-columns:1fr .92fr;gap:14px;align-items:start}
@media(max-width:980px){.camp-wrap{grid-template-columns:1fr}}
.camp-panel{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px;box-shadow:0 12px 26px rgba(15,23,42,.06)}
.camp-panel h2{margin:0;font-size:18px;font-weight:950}
.camp-panel .desc2{color:var(--muted);margin-top:6px;line-height:1.6}
.camp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}
@media(max-width:560px){.camp-grid{grid-template-columns:1fr}}
.camp-card{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:20px;padding:14px;position:relative;overflow:hidden}
.camp-card .tag{position:absolute;top:12px;right:12px;font-size:12px;border-radius:999px;padding:7px 10px;border:1px solid rgba(255,122,0,.26);background:rgba(255,122,0,.10);color:rgba(15,23,42,.9);font-weight:900}
.camp-card h3{margin:0;font-size:15px;font-weight:950}
.camp-card p{margin:8px 0 0 0;color:var(--muted);line-height:1.6;font-size:13px}
.camp-card .line{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px}
.countdown{display:inline-flex;gap:8px;align-items:center;font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;color:rgba(15,23,42,.78)}
.countdown b{color:rgba(15,23,42,.92)}
.camp-card .cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.camp-card .cta a{font-weight:900}
.camp-card .note{margin-top:10px;font-size:12px;color:var(--muted)}
.camp-card:before{content:"";position:absolute;inset:-40px;opacity:.11;pointer-events:none;background:
  radial-gradient(520px 260px at 20% 10%, rgba(255,122,0,.65), transparent 60%),
  radial-gradient(520px 260px at 90% 20%, rgba(15,23,42,.55), transparent 62%);
}
.camp-card > *{position:relative;z-index:2}

.camp-filter{display:grid;gap:10px;margin-top:12px}
.camp-filter .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.camp-filter .row{grid-template-columns:1fr}}
.badge-ends{font-size:12px;border:1px solid rgba(245,158,11,.28);background:rgba(245,158,11,.10);color:rgba(15,23,42,.9);border-radius:999px;padding:7px 10px;font-weight:900}

/* =========================
   Contact 2-Step Quote Form
   ========================= */
.form-wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;align-items:start}
@media(max-width:980px){.form-wrap{grid-template-columns:1fr}}
.form-card{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:22px;padding:14px;box-shadow:0 12px 26px rgba(15,23,42,.06)}
.steps{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:10px}
.step-chip{display:inline-flex;gap:8px;align-items:center;font-size:12px;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;color:rgba(15,23,42,.78)}
.step-chip b{color:rgba(15,23,42,.92)}
.step-chip.active{border-color:rgba(255,122,0,.28);background:rgba(255,122,0,.10)}
.step-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;justify-content:flex-end}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media(max-width:560px){.form-row{grid-template-columns:1fr}}
.notice{border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:18px;padding:12px;color:rgba(15,23,42,.82);font-size:12px;line-height:1.6}
.success{border:1px solid rgba(34,197,94,.30);background:rgba(34,197,94,.10);border-radius:18px;padding:12px;font-size:12px;line-height:1.6}
.err{border:1px solid rgba(239,68,68,.28);background:rgba(239,68,68,.10);border-radius:18px;padding:12px;font-size:12px;line-height:1.6}
.wafallback{position:sticky;top:12px}

/* =========================
   Mobile Experience Upgrade
   ========================= */
:root{scroll-behavior:smooth}
@media(max-width:860px){
  .btn{padding:12px 14px;border-radius:16px}
  .menu a{padding:12px 10px}
  .chip{padding:10px 12px}
}

/* Global mobile bottom action bar */
.mbar{position:fixed;left:12px;right:12px;bottom:12px;z-index:140;display:none}
.mbar .inner{display:flex;gap:10px;align-items:center;justify-content:space-between;background:#fff;border:1px solid rgba(15,23,42,.12);
  border-radius:18px;padding:10px;box-shadow:0 18px 42px rgba(15,23,42,.16)}
.mbar .inner a{flex:1;text-align:center;font-weight:950;border-radius:14px;padding:12px 10px;border:1px solid rgba(15,23,42,.12)}
.mbar .inner a.primary{background:var(--orange);border-color:var(--orange);color:#fff}
.mbar .inner a.ghost{background:rgba(15,23,42,.02)}
@media(max-width:860px){.mbar{display:block} body{padding-bottom:96px}}

/* Micro animations */
.fade-up{opacity:0;transform:translateY(10px);transition:opacity .45s ease, transform .45s ease}
.fade-up.in{opacity:1;transform:none}
.card,.form-card,.box-white,.camp-card,.filters,.gallery,.specs{transition:transform .18s ease, box-shadow .18s ease}
.card:active,.camp-card:active{transform:scale(.99)}
@media(hover:hover){
  .card:hover,.camp-card:hover,.box-white:hover{box-shadow:0 18px 44px rgba(15,23,42,.10);transform:translateY(-2px)}
}

/* Image rendering and performance */
img{max-width:100%;height:auto}
.car-media img{content-visibility:auto;contain-intrinsic-size:300px 180px}

/* =========================
   Micro Details Upgrade
   ========================= */
.ico{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:8px;background:rgba(15,23,42,.06);border:1px solid rgba(15,23,42,.10);font-size:12px}
.ico.orange{background:rgba(255,122,0,.12);border-color:rgba(255,122,0,.22)}

.skel{position:relative;overflow:hidden;background:rgba(15,23,42,.06);border:1px solid rgba(15,23,42,.10);border-radius:18px}
.skel:before{content:"";position:absolute;inset:0;transform:translateX(-100%);
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  animation:skel 1.2s infinite}
@keyframes skel{to{transform:translateX(100%)}}
.skel.card{padding:14px}
.skel .line{height:12px;border-radius:10px;background:rgba(15,23,42,.10);margin-top:10px}
.skel .line.w70{width:70%}
.skel .line.w50{width:50%}
.skel .img{height:150px;border-radius:16px;background:rgba(15,23,42,.10)}
.skel .btns{display:flex;gap:10px;margin-top:12px}
.skel .btn{height:40px;border-radius:14px;background:rgba(15,23,42,.10);flex:1}

.empty{border:1px dashed rgba(15,23,42,.18);background:rgba(15,23,42,.02);border-radius:22px;padding:16px;text-align:center}
.empty .big{font-weight:950;font-size:16px}
.empty .small{color:var(--muted);margin-top:6px;line-height:1.7}
.empty .actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:12px}

.page404{min-height:60vh;display:grid;place-items:center}
.page404 .box{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:24px;padding:18px;box-shadow:0 18px 44px rgba(15,23,42,.10);text-align:center;max-width:640px}
.page404 h1{margin:0;font-size:28px;font-weight:950}
.page404 p{color:var(--muted);line-height:1.7;margin:10px 0 0}
.page404 .code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;font-size:12px;
  display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(15,23,42,.12);background:rgba(15,23,42,.02);border-radius:999px;padding:7px 10px;margin-top:12px}



/* =========================
   MOBILE RESPONSIVE FIX V2
   ========================= */
html,body{max-width:100%;overflow-x:hidden}
img,svg{max-width:100%}

/* Safer containers on small screens */
@media(max-width:560px){
  .container{padding:0 14px}
}

/* Header + topbar */
@media(max-width:860px){
  header{position:sticky;top:0;z-index:130}
  .nav{flex-wrap:wrap}
  .cta-wrap{width:100%;justify-content:flex-end}
}
@media(max-width:560px){
  .topbar .row{justify-content:center}
  .topbar .left,.topbar .right{justify-content:center}
  .chip{max-width:100%}
  .chip span{white-space:normal}
}

/* Buttons + tap targets */
@media(max-width:860px){
  .btn{padding:12px 14px;border-radius:16px;min-width:0}
  .menu a{padding:12px 12px}
  .pill{padding:10px 12px}
}

/* Hero + split layouts */
@media(max-width:900px){
  .hero-split{grid-template-columns:1fr}
}
@media(max-width:560px){
  .hero-card .content{padding:16px}
  .pills{gap:8px}
}

/* Generic two-column wrappers used across pages */
@media(max-width:980px){
  .camp-wrap,.form-wrap,.detail-wrap{grid-template-columns:1fr}
}

/* Car detail gallery/specs safety */
@media(max-width:768px){
  .gallery{grid-template-columns:1fr}
  .specs{grid-template-columns:1fr}
  table{display:block;width:100%;overflow-x:auto}
}

/* Footer stack */
@media(max-width:768px){
  footer .grid{grid-template-columns:1fr !important}
  footer{text-align:center}
}

/* Mobile bottom bar spacing */
@media(max-width:860px){
  body{padding-bottom:96px}
  .mbar{left:10px;right:10px;bottom:10px}
  .mbar .inner{padding:10px;border-radius:18px}
}

/* Prevent accidental fixed-width overflow */
*{min-width:0}

/* =========================
   MOBILE: HIDE TOP INFO BAR
   ========================= */
@media (max-width: 860px){
  .topbar,
  .top-info,
  .header-top,
  .top-header{
    display:none !important;
  }
  header{
    margin-top:0 !important;
  }
}


.resultsbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin:12px 0 14px}
.resultsbar .pill b{color:var(--text)}
.avail-badge{position:absolute;left:10px;top:10px;z-index:2;font-size:12px;font-weight:900;border-radius:999px;padding:7px 10px;border:1px solid rgba(15,23,42,.12);background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.08)}
.avail-badge.available{border-color:rgba(34,197,94,.28);background:rgba(34,197,94,.10)}
.avail-badge.blocked{border-color:rgba(239,68,68,.24);background:rgba(239,68,68,.10)}
.avail-badge.partial{border-color:rgba(245,158,11,.28);background:rgba(245,158,11,.10)}
.card.is-blocked{opacity:.92}
.card.is-blocked .car-media{background:linear-gradient(180deg, rgba(239,68,68,.05), #fff)}
.card.is-available .car-media{background:linear-gradient(180deg, rgba(34,197,94,.05), #fff)}


/* Detail page availability */
.detail-availability{margin-top:12px;display:grid;gap:12px}
.detail-availability-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.detail-availability-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.detail-availability-grid label{display:grid;gap:6px}
.detail-availability-actions{display:flex;gap:10px;flex-wrap:wrap}
.status-pill-blocked{border-color:rgba(239,68,68,.24);background:rgba(239,68,68,.10)}
.detail-alt-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.detail-alt-card{border:1px solid rgba(15,23,42,.12);background:#fff;border-radius:18px;padding:14px;box-shadow:0 12px 26px rgba(15,23,42,.05)}
.detail-alt-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.detail-alt-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
@media(max-width:900px){.detail-alt-grid{grid-template-columns:1fr}.detail-availability-grid{grid-template-columns:1fr}}


.filters-advanced-grid{grid-template-columns:1fr 1fr 1fr 1fr !important}
@media(max-width:980px){.filters-advanced-grid{grid-template-columns:1fr 1fr !important}}
@media(max-width:560px){.filters-advanced-grid{grid-template-columns:1fr !important}}
.active-filters{display:flex;gap:8px;flex-wrap:wrap;margin:-2px 0 14px}
.filter-chip{display:inline-flex;align-items:center;gap:8px;padding:8px 10px;border-radius:999px;border:1px solid rgba(15,23,42,.12);background:#fff;font-size:12px;color:rgba(15,23,42,.82);box-shadow:0 8px 18px rgba(15,23,42,.04)}
.filter-chip b{color:var(--text)}
.filter-chip button{border:none;background:transparent;padding:0;margin:0;font-size:14px;line-height:1;cursor:pointer;color:var(--muted)}
.filter-chip button:hover{color:var(--orange)}
.car-media.img-fallback{background:linear-gradient(180deg, rgba(255,122,0,.06), rgba(15,23,42,.02));}
.car-media.img-fallback:after{content:"Görsel yükleniyor";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:12px;font-weight:900;color:rgba(15,23,42,.48);border:1px solid rgba(15,23,42,.10);background:rgba(255,255,255,.86);padding:8px 10px;border-radius:999px;pointer-events:none}
.card.is-blocked .price{opacity:.94}


.category-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:18px 0 18px}
.category-card{appearance:none;border:1px solid rgba(15,23,42,.10);background:linear-gradient(180deg,#fff,rgba(255,122,0,.05));border-radius:22px;padding:16px 14px;display:grid;gap:6px;text-align:left;cursor:pointer;box-shadow:0 12px 26px rgba(15,23,42,.05);transition:.22s ease}
.category-card strong{font-size:16px;color:var(--text)}
.category-card small{font-size:12px;color:var(--muted);font-weight:800}
.category-kicker{font-size:11px;font-weight:900;letter-spacing:.02em;color:var(--orange)}
.category-card:hover,.category-card.active{transform:translateY(-2px);border-color:rgba(255,122,0,.35);box-shadow:0 16px 34px rgba(255,122,0,.10)}
@media(max-width:1080px){.category-strip{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:640px){.category-strip{grid-template-columns:1fr;}}


/* Logo only layout */
.brand-logo-only{gap:0}
.site-logo{display:block;width:auto;height:auto;max-width:none}
.site-logo-header{height:92px}
.site-logo-drawer{height:84px}
.site-logo-footer{height:150px}
.footer-logo-wrap{display:flex;align-items:center}
@media(max-width:860px){
  .site-logo-header{height:82px}
  .site-logo-footer{height:130px}
}
@media(max-width:640px){
  .site-logo-header{height:72px}
  .site-logo-drawer{height:68px}
  .site-logo-footer{height:110px}
}


/* =========================
   V2 UI Refresh - Header / Hero / CTA
   ========================= */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&display=swap");

body,
button,
input,
select,
textarea{
  font-family:"Manrope", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

header{
  backdrop-filter:saturate(180%) blur(10px);
  background:rgba(255,255,255,.96);
}

.nav{
  min-height:108px;
  gap:18px;
  padding:16px 0;
}

.brand.brand-logo-only{
  flex:0 0 auto;
  display:flex;
  align-items:center;
}

.site-logo-header{
  height:118px;
}

.menu{
  gap:8px;
  align-items:center;
}

.menu a{
  position:relative;
  padding:12px 16px;
  font-size:15px;
  font-weight:800;
  letter-spacing:.01em;
  color:rgba(15,23,42,.94);
  transition:color .2s ease, background .2s ease, transform .2s ease;
}

.menu a::after{
  content:"";
  position:absolute;
  left:16px;
  right:16px;
  bottom:8px;
  height:2px;
  border-radius:999px;
  background:var(--orange);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s ease;
}

.menu a:hover,
.menu a:focus-visible{
  color:var(--orange);
  background:rgba(255,122,0,.08);
}

.menu a:hover::after,
.menu a:focus-visible::after,
.menu a.active::after{
  transform:scaleX(1);
}

.cta-wrap{
  gap:12px;
}

.btn{
  transition:background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease, filter .2s ease;
}

.btn:hover,
.btn:focus-visible{
  transform:translateY(-1px);
}

.btn-primary,
.btn-primary:visited{
  background:var(--orange);
  border-color:var(--orange);
  color:#fff;
  box-shadow:0 14px 28px rgba(255,122,0,.22);
}

.btn-primary:hover,
.btn-primary:focus-visible,
.btn-primary:active{
  background:#e96f00;
  border-color:#e96f00;
  color:#fff;
  filter:none;
  box-shadow:0 18px 34px rgba(233,111,0,.28);
}

.btn-ghost{
  font-weight:800;
}

.hero{
  padding:34px 0 22px 0;
}

.hero-card{
  padding:28px;
}

.h1{
  font-size:clamp(36px, 4vw, 56px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:-.04em;
  max-width:12ch;
}

.sub{
  font-size:17px;
  line-height:1.7;
  color:rgba(100,116,139,.95);
  max-width:62ch;
}

.hero-card .content > div[style*="display:flex"][style*="flex-wrap:wrap"]{
  margin-top:6px;
}

@media (max-width: 1100px){
  .site-logo-header{height:108px;}
}

@media (max-width: 860px){
  .nav{
    min-height:92px;
    gap:12px;
  }

  .site-logo-header{height:86px;}

  .h1{
    max-width:none;
  }
}

@media (max-width: 640px){
  .hero-card{
    padding:22px;
  }

  .site-logo-header{height:74px;}

  .menu a{
    font-size:14px;
  }

  .sub{
    font-size:15px;
    line-height:1.65;
  }
}

/* =========================
   V3 Minimal Header + Font Scale Tuning
   ========================= */
.topbar .row{
  padding:5px 0;
  gap:8px;
}

.chip{
  padding:5px 9px;
  font-size:11px;
}

.nav{
  min-height:76px;
  gap:14px;
  padding:8px 0;
}

.site-logo-header{
  height:72px;
}

.menu{
  gap:4px;
}

.menu a{
  padding:9px 12px;
  font-size:14px;
  font-weight:700;
  letter-spacing:0;
}

.menu a::after{
  left:12px;
  right:12px;
  bottom:6px;
}

.cta-wrap{
  gap:8px;
}

.btn{
  padding:10px 12px;
  font-size:14px;
  border-radius:12px;
}

.hero{
  padding:22px 0 14px 0;
}

.hero-card{
  padding:22px;
}

.h1{
  font-size:clamp(28px, 3vw, 42px);
  line-height:1.1;
  font-weight:800;
  letter-spacing:-.03em;
  max-width:13ch;
}

.sub{
  font-size:15px;
  line-height:1.55;
  max-width:58ch;
}

.section{
  padding:16px 0 28px 0;
}

.section h2{
  font-size:20px;
}

.desc,
.small,
.help,
.meta,
.tag,
.pill,
.secure .chip,
.trust .tcard span{
  font-size:12px;
}

.trust .tcard{
  padding:10px;
}

.trust .tcard b{
  font-size:14px;
}

.bookbar{
  padding:12px;
  border-radius:18px;
}

.bookbar h3{
  font-size:13px;
}

@media (max-width: 1100px){
  .site-logo-header{height:66px;}
}

@media (max-width: 860px){
  .topbar .row{
    padding:4px 0;
  }

  .nav{
    min-height:70px;
    gap:10px;
    padding:7px 0;
  }

  .site-logo-header{height:60px;}

  .hero-card{
    padding:18px;
  }

  .h1{
    max-width:none;
  }
}

@media (max-width: 640px){
  .chip{
    font-size:10px;
    padding:4px 8px;
  }

  .nav{
    min-height:64px;
  }

  .site-logo-header{height:54px;}

  .site-logo-drawer{height:56px;}

  .menu a,
  .btn{
    font-size:13px;
  }

  .hero{
    padding:18px 0 12px 0;
  }

  .hero-card,
  .bookbar{
    padding:16px;
  }

  .sub{
    font-size:14px;
    line-height:1.5;
  }
}


/* Vehicles page compact filters v4 */
.filters-compact{padding:12px 14px;border-radius:20px;gap:12px}
.filters-compact .label{font-size:12px;font-weight:800;color:var(--muted);margin-bottom:6px}
.filters-compact .input,
.filters-compact select{min-width:0;width:100%;padding:10px 12px;border-radius:12px;font-size:14px;background:#fff}
.filters-topline{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.filters-topline strong{font-size:15px;letter-spacing:.01em}
.filters-inline-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filters-inline-actions .btn{padding:10px 14px;border-radius:12px;font-size:13px}
.filters-toolbar{display:grid;grid-template-columns:minmax(220px,1.35fr) repeat(4,minmax(0,1fr));gap:10px;align-items:end}
.filters-toolbar .field{margin:0}
.field-search{min-width:0}
.filters-advanced-panel{border:1px solid rgba(15,23,42,.08);border-radius:16px;background:rgba(15,23,42,.02);padding:0}
.filters-advanced-panel summary{list-style:none;cursor:pointer;padding:12px 14px;font-size:13px;font-weight:800;color:var(--text);display:flex;align-items:center;justify-content:space-between;gap:12px}
.filters-advanced-panel summary::-webkit-details-marker{display:none}
.filters-advanced-panel summary::after{content:'+';font-size:18px;line-height:1;color:var(--orange)}
.filters-advanced-panel[open] summary::after{content:'−'}
.compact-advanced-grid{padding:0 14px 14px;display:grid;grid-template-columns:1fr 1fr 1fr 1.2fr !important;gap:10px;align-items:end}
.range-compact{border:1px solid rgba(15,23,42,.08);background:#fff;border-radius:14px;padding:10px 12px;gap:8px}
.range-compact .small{font-size:12px}
.resultsbar{margin-top:14px}
@media(max-width:1180px){.filters-toolbar{grid-template-columns:repeat(3,minmax(0,1fr));}.field-search{grid-column:1 / -1}}
@media(max-width:860px){.filters-topline,.filters-inline-actions{align-items:stretch}.filters-inline-actions{width:100%}.filters-inline-actions .btn{flex:1}.filters-toolbar{grid-template-columns:1fr 1fr}.compact-advanced-grid{grid-template-columns:1fr 1fr !important}}
@media(max-width:560px){.filters-compact{padding:12px}.filters-toolbar{grid-template-columns:1fr}.compact-advanced-grid{grid-template-columns:1fr !important}.filters-advanced-panel summary{padding:11px 12px}}


/* =========================
   Campaigns Page Gallery Refresh
   ========================= */
.campaigns-section{padding-top:28px}
.camp-shell{display:grid;gap:16px}
.camp-head-minimal{display:flex;align-items:end;justify-content:space-between;gap:16px}
.camp-head-minimal h1{margin:6px 0 0;font-size:26px;font-weight:900;letter-spacing:-.02em}
.camp-head-minimal p{margin:8px 0 0;color:var(--muted);max-width:620px;line-height:1.6;font-size:14px}
.eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(15,23,42,.10);background:#fff;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:rgba(15,23,42,.72)}
.camp-actions-minimal{display:flex;gap:10px;flex-wrap:wrap}
.camp-toolbar-minimal{display:grid;grid-template-columns:minmax(220px,1.2fr) 170px 170px;gap:10px;align-items:center}
.camp-toolbar-minimal .field{margin:0}
.camp-toolbar-minimal .input,.camp-toolbar-minimal select{height:44px;border-radius:15px;background:#fff;border:1px solid rgba(15,23,42,.10);padding:0 14px;font-size:13px}
.camp-grid-gallery{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:0}
@media(max-width:1180px){.camp-grid-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){.camp-head-minimal{align-items:flex-start;flex-direction:column}.camp-toolbar-minimal{grid-template-columns:1fr 1fr}.camp-toolbar-minimal .search-wide{grid-column:1/-1}.camp-grid-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.campaigns-section{padding-top:18px}.camp-head-minimal h1{font-size:22px}.camp-toolbar-minimal{grid-template-columns:1fr}.camp-grid-gallery{grid-template-columns:1fr}}

.camp-grid-gallery .camp-card{min-height:0;aspect-ratio:1/1.04;border:none;border-radius:22px;padding:14px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 16px 34px rgba(15,23,42,.12);background:linear-gradient(180deg, rgba(15,23,42,.12), rgba(15,23,42,.58)), radial-gradient(120% 120% at 0% 0%, rgba(255,122,0,.96) 0%, rgba(255,150,60,.92) 28%, rgba(33,33,33,.94) 100%);color:#fff;overflow:hidden;position:relative}
.camp-grid-gallery .camp-card:nth-child(4n+2){background:linear-gradient(180deg, rgba(15,23,42,.10), rgba(15,23,42,.60)), radial-gradient(120% 120% at 100% 0%, rgba(255,140,80,.92) 0%, rgba(251,191,36,.78) 30%, rgba(30,41,59,.94) 100%)}
.camp-grid-gallery .camp-card:nth-child(4n+3){background:linear-gradient(180deg, rgba(15,23,42,.10), rgba(15,23,42,.62)), radial-gradient(120% 120% at 0% 100%, rgba(249,115,22,.92) 0%, rgba(234,88,12,.86) 35%, rgba(17,24,39,.95) 100%)}
.camp-grid-gallery .camp-card:nth-child(4n+4){background:linear-gradient(180deg, rgba(15,23,42,.10), rgba(15,23,42,.56)), radial-gradient(120% 120% at 100% 100%, rgba(255,152,86,.90) 0%, rgba(255,122,0,.82) 34%, rgba(15,23,42,.96) 100%)}
.camp-grid-gallery .camp-card::before{content:"";position:absolute;inset:auto -14% -38% auto;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.10);filter:blur(4px);opacity:.78}
.camp-grid-gallery .camp-card::after{content:"";position:absolute;inset:14px 14px auto auto;width:56px;height:56px;border-radius:18px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);backdrop-filter:blur(4px)}
.camp-grid-gallery .camp-card > *{position:relative;z-index:2}
.camp-grid-gallery .camp-card .tag{position:static;display:inline-flex;align-items:center;width:max-content;font-size:10px;letter-spacing:.05em;text-transform:uppercase;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);color:#fff;padding:6px 9px;border-radius:999px;backdrop-filter:blur(6px)}
.camp-grid-gallery .camp-card h3{margin:8px 0 0;font-size:19px;line-height:1.08;font-weight:900;max-width:88%}
.camp-grid-gallery .camp-card p{margin:8px 0 0;font-size:12px;line-height:1.5;color:rgba(255,255,255,.88);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:92%}
.camp-grid-gallery .camp-card .line{margin-top:10px}
.camp-grid-gallery .countdown,.camp-grid-gallery .badge-ends{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:11px}
.camp-grid-gallery .countdown b,.camp-grid-gallery .badge-ends b{color:#fff}
.camp-grid-gallery .pills{margin-top:8px;gap:6px;display:flex;flex-wrap:wrap}
.camp-grid-gallery .pill{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.16);color:#fff;font-size:11px;padding:6px 9px}
.camp-grid-gallery .pill .dot{background:#fff}
.camp-grid-gallery .cta{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.camp-grid-gallery .cta .btn,
.camp-grid-gallery .cta .btn:visited{min-height:40px;padding:9px 10px;font-size:12px;font-weight:800;justify-content:center;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff;text-align:center}
.camp-grid-gallery .cta .btn:hover,
.camp-grid-gallery .cta .btn:focus-visible{background:#fff;color:var(--dark);border-color:#fff}
.camp-grid-gallery .cta .btn.btn-primary,
.camp-grid-gallery .cta .btn.btn-primary:visited{background:#fff;color:var(--dark);border-color:#fff}
.camp-grid-gallery .cta .btn.btn-primary:hover,
.camp-grid-gallery .cta .btn.btn-primary:focus-visible{background:#1f2937;color:#fff;border-color:#1f2937}
.camp-grid-gallery .note{margin-top:8px;font-size:10px;line-height:1.45;color:rgba(255,255,255,.74)}
@media(max-width:640px){.camp-grid-gallery .camp-card{aspect-ratio:1/1.02;border-radius:20px;padding:14px}.camp-grid-gallery .camp-card h3{font-size:18px;max-width:100%}.camp-grid-gallery .cta{grid-template-columns:1fr}}

.camp-footer-minimal{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mini-note-card{border:1px solid rgba(15,23,42,.10);background:#fff;border-radius:18px;padding:14px;font-size:13px;line-height:1.6;color:var(--muted)}
.mini-note-card strong{color:var(--dark)}
@media(max-width:700px){.camp-footer-minimal{grid-template-columns:1fr}}


/* V7 campaigns button readability fix */
.camp-grid-gallery .cta .btn,
.camp-grid-gallery .cta .btn:link,
.camp-grid-gallery .cta .btn:visited{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:10px 12px;
  font-size:12px;
  line-height:1.2;
  font-weight:800;
  text-align:center;
  text-decoration:none;
  color:#111827 !important;
  background:#ffffff !important;
  border:1px solid rgba(255,255,255,.85) !important;
  box-shadow:0 10px 20px rgba(15,23,42,.14);
  opacity:1;
}

.camp-grid-gallery .cta .btn:hover,
.camp-grid-gallery .cta .btn:focus-visible,
.camp-grid-gallery .cta .btn:active{
  color:#111827 !important;
  background:#f8fafc !important;
  border-color:#ffffff !important;
}

.camp-grid-gallery .cta .btn.btn-primary,
.camp-grid-gallery .cta .btn.btn-primary:link,
.camp-grid-gallery .cta .btn.btn-primary:visited{
  color:#ffffff !important;
  background:var(--orange) !important;
  border-color:var(--orange) !important;
}

.camp-grid-gallery .cta .btn.btn-primary:hover,
.camp-grid-gallery .cta .btn.btn-primary:focus-visible,
.camp-grid-gallery .cta .btn.btn-primary:active{
  color:#ffffff !important;
  background:#e96f00 !important;
  border-color:#e96f00 !important;
}


/* V14 clickable vehicle cards */
.card-clickable{cursor:pointer;}
.card-clickable:focus-visible{outline:2px solid var(--orange);outline-offset:3px;}
.card-clickable .car-media img{pointer-events:none;}


/* =========================
   V16 mobile app UI refresh
   ========================= */
@media (max-width: 768px){
  :root{--mobile-nav-h:78px}
  html{scroll-padding-top:84px}
  body{background:#f4f6fb;padding-bottom:calc(var(--mobile-nav-h) + 18px);-webkit-overflow-scrolling:touch}
  body.has-mobile-bottom-nav .sticky-contact{bottom:calc(var(--mobile-nav-h) + 18px)}
  header{position:sticky;top:0;z-index:1100;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border-bottom:1px solid rgba(15,23,42,.08);box-shadow:0 10px 30px rgba(15,23,42,.05)}
  .topbar{display:none}
  .container{width:min(100% - 28px, 1200px)}
  .nav{min-height:68px;padding:10px 0;gap:12px}
  .brand{min-width:0}
  .site-logo-header{height:42px !important;width:auto;object-fit:contain}
  .menu,.cta-wrap .btn-ghost,.cta-wrap .btn-primary{display:none !important}
  .cta-wrap{margin-left:auto;gap:8px}
  .mobile-toggle{display:inline-flex !important;align-items:center;justify-content:center;min-width:46px;height:46px;padding:0;border-radius:14px;border:1px solid rgba(15,23,42,.08);background:#fff;color:var(--dark);box-shadow:0 10px 24px rgba(15,23,42,.08)}

  .drawer .sheet{width:min(92vw, 360px);border-radius:26px 0 0 26px;padding:20px 18px 24px;background:rgba(255,255,255,.98);backdrop-filter:blur(18px);box-shadow:-18px 0 40px rgba(15,23,42,.18)}
  .drawer .head{padding-bottom:8px;margin-bottom:10px}
  .drawer nav{display:grid;gap:8px}
  .drawer nav a{padding:14px 16px;border-radius:16px;background:#f5f7fb;font-weight:800}
  .drawer nav a.active{background:rgba(255,122,0,.12);color:var(--orange)}
  .drawer .actions{display:grid;grid-template-columns:1fr;gap:10px;margin-top:14px}
  .drawer .actions .btn{min-height:48px;border-radius:16px;font-weight:800}

  .hero{padding:16px 0 8px}
  .hero-split{grid-template-columns:1fr;gap:14px}
  .hero-card,.bookbar,.section .card,.filters,.filters-compact,.camp-grid-gallery .camp-card,.mini-note-card,.step,.faq-item,.contact-card,.contact-form,.map-card,.legal-card,.kpi-card,.comparebar .bar,.modal-compare .box{border-radius:22px;box-shadow:0 14px 34px rgba(15,23,42,.08)}
  .hero-card{padding:18px 16px}
  .hero-card .content{gap:14px}
  .hero-card .h1,.hero h1{font-size:clamp(28px, 9vw, 38px) !important;line-height:1.06;letter-spacing:-.03em}
  .hero-card .sub,.hero .sub{font-size:14px;line-height:1.6;max-width:unset}
  .pills{gap:8px}
  .pill{font-size:11px;padding:8px 10px;border-radius:999px}
  .trust{display:none !important}
  .bookbar{padding:16px}
  .bookbar h3{font-size:20px;margin-bottom:4px}
  .book-grid{gap:10px}
  .book-grid .full,.book-grid .field{grid-column:auto !important}

  .section{padding:20px 0}
  .section h2{font-size:24px;line-height:1.1;letter-spacing:-.02em;margin-bottom:8px}
  .desc{font-size:14px;line-height:1.6}

  .grid,.grid.cars,#carsGrid,.how,.camp-grid-gallery,.camp-footer-minimal,.contact-grid,.why-grid,.kv-grid,.stats-grid,.footer-grid{grid-template-columns:1fr !important;gap:14px !important}
  .how .step,.step{padding:16px}

  .filters.filters-compact{padding:14px;border:1px solid rgba(15,23,42,.06);background:rgba(255,255,255,.96)}
  .filters-topline{align-items:flex-start;gap:10px}
  .filters-topline strong{font-size:18px}
  .filters-inline-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .filters-inline-actions .btn{min-height:46px;border-radius:14px}
  .filters-toolbar,.compact-advanced-grid{grid-template-columns:1fr !important;gap:10px !important}
  .filters-toolbar .field,.compact-advanced-grid .field{margin:0}
  .filters-advanced-panel summary{padding:13px 14px;font-size:13px;border-radius:16px}
  .resultsbar,.active-filters{display:grid;gap:8px}

  .card,[data-car],.camp-grid-gallery .camp-card,.contact-card,.faq-item,.legal-card{overflow:hidden}
  .card,.car-card,[data-car]{border-radius:22px}
  #carsGrid > *{margin:0 !important}
  .car-media{border-radius:18px;overflow:hidden;background:linear-gradient(180deg,#fff,#f4f6fb)}
  .car-media img{height:190px;object-fit:contain;padding:10px}
  .card-top{gap:12px}
  .title{font-size:18px;line-height:1.15}
  .meta{font-size:13px;line-height:1.5}
  .price{font-size:22px}
  .card .btn,.compare-line .btn{min-height:48px;border-radius:15px;font-size:14px;font-weight:800}
  .compare-line{display:grid;grid-template-columns:1fr 1fr;gap:10px}
  .comparebar{bottom:calc(var(--mobile-nav-h) + 10px)}
  .comparebar .bar{padding:12px 14px;border-radius:18px}

  .camp-head-minimal{gap:10px}
  .camp-head-minimal h1{font-size:24px}
  .camp-toolbar-minimal{grid-template-columns:1fr !important}
  .camp-grid-gallery .camp-card{aspect-ratio:auto;min-height:260px;padding:15px}
  .camp-grid-gallery .camp-card h3{font-size:18px}

  .btn,button,input,select,textarea,.input{font-size:14px}
  .btn{min-height:48px;padding:12px 16px;border-radius:15px;font-weight:800;justify-content:center}
  input,select,textarea,.input{min-height:48px;border-radius:15px;padding:0 14px;background:#fff;border:1px solid rgba(15,23,42,.10);box-shadow:none}
  textarea{padding-top:12px;padding-bottom:12px;min-height:110px}

  footer{padding-bottom:10px;margin-bottom:0}
}

.mobile-bottom-nav{display:none}
@media (max-width: 768px){
  .mobile-bottom-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;position:fixed;left:12px;right:12px;bottom:12px;z-index:1200;padding:10px 12px;background:rgba(17,24,39,.94);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.08);border-radius:24px;box-shadow:0 18px 40px rgba(15,23,42,.28)}
  .mobile-bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:56px;border-radius:18px;text-decoration:none;color:rgba(255,255,255,.7);font-size:10px;font-weight:800;letter-spacing:.02em;transition:all .25s ease}
  .mobile-bottom-nav a .icon{width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}
  .mobile-bottom-nav a .icon svg{width:22px;height:22px}
  .mobile-bottom-nav a .label{display:block;line-height:1}
  .mobile-bottom-nav a.active{background:linear-gradient(180deg, rgba(255,122,0,.22), rgba(255,122,0,.12));color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
  .mobile-bottom-nav a.active .icon{transform:translateY(-1px)}
}


/* =========================
   V17 logo balance + detail page header fix
   ========================= */
header .brand.brand-logo-only{
  display:flex;
  align-items:center;
  gap:0;
  flex:0 0 auto;
  min-width:0;
}
header .brand.brand-logo-only .site-logo-header{
  display:block;
  height:78px !important;
  width:auto;
  max-width:min(42vw, 290px);
  object-fit:contain;
  object-position:left center;
}
.nav{
  min-height:84px !important;
  padding:8px 0 !important;
  gap:16px;
}
.site-logo-drawer{
  height:76px !important;
  width:auto;
}
@media (max-width:1100px){
  header .brand.brand-logo-only .site-logo-header{
    height:72px !important;
    max-width:min(46vw, 260px);
  }
}
@media (max-width:860px){
  .nav{
    min-height:74px !important;
    padding:8px 0 !important;
  }
  header .brand.brand-logo-only .site-logo-header{
    height:60px !important;
    max-width:54vw;
  }
}
@media (max-width:640px){
  .nav{
    min-height:68px !important;
    padding:7px 0 !important;
  }
  header .brand.brand-logo-only .site-logo-header{
    height:54px !important;
    max-width:62vw;
  }
  .site-logo-drawer{
    height:62px !important;
  }
}


/* =========================
   V18 mobile header/footer/logo cleanup
   ========================= */
.brand.brand-logo-only,
.footer-logo-wrap{min-width:0}
.footer-logo-wrap{justify-content:flex-start}
.site-logo-footer{height:108px !important;max-width:min(100%, 280px);width:auto;object-fit:contain}
header .brand.brand-logo-only .site-logo-header{height:84px !important;max-width:min(34vw, 240px);width:auto;object-fit:contain;object-position:left center}
.nav{min-height:86px !important;padding:10px 0 !important;align-items:center}
@media (max-width:1100px){
  header .brand.brand-logo-only .site-logo-header{height:74px !important;max-width:min(40vw, 220px)}
  .nav{min-height:78px !important}
}
@media (max-width:768px){
  header{background:rgba(255,255,255,.94) !important}
  .nav{display:grid !important;grid-template-columns:minmax(0,1fr) auto !important;align-items:center !important;min-height:76px !important;padding:12px 0 !important;gap:12px !important}
  header .brand.brand-logo-only{display:flex !important;align-items:center !important;width:auto !important;max-width:none !important;overflow:visible !important}
  header .brand.brand-logo-only .site-logo-header{height:62px !important;max-width:180px !important;width:auto !important;display:block !important}
  .menu{display:none !important}
  .cta-wrap{display:flex !important;align-items:center !important;justify-content:flex-end !important;width:auto !important;max-width:none !important;margin-left:0 !important;gap:8px !important}
  .cta-wrap .btn-ghost,.cta-wrap .btn-primary{display:none !important}
  .mobile-toggle{display:inline-flex !important;align-items:center !important;justify-content:center !important;min-width:48px !important;height:48px !important;padding:0 !important;border-radius:16px !important;font-size:24px !important;line-height:1 !important;font-weight:700 !important;color:var(--text) !important}
  .drawer .head .site-logo-drawer{height:56px !important;width:auto !important;max-width:170px}
  .footer{padding-top:22px !important}
  .footer-grid > div:first-child{display:flex;align-items:center}
  .footer-logo-wrap{justify-content:flex-start !important}
  .site-logo-footer{height:88px !important;max-width:220px !important}
  .bottom{padding-bottom:8px}
}


.hero-showcase{position:relative;margin-top:16px;border:1px solid rgba(15,23,42,.12);background:linear-gradient(180deg,#fff,rgba(248,250,252,.96));border-radius:24px;overflow:hidden;min-height:260px;box-shadow:0 18px 40px rgba(15,23,42,.10)}
.hero-slider{position:relative;height:260px;background:radial-gradient(500px 180px at 50% 100%, rgba(255,122,0,.16), transparent 55%),linear-gradient(180deg,rgba(255,255,255,.98),rgba(241,245,249,.95))}
.hero-slider .slide{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:translateX(18px) scale(.98);animation:heroFade 12s infinite ease-in-out;padding:18px}
.hero-slider .slide img{max-width:100%;max-height:190px;object-fit:contain;filter:drop-shadow(0 22px 26px rgba(15,23,42,.18))}
.hero-slider .s1{animation-delay:0s}
.hero-slider .s2{animation-delay:4s}
.hero-slider .s3{animation-delay:8s}
.showcase-overlay{position:absolute;left:16px;right:16px;bottom:16px;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;z-index:2}
.show-badge{display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;background:rgba(15,23,42,.9);color:#fff;font-size:12px;font-weight:900;letter-spacing:.02em;box-shadow:0 10px 20px rgba(15,23,42,.18)}
.show-meta{display:grid;gap:4px;flex:1;max-width:360px;padding:12px 14px;border-radius:18px;background:rgba(255,255,255,.88);backdrop-filter:blur(10px);border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 24px rgba(15,23,42,.08)}
.show-meta b{font-size:14px;font-weight:950}
.show-meta span{font-size:12px;color:var(--muted);line-height:1.45}
.show-dots{display:flex;gap:6px;align-items:center;padding:10px 12px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 20px rgba(15,23,42,.08)}
.show-dots span{width:8px;height:8px;border-radius:999px;background:rgba(15,23,42,.18);animation:dotPulse 12s infinite ease-in-out}
.show-dots span:nth-child(1){animation-delay:0s}
.show-dots span:nth-child(2){animation-delay:4s}
.show-dots span:nth-child(3){animation-delay:8s}
@keyframes heroFade{0%,28%{opacity:1;transform:translateX(0) scale(1)}33%,100%{opacity:0;transform:translateX(-18px) scale(.98)}}
@keyframes dotPulse{0%,28%{background:var(--orange);transform:scale(1.15)}33%,100%{background:rgba(15,23,42,.18);transform:scale(1)}}
@media(max-width:900px){.hero-showcase{min-height:240px}.hero-slider{height:240px}.hero-slider .slide img{max-height:168px}.showcase-overlay{left:12px;right:12px;bottom:12px;flex-direction:column;align-items:stretch}.show-meta{max-width:none}.show-dots{align-self:flex-start}}
@media(max-width:520px){.hero-showcase{min-height:220px;border-radius:20px}.hero-slider{height:220px}.hero-slider .slide{padding:12px}.hero-slider .slide img{max-height:142px}.show-badge{font-size:11px;padding:7px 10px}.show-meta{padding:10px 12px;border-radius:16px}.show-meta b{font-size:13px}.show-meta span{font-size:11px}}


/* v23: Ana sayfa sol hero tamamen araç vitrini */
.hero-card .content{display:flex;flex-direction:column;justify-content:center;height:100%}
.hero-showcase-only{margin-top:0;min-height:420px;height:100%}
.hero-showcase-only .hero-slider{height:420px}
.hero-showcase-only .hero-slider .slide{padding:24px}
.hero-showcase-only .hero-slider .slide img{max-height:270px}
@media(max-width:900px){
  .hero-showcase-only{min-height:320px}
  .hero-showcase-only .hero-slider{height:320px}
  .hero-showcase-only .hero-slider .slide img{max-height:210px}
}
@media(max-width:520px){
  .hero-showcase-only{min-height:260px}
  .hero-showcase-only .hero-slider{height:260px}
  .hero-showcase-only .hero-slider .slide img{max-height:170px}
}


/* v27: ana sayfa hareketli araç vitrini kampanya poster entegrasyonu */
.hero-promo-slider{background:linear-gradient(135deg,#2b0a07 0%, #61100d 28%, #17131f 100%)}
.hero-promo-slider .slide{padding:0}
.hero-promo-slider .slide::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.14));z-index:1;pointer-events:none}
.hero-promo-slider .slide img{width:100%;height:100%;max-width:none;max-height:none;object-fit:cover;object-position:center center;filter:none}
.hero-showcase-only .hero-promo-slider .slide img{max-height:none}
@media(max-width:900px){
  .hero-promo-slider .slide img{object-position:center top}
}
@media(max-width:520px){
  .hero-promo-slider .slide img{object-position:center top}
}
