/* VIGICAR — Vanilla CSS, responsive, accessible */
:root{
  /* Updated theme palette and densities */
  --brand:#0F172A; /* headings */
  --brand-700:#1f2937;
  --accent:#E9A500; /* primary accent */
  --accent-700:#C28500;
  --bg:#ffffff;
  --text:#374151; /* body text */
  --muted:#6b7280;
  --surface:#f8fafc;
  --surface-2:#eef2f7;
  --success:#16a34a;
  --error:#dc2626;
  --focus:#2563eb;
  --radius:12px;
  --radius-lg:18px;
  --shadow-sm:0 1px 2px rgba(0,0,0,.06), 0 1px 3px rgba(0,0,0,.08);
  --shadow-md:0 10px 22px rgba(15,23,42,.12);
  --shadow-lg:0 18px 40px rgba(15,23,42,.18);
  --vehicle-media-height:240px;
  --btn-height:48px;
  --btn-radius:12px;
  --btn-padding:0 1.2rem;
  --btn-gap:.45rem;
}

/* System font stack */
html{box-sizing:border-box;scroll-behavior:smooth}
*,*::before,*::after{box-sizing:inherit}
body{
  margin:0; font-family:'Poppins', -apple-system, BlinkMacSystemFont,"Segoe UI",Roboto,Ubuntu,Helvetica,Arial,sans-serif; 
  color:var(--text); background:#f5f7fb; line-height:1.6; letter-spacing:.2px;
  font-size:16px;
}
body.nav-open{overflow:hidden}
@media(min-width:1200px){ body{ font-size:17px } }
@media(max-width:640px){ body{ font-size:15px } }
@media(max-width:640px){
  :root{
    --vehicle-media-height:200px;
    --btn-height:44px;
    --btn-padding:0 1rem;
  }
}
html[dir="rtl"] body{font-family:Tahoma, Arial, "Segoe UI", system-ui, sans-serif}

img{max-width:100%; height:auto; display:block}
a{color:var(--accent); text-decoration:none}
a:focus, button:focus, [href]:focus, [tabindex]:focus{outline:3px solid var(--focus); outline-offset:2px}

