/* ════════════════════════════════════════════════════════════
   PRESTIGE AUTOMOTIVE — Shared Design System
   Fonts: Barlow Condensed (display) · Barlow (body)
════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600&family=Barlow:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&display=swap');

/* ─── Tokens ──────────────────────────────────────────────── */
:root {
  --black:        #f5f5f3;
  --surface:      #eceae8;
  --surface-hi:   #e3e1df;
  --surface-lo:   #f9f9f7;
  --green:        #38a81a;
  --green-hi:     #41bb1f;
  --green-glow:   rgba(56,168,26,.20);
  --green-dim:    rgba(56,168,26,.10);
  --green-border: rgba(56,168,26,.35);
  --white:        #111111;
  --muted:        rgba(0,0,0,.52);
  --border:       rgba(0,0,0,.10);
  --border-hi:    rgba(0,0,0,.16);

  --display: 'Barlow Condensed', sans-serif;
  --body:    'Barlow', sans-serif;

  --ease-out:  cubic-bezier(.16,1,.3,1);
  --ease-snap: cubic-bezier(.34,1.56,.64,1);
  --ease-in:   cubic-bezier(.7,0,.84,0);

  --t-xs: 150ms; --t-sm: 230ms; --t-md: 370ms; --t-lg: 580ms;

  --sh-sm:    0 2px 12px rgba(0,0,0,.10);
  --sh-md:    0 10px 44px rgba(0,0,0,.14);
  --sh-lg:    0 28px 90px rgba(0,0,0,.18);
  --sh-green: 0 0 50px rgba(56,168,26,.18);

  --r-xs: 4px; --r-sm: 8px; --r-md: 14px; --r-lg: 22px; --r-pill: 999px;

  --nav-h: 72px;
}

/* ─── Reset ───────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; font-size:16px; }
body { background:var(--black); color:var(--white); font-family:var(--body);
       font-weight:400; line-height:1.68; overflow-x:hidden;
       -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
h1,h2,h3,h4,h5,h6 { font-family:var(--display); text-transform:uppercase;
                     letter-spacing:.04em; line-height:1.05; font-weight:700; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
ul { list-style:none; }
button { border:none; background:none; cursor:pointer; font-family:inherit; }
input,textarea,select { font-family:inherit; }

/* ─── Grain ───────────────────────────────────────────────── */
body::before {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:9999;
  opacity:.033;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:256px 256px;
}

/* ─── Ambient glow ────────────────────────────────────────── */
body::after {
  content:''; position:fixed; width:800px; height:800px;
  background:radial-gradient(circle, rgba(65,187,31,.05) 0%, transparent 68%);
  top:-300px; right:-300px; pointer-events:none; z-index:0;
  animation:glowDrift 22s ease-in-out infinite alternate;
}
@keyframes glowDrift {
  from { transform:translate(0,0) scale(1); }
  to   { transform:translate(-90px,110px) scale(1.2); }
}

/* ─── Scroll progress bar ─────────────────────────────────── */
#progress-bar {
  position:fixed; top:0; left:0; height:2px; width:0%;
  background:var(--green); z-index:10001; pointer-events:none;
  transition:width .1s linear;
  box-shadow:0 0 10px var(--green-glow);
}

/* ─── Reveal ──────────────────────────────────────────────── */
.rev {
  opacity:0; transform:translateY(48px);
  transition:opacity var(--t-lg) var(--ease-out), transform var(--t-lg) var(--ease-out);
}
.rev.left  { transform:translateX(-44px); }
.rev.right { transform:translateX(44px); }
.rev.scale { transform:scale(.91); }
.rev.up    { transform:translateY(64px); }
.rev.in    { opacity:1; transform:none; }

/* ─── Page transition ─────────────────────────────────────── */
.page-wrap { animation:pageFadeIn .5s var(--ease-out) both; }
@keyframes pageFadeIn {
  from { opacity:0; transform:translateY(16px); }
  to   { opacity:1; transform:translateY(0); }
}

/* ═══════════════════════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════════════════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000; height:var(--nav-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 52px;
  transition:background var(--t-md) var(--ease-out), backdrop-filter var(--t-md),
             box-shadow var(--t-md) var(--ease-out), transform var(--t-md) var(--ease-out),
             opacity var(--t-md) var(--ease-out);
}
body.modal-open .nav { transform:translateY(-100%); opacity:0; pointer-events:none; }
.nav.solid {
  background:rgba(245,245,243,.94); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  box-shadow:0 1px 0 var(--border);
}
.nav__logo img { height:38px; width:auto;
  transition:filter var(--t-sm) var(--ease-out), opacity var(--t-sm); }
.nav__logo:hover img { filter:brightness(1.15) drop-shadow(0 0 10px rgba(65,187,31,.45)); }

.nav__links { display:flex; gap:34px; }
.nav__links a {
  font-family:var(--display); font-weight:600; font-size:12px;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--green);
  text-shadow:0 1px 6px rgba(0,0,0,.35);
  padding-bottom:3px;
  background-image:linear-gradient(to right, var(--green) 100%, var(--green) 0);
  background-repeat:no-repeat; background-size:0% 1.5px; background-position:0% 100%;
  transition:color var(--t-sm) var(--ease-out), background-size var(--t-sm) var(--ease-out);
}
.nav__links a:hover, .nav__links a.active { color:#111; background-size:100% 1.5px; }
.nav__links a.active { color:var(--green); }
.nav.solid .nav__links a { text-shadow:none; }
/* Het logo is wit; op de lichte nav en footer zou het onzichtbaar zijn. */
.nav__logo img.logo--dark { display:none; }
.nav.solid .nav__logo img.logo--light { display:none; }
.nav.solid .nav__logo img.logo--dark { display:block; }

.nav__right { display:flex; align-items:center; gap:20px; }

.nav__cta {
  font-family:var(--display); font-weight:700; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase;
  padding:10px 26px; border-radius:var(--r-pill);
  border:1.5px solid var(--green); color:var(--green);
  position:relative; overflow:hidden; z-index:1;
  transition:color var(--t-xs) var(--ease-out), box-shadow var(--t-md);
}
.nav__cta::before {
  content:''; position:absolute; inset:0; background:var(--green);
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--t-md) var(--ease-out); z-index:-1; border-radius:inherit;
}
.nav__cta:hover { color:#000; box-shadow:0 0 28px var(--green-glow); }
.nav__cta:hover::before { transform:scaleX(1); }

/* Hamburger */
.nav__burger {
  display:none; flex-direction:column; gap:5px; padding:6px;
  width:36px; background:none; border:none; cursor:pointer;
}
.nav__burger span {
  display:block; height:1.5px; background:#111; border-radius:2px;
  transition:transform var(--t-md) var(--ease-out), opacity var(--t-sm), width var(--t-md);
}
.nav__burger span:nth-child(2) { width:70%; }
.nav__burger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
.nav__burger.open span:nth-child(2) { opacity:0; width:0; }
.nav__burger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }

