/* AUTO GTBE - Minimal like arvaro.be */
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#09090b;--card:#18181b;--card2:#27272a;--accent:#2ec4b6;--accent2:#2190a3;--text:#fafafa;--muted:#a1a1aa;--dark:#52525b;--border:#27272a;--r:10px;--font:'Inter',system-ui,sans-serif}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.5;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{text-decoration:none;color:inherit}
.container{max-width:1280px;margin:0 auto;padding:0 16px}

/* NAV */
.navbar{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(9,9,11,.8);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);transition:.3s}
.nav-container{display:flex;align-items:center;justify-content:space-between;height:56px}
.nav-logo{font-weight:800;font-size:1.2rem;letter-spacing:1px}
.nav-logo .accent{color:var(--accent)}
.nav-right{display:flex;align-items:center;gap:12px}
.lang-switch{display:flex;gap:2px;background:var(--card);border-radius:6px;padding:2px}
.lang-btn{background:none;border:none;color:var(--muted);font-size:.75rem;font-weight:600;padding:4px 10px;border-radius:4px;cursor:pointer;transition:.2s}
.lang-btn.active{background:var(--accent);color:#fff}
.lang-btn:hover:not(.active){color:var(--text)}
.nav-phone{font-size:.85rem;font-weight:600;color:var(--text);display:flex;align-items:center;gap:4px}
.nav-phone:hover{color:var(--accent)}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:6px}
.hamburger,.hamburger::before,.hamburger::after{display:block;width:20px;height:2px;background:var(--text);transition:.3s}
.hamburger::before{content:'';transform:translateY(-5px)}
.hamburger::after{content:'';transform:translateY(3px)}
.nav-mobile{display:none;position:fixed;top:56px;left:0;right:0;background:rgba(9,9,11,.98);backdrop-filter:blur(16px);border-bottom:1px solid var(--border);padding:8px 16px}
.nav-mobile.open{display:flex;flex-direction:column;gap:4px}
.nav-mobile a{padding:12px 8px;font-weight:600;font-size:.9rem;color:var(--muted);border-bottom:1px solid var(--border)}
.nav-mobile a:last-child{border:none}
.nav-mobile a:hover{color:var(--accent)}

/* HERO */
.hero{position:relative;min-height:50vh;display:flex;align-items:center;padding:80px 0 40px}
.hero-bg{position:absolute;inset:0;background:url('../images/truck-bg.jpg') center right/cover no-repeat}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,9,11,.95) 0%,rgba(9,9,11,.7) 50%,rgba(9,9,11,.3) 100%)}
.hero-content{position:relative;z-index:2;max-width:560px}
.hero-title{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;line-height:1.15;margin-bottom:12px}
.hero-sub{font-size:1rem;color:var(--muted);margin-bottom:20px}
.hero-cta{display:inline-flex;padding:12px 24px;background:var(--accent);color:#000;font-weight:700;font-size:.9rem;border-radius:var(--r);transition:.2s}
.hero-cta:hover{background:var(--accent2);transform:translateY(-1px)}

/* FILTER BAR */
.filter-bar{padding:16px 0;border-bottom:1px solid var(--border);background:var(--bg);position:sticky;top:56px;z-index:90}
.filter-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;background:var(--card);border:1px solid var(--border);border-radius:var(--r);color:var(--text);font-size:.85rem;font-weight:500;cursor:pointer;transition:.2s}
.filter-btn:hover{background:var(--card2);border-color:var(--accent)}
.filter-btn .filter-icon{width:16px;height:16px}
.filter-count{display:inline-block;margin-left:12px;font-size:.8rem;color:var(--muted)}

/* FILTER PANEL */
.filter-panel{max-height:0;overflow:hidden;transition:max-height .3s ease;background:var(--card);border-bottom:1px solid var(--border)}
.filter-panel.open{max-height:300px}
.filter-panel .container{padding:20px 16px}
.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:16px}
.filter-group label{display:block;font-size:.75rem;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.filter-group select{width:100%;padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.85rem;cursor:pointer;appearance:auto}
.filter-group select:focus{outline:none;border-color:var(--accent)}
.filter-reset{background:none;border:1px solid var(--border);color:var(--muted);padding:8px 16px;border-radius:8px;font-size:.8rem;cursor:pointer;transition:.2s}
.filter-reset:hover{border-color:var(--accent);color:var(--accent)}

/* STOCK */
.stock{padding:40px 0 60px}
.car-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}

/* CAR CARD */
.car-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:.2s}
.car-card:hover{border-color:rgba(46,196,182,.3);transform:translateY(-2px)}
.car-card.hidden{display:none}

/* GALLERY - FIXED FOR MOBILE */
.car-gallery{position:relative;height:200px;overflow:hidden;background:var(--bg);touch-action:pan-y}
.gallery-track{width:100%;height:100%;position:relative}
.gallery-track img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;opacity:0;transition:opacity .3s;pointer-events:none}
.gallery-track img.active{opacity:1;z-index:2;pointer-events:auto}

.gal-prev,.gal-next{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.15);color:#fff;font-size:1rem;cursor:pointer;z-index:5;display:flex;align-items:center;justify-content:center;opacity:0;transition:.2s;backdrop-filter:blur(4px)}
.car-gallery:hover .gal-prev,.car-gallery:hover .gal-next{opacity:1}
.gal-prev:hover,.gal-next:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.gal-prev{left:8px}.gal-next{right:8px}

/* Always show arrows on mobile */
@media(max-width:768px){
    .gal-prev,.gal-next{opacity:1;width:28px;height:28px;font-size:.9rem}
    .car-gallery{height:220px}
}

