@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{--ink:#111318;--muted:#6d737d;--line:#e5e7eb;--soft:#f5f6f8;--accent:#c51f2b;--white:#fff;--dark:#17191d}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.5}
a{text-decoration:none;color:inherit}button,input,select{font:inherit}
.topbar{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.topbar-inner{height:76px;max-width:1240px;margin:auto;padding:0 24px;display:flex;align-items:center;gap:42px}
.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:800;letter-spacing:-.04em;white-space:nowrap}.brand>span:last-child>span{color:var(--accent)}
.brand-mark{display:grid;place-items:center;width:32px;height:32px;background:var(--ink);color:#fff;border-radius:8px;font-size:16px;font-weight:800}
.main-nav{display:flex;gap:30px;flex:1}.main-nav a{font-size:14px;color:#666d76;font-weight:600;padding:28px 0;border-bottom:2px solid transparent}.main-nav a:hover,.main-nav a.active{color:var(--ink);border-color:var(--accent)}
.admin-button,.hero-button{border:0;border-radius:8px;background:var(--ink);color:#fff;padding:12px 17px;font-size:13px;font-weight:700;cursor:pointer}.admin-button:hover,.hero-button:hover{background:#30333a}
.menu-toggle{display:none;border:0;background:none;font-size:24px;cursor:pointer}
.hero{min-height:510px;background:linear-gradient(90deg,rgba(10,11,13,.97) 0%,rgba(10,11,13,.88) 42%,rgba(10,11,13,.18) 100%),url('https://images.unsplash.com/photo-1504215680853-026ed2a45def?auto=format&fit=crop&w=1800&q=85') center/cover;display:flex;align-items:center;justify-content:space-between;padding:70px max(24px,calc((100% - 1240px)/2));color:#fff;gap:40px}
.hero-content{max-width:650px}.eyebrow{display:inline-block;font-size:11px;letter-spacing:.16em;font-weight:800;color:#cbd0d7;margin-bottom:13px}.eyebrow.dark{color:var(--accent)}h1{font-size:clamp(42px,6vw,72px);line-height:1.02;letter-spacing:-.055em;margin-bottom:22px}h1 strong{color:#fff}.hero-content p{max-width:580px;color:#d3d6db;font-size:16px;margin-bottom:30px}.hero-button{display:inline-flex;gap:25px;align-items:center;background:#fff;color:var(--ink);padding:14px 18px}.hero-button:hover{background:#eee}.hero-stats{display:flex;gap:30px;align-self:flex-end;padding-bottom:15px}.hero-stats div{display:flex;flex-direction:column}.hero-stats strong{font-size:23px}.hero-stats span{font-size:11px;color:#c4c8ce}
.dashboard{max-width:1240px;margin:0 auto;padding:85px 24px 70px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:30px}.section-heading h2,.about h2,.contact h2{font-size:36px;letter-spacing:-.045em;line-height:1.1;margin-bottom:7px}.section-heading p{color:var(--muted);font-size:13px}.view-button{border:1px solid var(--line);background:#fff;padding:10px 14px;border-radius:7px;cursor:pointer;font-size:13px;color:#555}.view-button:hover{background:var(--soft)}
.filters{display:grid;grid-template-columns:minmax(240px,1.7fr) repeat(3,minmax(150px,1fr));gap:10px;margin-bottom:24px}.search-box{border:1px solid var(--line);border-radius:7px;display:flex;align-items:center;padding:0 13px;background:#fff}.search-box span{font-size:23px;color:#8a9098}.search-box input,.filters select{width:100%;height:46px;border:0;outline:0;background:#fff;color:#4d535b;font-size:13px}.filters select{border:1px solid var(--line);border-radius:7px;padding:0 12px;cursor:pointer}
.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.car-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;transition:transform .2s,box-shadow .2s}.car-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(20,24,30,.09)}.car-image{height:230px;position:relative;background:#ddd;overflow:hidden}.car-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}.car-card:hover .car-image img{transform:scale(1.04)}.badge{position:absolute;top:13px;left:13px;background:var(--accent);color:#fff;font-size:10px;font-weight:800;padding:6px 9px;border-radius:5px}.badge.new{background:#17191d}.badge.hybrid{background:#3d6c53}.badge.diesel{background:#5c6470}.badge.electric{background:#28647a}.heart{position:absolute;top:10px;right:11px;border:0;background:rgba(255,255,255,.94);width:34px;height:34px;border-radius:50%;font-size:21px;cursor:pointer}.heart.saved{color:var(--accent)}.car-body{padding:18px}.car-top{display:flex;justify-content:space-between;gap:10px;color:var(--accent);font-size:11px;font-weight:800;text-transform:uppercase}.car-top small{color:#9298a0;font-weight:600}.car-body h3{font-size:21px;letter-spacing:-.03em;margin:3px 0 7px}.specs{font-size:12px;color:var(--muted);margin-bottom:19px}.car-bottom{border-top:1px solid var(--line);padding-top:15px;display:flex;align-items:center;justify-content:space-between;gap:10px}.car-bottom strong{font-size:19px;letter-spacing:-.03em}.details{border:0;background:none;color:var(--accent);font-size:11px;font-weight:800;cursor:pointer}.catalog-grid.compact{grid-template-columns:1fr}.catalog-grid.compact .car-card{display:grid;grid-template-columns:280px 1fr}.catalog-grid.compact .car-image{height:190px}.empty{text-align:center;padding:50px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);margin-top:20px}
.trust{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:45px max(24px,calc((100% - 1240px)/2))}.trust>div{display:flex;gap:15px}.trust-icon{flex:0 0 40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid var(--line);font-weight:800;color:var(--accent)}.trust strong{font-size:13px}.trust p{font-size:12px;color:var(--muted);margin-top:3px}
.about{max-width:1240px;margin:auto;padding:95px 24px;display:grid;grid-template-columns:1fr 1fr;gap:80px}.about p{color:var(--muted);font-size:15px;max-width:520px;padding-top:30px}
.contact{background:var(--dark);color:#fff;padding:70px max(24px,calc((100% - 1240px)/2));display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.contact p{color:#aeb3ba;max-width:500px;font-size:14px}.contact h2{font-size:38px}.contact form{display:grid;gap:10px}.contact input{height:47px;padding:0 14px;border:1px solid #393d44;border-radius:6px;background:#22252a;color:#fff;outline:none}.contact input:focus{border-color:#747b84}.contact button{height:47px;border:0;border-radius:6px;background:#fff;color:var(--ink);font-size:13px;font-weight:800;cursor:pointer}.contact button:hover{background:#e8e8e8}
footer{max-width:1240px;margin:auto;padding:35px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#858b94;font-size:11px}.footer-brand{color:var(--ink);font-size:15px}.footer-brand+.x{display:none}
@media(max-width:900px){.topbar-inner{gap:20px}.main-nav{gap:18px}.admin-button{display:none}.catalog-grid{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr 1fr}.search-box{grid-column:1/-1}.hero-stats{display:none}.trust{grid-template-columns:1fr}.about,.contact{grid-template-columns:1fr;gap:20px}.about p{padding-top:0}}
@media(max-width:640px){.topbar-inner{height:64px;padding:0 16px;justify-content:space-between}.menu-toggle{display:block;order:-1}.main-nav{display:none;position:absolute;top:64px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:8px 16px;flex-direction:column;gap:0}.main-nav.open{display:flex}.main-nav a{padding:13px 4px;border-bottom:1px solid var(--line)}.main-nav a:last-child{border:0}.hero{min-height:570px;padding:50px 20px;align-items:flex-end;background-position:62% center}.hero-content{padding-bottom:20px}.hero h1{font-size:48px}.dashboard{padding:60px 16px 50px}.section-heading{align-items:start;flex-direction:column}.section-heading h2{font-size:30px}.filters{grid-template-columns:1fr}.search-box{grid-column:auto}.catalog-grid{grid-template-columns:1fr}.car-image{height:240px}.catalog-grid.compact{grid-template-columns:1fr}.catalog-grid.compact .car-card{display:block}.catalog-grid.compact .car-image{height:240px}.trust{padding:35px 20px}.about{padding:65px 20px}.about h2,.contact h2{font-size:31px}.contact{padding:55px 20px}.contact form{margin-top:15px}footer{padding:28px 20px;flex-direction:column;align-items:flex-start}}