/* Mobile overlay */
.nav__mobile {
  position:fixed; inset:0; background:rgba(245,245,243,.97);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  z-index:999; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:8px;
  opacity:0; pointer-events:none;
  transition:opacity var(--t-md) var(--ease-out);
}
.nav__mobile.open { opacity:1; pointer-events:all; }
.nav__mobile a {
  font-family:var(--display); font-weight:700;
  font-size:clamp(38px,9vw,72px); letter-spacing:.1em; text-transform:uppercase;
  color:rgba(0,0,0,.8); line-height:1.15;
  transition:color var(--t-sm) var(--ease-out), letter-spacing var(--t-sm) var(--ease-out),
             opacity var(--t-sm) var(--ease-out);
  opacity:0; transform:translateY(20px);
  transition:all var(--t-md) var(--ease-out);
}
.nav__mobile.open a {
  opacity:1; transform:translateY(0);
}
.nav__mobile.open a:nth-child(1) { transition-delay:.05s; }
.nav__mobile.open a:nth-child(2) { transition-delay:.10s; }
.nav__mobile.open a:nth-child(3) { transition-delay:.15s; }
.nav__mobile.open a:nth-child(4) { transition-delay:.20s; }
.nav__mobile.open a:nth-child(5) { transition-delay:.25s; }
.nav__mobile.open a:nth-child(6) { transition-delay:.30s; }
.nav__mobile a:hover { color:var(--green); letter-spacing:.18em; }
.nav__mobile-cta {
  margin-top:24px; font-family:var(--display); font-weight:700;
  font-size:14px; letter-spacing:.2em; text-transform:uppercase;
  padding:14px 40px; border-radius:var(--r-pill);
  border:2px solid var(--green); color:var(--green);
  opacity:0; transition:all var(--t-md) var(--ease-out);
}
.nav__mobile.open .nav__mobile-cta { opacity:1; transition-delay:.35s; }
.nav__mobile-cta:hover { background:var(--green); color:#000; }

@media (max-width:900px) {
  .nav { padding:0 24px; }
  .nav__links { display:none; }
  .nav__cta { display:none; }
  .nav__burger { display:flex; }
}

/* ═══════════════════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════════════════ */
.footer {
  background:#e0deda; padding:72px 52px 40px;
  border-top:1px solid rgba(0,0,0,.08); position:relative;
}
.footer::before {
  content:''; position:absolute; top:0; left:52px; right:52px; height:1px;
  background:linear-gradient(to right, transparent, var(--green-border), transparent);
}
.footer__grid {
  display:grid; grid-template-columns:2.2fr 1fr 1fr 1fr;
  gap:56px; margin-bottom:56px;
}
.footer__logo { height:34px; margin-bottom:16px; }
.footer__tagline {
  font-size:14px; color:rgba(0,0,0,.5); line-height:1.72; max-width:220px;
}
.footer__social { display:flex; gap:14px; margin-top:24px; }
.footer__social a {
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--border); display:flex; align-items:center; justify-content:center;
  font-size:13px; color:rgba(0,0,0,.5);
  transition:border-color var(--t-sm), color var(--t-sm), background var(--t-sm);
}
.footer__social a:hover { border-color:var(--green); color:var(--green); background:var(--green-dim); }
.footer__h {
  font-family:var(--display); font-size:10px; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--green); margin-bottom:20px;
}
.footer__ul { display:flex; flex-direction:column; gap:10px; }
.footer__ul li { font-size:14px; color:rgba(0,0,0,.5); line-height:1.6; }
.footer__ul a {
  font-size:14px; color:rgba(0,0,0,.5);
  transition:color var(--t-xs) var(--ease-out), padding-left var(--t-xs);
}
.footer__ul a:hover { color:var(--green); padding-left:6px; }
.footer__bottom {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:28px; border-top:1px solid rgba(0,0,0,.1);
  flex-wrap:wrap; gap:12px;
}
.footer__copy { font-size:12px; color:rgba(0,0,0,.4); letter-spacing:.02em; }
.footer__badge {
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(65,187,31,.6);
  display:flex; align-items:center; gap:8px;
}
.footer__badge::before { content:'✦'; font-size:7px; color:var(--green); }
@media (max-width:900px) {
  .footer { padding:52px 24px 32px; }
  .footer__grid { grid-template-columns:1fr 1fr; gap:36px; }
}
@media (max-width:500px) {
  .footer__grid { grid-template-columns:1fr; gap:32px; }
}

/* ═══════════════════════════════════════════════════════════
   FLOATING ELEMENTS
═══════════════════════════════════════════════════════════ */
/* WhatsApp FAB */
.fab-wa {
  position:fixed; bottom:28px; right:28px; z-index:500;
  width:56px; height:56px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 4px 24px rgba(37,211,102,.4);
  transition:transform var(--t-sm) var(--ease-snap), box-shadow var(--t-sm);
}
.fab-wa:hover { transform:scale(1.12); box-shadow:0 8px 36px rgba(37,211,102,.55); }
.fab-wa svg { width:26px; height:26px; fill:#fff; }

/* Back to top */
#back-top {
  position:fixed; bottom:96px; right:28px; z-index:500;
  width:40px; height:40px; border-radius:50%;
  background:rgba(0,0,0,.07); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  font-size:16px; color:rgba(0,0,0,.5);
  opacity:0; pointer-events:none;
  transition:opacity var(--t-sm), transform var(--t-sm) var(--ease-out),
             background var(--t-sm), color var(--t-sm);
  backdrop-filter:blur(8px);
}
#back-top.show { opacity:1; pointer-events:all; }
#back-top:hover { background:var(--green); color:#000; border-color:var(--green); transform:translateY(-2px); }