.gal-dots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:4px;z-index:5}
.gal-dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.3);border:none;cursor:pointer;transition:.2s;padding:0}
.gal-dot.active{background:var(--accent);width:16px;border-radius:3px}
.gal-counter{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.7);color:#fff;padding:2px 7px;border-radius:8px;font-size:.65rem;font-weight:600;z-index:5}
.badge-new,.badge-ct{position:absolute;top:8px;left:8px;padding:3px 8px;border-radius:4px;font-size:.65rem;font-weight:700;z-index:5;backdrop-filter:blur(6px)}
.badge-new{background:rgba(234,179,8,.9);color:#000}
.badge-ct{background:rgba(34,197,94,.9);color:#000}

/* CAR INFO */
.car-info{padding:14px}
.car-info h3{font-size:.95rem;font-weight:700;margin-bottom:8px}
.car-specs{display:flex;gap:10px;flex-wrap:wrap;padding:8px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-bottom:8px}
.car-specs span{font-size:.75rem;color:var(--muted)}
.car-tags{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.car-tags span{padding:2px 7px;background:rgba(46,196,182,.1);border:1px solid rgba(46,196,182,.25);border-radius:10px;font-size:.7rem;color:var(--accent);font-weight:500}
.car-price{font-size:1.3rem;font-weight:800;margin-bottom:10px}
.car-price small{font-size:.7rem;color:var(--dark);font-weight:500;margin-left:4px}
.car-btns{display:flex;gap:6px;flex-wrap:wrap}
.btn-interest{flex:1;padding:8px 10px;background:#22c55e;color:#000;font-size:.75rem;font-weight:700;border-radius:6px;text-align:center;transition:.2s;min-width:0}
.btn-interest:hover{background:#16a34a}
.btn-pdf{padding:8px 10px;background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.25);color:#ef4444;font-size:.72rem;font-weight:600;border-radius:6px;transition:.2s}
.btn-pdf:hover{background:rgba(239,68,68,.2)}
.btn-carpass{padding:8px 10px;background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.25);color:#60a5fa;font-size:.72rem;font-weight:600;border-radius:6px;transition:.2s}
.btn-carpass:hover{background:rgba(59,130,246,.2)}

.no-results{text-align:center;padding:60px 20px;color:var(--muted)}
.no-results p{font-size:1.1rem}

/* CTA */
.cta{padding:50px 0;background:#22c55e;text-align:center}
.cta h2{font-size:1.5rem;font-weight:800;color:#000;margin-bottom:16px}
.btn-call{display:inline-flex;padding:14px 28px;background:#000;color:var(--accent);font-weight:800;font-size:1.1rem;border-radius:var(--r);transition:.2s}
.btn-call:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.3)}

/* CONTACT */
.contact{padding:60px 0;border-top:1px solid var(--border)}
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:40px}
.contact h2{font-size:1.4rem;font-weight:800;margin-bottom:20px}
.c-item{margin-bottom:16px}
.c-item strong{display:block;font-size:.7rem;color:var(--dark);text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
.c-item a,.c-item span{font-size:.95rem;color:var(--text)}
.c-item a:hover{color:var(--accent)}
.hours{display:flex;flex-direction:column;gap:3px}
.hours>div{display:flex;justify-content:space-between;font-size:.85rem}
.hours>div span:last-child{font-weight:600}
.hours .hl{color:var(--accent);padding-top:4px;margin-top:4px;border-top:1px solid var(--border)}

.contact-form h3{font-size:1.1rem;font-weight:700;margin-bottom:16px}
.contact-form input,.contact-form textarea{padding:10px 12px;background:var(--card);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.9rem;font-family:var(--font);transition:.2s}
.contact-form input:focus,.contact-form textarea:focus{outline:none;border-color:var(--accent)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.btn-send{width:100%;padding:12px;background:var(--accent);color:#fff;font-weight:700;font-size:.9rem;border:none;border-radius:8px;cursor:pointer;transition:.2s}
.btn-send:hover{background:var(--accent2)}

/* WHATSAPP */
.wa-float{position:fixed;bottom:20px;right:20px;width:56px;height:56px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:999;box-shadow:0 4px 16px rgba(37,211,102,.4);transition:.2s;animation:waPulse 3s infinite}
@keyframes waPulse{0%,100%{box-shadow:0 4px 16px rgba(37,211,102,.4)}50%{box-shadow:0 4px 24px rgba(37,211,102,.6),0 0 0 8px rgba(37,211,102,.1)}}
.wa-float:hover{transform:scale(1.1)}

/* FOOTER */
footer{padding:32px 0 0;border-top:1px solid var(--border)}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:24px;padding-bottom:24px}
.f-logo{font-weight:800;font-size:1.1rem;letter-spacing:1px;margin-bottom:6px}
.f-logo span{color:var(--accent)}
footer p,footer li{font-size:.82rem;color:var(--muted);margin-bottom:4px}
footer h4{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:10px;color:var(--text)}
footer a:hover{color:var(--accent)}
.f-bottom{padding:16px 0;border-top:1px solid var(--border);text-align:center}
.f-bottom p{font-size:.75rem;color:var(--dark)}

/* MOBILE */
@media(max-width:1024px){
    .car-grid{grid-template-columns:repeat(2,1fr)}
    .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
    .nav-phone{display:none}
    .nav-toggle{display:block}
    .car-grid{grid-template-columns:1fr}
    .contact-grid{grid-template-columns:1fr}
    .form-row{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr}
    .filter-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
    .hero-title{font-size:1.6rem}
    .car-gallery{height:200px}
    .filter-grid{grid-template-columns:1fr}
    .wa-float{width:50px;height:50px;bottom:14px;right:14px}
    .wa-float svg{width:26px;height:26px}
}