:root{--orange:#ff7800;--black:#030303;--panel:#0d0d0d;--text:#f5f5f5;--muted:#9b9b9b;--line:rgba(255,255,255,.08);--shadow:0 22px 70px rgba(0,0,0,.55)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#030303;color:var(--text);font-family:Inter,Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}.site-header{position:sticky;top:0;z-index:100;background:rgba(3,3,3,.97);border-bottom:1px solid rgba(255,120,0,.55);box-shadow:0 10px 40px rgba(0,0,0,.35);backdrop-filter:blur(18px)}
.header-inner{max-width:1380px;margin:auto;min-height:92px;padding:8px 22px;display:flex;align-items:center;gap:25px}.brand img{width:225px;height:76px;object-fit:contain}
.main-nav{display:flex;align-items:center;justify-content:center;gap:3px;flex:1}.main-nav a{padding:12px 15px;color:#ddd;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:1px;border-radius:7px}.main-nav a:hover{color:#fff;background:#151515;box-shadow:inset 0 -2px 0 var(--orange)}
.header-actions{display:flex;gap:8px}.phone-btn,.wa-btn{padding:11px 14px;border-radius:7px;font-size:12px;font-weight:900}.phone-btn{background:#f3f3f3;color:#080808}.wa-btn{background:#19bd5b;color:#fff}.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:27px}
.hero{min-height:700px;position:relative;display:flex;align-items:center;background-image:linear-gradient(90deg,rgba(0,0,0,.96),rgba(0,0,0,.65) 40%,rgba(0,0,0,.25)),linear-gradient(0deg,rgba(0,0,0,.75),transparent 55%),url('../images/hero-car.jpg');background-size:cover;background-position:center}.hero:after{content:"";position:absolute;inset:auto 0 0;height:180px;background:linear-gradient(transparent,#030303)}
.hero-content{width:min(1380px,100%);margin:auto;padding:90px 30px;position:relative;z-index:1}.kicker{font-size:12px;color:var(--orange);font-weight:900;letter-spacing:4px;text-transform:uppercase}
.hero h1{font-size:clamp(44px,6vw,82px);line-height:.94;max-width:760px;margin:15px 0 22px;letter-spacing:-2px}.hero p{max-width:620px;color:#c8c8c8;font-size:18px;line-height:1.7}.orange{color:var(--orange)}
.hero-buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 20px;border-radius:7px;font-weight:900;border:1px solid var(--line)}.btn-orange{background:var(--orange);color:#050505;border-color:var(--orange)}.btn-dark{background:#0b0b0b;color:#fff;border-color:#333}
.section{max-width:1380px;margin:auto;padding:78px 30px}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section h2{font-size:38px;margin:5px 0}.muted{color:var(--muted)}
.cars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.car-card{background:linear-gradient(145deg,#151515,#0a0a0a);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}.car-image{position:relative;aspect-ratio:16/10;background:#090909;overflow:hidden}.car-image img{width:100%;height:100%;object-fit:cover;display:block}.badge{position:absolute;top:12px;left:12px;background:var(--orange);color:#000;padding:7px 10px;border-radius:5px;font-size:10px;font-weight:1000}.car-body{padding:20px}.car-title{font-size:21px;font-weight:900;margin:0 0 13px}.specs{display:grid;grid-template-columns:1fr 1fr;gap:8px;color:#999;font-size:13px}.price{font-size:25px;font-weight:1000;color:var(--orange);margin:18px 0}.card-actions{display:flex;gap:8px}.card-actions .btn{flex:1;padding:11px 8px;font-size:12px}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{padding:28px;background:linear-gradient(145deg,#111,#090909);border:1px solid var(--line);border-radius:12px}.feature strong{display:block;font-size:18px;margin-bottom:9px}
.site-footer{background:#030303;border-top:1px solid #191919;padding:55px 24px 20px}.footer-grid{max-width:1380px;margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}.footer-logo{width:210px;height:82px;object-fit:contain}.footer-grid h3{color:var(--orange);font-size:14px;text-transform:uppercase}.footer-grid a{display:block;color:#aaa;margin:8px 0}.copyright{max-width:1380px;margin:35px auto 0;padding-top:18px;border-top:1px solid #181818;color:#666;font-size:12px}
.floating-wa{position:fixed;right:20px;bottom:20px;width:58px;height:58px;border-radius:50%;background:#19bd5b;display:flex;align-items:center;justify-content:center;font-size:27px;z-index:110;box-shadow:0 12px 35px rgba(0,0,0,.6)}
.page-hero{background:linear-gradient(180deg,#0d0d0d,#070707);border-bottom:1px solid #1b1b1b;padding:55px 30px}.page-hero>div{max-width:1380px;margin:auto}
.detail{display:grid;grid-template-columns:1.25fr .75fr;gap:25px}.gallery-main{aspect-ratio:16/10;background:#080808;border-radius:12px;overflow:hidden;border:1px solid var(--line)}.gallery-main img{width:100%;height:100%;object-fit:cover}.detail-card{background:#0d0d0d;border:1px solid var(--line);border-radius:12px;padding:28px;box-shadow:var(--shadow)}
@media(max-width:1000px){.main-nav{display:none}.header-actions{margin-left:auto}.menu-toggle{display:block}.cars-grid{grid-template-columns:repeat(2,1fr)}.features{grid-template-columns:1fr}.detail{grid-template-columns:1fr}}
@media(max-width:680px){.header-inner{min-height:72px;padding:5px 12px}.brand img{width:170px;height:60px}.phone-btn{font-size:0;padding:10px 11px}.phone-btn:before{content:'☎';font-size:18px}.wa-btn{font-size:0;padding:10px 11px}.wa-btn:after{content:'WA';font-size:12px}.hero{min-height:600px;background-position:58% center}.hero-content{padding:60px 18px}.hero h1{font-size:31px}.cars-grid{grid-template-columns:1fr}.section{padding:55px 16px}.section h2{font-size:30px}.footer-grid{grid-template-columns:1fr}}

/* Premium vehicle detail */
.car-detail-hero{background:radial-gradient(circle at 75% 15%,rgba(255,120,0,.07),transparent 35%),#030303;border-bottom:1px solid #171717}
.detail-breadcrumb{display:flex;gap:10px;align-items:center;color:#666;font-size:12px;text-transform:uppercase;letter-spacing:.8px;margin-bottom:25px}
.detail-breadcrumb strong{color:#bbb}.detail-breadcrumb a:hover{color:var(--orange)}
.premium-detail{display:grid;grid-template-columns:1.28fr .72fr;gap:28px;align-items:stretch}
.detail-visual{min-width:0}
.premium-gallery{position:relative;border:1px solid #222;border-radius:14px;background:#080808;box-shadow:0 30px 80px rgba(0,0,0,.55);overflow:hidden}
.premium-gallery img{display:block;width:100%;height:100%;object-fit:cover}
.no-photo{height:100%;min-height:500px;display:flex;align-items:center;justify-content:center;color:#333;font-size:40px;font-weight:1000;letter-spacing:5px}
.detail-status{position:absolute;left:18px;top:18px;background:var(--orange);color:#050505;padding:9px 13px;border-radius:5px;font-size:11px;font-weight:1000;letter-spacing:1px}
.gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.65);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.gallery-arrow:hover{background:var(--orange);color:#000}.gallery-arrow.left{left:16px}.gallery-arrow.right{right:16px}
.gallery-thumbs{display:flex;gap:9px;margin-top:10px}.thumb{width:84px;height:60px;border:1px solid #222;border-radius:7px;overflow:hidden;background:#0d0d0d;padding:0;cursor:pointer}.thumb img{width:100%;height:100%;object-fit:cover}.thumb.active{border:2px solid var(--orange)}.thumb.placeholder{display:flex;align-items:center;justify-content:center;color:#444;font-weight:1000}
.detail-info{background:linear-gradient(155deg,#151515,#090909);border:1px solid #222;border-radius:14px;padding:35px;box-shadow:0 30px 80px rgba(0,0,0,.45);display:flex;flex-direction:column}
.detail-kicker{font-size:10px;letter-spacing:2px;color:var(--orange);font-weight:900;margin-bottom:18px}.detail-info h1{font-size:clamp(38px,4vw,58px);line-height:.95;letter-spacing:-2px;margin:0 0 20px}.detail-info h1 span{color:#aaa}
.detail-price{font-size:38px;font-weight:1000;color:#fff;margin-bottom:18px}.detail-price small{font-size:13px;color:var(--orange);letter-spacing:2px}
.detail-intro{color:#999;line-height:1.7;font-size:14px;border-top:1px solid #222;padding-top:20px;min-height:90px}
.detail-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:auto;padding-top:20px}.big-btn{min-height:52px}.wa-big{background:#19bd5b;color:#fff;border-color:#19bd5b;min-height:52px}
.quick-contact{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #222;margin-top:20px;padding-top:18px;color:#666;font-size:12px}.quick-contact a{color:#fff;font-weight:900}.quick-contact a:hover{color:var(--orange)}
.detail-section-title{margin-bottom:25px}.detail-section-title h2{margin-top:5px}.spec-grid-large{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.spec-grid-large div{background:#0d0d0d;border:1px solid #1d1d1d;border-radius:9px;padding:20px}.spec-grid-large span{display:block;color:#666;font-size:11px;text-transform:uppercase;letter-spacing:1px;margin-bottom:9px}.spec-grid-large strong{font-size:17px;color:#eee}
.detail-cta{padding-top:15px}.detail-cta-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(110deg,#151515,#090909);border:1px solid #242424;border-left:3px solid var(--orange);border-radius:14px;padding:35px}.detail-cta h2{font-size:34px;margin:5px 0}.detail-cta p{color:#888;margin:0;max-width:650px}
@media(max-width:1000px){.premium-detail{grid-template-columns:1fr}.detail-info{min-height:430px}.spec-grid-large{grid-template-columns:repeat(2,1fr)}}
@media(max-width:680px){.premium-detail{gap:16px}.detail-info{padding:24px;min-height:0}.detail-info h1{font-size:40px}.detail-price{font-size:31px}.detail-actions{grid-template-columns:1fr}.spec-grid-large{grid-template-columns:1fr}.detail-cta-inner{display:block;padding:25px}.detail-cta .hero-buttons{margin-top:22px}.gallery-arrow{width:38px;height:38px;font-size:25px}}

/* CM Class Motors cinematic car hero */
.hero{
  min-height:760px;
  background-position:center right;
  background-size:cover;
  overflow:hidden;
}
.hero:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(2,2,2,.98) 0%,rgba(2,2,2,.88) 24%,rgba(2,2,2,.52) 48%,rgba(2,2,2,.12) 78%,rgba(2,2,2,.25)),
    linear-gradient(0deg,#030303 0%,rgba(3,3,3,.18) 30%,rgba(3,3,3,.15) 100%);
  z-index:0;
}
.hero-content{max-width:1380px}
.hero h1{max-width:620px;text-transform:uppercase;font-weight:1000;font-size:clamp(1.65rem,3vw,2.65rem);line-height:1.08;letter-spacing:-1px}
.hero h1 .orange{color:#ff7800}
.hero p{max-width:600px}
@media(max-width:680px){
  .hero{min-height:650px;background-position:65% center}
  .hero:before{background:linear-gradient(90deg,rgba(2,2,2,.94),rgba(2,2,2,.60)),linear-gradient(0deg,#030303,transparent)}
}



/* Cumpărăm Auto - formular mai aerisit */
.form-card{
  max-width:820px;
  margin:0 auto;
  background:linear-gradient(145deg,#111,#090909);
  border:1px solid var(--line);
  border-radius:12px;
  padding:34px;
  box-shadow:var(--shadow);
}
.form-card form{
  display:flex;
  flex-direction:column;
}
.form-card label{
  display:block;
  margin:0 0 8px;
  color:#ddd;
  font-size:13px;
  font-weight:800;
  letter-spacing:.2px;
}
.form-card input,
.form-card textarea{
  width:100%;
  background:#080808;
  color:#fff;
  border:1px solid #292929;
  border-radius:7px;
  padding:13px 14px;
  font:inherit;
  outline:none;
  transition:border-color .2s,box-shadow .2s;
}
.form-card input{
  min-height:46px;
  margin-bottom:20px;
}
.form-card textarea{
  min-height:180px;
  resize:vertical;
  line-height:1.6;
  margin-bottom:0;
}
.form-card input:focus,
.form-card textarea:focus{
  border-color:var(--orange);
  box-shadow:0 0 0 2px rgba(255,120,0,.10);
}
.form-card form .btn-orange{
  margin-top:22px;
  align-self:flex-start;
}
@media(max-width:680px){
  .form-card{padding:22px 18px}
  .form-card input{margin-bottom:18px}
  .form-card textarea{min-height:220px}
  .form-card form .btn-orange{
    width:100%;
    align-self:stretch;
  }
}

/* Admin multi-photo gallery */
.admin-image-preview,.admin-current-gallery{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 22px}
.admin-image-thumb,.admin-current-photo{position:relative;width:120px;height:90px;border:1px solid #2a2a2a;border-radius:8px;overflow:hidden;background:#090909}
.admin-image-thumb img,.admin-current-photo img{width:100%;height:100%;object-fit:cover;display:block}
.admin-image-thumb span,.admin-current-photo span{position:absolute;left:0;right:0;bottom:0;padding:5px;background:rgba(0,0,0,.78);font-size:10px;text-align:center;color:#fff}
.form-card input[type=file]{padding:10px;cursor:pointer}
@media(max-width:680px){.admin-image-thumb,.admin-current-photo{width:105px;height:80px}}


/* FINAL MOBILE HERO - desktop-style overlay */
@media (max-width:680px){
  .hero{
    min-height:580px !important;
    height:580px !important;
    position:relative !important;
    display:flex !important;
    align-items:flex-end !important;
    background-size:cover !important;
    background-position:58% center !important;
    overflow:hidden !important;
  }

  .hero-content{
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100% !important;
    max-width:none !important;
    box-sizing:border-box !important;
    margin:0 !important;
    padding:28px 18px 28px !important;
    z-index:3 !important;
  }

  .hero:before{
    background:
      linear-gradient(90deg,rgba(2,2,2,.86) 0%,rgba(2,2,2,.48) 58%,rgba(2,2,2,.08) 100%),
      linear-gradient(0deg,rgba(2,2,2,.97) 0%,rgba(2,2,2,.82) 22%,rgba(2,2,2,.18) 62%,rgba(2,2,2,.05) 100%) !important;
  }

  .hero:after{
    height:240px !important;
    background:linear-gradient(transparent,rgba(3,3,3,.90)) !important;
    z-index:1 !important;
    pointer-events:none !important;
  }

  .hero .kicker{
    font-size:10px !important;
    letter-spacing:4px !important;
    margin:0 0 10px !important;
  }

  .hero h1{
    max-width:600px !important;
    font-size:29px !important;
    line-height:1.04 !important;
    letter-spacing:-1px !important;
    margin:0 0 14px !important;
  }

  .hero p{
    max-width:590px !important;
    font-size:14px !important;
    line-height:1.45 !important;
    margin:0 !important;
  }

  .hero-buttons{
    display:flex !important;
    gap:8px !important;
    flex-wrap:nowrap !important;
    margin-top:17px !important;
  }

  .hero-buttons .btn{
    min-height:42px !important;
    padding:10px 14px !important;
    font-size:12px !important;
  }
}

/* WhatsApp header button: icon-only on mobile */
.wa-icon{display:inline-flex;align-items:center;justify-content:center}
.wa-icon svg{width:18px;height:18px;fill:currentColor;display:block}
.wa-label{display:inline}
@media(max-width:680px){
  .wa-btn{
    width:48px !important;
    min-width:48px !important;
    height:44px !important;
    padding:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:0 !important;
  }
  .wa-label{display:none !important}
  .wa-icon svg{width:24px;height:24px}
}

/* MOBILE HEADER WHATSAPP - ICON ONLY */
@media (max-width:680px){
  .wa-btn{
    font-size:0 !important;
    line-height:0 !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 !important;
    gap:0 !important;
    text-indent:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .wa-btn::before,
  .wa-btn::after{
    content:none !important;
    display:none !important;
  }
  .wa-btn .wa-label{
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    overflow:hidden !important;
  }
  .wa-btn .wa-icon{
    display:inline-flex !important;
    width:26px !important;
    height:26px !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .wa-btn .wa-icon svg{
    display:block !important;
    width:26px !important;
    height:26px !important;
  }
}

/* FINAL: mobile header WhatsApp = icon only, no text */
@media (max-width:680px){
  header .wa-btn,
  .site-header .wa-btn,
  .wa-btn{
    font-size:0 !important;
    line-height:0 !important;
    letter-spacing:0 !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .wa-btn::before,
  .wa-btn::after{
    content:"" !important;
    display:none !important;
  }
  .wa-btn .wa-icon{
    display:flex !important;
    width:26px !important;
    height:26px !important;
    margin:0 !important;
    padding:0 !important;
    text-indent:0 !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .wa-btn .wa-icon svg{
    display:block !important;
    width:26px !important;
    height:26px !important;
    margin:0 !important;
  }
  .wa-btn .wa-label,
  .wa-btn > span:not(.wa-icon){
    display:none !important;
  }
}

@media (max-width:680px){
  .wa-btn .wa-label{display:none!important}
}

/* Restore original desktop WhatsApp header button proportions */
@media (min-width:681px){
  .wa-btn{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:11px 16px !important;
    font-size:14px !important;
    line-height:1.2 !important;
    text-indent:0 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
  }
  .wa-btn .wa-icon{
    width:18px !important;
    height:18px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    flex:0 0 18px !important;
  }
  .wa-btn .wa-icon svg{
    width:18px !important;
    height:18px !important;
  }
  .wa-btn .wa-label{
    display:inline !important;
    visibility:visible !important;
    width:auto !important;
    overflow:visible !important;
  }
}

/* FINAL HEADER FIX — desktop unchanged, mobile WhatsApp icon only */
@media (min-width:681px){
  .site-header .wa-btn{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    min-height:0 !important;
    padding:11px 14px !important;
    font-size:12px !important;
    line-height:1.2 !important;
    text-indent:0 !important;
    overflow:visible !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:8px !important;
  }
  .site-header .wa-btn .wa-icon{
    width:18px !important;
    height:18px !important;
    flex:0 0 18px !important;
  }
  .site-header .wa-btn .wa-icon svg{
    width:18px !important;
    height:18px !important;
  }
  .site-header .wa-btn .wa-label{
    display:inline !important;
    visibility:visible !important;
    width:auto !important;
    height:auto !important;
    overflow:visible !important;
  }
}

@media (max-width:680px){
  .site-header .wa-btn{
    width:48px !important;
    min-width:48px !important;
    max-width:48px !important;
    height:44px !important;
    min-height:44px !important;
    padding:0 !important;
    margin:0 !important;
    font-size:0 !important;
    line-height:0 !important;
    letter-spacing:0 !important;
    text-indent:0 !important;
    overflow:hidden !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
  }
  .site-header .wa-btn::before,
  .site-header .wa-btn::after{
    content:none !important;
    display:none !important;
  }
  .site-header .wa-btn .wa-label{
    display:none !important;
    visibility:hidden !important;
    width:0 !important;
    height:0 !important;
    overflow:hidden !important;
  }
  .site-header .wa-btn .wa-icon{
    display:inline-flex !important;
    width:26px !important;
    height:26px !important;
    margin:0 !important;
    padding:0 !important;
    flex:0 0 26px !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .site-header .wa-btn .wa-icon svg{
    display:block !important;
    width:26px !important;
    height:26px !important;
    margin:0 !important;
  }
}