/* ═══════════════════════════════════════════════════════════
   SHARED COMPONENTS
═══════════════════════════════════════════════════════════ */
/* Buttons */
.btn {
  font-family:var(--display); font-weight:700; font-size:12px;
  letter-spacing:.18em; text-transform:uppercase;
  padding:13px 36px; border-radius:var(--r-pill);
  display:inline-flex; align-items:center; gap:10px;
  position:relative; overflow:hidden; z-index:1;
  transition:color var(--t-xs) var(--ease-out), box-shadow var(--t-md), filter var(--t-sm);
  cursor:pointer;
}
.btn--primary { background:var(--green); color:#000; border:2px solid var(--green); }
.btn--primary:hover { box-shadow:0 0 32px var(--green-glow); filter:brightness(1.08); }
.btn--ghost { color:#111; border:1.5px solid rgba(0,0,0,.3); }
.btn--ghost::before {
  content:''; position:absolute; inset:0; background:rgba(0,0,0,.05);
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--t-md) var(--ease-out); z-index:-1; border-radius:inherit;
}
.btn--ghost:hover { border-color:rgba(0,0,0,.55); }
.btn--ghost:hover::before { transform:scaleX(1); }
.btn--green-ghost { color:var(--green); border:1.5px solid var(--green); }
.btn--green-ghost::before {
  content:''; position:absolute; inset:0; background:var(--green);
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--t-md) var(--ease-out); z-index:-1; border-radius:inherit;
}
.btn--green-ghost:hover { color:#000; }
.btn--green-ghost:hover::before { transform:scaleX(1); }
.btn--outline-white { color:#111; border:1.5px solid rgba(0,0,0,.28); background:transparent; }
.btn--outline-white:hover { border-color:var(--green); color:var(--green); }

/* Eyebrow */
.eyebrow {
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; color:var(--green);
}
.eyebrow::before { content:'━'; font-size:10px; opacity:.7; }

/* Section layouts */
.section { padding:120px 52px; position:relative; }
.section--sm { padding:80px 52px; }
.section--dark { background:var(--black); }
.section--surface { background:var(--surface); }
.section--lo { background:var(--surface-lo); }
.container { max-width:1280px; margin:0 auto; }

.section-head { margin-bottom:64px; }
.section-head--center { text-align:center; }
.section-head--center .section__lead { margin:0 auto; }

.section__title {
  font-size:clamp(42px,5.5vw,80px); font-weight:800;
  line-height:.94; letter-spacing:.03em; margin-top:14px; margin-bottom:18px;
}
.section__lead {
  font-size:16px; line-height:1.75; color:var(--muted); max-width:520px;
}

/* Glass card */
.glass {
  background:linear-gradient(135deg, rgba(255,255,255,.55), rgba(56,168,26,.04));
  backdrop-filter:blur(14px) saturate(1.5); -webkit-backdrop-filter:blur(14px) saturate(1.5);
  border:1px solid var(--green-border); border-radius:var(--r-md);
  box-shadow:var(--sh-sm), inset 0 1px 0 rgba(255,255,255,.6);
  transition:all var(--t-md) var(--ease-out); position:relative; overflow:hidden;
}
.glass::after {
  content:''; position:absolute; top:0; left:-130%; width:60%; height:100%;
  background:linear-gradient(90deg, transparent, rgba(65,187,31,.07), transparent);
  transform:skewX(-15deg);
  transition:left .6s var(--ease-out); pointer-events:none;
}
.glass:hover::after { left:160%; }
.glass:hover {
  border-color:rgba(56,168,26,.55);
  background:linear-gradient(135deg, rgba(56,168,26,.09), rgba(56,168,26,.02));
  box-shadow:var(--sh-green), var(--sh-md);
}

/* Badge */
.badge {
  display:inline-block; font-family:var(--display); font-size:10px;
  font-weight:700; letter-spacing:.22em; text-transform:uppercase;
  padding:4px 12px; border-radius:var(--r-pill);
  border:1px solid var(--green-border); color:var(--green); background:var(--green-dim);
}

/* Divider line */
.divider {
  height:1px; background:linear-gradient(to right, transparent, var(--border-hi), transparent);
  margin:0;
}

/* Page hero (inner pages) */
.page-hero {
  min-height:52vh; display:flex; align-items:flex-end;
  padding:0 52px 72px; position:relative; overflow:hidden;
  padding-top:var(--nav-h);
}
.page-hero__bg {
  position:absolute; inset:0; background-size:cover; background-position:center;
  transform:scale(1.04);
}
.page-hero__bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(9,9,9,.97) 0%, rgba(9,9,9,.45) 60%, rgba(9,9,9,.2) 100%);
}
.page-hero__ghost {
  position:absolute; font-family:var(--display); font-weight:800;
  font-size:clamp(80px,16vw,200px); letter-spacing:.07em;
  text-transform:uppercase; color:#fff; opacity:.04; line-height:.88;
  bottom:-10px; right:-20px; pointer-events:none; user-select:none;
}
.page-hero__content,
.page-hero__inner { position:relative; z-index:2; }
.page-hero__crumb {
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--green);
  margin-bottom:16px; display:flex; align-items:center; gap:10px;
}
.page-hero__crumb span { color:rgba(255,255,255,.35); }
.page-hero__title {
  font-size:clamp(52px,8vw,110px); font-weight:800; line-height:.92;
  color:#fff;
}
.page-hero__sub {
  font-size:16px; color:rgba(255,255,255,.72); max-width:460px;
  margin-top:18px; line-height:1.72;
}
@media (max-width:768px) {
  .section { padding:80px 24px; }
  .section--sm { padding:60px 24px; }
  .page-hero { padding:0 24px 56px; }
}