.container{width:min(1200px, 92vw); margin-inline:auto}
.section{padding:1.6rem 0}
.section.container:nth-of-type(even){
  background:linear-gradient(to bottom, #f9fafb, #ffffff);
}

/* Headings and text hierarchy */
h1,h2,h3{color:var(--brand); font-weight:700; line-height:1.25}
h2{font-size:clamp(1.35rem, 1.2vw + 1rem, 1.8rem)}
h3{font-size:clamp(1.05rem, .6vw + .9rem, 1.25rem)}
p{color:var(--text)}
.eyebrow{font-size:.78rem; letter-spacing:.2rem; text-transform:uppercase; font-weight:700; color:#94a3b8; margin:0 0 .4rem}
.grid{display:grid; gap:1rem}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.grid-3,.grid-4,.grid-2{grid-template-columns:1fr}}


/* Skip link */
.skip-link{position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden}
.skip-link:focus{left:1rem; top:1rem; width:auto; height:auto; background:#fff; border:2px solid var(--focus); padding:.5rem 1rem; z-index:10000}

/* Navbar */
.navbar{position:sticky; top:0; z-index:999; color:#fff; border-bottom:4px solid var(--accent); box-shadow:0 12px 24px rgba(15,23,42,.18); background:linear-gradient(180deg, rgba(15,23,42,.9), rgba(15,23,42,.85)); backdrop-filter:saturate(130%) blur(6px); transition:transform .35s ease}
.navbar.is-hidden{transform:translateY(-120%)}
body.nav-open .navbar{transform:none}
.navbar .inner{position:relative; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.65rem 0}
.brand{display:flex; align-items:center; gap:.5rem; color:#fff}
.brand img{width:40px;height:40px;border-radius:6px;object-fit:cover; background:#fff}
.nav-links{
  position:absolute;
  top:calc(100% + .5rem);
  right:0;
  display:flex;
  flex-direction:column;
  gap:.75rem;
  width:min(360px, calc(100vw - 2rem));
  padding:1.4rem 1.2rem;
  background:rgba(8,13,28,.96);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  box-shadow:0 28px 48px rgba(8,13,28,.45);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(-6px);
  transition:transform .25s ease, opacity .2s ease;
  z-index:1000;
}
@media(min-width:960px){
  .nav-links{
    position:static;
    flex-direction:row;
    align-items:center;
    gap:1.1rem;
    width:auto;
    padding:0;
    background:transparent;
    border:none;
    border-radius:0;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none;
  }
  .nav-links a{
    width:auto;
    text-align:center;
    opacity:.95;
    justify-content:center;
    white-space:normal;
  }
  .nav-links .cta, .nav-links .lang-toggle{width:auto}
  .nav-toggle{display:none !important}
}
@media(max-width:640px){
  .nav-links{
    left:50%;
    right:auto;
    width:calc(100vw - 2rem);
    transform:translate(-50%, -6px);
  }
  body.nav-open .nav-links{transform:translate(-50%, 0)}
}
body.nav-open .nav-links{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.nav-links a{
  color:#fff;
  padding:.5rem .55rem;
  font-weight:700;
  font-size:clamp(.95rem, 1vw + .2rem, 1.05rem);
  opacity:.85;
  transition:opacity .2s ease;
  position:relative;
  width:100%;
  text-align:left;
  display:inline-flex;
  align-items:center;
  min-height:var(--btn-height);
  line-height:1.1;
  white-space:normal;
  border-radius:12px;
}
.nav-links a:hover{
  opacity:1;
  background:rgba(255,255,255,.06);
  box-shadow:0 10px 22px rgba(0,0,0,.08);
}
.nav-links .nav-legal{
  border:1px solid #ffffff33;
  padding:.55rem .9rem;
  border-radius:12px;
  background:rgba(255,255,255,.05);
  box-shadow:0 10px 22px rgba(0,0,0,.06);
}
.nav-links a:hover{opacity:1}
.nav-links .cta, .nav-links .lang-toggle{display:flex; justify-content:center; width:100%; white-space:nowrap}
.nav-toggle{display:flex; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.4); width:44px; height:44px; border-radius:10px; align-items:center; justify-content:center; flex-direction:column; gap:6px; cursor:pointer; transition:transform .2s ease, background .2s ease}
.nav-toggle span{width:22px; height:2px; background:#fff; border-radius:999px; transition:transform .2s ease, opacity .2s ease}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
/* Active page indicator */
.nav-links a[aria-current="page"]{opacity:1}
.nav-links a[aria-current="page"]::after{content:""; position:absolute; left:0; right:0; bottom:-6px; height:3px; background:var(--accent); border-radius:2px}
html[dir="rtl"] .nav-links{flex-direction:row-reverse}
html[dir="rtl"] .brand{flex-direction:row-reverse}
.cta{background:linear-gradient(180deg, var(--accent), #f39c0a); color:#1f1300; box-shadow:0 10px 22px rgba(245,158,11,.32); border:1px solid #f1a300}
.cta:hover{background:linear-gradient(180deg, var(--accent-700), #c86d04)}
.lang-toggle{background:#ffffff12; color:#fff; border:1px solid #ffffff33}

/* Hero */
.hero{
  background:linear-gradient(135deg, #08142c 0%, #0b1b3d 68%, #f5f7fb 68%);
  color:#f8fbff;
  padding:3.5rem 0 3.5rem;
  position:relative;
  overflow:hidden;
}
html[dir="rtl"] .hero{
  background:linear-gradient(225deg, #08142c 0%, #0b1b3d 68%, #f5f7fb 68%);
}
.hero h1{
  color:#ffffff;
  text-shadow:0 10px 28px rgba(4,8,15,.38);
}
.hero::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 15%, rgba(255,255,255,.14), transparent 55%); pointer-events:none}
.hero::after{
  content:"";
  position:absolute;
  inset:auto 10% -14% 10%;
  height:200px;
  background:radial-gradient(circle at 30% 20%, rgba(15,23,42,.12), rgba(15,23,42,0) 65%), radial-gradient(circle at 70% 50%, rgba(255,255,255,.12), rgba(255,255,255,0) 60%);
  filter:blur(8px);
  pointer-events:none;
}
.hero h1{font-size:clamp(2.1rem, 2.8vw + 1.1rem, 3.2rem); margin:.75rem 0 1.25rem; letter-spacing:.3px}
.hero p{color:#f5f7ff}
.hero .tag{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  color:#f6f9ff;
  opacity:1;
  font-weight:600;
  letter-spacing:.4px;
  background:rgba(8,17,38,.58);
  border:1px solid rgba(255,255,255,.3);
  border-radius:999px;
  padding:.45rem .95rem;
  text-transform:uppercase;
  font-size:.82rem;
  box-shadow:0 12px 24px rgba(3,6,14,.32);
}
.hero .tag::before{content:""; width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 3px rgba(245,158,11,.35)}
.badges{display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem}
.badge{
  background:#ffffff1f;
  color:#f4f6ff;
  padding:.5rem .95rem;
  border-radius:999px;
  border:1px solid #ffffff44;
  font-size:.95rem;
  letter-spacing:.25px;
  text-shadow:0 8px 18px rgba(2,4,9,.28);
}
.hero .grid{gap:2.6rem; align-items:center; grid-template-columns:minmax(0,420px) minmax(0,1fr)}
.hero-ctas{display:flex; gap:.85rem; margin-top:1.4rem; flex-wrap:wrap}
.hero-ctas .btn{min-width:170px}
.hero .slider{margin-left:auto; width:100%; max-width:520px}
@media(max-width:900px){
  .hero{padding:3rem 0 2.6rem}
  .hero .grid{grid-template-columns:1fr; text-align:center}
  .hero .slider{margin:2rem auto 0}
  .hero .hero-ctas{justify-content:center}
  .hero .badges{justify-content:center}
}
html[dir="rtl"] .hero .grid{direction:rtl}
.hero-ctas .btn,
.footer-actions .btn,
.cta-actions .btn,
.wa-reserve .actions .btn{min-width:170px; justify-content:center}
@media(max-width:640px){
  .hero-ctas .btn,
  .footer-actions .btn,
  .cta-actions .btn,
  .wa-reserve .actions .btn{width:100%}
}
.btn, .cta, .lang-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:var(--btn-gap);
  padding:var(--btn-padding);
  min-height:var(--btn-height);
  border-radius:var(--btn-radius);
  font-weight:700;
  line-height:1.15;
  cursor:pointer;
  text-decoration:none;
  letter-spacing:.12px;
  white-space:nowrap;
}
.btn{border:1px solid transparent}
.btn.primary{background:var(--accent); color:#1f1300}
.btn.primary:hover{background:var(--accent-700); transform:translateY(-1px)}
.btn.ghost{background:transparent; color:#fff; border-color:#ffffff55}
.btn.ghost:hover{background:#ffffff12; transform:translateY(-1px)}
.btn{transition:background-color .2s ease, transform .2s ease, box-shadow .2s ease}

/* Slider */
.slider{position:relative; width:100%; aspect-ratio:var(--slider-aspect, 16/10); min-height:240px; height:auto; border-radius:18px; overflow:hidden; border:1px solid rgba(15,23,42,.25); box-shadow:0 25px 45px rgba(15,23,42,.22)}
@media(max-width:900px){ .slider{max-width:520px; margin-inline:auto} }
.slider .slides{position:relative; width:100%; height:100%}
.slider .slide{position:absolute; inset:0; opacity:0; transition:opacity .7s ease; background:#111}
.slider .slide.active{opacity:1}
.slider img{width:100%; height:100%; object-fit:cover; object-position:center; display:block}
/* Optional: show entire image without cropping */
.slider.slider--contain img{object-fit:contain; background:#000}
.slider .controls{position:absolute; inset:auto 0 8px 0; display:flex; justify-content:center; gap:.4rem}
.slider .dot{width:8px; height:8px; border-radius:50%; background:#ffffff6a; border:1px solid #ffffffb0; transition:transform .2s ease, background-color .2s ease}
.slider .dot.active{background:var(--accent); transform:scale(1.2)}
.slider::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,0) 40%, rgba(0,0,0,.15)); pointer-events:none}
.slider .prev,.slider .next{position:absolute; top:50%; transform:translateY(-50%); background:rgba(15,23,42,.55); color:#fff; border:1px solid rgba(255,255,255,.4); border-radius:50%; width:36px; height:36px; display:flex; align-items:center; justify-content:center; font-size:1.1rem; transition:background .2s ease}
.slider .prev:hover,.slider .next:hover{background:rgba(15,23,42,.75)}
.slider .prev{left:14px}
.slider .next{right:14px}
@media (prefers-reduced-motion: reduce){ .slider .slide{transition:none} }

/* Cards */
.section{padding:3rem 0}
.section h2{font-size:1.6rem; margin:0 0 1rem}
.card{background:#fff; border:1px solid #e5e7eb; border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; box-shadow:var(--shadow-sm); transition:transform .2s ease, box-shadow .2s ease; will-change:transform}
.card:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(0,0,0,.12)}
.card .content{padding:1.2rem; display:flex; flex-direction:column; gap:.65rem}
.muted{color:var(--muted)}
.tags{display:flex; flex-wrap:wrap; gap:.35rem}
.tag{background:var(--surface); border:1px solid #e5e7eb; padding:.2rem .5rem; border-radius:999px; font-size:.82rem}
.form-card{background:linear-gradient(180deg, #ffffff, #fffef9); border:1px solid #e2e8f0; border-radius:16px; padding:1.6rem; display:flex; flex-direction:column; gap:1.2rem; box-shadow:var(--shadow-sm)}

.form-card.soft{background:#fffef9; border-style:dashed}
.form-note{color:var(--muted); font-size:.9rem; margin:0}
.form-subtitle{margin:0; font-size:1.05rem; font-weight:700}
.form-actions{display:flex; flex-wrap:wrap; gap:.75rem; margin-top:1.4rem}
.option-line{display:flex; gap:.55rem; font-size:.95rem; line-height:1.45; align-items:flex-start}
.option-line input{margin-top:.2rem}
.car-preview{border:1px dashed #cbd5e1; border-radius:14px; padding:1.1rem 1.2rem; background:#fff; color:#0f172a}
.car-preview .preview-title{margin:0 0 .35rem; font-size:1.1rem; font-weight:700}
.car-preview .preview-meta{margin:0 0 .4rem; color:var(--muted); font-size:.94rem}
.car-preview .preview-capacity{margin:0 0 .6rem; font-weight:600; color:var(--brand)}
.car-preview .preview-features{font-size:.92rem}
.car-preview .preview-list{margin:.4rem 0 0; padding-left:1.1rem; display:grid; gap:.25rem}
.chip-group{display:flex; flex-wrap:wrap; gap:.6rem}
.chip{position:relative; display:inline-flex; align-items:center; gap:.45rem; padding:.55rem 1rem; border:1px solid #cbd5e1; border-radius:999px; background:#fff; font-weight:600; cursor:pointer; transition:all .2s ease}
.chip input{position:absolute; inset:0; opacity:0; pointer-events:none}
.chip span{pointer-events:none}
.chip.is-active{background:var(--accent); color:#1f1300; border-color:var(--accent)}
.medium-stack{gap:1.2rem}
@media(max-width:900px){
  .medium-stack{grid-template-columns:1fr!important}
}

/* Fleet filters */
.filters{display:flex; flex-wrap:wrap; gap:.8rem; margin:1.5rem 0 1.8rem; background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:.9rem 1.2rem; box-shadow:0 10px 25px rgba(15,23,42,.06)}
.filters label{display:flex; flex-direction:column; font-size:.84rem; color:#334155; gap:.35rem}
.filters select{padding:.55rem .8rem; border-radius:8px; border:1px solid #cbd5e1; min-width:150px; font-weight:500; background:#f8fafc; color:#0f172a}

/* Testimonials */
.testimonials{display:grid; gap:1.25rem; grid-template-columns:repeat(3,1fr); margin-top:1.6rem}
@media(max-width:900px){.testimonials{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.testimonials{grid-template-columns:1fr}}
.quote{background:#fff; border:1px solid #e2e8f0; border-radius:14px; padding:1.2rem 1.3rem; box-shadow:0 12px 30px rgba(15,23,42,.06)}

/* Forms */
form{display:flex; flex-direction:column; gap:1.4rem}
label{font-weight:600}
input, select, textarea{padding:.65rem .75rem; border:1px solid #cbd5e1; border-radius:8px; font:inherit; background:#fff; transition:border-color .15s ease, box-shadow .15s ease}
input:focus, select:focus, textarea:focus{border-color:#94a3b8; box-shadow:0 0 0 4px #93c5fd44}
input:invalid, select:invalid, textarea:invalid{border-color:#fca5a5}
::placeholder{color:#94a3b8}
.inline{display:flex; gap:.6rem; flex-wrap:wrap}
.help{font-size:.88rem; color:var(--muted)}
.summary{background:#f8fafc; border:1px solid #e5e7eb; padding:1rem; border-radius:8px}
.estimate-line{display:flex; align-items:center; gap:.5rem; margin-top:1rem; font-weight:600}

#featured-cars{gap:1rem; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); margin-top:1.4rem}
#fleet-grid{display:grid; gap:1rem; grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}

/* Footer */
footer{background:var(--brand); color:#e5e7eb; margin-top:2rem; border-top:4px solid var(--accent)}
footer .columns{display:grid; gap:1rem; grid-template-columns:2fr 1fr 1fr}
@media(max-width:900px){footer .columns{grid-template-columns:1fr 1fr}}
@media(max-width:640px){footer .columns{grid-template-columns:1fr}}
footer a{color:#fff}
.copy{border-top:1px solid #ffffff22; padding:.8rem 0; color:#cbd5e1; font-size:.92rem}

/* Floating WhatsApp */
.whatsapp-float{position:fixed; bottom:18px; right:18px; width:56px; height:56px; background:#25D366; color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; box-shadow:0 10px 20px #00000022; z-index:998; transition:transform .2s ease}
.whatsapp-float:hover{transform:translateY(-2px)}
.whatsapp-float:focus{outline:3px solid #128C7E}

/* Cookie banner */
.cookie-banner{position:fixed; left:12px; right:12px; bottom:12px; background:#0b1020; color:#fff; border:1px solid #334155; border-radius:14px; padding:1rem 1.2rem; display:flex; gap:1rem; align-items:flex-start; z-index:999}
.cookie-banner .actions{margin-left:auto; display:flex; gap:.5rem}
.cookie-banner button{background:var(--accent); border:none; color:#1f1300; padding:var(--btn-padding); min-height:var(--btn-height); border-radius:var(--btn-radius); font-weight:700}

/* Utilities */
.sr-only{position:absolute; width:1px; height:1px; margin:-1px; border:0; padding:0; clip:rect(0 0 0 0); overflow:hidden}
.center{text-align:center}
.mb-0{margin-bottom:0}
.mt-0{margin-top:0}
.mt-1{margin-top:.25rem}
.mt-2{margin-top:.5rem}
.mt-3{margin-top:1rem}
.mt-4{margin-top:1.5rem}
.mb-4{margin-bottom:1.5rem}
.flex{display:flex}
.space-between{justify-content:space-between}
.items-center{align-items:center}

/* Table-like pricing */

/* Map embed */
.map{border:0; width:100%; height:320px; border-radius:10px}

/* (Gallery styles removed per request: header slider only) */

/* Focus visible for keyboard users */
*:focus-visible{outline:3px solid var(--focus); outline-offset:2px}

main{position:relative; z-index:1}
.section.container{padding-top:1.6rem; padding-bottom:2rem}
.section.container:nth-of-type(even){position:relative}

.section-card{background:linear-gradient(180deg, #ffffff, #fbfdff); border:1px solid #e2e8f0; border-radius:20px; padding:1.8rem 1.6rem; box-shadow:0 18px 40px rgba(15,23,42,.08); margin-top:1.6rem}
.section-card h2{margin-top:0}

/* Enhanced cards and sections */
.section-card{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  border:1px solid #dfe6f2;
  box-shadow:0 24px 60px rgba(12,19,37,.08);
}
.section-card::after{
  content:"";
  position:absolute;
  inset:-24% 5% auto 5%;
  height:140px;
  background:radial-gradient(220px 160px at 20% 40%, rgba(15,23,42,.08), rgba(15,23,42,0) 70%), radial-gradient(240px 180px at 80% 50%, rgba(255,255,255,.08), rgba(255,255,255,0) 70%);
  opacity:.22;
  filter:blur(6px);
  pointer-events:none;
}
.card{
  border:1px solid #e3e8f2;
  background:linear-gradient(180deg,#ffffff,#f9fbff);
  transition:transform .2s ease, box-shadow .25s ease, border-color .2s ease;
}
.card:hover{
  transform:translateY(-6px);
  box-shadow:0 26px 60px rgba(12,19,37,.12);
  border-color:#d7e2f5;
}
.card .tags .tag{
  background:#f6f0ff;
  color:#1d1b55;
  border-color:#e4dcff;
}
.card-badges .badge{
  background:#0b1020dd;
  border-color:#ffffff66;
}

/* Section spacing refinements */
.section > h2, .section > h1{letter-spacing:.2px}
.section.container{padding-top:2rem; padding-bottom:2.5rem}

/* Reveal animation (progressive enhancement)
   By default content is visible; when JS adds .js-ready on <body>, we animate in. */
[data-animate]{opacity:1; transform:none}
.js-ready [data-animate]{opacity:0; transform:translateY(14px); filter:saturate(.95); transition:opacity .6s ease, transform .6s ease, filter .6s ease}
.js-ready [data-animate].is-visible{opacity:1; transform:none; filter:none}

/* Navbar active link */
.nav-links a[aria-current="page"]{text-decoration:underline; text-underline-offset:4px; color:#fff}



main > .section-card:not(:first-of-type){margin-top:1.4rem}




/* Subtle design polish */
.btn.primary{background:linear-gradient(180deg, var(--accent), #f7a41a); color:#1f1300}
.btn.primary:hover{background:linear-gradient(180deg, var(--accent-700), #cf7a07)}
.card{box-shadow:0 6px 18px rgba(15,23,42,.08)}
.card:hover{box-shadow:0 14px 28px rgba(15,23,42,.14)}


/* Professional theme polish (overrides) */
:root{
  --brand:#0F172A;
  --brand-700:#111827;
  --accent:#E9A500; /* refined amber */
  --accent-700:#C28500;
  --bg:#f7f9fc;
  --text:#374151;
  --muted:#64748b;
  --surface:#ffffff;
  --surface-2:#f2f5fb;
}

body{background:var(--bg); color:var(--text); letter-spacing:.1px}

/* Navbar */
.navbar{border-bottom:1px solid rgba(255,255,255,.12); background:linear-gradient(180deg, rgba(12,19,37,.96), rgba(12,19,37,.9)); box-shadow:0 10px 30px rgba(12,19,37,.25)}
.brand img{border:1px solid #ffffff33; background:#fff}

/* Buttons */
.btn{padding:var(--btn-padding); min-height:var(--btn-height); border-radius:var(--btn-radius); box-shadow:0 10px 22px rgba(0,0,0,.06)}
.btn.primary{background:linear-gradient(180deg, var(--accent), #f4ad1c); border:1px solid #f1a300; color:#1f1300}
.btn.primary:hover{transform:translateY(-2px); box-shadow:0 14px 28px rgba(0,0,0,.12)}
.btn.ghost{background:#ffffff; color:#0b1020; border-color:#e2e8f0}
.hero .btn.ghost{background:transparent; color:#fff; border-color:#ffffff55}

/* Hero */
.hero{background:radial-gradient(1200px 600px at 15% 5%, rgba(255,255,255,.08), transparent 40%), linear-gradient(140deg, #0c1325 0%, #0b1220 55%, var(--bg) 55%)}
.hero h1{letter-spacing:.35px}

/* Cards */
.card{border:1px solid #e6ecf3; border-radius:20px; box-shadow:0 18px 40px rgba(12,19,37,.08); overflow:hidden; background:#fff}
.card:hover{transform:translateY(-6px); box-shadow:0 24px 52px rgba(12,19,37,.14)}
.card .content{padding:1.35rem; gap:.65rem; display:flex; flex-direction:column}
.card .content h3{font-size:1.15rem}
.card .tags{display:flex; flex-wrap:wrap; gap:.35rem}
.card .tags .tag{background:#f0f4ff; border-radius:999px; padding:.25rem .7rem; font-size:.8rem; color:#1e3a8a}
.card-meta{list-style:none; margin:.4rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.45rem 1rem; font-size:.92rem; color:#475569}
.card-meta li{display:inline-flex; align-items:center; gap:.35rem}
.card-contact{font-size:.88rem; color:#475569}
.card-contact a{color:#0f172a; font-weight:600}
.card-actions{display:flex; gap:.6rem; margin-top:1rem; flex-wrap:wrap}
.card-actions .btn{flex:1; min-width:130px; border-radius:14px}
.card-actions .btn.primary{background:linear-gradient(120deg, #f59e0b, #f97316); border:none; color:#1f1300}
.card-actions .btn.ghost{background:#f1f5f9; border-color:transparent; color:#0f172a}

/* Unify vehicle image presentation and add placeholder badge */
.card .media{
  width:100%;
  height:var(--vehicle-media-height);
  object-fit:cover;
  object-position:center;
  border-radius:12px 12px 0 0;
  border-bottom:1px solid #eef2f7;
  background:#0a152c;
  opacity:1;
  transform:scale(1);
  transition:opacity .5s ease, transform .5s ease;
  will-change:transform,opacity;
}
.placeholder-badge{position:absolute; top:10px; right:10px; background:#0b1020cc; color:#fff; border:1px solid #ffffff55; padding:.28rem .6rem; border-radius:999px; font-size:.82rem; font-weight:700; z-index:2; pointer-events:none}

/* Creative Fleet Cards */
.card{position:relative}
.card .media{transition:transform .35s ease, filter .3s ease, opacity .4s ease}
.js-ready .card .media{opacity:1; transform:scale(1.02)}
.js-ready .card .media.loaded{opacity:1; transform:scale(1)}
.card:hover .media{transform:scale(1.035); filter:saturate(1.05) contrast(1.03)}
.card-badges{position:absolute; top:10px; left:10px; display:flex; gap:.5rem; z-index:2; pointer-events:none}
.card-badges .badge{background:#0b1020cc; color:#fff; border:1px solid #ffffff55; padding:.35rem .6rem; border-radius:999px; font-size:.82rem; font-weight:700}
.card .content h3{margin:0 0 .15rem; font-size:1.15rem}
.card-actions{display:flex; gap:.6rem; margin-top:1rem; flex-wrap:wrap}
.card-actions .btn{flex:1; min-width:130px}

/* Featured grid: unify image height */


/* Quick WhatsApp reservation widget */
.wa-section{background:linear-gradient(135deg, #ffffff, #f7faff); border:1px solid #e4ecfb; border-radius:28px; box-shadow:0 30px 60px rgba(15,23,42,.08)}
.wa-layout{display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:2.2rem; align-items:center}
.wa-copy .eyebrow{color:#f59e0b}
.wa-highlights{list-style:none; margin:0 0 1.2rem; padding:0; display:grid; gap:.45rem}
.wa-highlights li{position:relative; padding-left:1.4rem; color:#475569; font-size:.95rem}
.wa-highlights li::before{content:"\2713"; position:absolute; left:0; color:var(--accent); font-weight:700}
.contact-pills{display:flex; flex-wrap:wrap; gap:.65rem}
.contact-pill{display:inline-flex; align-items:center; gap:.4rem; padding:.5rem .9rem; border:1px solid #e2e8f0; border-radius:999px; background:#fff; font-weight:600; color:#0f172a; box-shadow:var(--shadow-sm)}
.contact-pill span{font-size:1.15rem}
.wa-reserve{display:flex; flex-direction:column; gap:1.1rem; padding:1.4rem; border-radius:22px; background:#fff; border:1px solid #e4ecfb; box-shadow:0 15px 35px rgba(15,23,42,.08)}
.wa-reserve .field-group{display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:1rem}
.wa-reserve .field{display:flex; flex-direction:column}
.wa-reserve .field label{font-weight:700; color:#0f172a; display:flex; align-items:center; gap:.45rem; margin-bottom:.35rem}
.label-icon{font-size:1.2rem; line-height:1; font-family:'Segoe UI Emoji','Apple Color Emoji','Noto Color Emoji',sans-serif}
.wa-reserve .field select{width:100%; padding:.85rem 1rem; border:1px solid #cbd5e1; border-radius:18px; background:#f8fafc; min-height:52px; font-weight:600; font-size:1rem; appearance:none}
.wa-reserve .field select:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(233,165,0,.25)}
.wa-reserve .actions{width:100%; display:flex; gap:.75rem; flex-wrap:wrap; align-items:center}
.wa-note{width:100%; margin-top:.2rem; color:var(--muted); font-size:.92rem}
@media(max-width:640px){
  .wa-reserve{padding:1rem}
  .wa-reserve .field-group{grid-template-columns:1fr}
  .wa-reserve .actions{flex-direction:column; align-items:stretch}
}
.btn.whatsapp{background:#25D366; color:#0b1020; border:1px solid #1fb65a}
.btn.whatsapp:hover{background:#1fb65a}

/* Enhanced Buttons (glow + shine) */
.btn{
  position:relative;
  overflow:hidden;
  isolation:isolate; /* ensure pseudo-elements stack above background only */
  transition:background-color .2s ease, transform .2s ease, box-shadow .25s ease, filter .2s ease;
}
.btn.primary{
  /* keep existing gradient + border from theme, add subtle ambient glow */
  box-shadow:0 10px 22px rgba(241,162,13,.22);
}
.btn.primary:hover{
  box-shadow:0 14px 32px rgba(241,162,13,.32), 0 8px 18px rgba(12,19,37,.12);
}
.btn:active{
  transform:translateY(0); /* reduce hover lift on press */
  box-shadow:0 10px 22px rgba(0,0,0,.1);
}
/* Subtle moving shine on primary buttons */
.btn.primary::before{
  content:"";
  position:absolute;
  top:-120%;
  left:-30%;
  width:60%;
  height:300%;
  background:linear-gradient(130deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.35) 45%, rgba(255,255,255,0) 60%);
  transform:translateX(-120%) rotate(18deg);
  transition:transform .6s ease;
  pointer-events:none;
  mix-blend-mode:screen;
}
.btn.primary:hover::before{ transform:translateX(180%) rotate(18deg) }
/* Accessible focus ring enhancement for buttons */
.btn:focus-visible{
  outline:3px solid var(--focus);
  outline-offset:2px;
  box-shadow:0 0 0 4px rgba(37,99,235,.25), 0 8px 20px rgba(0,0,0,.12);
}

/* Apply the same polish to the navbar call-to-action */
.cta{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  box-shadow:0 10px 22px rgba(241,162,13,.18);
}
.cta:hover{ box-shadow:0 14px 30px rgba(241,162,13,.28) }
.cta::before{
  content:"";
  position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(120deg, rgba(255,255,255,.22), rgba(255,255,255,0) 40%);
  opacity:.0; transform:translateX(-20%);
  transition:opacity .35s ease, transform .6s ease;
}
.cta:hover::before{ opacity:1; transform:translateX(15%) }
.card h3{margin:0; font-size:1.05rem; letter-spacing:.2px}
.card .muted{color:#64748b}
.tag{background:#fff8ea; border-color:#fde7bd; color:#7a4c00}

/* Forms */
label{color:#0b1325}
input, select, textarea{background:#fff; border:1px solid #d4dbe6}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 4px rgba(241,162,13,.18)}
::placeholder{color:#94a3b8}

/* Section cards */
.section-card{background:linear-gradient(180deg, #ffffff, #f9fbff); border:1px solid #e4eaf3; border-radius:22px; box-shadow:0 20px 42px rgba(12,19,37,.10)}

/* Footer */
footer{background:#0c1325; border-top:3px solid var(--accent)}
footer a:hover{text-decoration:underline; opacity:.92}

/* Floating WhatsApp */
.whatsapp-float{box-shadow:0 12px 24px rgba(0,0,0,.22)}

/* Reveal animations */

/* Image fade-in and hover */
/* (handled above within card styles to keep cascade tight) */

/* Footer refresh */
.site-footer{background:radial-gradient(circle at top left,#101836,#050912 55%); color:#e2e8ff; margin-top:3rem; padding:3rem 0 1.5rem; border-top:1px solid rgba(255,255,255,.08)}
.site-footer a{color:#fff}
.site-footer a:hover{opacity:.85}
.footer-hero{display:flex; flex-wrap:wrap; gap:1.5rem; align-items:center; justify-content:space-between; padding-bottom:2rem; border-bottom:1px solid rgba(255,255,255,.08)}
.footer-hero h2{color:#fff; margin:0}
.footer-hero p{color:#cbd5f5; margin:.3rem 0 0}
.footer-actions{display:flex; gap:.85rem; flex-wrap:wrap}
.footer-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1.4rem; margin-top:2rem}
.footer-card{background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08); border-radius:18px; padding:1.3rem; box-shadow:0 20px 35px rgba(0,0,0,.25); min-height:100%}
.brand-minimal{display:flex; align-items:center; gap:.7rem; margin-bottom:.7rem}
.brand-minimal img{width:48px; height:48px; border-radius:12px; border:1px solid rgba(255,255,255,.35); background:#fff}
.footer-card h4{margin-top:0; color:#fff}
.footer-card nav a{display:inline-block; margin:.2rem 0}
.footer-card p{color:#c8d3f0}
.copy{margin-top:2rem; text-align:center; color:#94a3b8; font-size:.9rem}
.copy span+span{margin-left:.35rem}
@media(max-width:640px){
  .footer-hero{flex-direction:column; text-align:center}
  .footer-actions{justify-content:center}
}

/* Compact responsive adjustments */
@media(max-width:768px){
  #featured-cars, #fleet-grid{grid-template-columns:1fr; gap:.9rem}
  .section.container{padding:1.2rem 1rem}
}

/* Density helpers */
.stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1rem; margin-top:1rem}
.stat-card{background:#0f172a; color:#fff; border-radius:18px; padding:1.2rem 1.4rem; box-shadow:0 18px 36px rgba(15,23,42,.18); position:relative; overflow:hidden}
.stat-card::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at top right, rgba(255,255,255,.18), transparent 55%); opacity:.7; pointer-events:none}
.stat-card strong{display:block; font-size:2rem; letter-spacing:.5px; margin-bottom:.4rem}
.stat-card span{opacity:.8; font-weight:600}

.icon-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1.2rem; margin-top:1.2rem}
.icon-card{border:1px solid #e2e8f0; border-radius:18px; padding:1.4rem; background:#fff; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; gap:.7rem}
.icon-card .icon{width:46px; height:46px; border-radius:12px; background:#fff5e0; display:flex; align-items:center; justify-content:center; font-size:1.4rem; color:#b96d00; font-family:'Segoe UI Emoji','Apple Color Emoji','Noto Color Emoji',sans-serif}
.icon-card h3{margin:0; font-size:1.05rem}
.icon-card p{margin:0; color:var(--muted); font-size:.95rem}

.steps-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem; margin-top:1.2rem; counter-reset:step}
.step-card{border:1px solid #d8e0ef; border-radius:20px; background:linear-gradient(180deg,#ffffff,#f8fbff); padding:1.3rem; box-shadow:0 12px 26px rgba(15,23,42,.08); position:relative}
.step-card::before{counter-increment:step; content:counter(step); position:absolute; top:1rem; right:1rem; width:36px; height:36px; border-radius:50%; background:#0f172a; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700}
.step-card h3{margin-top:0; margin-bottom:.5rem}
.step-card p{margin:0; font-size:.95rem}

.cta-banner{margin-top:1.4rem; border-radius:24px; padding:2.2rem; background:linear-gradient(135deg,#0b1224,#13254a); color:#fff; display:flex; flex-wrap:wrap; gap:1.4rem; align-items:center; justify-content:space-between; box-shadow:0 24px 60px rgba(12,18,36,.45)}
.cta-banner h2{color:#fff; margin:0}
.cta-banner p{margin:.3rem 0 0; color:#d4dcff}
.cta-banner .cta-actions{display:flex; gap:.8rem; flex-wrap:wrap}
.cta-banner .btn.whatsapp{box-shadow:0 12px 30px rgba(37,211,102,.35)}