/* ═══════════════════════════════════════════════════════════
   HOME — HERO
═══════════════════════════════════════════════════════════ */
.hero {
  position:relative; min-height:100dvh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:0 52px 88px; overflow:hidden;
}
.hero__bg {
  position:absolute; inset:0;
  background:url('../img/prestige-rs3-front-action.jpg') center 30%/cover;
  transform:scale(1.05); will-change:transform;
}
.hero__bg::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(9,9,9,.98) 0%, rgba(9,9,9,.5) 50%, rgba(9,9,9,.1) 100%);
}
.hero__ghost {
  position:absolute; font-family:var(--display); font-weight:800;
  font-size:clamp(110px,20vw,280px); letter-spacing:.07em; line-height:.85;
  color:#fff; opacity:.045; top:50%; left:50%; transform:translate(-50%,-50%);
  white-space:nowrap; pointer-events:none; user-select:none; z-index:1;
}
.hero__content { position:relative; z-index:2; max-width:820px; }
.hero__eyebrow {
  display:flex; align-items:center; gap:14px; margin-bottom:22px;
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.28em; text-transform:uppercase; color:var(--green);
  opacity:0; animation:fadeUp .8s var(--ease-out) .3s forwards;
}
.hero__eyebrow::before { content:''; display:block; width:38px; height:1.5px; background:var(--green); }
.hero__title {
  font-size:clamp(58px,10vw,130px); font-weight:800; line-height:.90; letter-spacing:.03em;
  margin-bottom:26px; opacity:0; animation:fadeUp .9s var(--ease-out) .5s forwards;
  color:#fff;
}
.hero__title em { font-style:italic; font-weight:300; color:var(--green); }
.hero__sub {
  font-size:16px; font-weight:400; line-height:1.72; color:rgba(255,255,255,.55);
  max-width:480px; margin-bottom:44px;
  opacity:0; animation:fadeUp .9s var(--ease-out) .7s forwards;
}
.hero__actions {
  display:flex; gap:16px; flex-wrap:wrap;
  opacity:0; animation:fadeUp .9s var(--ease-out) .9s forwards;
}
.hero__scroll {
  position:absolute; bottom:38px; right:56px; z-index:2;
  font-family:var(--display); font-size:10px; letter-spacing:.26em;
  text-transform:uppercase; color:rgba(255,255,255,.35);
  writing-mode:vertical-rl; display:flex; flex-direction:column; align-items:center; gap:10px;
  opacity:0; animation:fadeIn 1s var(--ease-out) 1.4s forwards;
}
.hero__scroll::after {
  content:''; width:1px; height:64px;
  background:linear-gradient(to bottom, var(--green), transparent);
  animation:scrollPulse 2.2s ease-in-out infinite;
}
@keyframes scrollPulse { 0%,100%{opacity:.4;transform:scaleY(1)} 50%{opacity:1;transform:scaleY(1.25)} }
@keyframes fadeUp {
  from { opacity:0; transform:translateY(38px); }
  to   { opacity:1; transform:translateY(0); }
}
@keyframes fadeIn { from{opacity:0} to{opacity:1} }

/* ─── Home: Ticker ────────────────────────────────────────── */
.ticker { background:var(--green); overflow:hidden; padding:14px 0; }
.ticker__track {
  display:flex; gap:0; white-space:nowrap;
  animation:ticker 25s linear infinite;
}
.ticker__item {
  font-family:var(--display); font-size:13px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; color:#000;
  padding:0 40px; display:flex; align-items:center; gap:16px; flex-shrink:0;
}
.ticker__item::after { content:'✦'; font-size:9px; }
@keyframes ticker { from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ─── Home: Services preview ──────────────────────────────── */
.srv-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
}
.srv-card {
  padding:40px 32px 36px; cursor:pointer; transform:translateY(0);
}
.srv-card:hover { transform:translateY(-8px); }
.srv-card__num {
  font-family:var(--display); font-size:80px; font-weight:800; line-height:1;
  letter-spacing:-.02em; color:rgba(0,0,0,.05); position:absolute;
  top:16px; right:20px; pointer-events:none; user-select:none;
  transition:color var(--t-md);
}
.srv-card:hover .srv-card__num { color:rgba(56,168,26,.1); }
.srv-card__tag { font-family:var(--display); font-size:10px; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase; color:var(--green);
  display:block; margin-bottom:18px; }
.srv-card__title { font-size:34px; font-weight:700; letter-spacing:.05em; margin-bottom:14px; }
.srv-card__desc { font-size:14px; line-height:1.72; color:rgba(0,0,0,.58); margin-bottom:28px; }
.srv-card__price { font-family:var(--display); font-size:13px; font-weight:600;
  letter-spacing:.1em; text-transform:uppercase; color:var(--green); margin-bottom:26px; }
.srv-card__price strong { font-size:30px; font-weight:800; letter-spacing:0; }
.srv-card__link {
  font-family:var(--display); font-weight:700; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase; color:var(--green);
  display:inline-flex; align-items:center; gap:8px;
  transition:gap var(--t-xs) var(--ease-out);
}
.srv-card__link::after { content:'→'; font-size:15px; transition:transform var(--t-xs) var(--ease-snap); }
.srv-card:hover .srv-card__link { gap:14px; }
.srv-card:hover .srv-card__link::after { transform:translateX(4px); }
@media (max-width:960px) { .srv-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:580px) { .srv-grid { grid-template-columns:1fr; } }

/* ─── Home: Split / About preview ────────────────────────── */
.split { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.split--flip { direction:rtl; }
.split--flip > * { direction:ltr; }
.split__img {
  position:relative; border-radius:var(--r-lg); overflow:hidden;
  aspect-ratio:4/5;
}
.split__img img { width:100%; height:100%; object-fit:cover;
  transition:transform .8s var(--ease-out); }
.split__img:hover img { transform:scale(1.04); }
.split__img::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(135deg, transparent 50%, rgba(9,9,9,.4) 100%);
}
.split__img-border {
  position:absolute; inset:-1px; border-radius:inherit;
  background:linear-gradient(135deg, var(--green-border), transparent 60%);
  z-index:1; pointer-events:none;
}
.split__text { display:flex; flex-direction:column; gap:0; }
.split__stats { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:40px; }
.stat {
  padding:22px 18px; border-radius:var(--r-sm);
  border:1px solid var(--border); background:rgba(0,0,0,.03);
}
.stat__n {
  font-family:var(--display); font-size:48px; font-weight:800;
  line-height:1; letter-spacing:-.02em; color:var(--green); margin-bottom:6px;
}
.stat__l {
  font-family:var(--display); font-size:10px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(0,0,0,.5);
}
.check-list { display:flex; flex-direction:column; gap:12px; margin:28px 0; }
.check-list li {
  display:flex; align-items:flex-start; gap:12px; font-size:15px; color:rgba(0,0,0,.65);
}
.check-list li::before {
  content:'✦'; color:var(--green); font-size:10px; margin-top:4px; flex-shrink:0;
}
@media (max-width:900px) {
  .split { grid-template-columns:1fr; gap:44px; }
  .split--flip { direction:ltr; }
  .split__img { aspect-ratio:16/9; }
}

/* ─── Home: Stats row ─────────────────────────────────────── */
.stats-bar {
  display:grid; grid-template-columns:repeat(4,1fr); gap:0;
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.stats-bar__item {
  padding:48px 32px; text-align:center;
  border-right:1px solid var(--border); position:relative;
}
.stats-bar__item:last-child { border-right:none; }
.stats-bar__n {
  font-family:var(--display); font-size:clamp(40px,5vw,72px); font-weight:800;
  line-height:1; color:var(--green); letter-spacing:-.02em; display:block;
}
.stats-bar__l {
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(0,0,0,.5);
  display:block; margin-top:8px;
}
@media (max-width:700px) {
  .stats-bar { grid-template-columns:1fr 1fr; }
  .stats-bar__item:nth-child(2) { border-right:none; }
  .stats-bar__item:nth-child(3) { border-right:1px solid var(--border); }
}

/* ─── Home: Testimonials ──────────────────────────────────── */
.reviews-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.review-card { padding:32px 28px; }
.review-card__stars {
  display:flex; gap:4px; margin-bottom:18px;
  font-size:14px; color:var(--green);
}
.review-card__text {
  font-size:15px; line-height:1.72; color:rgba(0,0,0,.65);
  margin-bottom:22px; font-style:italic;
}
.review-card__author {
  font-family:var(--display); font-size:13px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase; color:#111;
}
.review-card__car {
  font-size:12px; color:var(--green); margin-top:4px;
  font-family:var(--display); letter-spacing:.1em; text-transform:uppercase;
}
@media (max-width:800px) { .reviews-grid { grid-template-columns:1fr; } }
@media (min-width:801px) and (max-width:1100px) { .reviews-grid { grid-template-columns:1fr 1fr; } }

/* ─── Home: Gallery strip ─────────────────────────────────── */
.strip {
  display:grid; grid-template-columns:1.7fr 1fr 1fr; grid-template-rows:280px 280px; gap:12px;
}
.strip__item { overflow:hidden; border-radius:var(--r-md); position:relative; cursor:pointer; }
.strip__item:first-child { grid-row:1/3; }
.strip__item img { width:100%; height:100%; object-fit:cover;
  filter:brightness(.72) saturate(.8);
  transition:transform .7s var(--ease-out), filter .4s; }
.strip__item::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(9,9,9,.7) 0%, transparent 60%);
  opacity:0; transition:opacity var(--t-md);
}
.strip__item:hover img { transform:scale(1.07); filter:brightness(.95) saturate(1.1); }
.strip__item:hover::after { opacity:1; }
@media (max-width:768px) {
  .strip { grid-template-columns:1fr 1fr; grid-template-rows:auto; }
  .strip__item { height:180px; }
  .strip__item:first-child { grid-row:auto; }
}

/* ─── CTA Banner ──────────────────────────────────────────── */
.cta-banner {
  padding:110px 52px; text-align:center; position:relative; overflow:hidden;
  background:linear-gradient(135deg, var(--surface) 0%, rgba(56,168,26,.06) 50%, var(--surface) 100%);
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
}
.cta-banner::before {
  content:'PRESTIGE'; position:absolute; top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-family:var(--display); font-size:clamp(90px,18vw,260px);
  font-weight:800; letter-spacing:.08em; color:rgba(65,187,31,.025);
  white-space:nowrap; pointer-events:none; user-select:none;
}
.cta-banner__inner { position:relative; z-index:1; max-width:660px; margin:0 auto; }
.cta-banner__title { font-size:clamp(40px,7vw,90px); font-weight:800; line-height:.93; margin-bottom:20px; }
.cta-banner__sub { font-size:16px; color:var(--muted); margin-bottom:44px; line-height:1.72; }
.cta-banner__actions { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
@media (max-width:768px) { .cta-banner { padding:80px 24px; } }

/* ═══════════════════════════════════════════════════════════
   SERVICES PAGE
═══════════════════════════════════════════════════════════ */
.srv-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; margin-bottom:100px; }
.srv-detail-grid:nth-child(even) { direction:rtl; }
.srv-detail-grid:nth-child(even) > * { direction:ltr; }
.srv-detail-grid:last-child { margin-bottom:0; }
.srv-detail__img { position:relative; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:3/2; }
.srv-detail__img img { width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease-out); }
.srv-detail__img:hover img { transform:scale(1.04); }
.srv-detail__img::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(135deg, transparent 55%, rgba(9,9,9,.5) 100%);
}
.srv-detail__num {
  position:absolute; bottom:20px; right:24px; z-index:2;
  font-family:var(--display); font-size:80px; font-weight:800;
  color:rgba(0,0,0,.07); line-height:1; pointer-events:none;
}
.srv-detail__includes { display:flex; flex-direction:column; gap:10px; margin:24px 0; }
.srv-detail__includes li {
  display:flex; align-items:center; gap:12px; font-size:14px; color:rgba(0,0,0,.65);
}
.srv-detail__includes li::before {
  content:''; width:18px; height:18px; border-radius:50%; flex-shrink:0;
  background:var(--green-dim); border:1px solid var(--green-border);
  display:flex; align-items:center; justify-content:center;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 6l3 3 5-5' stroke='%2341bb1f' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:center;
}
.srv-detail__price-tag {
  display:inline-flex; align-items:baseline; gap:6px;
  font-family:var(--display); font-size:56px; font-weight:800;
  color:var(--green); line-height:1; margin:20px 0 24px;
}
.srv-detail__price-tag sup { font-size:24px; font-weight:600; align-self:flex-start; margin-top:8px; }
.srv-detail__price-tag span { font-size:14px; font-weight:400; color:var(--muted); letter-spacing:.06em; text-transform:uppercase; }
@media (max-width:900px) {
  .srv-detail-grid { grid-template-columns:1fr; gap:40px; direction:ltr !important; }
  .srv-detail-grid:nth-child(even) { direction:ltr; }
}

/* FAQ */
.faq { border-top:1px solid var(--border); }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item__q {
  display:flex; justify-content:space-between; align-items:center;
  padding:24px 0; cursor:pointer; gap:20px;
  font-family:var(--display); font-size:20px; font-weight:600;
  letter-spacing:.04em; text-transform:uppercase; color:#111;
  transition:color var(--t-xs);
}
.faq-item__q:hover { color:var(--green); }
.faq-item__icon {
  width:28px; height:28px; border-radius:50%; flex-shrink:0;
  border:1.5px solid var(--green-border); display:flex; align-items:center; justify-content:center;
  color:var(--green); font-size:16px; line-height:1;
  transition:transform var(--t-sm) var(--ease-out), background var(--t-sm), border-color var(--t-sm);
}
.faq-item.open .faq-item__icon { transform:rotate(45deg); background:var(--green); border-color:var(--green); color:#000; }
.faq-item__a {
  overflow:hidden; max-height:0;
  transition:max-height var(--t-md) var(--ease-out), padding var(--t-md);
  font-size:15px; line-height:1.75; color:var(--muted);
}
.faq-item.open .faq-item__a { max-height:300px; padding-bottom:24px; }

/* ═══════════════════════════════════════════════════════════
   PRICING PAGE
═══════════════════════════════════════════════════════════ */
.price-tabs { display:flex; gap:8px; margin-bottom:52px; flex-wrap:wrap; }
.price-tab {
  font-family:var(--display); font-size:12px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase;
  padding:10px 22px; border-radius:var(--r-pill);
  border:1.5px solid var(--border); color:rgba(0,0,0,.52);
  cursor:pointer; transition:all var(--t-sm) var(--ease-out);
}
.price-tab:hover { border-color:rgba(0,0,0,.3); color:#111; }
.price-tab.active { background:var(--green); border-color:var(--green); color:#000; }

.price-panel { display:none; }
.price-panel.active { display:block; }

.price-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; }
.price-card {
  padding:32px 22px 28px; display:flex; flex-direction:column;
  border:1.5px solid rgba(0,0,0,.10);
  background:linear-gradient(160deg, rgba(0,0,0,.025), rgba(0,0,0,.008));
  border-radius:var(--r-md); cursor:pointer; position:relative;
  transition:all var(--t-md) var(--ease-out);
}
.price-card--pop { border-color:var(--green-border); background:linear-gradient(160deg, rgba(65,187,31,.1), rgba(65,187,31,.025)); }
.price-card--pop::before {
  content:'POPULAIR'; position:absolute; top:0; right:0;
  background:var(--green); color:#000;
  font-family:var(--display); font-size:9px; font-weight:800; letter-spacing:.2em;
  padding:5px 12px; border-radius:0 var(--r-md) 0 var(--r-md);
}
.price-card:hover {
  border-color:rgba(65,187,31,.45);
  background:linear-gradient(160deg, rgba(65,187,31,.09), rgba(65,187,31,.02));
  box-shadow:var(--sh-green), var(--sh-md); transform:translateY(-6px);
}
.price-card__tag { font-family:var(--display); font-size:10px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--green); margin-bottom:14px; }
.price-card__name { font-size:18px; font-weight:700; letter-spacing:.05em; flex-grow:1; margin-bottom:20px; }
.price-card__amt {
  font-family:var(--display); font-size:54px; font-weight:800;
  line-height:1; letter-spacing:-.02em; color:var(--green); margin-bottom:6px;
}
.price-card__amt sup { font-size:22px; font-weight:600; vertical-align:super; margin-right:1px; }
.price-card__note { font-size:12px; color:rgba(0,0,0,.42); margin-bottom:22px; }
.price-card__list { display:flex; flex-direction:column; gap:8px; margin-bottom:26px; flex-grow:1; }
.price-card__list li {
  font-size:13px; color:rgba(0,0,0,.6);
  display:flex; align-items:center; gap:9px;
}
.price-card__list li::before { content:''; width:5px; height:5px;
  background:var(--green); border-radius:50%; flex-shrink:0; }
.price-card__btn {
  font-family:var(--display); font-weight:700; font-size:11px;
  letter-spacing:.18em; text-transform:uppercase;
  padding:10px 18px; border-radius:var(--r-pill);
  border:1.5px solid rgba(0,0,0,.28); color:#111;
  text-align:center; display:block;
  position:relative; overflow:hidden; z-index:1;
  transition:color var(--t-xs) var(--ease-out), border-color var(--t-xs), box-shadow var(--t-md);
}
.price-card__btn::before {
  content:''; position:absolute; inset:0; background:#111;
  transform:scaleX(0); transform-origin:left;
  transition:transform var(--t-md) var(--ease-out); z-index:-1;
}
.price-card:hover .price-card__btn { color:#fff; border-color:#111; }
.price-card:hover .price-card__btn::before { transform:scaleX(1); }
.price-card--pop .price-card__btn { background:var(--green); border-color:var(--green); color:#000; }
@media (max-width:1100px) { .price-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px)  { .price-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:440px)  { .price-grid { grid-template-columns:1fr; } }

/* ═══════════════════════════════════════════════════════════
   GALLERY PAGE
═══════════════════════════════════════════════════════════ */
.gallery-masonry {
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
}
.gal-item {
  overflow:hidden; border-radius:var(--r-md); position:relative; cursor:pointer;
}
.gal-item:nth-child(3n+1) { grid-row:span 2; }
.gal-item img { width:100%; height:100%; object-fit:cover; min-height:220px;
  filter:brightness(.72) saturate(.8);
  transition:transform .7s var(--ease-out), filter .4s; }
.gal-item::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(9,9,9,.8) 0%, transparent 55%);
  opacity:0; transition:opacity var(--t-md);
}
.gal-item__overlay {
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  z-index:2; opacity:0; transition:opacity var(--t-md);
}
.gal-item__overlay span {
  width:50px; height:50px; border-radius:50%;
  background:rgba(65,187,31,.9); display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#000; font-weight:700;
  transform:scale(.7); transition:transform var(--t-md) var(--ease-snap);
}
.gal-item:hover img { transform:scale(1.07); filter:brightness(.95) saturate(1.15); }
.gal-item:hover::after { opacity:1; }
.gal-item:hover .gal-item__overlay { opacity:1; }
.gal-item:hover .gal-item__overlay span { transform:scale(1); }

/* Lightbox */
.lightbox {
  position:fixed; inset:0; z-index:9000; display:flex; align-items:center; justify-content:center;
  background:rgba(0,0,0,.95); backdrop-filter:blur(12px);
  opacity:0; pointer-events:none; transition:opacity var(--t-md);
}
.lightbox.open { opacity:1; pointer-events:all; }
.lightbox img { max-width:90vw; max-height:90vh; object-fit:contain; border-radius:var(--r-sm);
  transform:scale(.95); transition:transform var(--t-md) var(--ease-out); }
.lightbox.open img { transform:scale(1); }
.lightbox__close {
  position:absolute; top:24px; right:24px; width:44px; height:44px;
  border-radius:50%; background:rgba(255,255,255,.1); border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center; font-size:18px; color:#fff;
  cursor:pointer; transition:background var(--t-xs), color var(--t-xs);
}
.lightbox__close:hover { background:var(--green); color:#000; border-color:var(--green); }
@media (max-width:768px) {
  .gallery-masonry { grid-template-columns:1fr 1fr; }
  .gal-item:nth-child(3n+1) { grid-row:span 1; }
}

/* ═══════════════════════════════════════════════════════════
   ABOUT PAGE
═══════════════════════════════════════════════════════════ */
.process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.process-step { padding:36px 28px; position:relative; }
.process-step__n {
  font-family:var(--display); font-size:72px; font-weight:800;
  color:rgba(65,187,31,.07); line-height:1; margin-bottom:20px; display:block;
  transition:color var(--t-md);
}
.process-step:hover .process-step__n { color:rgba(65,187,31,.15); }
.process-step__icon {
  width:48px; height:48px; border-radius:var(--r-sm);
  background:var(--green-dim); border:1px solid var(--green-border);
  display:flex; align-items:center; justify-content:center; font-size:22px;
  margin-bottom:18px;
}
.process-step__title { font-size:22px; font-weight:700; letter-spacing:.04em; margin-bottom:10px; }
.process-step__desc { font-size:14px; line-height:1.72; color:var(--muted); }
@media (max-width:900px) { .process-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:500px) { .process-grid { grid-template-columns:1fr; } }

.brands-grid {
  display:flex; gap:28px; flex-wrap:wrap; align-items:center;
}
.brand-badge {
  font-family:var(--display); font-size:13px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  padding:10px 20px; border-radius:var(--r-sm);
  border:1px solid var(--border); color:rgba(0,0,0,.5);
  transition:border-color var(--t-sm), color var(--t-sm), background var(--t-sm);
}
.brand-badge:hover { border-color:var(--green-border); color:var(--green); background:var(--green-dim); }

/* ═══════════════════════════════════════════════════════════
   CONTACT PAGE
═══════════════════════════════════════════════════════════ */
.contact-grid { display:grid; grid-template-columns:1fr 1.3fr; gap:80px; }
.contact-info { display:flex; flex-direction:column; gap:32px; }
.contact-block {}
.contact-block__label {
  font-family:var(--display); font-size:10px; font-weight:700;
  letter-spacing:.26em; text-transform:uppercase; color:var(--green); margin-bottom:10px;
}
.contact-block__val { font-size:16px; line-height:1.65; color:rgba(0,0,0,.7); }
.contact-block__val a:hover { color:var(--green); }

.contact-wa {
  display:flex; align-items:center; gap:16px;
  background:#25D366; border-radius:var(--r-md); padding:20px 24px;
  transition:filter var(--t-sm), box-shadow var(--t-sm);
}
.contact-wa:hover { filter:brightness(1.08); box-shadow:0 8px 36px rgba(37,211,102,.4); }
.contact-wa svg { width:32px; height:32px; fill:#fff; flex-shrink:0; }
.contact-wa__text strong { display:block; font-family:var(--display); font-size:18px;
  font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; }
.contact-wa__text span { font-size:13px; color:rgba(255,255,255,.85); }

.form { display:flex; flex-direction:column; gap:18px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-group label {
  font-family:var(--display); font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:rgba(0,0,0,.6);
}
.form-group input, .form-group textarea, .form-group select {
  background:rgba(0,0,0,.04); border:1.5px solid var(--border);
  border-radius:var(--r-sm); padding:14px 18px;
  font-size:15px; color:#111; outline:none;
  transition:border-color var(--t-sm), background var(--t-sm), box-shadow var(--t-sm);
}
.form-group input:focus, .form-group textarea:focus, .form-group select:focus {
  border-color:var(--green-border); background:rgba(65,187,31,.04);
  box-shadow:0 0 0 3px rgba(65,187,31,.08);
}
.form-group input::placeholder, .form-group textarea::placeholder { color:rgba(0,0,0,.32); }
.form-req { color:#b5271f; }
.form-group textarea { resize:vertical; min-height:140px; }
.form-group select option { background:#f5f5f3; color:#111; }
.form__submit-wrap { display:flex; align-items:center; gap:16px; margin-top:6px; }
.form__status { font-size:14px; color:var(--green); display:none; }
.form__status--error { color:#c0392b; }
.form__status.show { display:block; }
@media (max-width:900px) { .contact-grid { grid-template-columns:1fr; gap:56px; } }
@media (max-width:500px) { .form-row { grid-template-columns:1fr; } }

/* ═══════════════════════════════════════════════════════════
   TE KOOP — Car listings
═══════════════════════════════════════════════════════════ */
.cars-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:28px;
}
@media (max-width:1000px) { .cars-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:680px) { .cars-grid { grid-template-columns:1fr; } }

.car-card { display:flex; flex-direction:column; cursor:pointer; }
.car-card__media {
  position:relative; aspect-ratio:4/3; overflow:hidden;
  border-radius:var(--r-sm); margin:14px 14px 0;
}
.car-card__media img {
  width:100%; height:100%; object-fit:cover;
  transition:transform var(--t-md) var(--ease-out);
}
.car-card:hover .car-card__media img { transform:scale(1.06); }
.car-card__status {
  position:absolute; top:12px; left:12px;
  font-family:var(--display); font-size:11px; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase;
  padding:6px 14px; border-radius:var(--r-pill);
  background:rgba(0,0,0,.72); color:#fff;
}
.car-card__status--sold { background:rgba(190,40,30,.88); }
.car-card__body { padding:22px 22px 24px; }
.car-card__title {
  font-size:22px; font-weight:700; letter-spacing:.03em; margin-bottom:10px;
}
.car-card__specs {
  list-style:none; display:flex; flex-wrap:wrap; gap:8px 14px;
  font-size:12.5px; color:var(--muted); margin-bottom:14px;
  font-family:var(--display); letter-spacing:.04em; text-transform:uppercase;
}
.car-card__specs li { display:flex; align-items:center; gap:8px; }
.car-card__specs li + li::before { content:'·'; margin-right:6px; color:var(--green-border); }
.car-card__desc {
  font-size:14px; line-height:1.7; color:rgba(0,0,0,.58);
  margin-bottom:18px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.car-card__footer {
  display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.car-card__price {
  font-family:var(--display); font-size:22px; font-weight:800; letter-spacing:.02em;
}
.car-card__price--onaanvraag { font-size:14px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; }
.car-card__btn {
  font-family:var(--display); font-size:12px; font-weight:700;
  letter-spacing:.1em; text-transform:uppercase; color:var(--green);
  background:none; border:1.5px solid var(--green); border-radius:var(--r-pill);
  padding:10px 20px; cursor:pointer; transition:all var(--t-sm) var(--ease-out);
}
.car-card__btn:hover { background:var(--green); color:#000; }

/* Empty state */
.cars-empty {
  text-align:center; padding:80px 24px; border-radius:var(--r-lg);
  background:var(--surface-hi); border:1px dashed var(--border-hi);
}
.cars-empty__icon { font-size:44px; margin-bottom:18px; opacity:.5; }
.cars-empty__title {
  font-family:var(--display); font-size:26px; font-weight:700;
  letter-spacing:.04em; text-transform:uppercase; margin-bottom:12px;
}
.cars-empty__text { color:var(--muted); max-width:440px; margin:0 auto 28px; font-size:15px; line-height:1.7; }
.cars-loading { text-align:center; padding:80px 24px; color:var(--muted); font-family:var(--display); letter-spacing:.1em; text-transform:uppercase; font-size:13px; }

/* Car detail modal */
.car-modal {
  position:fixed; inset:0; z-index:300;
  background:rgba(0,0,0,.82);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
  opacity:0; pointer-events:none;
  transition:opacity var(--t-md) var(--ease-out);
}
.car-modal.open { opacity:1; pointer-events:all; }
.car-modal__box {
  background:var(--surface-lo); border-radius:var(--r-lg);
  max-width:960px; width:100%; max-height:88vh; overflow-y:auto;
  display:grid; grid-template-columns:1.1fr 1fr; align-items:start; position:relative;
  transform:translateY(24px) scale(.98); transition:transform var(--t-md) var(--ease-out);
}
.car-modal.open .car-modal__box { transform:translateY(0) scale(1); }
.car-modal__close {
  position:absolute; top:16px; right:16px; z-index:2;
  width:38px; height:38px; border-radius:50%; border:none;
  background:rgba(0,0,0,.6); color:#fff; font-size:22px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.car-modal__gallery { position:sticky; top:0; align-self:start; background:#000; min-height:280px; height:min(60vh,420px); }
.car-modal__gallery img {
  width:100%; height:100%; object-fit:cover; position:absolute; inset:0;
  opacity:0; transition:opacity .3s;
}
.car-modal__gallery img.active { opacity:1; }
.car-modal__thumbs {
  position:absolute; bottom:14px; left:0; right:0;
  display:flex; gap:8px; justify-content:center; z-index:2;
}
.car-modal__thumbs button {
  width:9px; height:9px; border-radius:50%; border:none;
  background:rgba(255,255,255,.4); cursor:pointer; padding:0;
}
.car-modal__thumbs button.active { background:var(--green); }
.car-modal__nav {
  position:absolute; top:50%; transform:translateY(-50%); z-index:2;
  width:40px; height:40px; border-radius:50%; border:none;
  background:rgba(0,0,0,.5); color:#fff; font-size:24px; line-height:1;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background var(--t-xs);
}
.car-modal__nav:hover { background:rgba(0,0,0,.75); }
.car-modal__nav--prev { left:14px; }
.car-modal__nav--next { right:14px; }
.car-modal__info { padding:36px 34px; }
.car-modal__title { font-size:28px; font-weight:800; letter-spacing:.03em; margin-bottom:14px; }
.car-modal__specs {
  list-style:none; display:flex; flex-wrap:wrap; gap:10px 18px;
  font-size:13px; color:var(--muted); margin-bottom:20px;
  font-family:var(--display); letter-spacing:.05em; text-transform:uppercase;
}
.car-modal__specs li + li::before { content:'·'; margin-right:10px; color:var(--green-border); }
.car-modal__price { font-family:var(--display); font-size:30px; font-weight:800; margin-bottom:18px; }
.car-modal__desc { font-size:15px; line-height:1.8; color:rgba(0,0,0,.62); margin-bottom:28px; white-space:pre-line; }

/* Incl./excl. BTW price display (car card + modal) */
.car-card__price-vat {
  font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.05em;
  color:var(--muted); margin-left:4px;
}
.car-card__price-sub {
  display:block; font-family:var(--display); font-size:13px; font-weight:600;
  letter-spacing:.03em; color:var(--muted); margin-top:2px; text-transform:none;
}
@media (max-width:760px) {
  .car-modal__box { grid-template-columns:1fr; }
  .car-modal__gallery { position:relative; top:auto; height:220px; min-height:220px; }
}

/* ═══════════════════════════════════════════════════════════
   BEHEER — Admin panel
═══════════════════════════════════════════════════════════ */
.admin-shell { min-height:100dvh; padding:48px 24px 80px; }
.admin-topbar {
  max-width:920px; margin:0 auto 40px; display:flex; align-items:center;
  justify-content:space-between; gap:20px; flex-wrap:wrap;
}
.admin-topbar img { height:34px; }
.admin-topbar a { font-size:13px; color:var(--muted); }
.admin-topbar a:hover { color:var(--green); }
.admin-login {
  max-width:420px; margin:8vh auto 0; padding:44px 38px;
  border-radius:var(--r-lg);
}
.admin-login h1 {
  font-size:26px; font-weight:800; letter-spacing:.04em; margin-bottom:8px;
}
.admin-login p.admin-login__sub { color:var(--muted); font-size:14px; margin-bottom:30px; }
.admin-error {
  font-size:13px; color:#b5271f; background:rgba(190,40,30,.08);
  border:1px solid rgba(190,40,30,.25); border-radius:var(--r-sm);
  padding:12px 16px; margin-top:14px; display:none;
}
.admin-error.show { display:block; }
.admin-wrap { max-width:920px; margin:0 auto; display:flex; flex-direction:column; gap:36px; }
.admin-panel { padding:36px 34px; border-radius:var(--r-lg); }
.admin-panel h2 {
  font-size:22px; font-weight:700; letter-spacing:.04em; margin-bottom:24px;
}
.admin-list { display:flex; flex-direction:column; gap:14px; }
.admin-row {
  display:flex; align-items:center; gap:16px; padding:14px;
  border:1px solid var(--border); border-radius:var(--r-md); background:rgba(0,0,0,.02);
}
.admin-row__img {
  width:76px; height:56px; object-fit:cover; border-radius:var(--r-sm);
  flex-shrink:0; background:var(--surface-hi);
}
.admin-row__body { flex:1; min-width:0; }
.admin-row__title { font-weight:600; font-size:15px; }
.admin-row__meta { font-size:12.5px; color:var(--muted); margin-top:2px; }
.admin-row__actions { display:flex; gap:8px; flex-shrink:0; }
.admin-row__actions button {
  font-family:var(--display); font-size:11px; font-weight:700;
  letter-spacing:.08em; text-transform:uppercase;
  border-radius:var(--r-pill); padding:8px 16px; cursor:pointer;
  border:1.5px solid var(--border-hi); background:transparent; color:#111;
}
.admin-row__actions button:hover { border-color:var(--green); color:var(--green); }
.admin-row__actions button.danger:hover { border-color:#b5271f; color:#b5271f; }
.admin-empty { color:var(--muted); font-size:14px; padding:20px 0; text-align:center; }
.admin-form { display:flex; flex-direction:column; gap:18px; }
.admin-form__actions { display:flex; align-items:center; gap:14px; margin-top:8px; }
.admin-form__actions button[type="button"] {
  background:none; border:none; color:var(--muted); font-size:13px; cursor:pointer;
}
.admin-form__actions button[type="button"]:hover { color:#111; }

/* ═══════════════════════════════════════════════════════════
   REDUCED MOTION
═══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after {
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  body::after { animation:none; }
  .ticker__track { animation:none; }
}