:root{
  --bg0:#050608;
  --bg1:#0b0f16;
  --bg2:#0f1623;
  --glass:rgba(255,255,255,.06);
  --text:#f2f2f2;
  --muted:rgba(242,242,242,.74);
  --muted2:rgba(242,242,242,.55);
  --line:rgba(242,242,242,.12);

  /* Night-city gold accents */
  --accent:#f6c453;   /* warm gold */
  --accent2:#ff7a18;  /* amber/orange */
  --accent3:#22d3ee;  /* subtle neon cyan for micro-highlights */

  --radius:22px;
  --shadow:0 18px 55px rgba(0,0,0,.55);
  --shadow2:0 10px 25px rgba(0,0,0,.28);
  --max:1180px;
}


*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--text);

  /* Subtle night-city glow */
  background:
    radial-gradient(1100px 650px at 18% -10%, rgba(255,122,24,.18), transparent 60%),
    radial-gradient(900px 600px at 85% 0%, rgba(246,196,83,.18), transparent 55%),
    radial-gradient(900px 700px at 60% 120%, rgba(34,211,238,.10), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 50%, #050608);
  min-height:100vh;
  overflow-x:hidden;
}

a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.container{max-width:var(--max); margin:0 auto; padding:0 22px}

.kicker{letter-spacing:.12em; text-transform:uppercase; font-size:.78rem; color:var(--muted2)}
.h1{font-size:clamp(2.2rem, 3.8vw, 3.5rem); line-height:1.05; margin:.35rem 0 1rem}
.h2{font-size:clamp(1.6rem, 2.4vw, 2.2rem); margin:0 0 .6rem}
.p{color:var(--muted); line-height:1.7; margin:0}
.small{color:var(--muted2); font-size:.95rem; line-height:1.6}

.btn{
  display:inline-flex; gap:.6rem; align-items:center; justify-content:center;
  padding:.9rem 1.05rem;
  border-radius:999px;
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.04));
  box-shadow: var(--shadow2);
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
  cursor:pointer;
}
.btn:hover{transform:translateY(-1px); border-color:rgba(246,196,83,.42)}
.btn.primary{
  border-color:rgba(246,196,83,.62);
  background:linear-gradient(180deg, rgba(246,196,83,.26), rgba(255,122,24,.16));
}
.btn.ghost{background:transparent; box-shadow:none}
.badge{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.35rem .7rem;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.05);
  color:var(--muted);
  font-size:.85rem;
}

/* Topbar */
.topbar{
  position:sticky; top:0; z-index:50;
  backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(5,6,10,.72), rgba(5,6,10,.35));
  border-bottom:1px solid rgba(232,236,255,.08);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:14px 0}
.brand{display:flex; gap:.8rem; align-items:center}
.logo{
  width:38px; height:38px; border-radius:12px;
  background:
    radial-gradient(18px 18px at 30% 30%, rgba(246,196,83,.95), transparent 60%),
    radial-gradient(18px 18px at 75% 70%, rgba(255,122,24,.85), transparent 62%),
    radial-gradient(18px 18px at 60% 25%, rgba(34,211,238,.55), transparent 62%),
    rgba(255,255,255,.06);
  border:1px solid rgba(242,242,242,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.40);
}
.brand strong{font-weight:800; letter-spacing:.02em}
.brand span{display:block; font-size:.85rem; color:var(--muted2); margin-top:-2px}

.navlinks{display:flex; gap:16px; align-items:center}
.navlinks a{
  padding:.55rem .75rem;
  border-radius:999px;
  color:var(--muted);
  transition:background .18s ease, color .18s ease;
}
.navlinks a:hover{background:rgba(255,255,255,.06); color:var(--text)}
.navlinks a.active{background:rgba(246,196,83,.14); color:var(--text); border:1px solid rgba(246,196,83,.22)}
.nav-cta{display:flex; gap:10px; align-items:center}

.burger{
  display:none;
  width:44px; height:44px; border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
}
@media (max-width: 920px){
  .navlinks{display:none}
  .burger{display:inline-grid; place-items:center}
}

/* Drawer */
.drawer{position:fixed; inset:0; z-index:60; background:rgba(0,0,0,.55); backdrop-filter: blur(10px); display:none}
.drawer.open{display:block}
.drawer-panel{
  position:absolute; right:0; top:0; height:100%;
  width:min(420px, 92vw);
  padding:18px;
  background:linear-gradient(180deg, rgba(10,14,26,.98), rgba(7,9,14,.98));
  border-left:1px solid rgba(232,236,255,.10);
  box-shadow: var(--shadow);
}
.drawer-panel a{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 14px; border-radius:16px;
  border:1px solid rgba(232,236,255,.10);
  background:rgba(255,255,255,.04);
  margin:10px 0;
}

/* Sections */
.section{padding:84px 0}
.section.tight{padding:56px 0}

/* Hero night-city background */
.hero{position:relative; overflow:hidden}
.hero::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(900px 600px at 20% 25%, rgba(0,0,0,.25), rgba(0,0,0,.70)),
    linear-gradient(180deg, rgba(5,6,8,.65), rgba(5,6,8,.90)),
    url("img/hero-night-city.png");
  background-size:cover;
  background-position:center;
  opacity:.40;
  transform:scale(1.03);
  pointer-events:none;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(700px 420px at 80% 0%, rgba(246,196,83,.14), transparent 60%),
    radial-gradient(700px 420px at 15% 20%, rgba(255,122,24,.10), transparent 55%);
  pointer-events:none;
}
.hero > .container{position:relative; z-index:1}
.grid{display:grid; gap:18px}
.grid.two{grid-template-columns: 1.1fr .9fr}
.grid.three{grid-template-columns: repeat(3, 1fr)}
@media (max-width: 920px){
  .grid.two{grid-template-columns:1fr}
  .grid.three{grid-template-columns:1fr}
}

.card{
  border-radius:var(--radius);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(232,236,255,.10);
  box-shadow: var(--shadow2);
  overflow:hidden;
}
.card.pad{padding:20px}
hr.sep{border:none; border-top:1px solid rgba(232,236,255,.10); margin:16px 0}

/* Hero */
.hero{position:relative; padding:86px 0 34px}
.hero:before{
  content:"";
  position:absolute; inset:-60px -40px auto -40px;
  height:520px;
  background: radial-gradient(520px 240px at 20% 45%, rgba(125,211,252,.18), transparent 60%),
              radial-gradient(520px 240px at 75% 30%, rgba(167,139,250,.16), transparent 60%);
  pointer-events:none;
}
.hero-wrap{position:relative; display:grid; grid-template-columns: 1.15fr .85fr; gap:22px; align-items:stretch}
@media (max-width: 920px){ .hero-wrap{grid-template-columns:1fr} }

.hero-card{border-radius: calc(var(--radius) + 8px); background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); border:1px solid rgba(232,236,255,.12); box-shadow: var(--shadow)}
.hero-copy{padding:26px 24px 24px}
.hero-actions{display:flex; flex-wrap:wrap; gap:10px; margin-top:18px}

.hero-media{position:relative; min-height:360px; padding:0}
.hero-media img{width:100%; height:100%; object-fit:cover; filter:saturate(1.02) contrast(1.03); transform: scale(1.03)}
.hero-media:after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(800px 340px at 70% 20%, rgba(125,211,252,.18), transparent 60%),
              linear-gradient(180deg, rgba(5,6,10,.05), rgba(5,6,10,.72));
}
.hero-float{
  position:absolute; left:16px; bottom:16px;
  padding:14px 14px;
  border-radius:18px;
  border:1px solid rgba(232,236,255,.12);
  background: rgba(5,6,10,.45);
  backdrop-filter: blur(10px);
  max-width: 72%;
}
.hero-float strong{display:block}
.hero-float span{display:block; color:var(--muted); font-size:.9rem; margin-top:3px}

/* Feature */
.feature{padding:18px; border-radius:var(--radius); border:1px solid rgba(232,236,255,.10); background: rgba(255,255,255,.04)}
.feature h3{margin:0 0 6px; font-size:1.05rem}
.feature p{margin:0; color:var(--muted); line-height:1.65}

/* Models */
.toolbar{display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap}
.search{flex:1; min-width:220px; display:flex; gap:10px; align-items:center; border-radius:999px; border:1px solid rgba(232,236,255,.14); background: rgba(255,255,255,.04); padding:10px 12px}
.search input{width:100%; background:transparent; border:none; outline:none; color:var(--text); font-size:1rem}

.models{display:grid; grid-template-columns: repeat(4, 1fr); gap:16px}
@media (max-width: 1050px){ .models{grid-template-columns: repeat(3, 1fr)} }
@media (max-width: 760px){ .models{grid-template-columns: repeat(2, 1fr)} }
@media (max-width: 480px){ .models{grid-template-columns: 1fr} }

.model-card{
  border-radius:22px; overflow:hidden;
  border:1px solid rgba(232,236,255,.10);
  background: rgba(255,255,255,.04);
  box-shadow: var(--shadow2);
  transition: transform .18s ease, border-color .18s ease;
}
.model-card:hover{transform: translateY(-3px); border-color: rgba(125,211,252,.28)}
.model-card .thumb{aspect-ratio: 16/10; overflow:hidden; position:relative}
.model-card .thumb img{width:100%; height:100%; object-fit:cover; transform: scale(1.03)}
.model-card .thumb:after{content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.00), rgba(0,0,0,.55))}
.model-card .meta{padding:14px 14px 16px}
.model-card h3{margin:0 0 6px; font-size:1.05rem}
.model-card p{margin:0; color:var(--muted2); font-size:.92rem}

/* FAQ */
.faq-item{border-radius:22px; border:1px solid rgba(232,236,255,.12); background: rgba(255,255,255,.04); padding:16px}
.faq-q{display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer}
.faq-q strong{font-size:1.02rem}
.faq-a{max-height:0; overflow:hidden; transition:max-height .22s ease; color:var(--muted)}
.faq-item.open .faq-a{max-height:260px}
.faq-a p{margin:10px 0 0; line-height:1.7}

/* Footer */
.footer{padding:42px 0 60px; border-top:1px solid rgba(232,236,255,.10); background: linear-gradient(180deg, rgba(255,255,255,.00), rgba(255,255,255,.03))}
.footer-grid{display:grid; grid-template-columns: 1.2fr .8fr .8fr; gap:18px}
@media (max-width: 920px){ .footer-grid{grid-template-columns: 1fr} }
.footer a{color:var(--muted)}
.footer a:hover{color:var(--text)}
.copy{margin-top:18px; color:var(--muted2); font-size:.9rem}

/* Reveal */
.reveal{opacity:0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease}
.reveal.show{opacity:1; transform: translateY(0)}

/* --- FutureMotors Lightbox --- */
.fm-lightbox{
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  z-index: 9999;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(8px);
}
.fm-lightbox.is-open{ display:flex; }
.fm-lightbox__dialog{
  position: relative;
  width: min(1100px, 96vw);
  max-height: 90vh;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(12,16,24,.72);
  box-shadow: 0 30px 80px rgba(0,0,0,.55);
}
.fm-lightbox__img{
  width: 100%;
  height: auto;
  max-height: 90vh;
  display: block;
  object-fit: contain;
  background: rgba(0,0,0,.35);
}
.fm-lightbox__close{
  position:absolute;
  top: 10px;
  right: 10px;
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(0,0,0,.35);
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.fm-lightbox__caption{
  position:absolute;
  left: 12px;
  bottom: 12px;
  right: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.9);
  font-size: 14px;
}
@media (prefers-reduced-motion: no-preference){
  .fm-lightbox__dialog{ animation: fmLbIn .18s ease-out; }
  @keyframes fmLbIn { from{ transform: translateY(8px); opacity:.85 } to{ transform:none; opacity:1 } }
}

/* === Cookies Banner (FutureMotors) === */
.fm-cookie-banner{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 16px;
  z-index: 99999;
  display: flex;
  justify-content: center;
  pointer-events: none;
}

.fm-cookie-card{
  width: min(980px, 100%);
  pointer-events: auto;
  display: flex;
  gap: 16px;
  align-items: center;
  justify-content: space-between;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(10,14,22,.82);
  backdrop-filter: blur(10px);
  box-shadow: 0 26px 80px rgba(0,0,0,.55);
}

.fm-cookie-title{
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 4px;
}

.fm-cookie-desc{
  font-size: 13px;
  line-height: 1.45;
  opacity: .9;
  max-width: 650px;
}

.fm-cookie-link{
  display: inline-block;
  margin-top: 6px;
  font-size: 13px;
  opacity: .9;
  text-decoration: underline;
}

.fm-cookie-actions{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.fm-cookie-btn{
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  padding: 10px 14px;
  cursor: pointer;
  font-weight: 600;
}

.fm-cookie-btn.primary{
  background: rgba(255,255,255,.12);
}

.fm-cookie-btn.secondary{
  background: rgba(0,0,0,.35);
}

@media (max-width: 720px){
  .fm-cookie-card{
    flex-direction: column;
    align-items: flex-start;
  }
  .fm-cookie-actions{
    width: 100%;
    justify-content: flex-start;
  }
}

/* ===========================
   WOW SAFE PACK (FutureMotors)
   =========================== */

/* Scroll progress bar */
.fm-progress{
  position: fixed;
  top: 0;
  left: 0;
  height: 3px;
  width: 0%;
  z-index: 99998;
  background: linear-gradient(90deg, rgba(90,200,255,.9), rgba(255,255,255,.5));
  box-shadow: 0 10px 30px rgba(90,200,255,.25);
}

/* Reveal animations (safe) */
.fm-reveal{
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: no-preference){
  .fm-reveal{
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .55s ease, transform .55s ease;
    will-change: opacity, transform;
  }
  .fm-reveal.is-visible{
    opacity: 1;
    transform: none;
  }
}

/* Card shimmer on hover */
.fm-shimmer{
  position: relative;
  overflow: hidden;
}
.fm-shimmer::after{
  content:"";
  position:absolute;
  inset:-40%;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.10) 50%, transparent 70%);
  transform: translateX(-60%) rotate(6deg);
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events:none;
}
@media (prefers-reduced-motion: no-preference){
  .fm-shimmer:hover::after{
    opacity: 1;
    animation: fmShimmer 1.2s ease;
  }
  @keyframes fmShimmer{
    from{ transform: translateX(-60%) rotate(6deg); }
    to  { transform: translateX(60%) rotate(6deg); }
  }
}

/* Neon streaks layer (background) */
.fm-streaks{
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -1;
  opacity: .55;
  mix-blend-mode: screen;
}
@media (prefers-reduced-motion: reduce){
  .fm-streaks{ display:none; }
}

/* Ensure main content stays above streaks */
main, header, footer, .container, .site-header{
  position: relative;
  z-index: 1;
}

/* === FM PHONE VISIBILITY FIX === */
body{ position: relative; }
header, .header, .site-header, .topbar, .top-bar, .contact-bar, .phone-bar, .nav, .navbar{
  position: relative;
  z-index: 5;
}

/* Phones under email */
.contact-phones{
  margin-top: 6px;
  font-weight: 600;
  letter-spacing: .2px;
}
.contact-phones a{
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,.18);
}
.contact-phones a:hover{
  border-bottom-color: rgba(255,255,255,.45);
}

.contact-phones-label{
  margin-top: 10px;
  font-size: 13px;
  opacity: .9;
}

/* ===========================
   PREMIUM COSMOS (no-content-change)
   Visual upgrades via CSS-only overrides
   =========================== */

:root{
  --radius: 26px;
  --radius2: 32px;
  --shadow: 0 24px 90px rgba(0,0,0,.68);
  --shadow2: 0 16px 46px rgba(0,0,0,.46);
  --shadow3: 0 10px 24px rgba(0,0,0,.32);
  --goldGlow: rgba(246,196,83,.22);
  --amberGlow: rgba(255,122,24,.18);
  --cyanGlow: rgba(34,211,238,.14);
}

/* Cinematic vignette + subtle film grain */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(1200px 700px at 20% 0%, var(--amberGlow), transparent 60%),
    radial-gradient(900px 650px at 85% 10%, var(--goldGlow), transparent 60%),
    radial-gradient(900px 700px at 60% 120%, var(--cyanGlow), transparent 60%),
    radial-gradient(1200px 900px at 50% 50%, rgba(0,0,0,.00), rgba(0,0,0,.45));
  mix-blend-mode: screen;
  opacity:.9;
}
body::after{
  content:"";
  position:fixed;
  inset:-40px;
  pointer-events:none;
  z-index:0;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.02) 0, rgba(255,255,255,.02) 1px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 4px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0, rgba(255,255,255,.015) 1px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 6px);
  opacity:.08;
  filter: blur(.25px);
}

/* Ensure content sits above overlays */
.topbar, .section, .footer{ position:relative; z-index:1; }

/* Typography polish */
body{
  letter-spacing: .01em;
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.h1{
  letter-spacing: -.02em;
  text-shadow: 0 18px 50px rgba(0,0,0,.55);
}
.h2{ letter-spacing: -.015em; }

/* Premium topbar: deeper glass + edge highlight */
.topbar{
  background: linear-gradient(180deg, rgba(5,6,10,.78), rgba(5,6,10,.38));
  border-bottom: 1px solid rgba(246,196,83,.14);
}
.topbar::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-1px;
  height:1px;
  background: linear-gradient(90deg, transparent, rgba(246,196,83,.35), rgba(34,211,238,.18), transparent);
  opacity:.75;
}

/* Links: softer + more luxury */
.navlinks a{
  border: 1px solid transparent;
}
.navlinks a:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(246,196,83,.14);
}
.navlinks a.active{
  background: linear-gradient(180deg, rgba(246,196,83,.18), rgba(255,122,24,.10));
  border-color: rgba(246,196,83,.28);
}

/* Buttons: metallic gradient + glow + micro animation */
.btn{
  position:relative;
  isolation:isolate;
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  box-shadow: var(--shadow3);
}
.btn::before{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(246,196,83,.0), rgba(246,196,83,.35), rgba(34,211,238,.22), rgba(255,122,24,.28), rgba(246,196,83,.0));
  opacity:.0;
  filter: blur(10px);
  z-index:-1;
  transition: opacity .22s ease;
}
.btn:hover{
  transform: translateY(-2px);
  border-color: rgba(246,196,83,.38);
}
.btn:hover::before{ opacity:.75; }
.btn:active{ transform: translateY(0px) scale(.99); }
.btn.primary{
  border-color: rgba(246,196,83,.55);
  background:
    linear-gradient(180deg, rgba(246,196,83,.28), rgba(255,122,24,.14)),
    radial-gradient(900px 220px at 20% 0%, rgba(34,211,238,.12), transparent 60%);
  box-shadow: 0 18px 60px rgba(0,0,0,.50);
}

/* Cards: glass + shimmer border + deeper shadows */
.card, .feature, .faq-item, .model-card, .drawer-panel a, .search{
  backdrop-filter: blur(14px);
}
.card, .model-card, .faq-item, .feature{
  position:relative;
  border-radius: var(--radius2);
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(900px 260px at 20% 0%, rgba(246,196,83,.07), transparent 60%),
    radial-gradient(900px 260px at 80% 0%, rgba(34,211,238,.06), transparent 60%),
    rgba(255,255,255,.045);
  box-shadow: var(--shadow2);
}
.card::after, .model-card::after, .faq-item::after, .feature::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  pointer-events:none;
  background: linear-gradient(120deg, rgba(255,255,255,.10), rgba(255,255,255,0) 45%, rgba(246,196,83,.10) 70%, rgba(34,211,238,.08));
  opacity:.12;
  mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
  -webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
  padding: 1px;
  box-sizing:border-box;
}

/* Lift on hover (premium feel) */
.model-card, .card, .feature, .faq-item{
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease;
}
.model-card:hover, .card:hover, .feature:hover{
  transform: translateY(-4px);
  border-color: rgba(246,196,83,.22);
  box-shadow: 0 26px 90px rgba(0,0,0,.62);
}

/* Hero: more cinematic contrast + gold/cyan rim light */
.hero::before{ opacity:.46; }
.hero::after{
  background:
    radial-gradient(820px 460px at 82% 0%, rgba(246,196,83,.18), transparent 62%),
    radial-gradient(740px 440px at 16% 18%, rgba(34,211,238,.12), transparent 62%),
    radial-gradient(900px 520px at 50% 100%, rgba(255,122,24,.10), transparent 60%);
}
.hero-card{
  border-radius: calc(var(--radius2) + 6px);
  border: 1px solid rgba(246,196,83,.16);
  background:
    radial-gradient(1200px 420px at 25% 0%, rgba(246,196,83,.09), transparent 60%),
    radial-gradient(900px 320px at 85% 0%, rgba(34,211,238,.07), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
}
.hero-media img{
  filter: saturate(1.12) contrast(1.08);
}

/* Inputs: cleaner and more premium */
.search{
  border-color: rgba(246,196,83,.16);
  background: rgba(255,255,255,.045);
}
.search:focus-within{
  border-color: rgba(246,196,83,.32);
  box-shadow: 0 0 0 6px rgba(246,196,83,.08);
}

/* Footer: subtle gold fade */
.footer{
  background:
    radial-gradient(900px 320px at 25% 0%, rgba(246,196,83,.06), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.00), rgba(255,255,255,.03));
}

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .btn, .card, .model-card, .feature, .faq-item{ transition:none !important; }
  .reveal{ transition:none !important; }
}

/* ===========================
   ULTRA (cinematic + luxury)
   Still CSS-only (no content/HTML changes)
   =========================== */

html{ position:relative; }

/* Moving light streaks (wet asphalt / city reflections) */
html::before{
  content:"";
  position:fixed;
  inset:-30vh -20vw;
  pointer-events:none;
  z-index:0;
  background:
    linear-gradient(115deg,
      rgba(0,0,0,0) 0%,
      rgba(246,196,83,.10) 18%,
      rgba(0,0,0,0) 38%,
      rgba(34,211,238,.08) 52%,
      rgba(0,0,0,0) 70%,
      rgba(255,122,24,.09) 86%,
      rgba(0,0,0,0) 100%),
    radial-gradient(1200px 700px at 30% 30%, rgba(246,196,83,.08), transparent 60%),
    radial-gradient(900px 600px at 70% 55%, rgba(34,211,238,.06), transparent 62%);
  transform: rotate(-8deg);
  mix-blend-mode: screen;
  opacity:.55;
  filter: blur(0.4px);
  animation: ultraStreaks 10.5s ease-in-out infinite alternate;
}

/* Subtle drifting particles (premium “atmosphere”, not glitter) */
html::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
  background-image:
    radial-gradient(circle at 10% 20%, rgba(246,196,83,.22) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 70% 30%, rgba(34,211,238,.18) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 40% 80%, rgba(255,122,24,.18) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 90% 65%, rgba(255,255,255,.14) 0 1px, rgba(0,0,0,0) 2px);
  background-size: 380px 380px, 460px 460px, 520px 520px, 600px 600px;
  opacity:.14;
  filter: blur(.2px);
  animation: ultraParticles 18s linear infinite;
}

@keyframes ultraStreaks{
  0%{ transform: translate3d(-2%, -1%, 0) rotate(-8deg) scale(1.02); opacity:.46; }
  100%{ transform: translate3d(2%, 1.2%, 0) rotate(-8deg) scale(1.04); opacity:.62; }
}

@keyframes ultraParticles{
  0%{ transform: translate3d(0,0,0); }
  100%{ transform: translate3d(-160px, 90px, 0); }
}

/* “Luxury edge” highlights on key cards/sections */
.card, .model-card, .feature, .faq-item, .hero-card{
  position:relative;
}
.card::after, .model-card::after, .feature::after, .faq-item::after, .hero-card::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: inherit;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(0,0,0,0),
      rgba(246,196,83,.22),
      rgba(34,211,238,.14),
      rgba(0,0,0,0));
  opacity: .0;
  filter: blur(.35px);
  transform: translateZ(0);
  transition: opacity .28s ease, transform .28s ease;
  mix-blend-mode: screen;
}
.card:hover::after, .model-card:hover::after, .feature:hover::after, .faq-item:hover::after, .hero-card:hover::after{
  opacity: .55;
  transform: translateY(-1px);
}

/* Buttons: more “metal” and depth on hover */
.btn{
  box-shadow:
    0 18px 48px rgba(0,0,0,.55),
    0 0 0 1px rgba(246,196,83,.12) inset;
}
.btn:hover{
  box-shadow:
    0 26px 70px rgba(0,0,0,.62),
    0 0 0 1px rgba(246,196,83,.22) inset,
    0 0 60px rgba(246,196,83,.18);
}

/* Motion safety (extend): disable ULTRA animations */
@media (prefers-reduced-motion: reduce){
  html::before, html::after{ animation:none !important; }
}



/* =========================================================
   ULTRA+ (cinematic showroom) — CSS-only, no content changes
   ========================================================= */

/* Stronger cinematic atmosphere + moving city light streaks */
body::before{
  /* keep existing glows but add moving streak layers */
  background:
    radial-gradient(1200px 700px at 20% 0%, rgba(255,122,24,.14), transparent 60%),
    radial-gradient(950px 700px at 85% 10%, rgba(246,196,83,.16), transparent 60%),
    radial-gradient(900px 750px at 60% 120%, rgba(34,211,238,.10), transparent 60%),

    /* light streaks */
    linear-gradient(115deg, rgba(246,196,83,.10) 0%, rgba(246,196,83,0) 35%, rgba(34,211,238,.08) 55%, rgba(34,211,238,0) 75%),
    linear-gradient(25deg, rgba(255,122,24,.10) 0%, rgba(255,122,24,0) 38%, rgba(246,196,83,.06) 62%, rgba(246,196,83,0) 82%),

    /* vignette */
    radial-gradient(1400px 900px at 50% 40%, rgba(0,0,0,0) 35%, rgba(0,0,0,.55) 75%);
  background-size:
    auto,
    auto,
    auto,
    220% 220%,
    240% 240%,
    auto;
  background-position:
    0 0,
    0 0,
    0 0,
    0% 20%,
    100% 60%,
    0 0;
  animation: fmCityStreaks 14s ease-in-out infinite;
  opacity:.95;
}

/* Premium “micro-grain” + luxury grid (subtle) */
body::after{
  background-image:
    /* grid */
    repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0, rgba(255,255,255,.025) 1px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 5px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0, rgba(255,255,255,.02) 1px, rgba(0,0,0,0) 2px, rgba(0,0,0,0) 7px),

    /* grain-ish speckle */
    radial-gradient(circle at 10% 20%, rgba(255,255,255,.06) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 70% 40%, rgba(255,255,255,.05) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 30% 80%, rgba(255,255,255,.05) 0 1px, rgba(0,0,0,0) 2px),
    radial-gradient(circle at 85% 75%, rgba(255,255,255,.045) 0 1px, rgba(0,0,0,0) 2px);
  background-size:
    auto,
    auto,
    240px 240px,
    260px 260px,
    280px 280px,
    300px 300px;
  background-position:
    0 0,
    0 0,
    0 0,
    40px 80px,
    120px 40px,
    200px 140px;
  opacity:.10;
  animation: fmGrainDrift 22s linear infinite;
}

@keyframes fmCityStreaks{
  0%   { background-position: 0 0, 0 0, 0 0,   0% 20%, 100% 60%, 0 0; filter:saturate(1.05) contrast(1.05); }
  50%  { background-position: 0 0, 0 0, 0 0, 100% 60%,  0% 30%, 0 0; filter:saturate(1.12) contrast(1.08); }
  100% { background-position: 0 0, 0 0, 0 0,   0% 20%, 100% 60%, 0 0; filter:saturate(1.05) contrast(1.05); }
}
@keyframes fmGrainDrift{
  0%{ transform: translate3d(0,0,0); }
  100%{ transform: translate3d(-18px, 12px, 0); }
}

/* Hero: dynamic rim-light sweep (automotive showroom vibe) */
.hero{
  isolation:isolate;
}
.hero::after{
  mix-blend-mode: screen;
  opacity:.95;
  background:
    radial-gradient(900px 420px at 85% 10%, rgba(246,196,83,.22), transparent 62%),
    radial-gradient(820px 420px at 10% 25%, rgba(34,211,238,.14), transparent 60%),
    radial-gradient(700px 360px at 60% 10%, rgba(255,122,24,.14), transparent 60%),
    linear-gradient(115deg, rgba(246,196,83,0) 10%, rgba(246,196,83,.16) 40%, rgba(34,211,238,.10) 55%, rgba(246,196,83,0) 80%),
    linear-gradient(180deg, rgba(0,0,0,.30), rgba(0,0,0,.70));
  background-size: auto, auto, auto, 220% 220%, auto;
  background-position: 0 0, 0 0, 0 0, -20% 40%, 0 0;
  animation: fmHeroRim 9.5s ease-in-out infinite;
}
@keyframes fmHeroRim{
  0%   { background-position: 0 0, 0 0, 0 0, -30% 45%, 0 0; }
  50%  { background-position: 0 0, 0 0, 0 0, 130% 55%, 0 0; }
  100% { background-position: 0 0, 0 0, 0 0, -30% 45%, 0 0; }
}

/* Cards: ultra-premium edge + subtle moving sheen on hover */
.card, .model-card, .feature, .faq-item{
  position:relative;
}
.card::after, .model-card::after, .feature::after, .faq-item::after{
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(135deg, rgba(246,196,83,.22), rgba(34,211,238,.12), rgba(255,122,24,.16));
  opacity:.0;
  filter: blur(18px);
  transition: opacity .35s ease;
}
.card:hover::after, .model-card:hover::after, .feature:hover::after, .faq-item:hover::after{
  opacity:.22;
}
.card::before, .model-card::before, .feature::before, .faq-item::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(115deg, rgba(246,196,83,.55), rgba(34,211,238,.32), rgba(255,122,24,.45));
  opacity:.18;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  padding:1px;
}

/* Buttons: “metallic” highlight + crisp glow */
.btn, button, input[type="submit"]{
  position:relative;
  overflow:hidden;
}
.btn::after, button::after, input[type="submit"]::after{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background: linear-gradient(115deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.18) 48%, rgba(255,255,255,0) 62%);
  transform: translateX(-40%) rotate(10deg);
  opacity:.0;
  pointer-events:none;
}
.btn:hover::after, button:hover::after, input[type="submit"]:hover::after{
  opacity:.85;
  animation: fmBtnSheen 1.05s ease;
}
@keyframes fmBtnSheen{
  from{ transform: translateX(-55%) rotate(10deg); }
  to  { transform: translateX(55%) rotate(10deg); }
}

/* Reduce motion support */
@media (prefers-reduced-motion: reduce){
  body::before, body::after, .hero::after, .btn:hover::after, button:hover::after, input[type="submit"]:hover::after{
    animation: none !important;
  }
}


/* =========================================================
   ULTRA+++ DARKER (black-luxury showroom)
   CSS-only overrides (no content/HTML changes)
   ========================================================= */

:root{
  --bg0:#020205;
  --bg1:#06070b;
  --bg2:#0a0c12;

  /* champagne gold + subtle copper, neon only as micro-accent */
  --accent:#d8b15a;
  --accent2:#c77a2a;
  --accent3:#21c7e6;

  --goldGlow: rgba(216,177,90,.20);
  --amberGlow: rgba(199,122,42,.14);
  --cyanGlow: rgba(33,199,230,.10);
}

/* Darker base + richer contrast */
body{
  background:
    radial-gradient(1100px 650px at 18% -10%, rgba(199,122,42,.12), transparent 62%),
    radial-gradient(900px 600px at 85% 0%, rgba(216,177,90,.12), transparent 58%),
    radial-gradient(900px 700px at 60% 120%, rgba(33,199,230,.06), transparent 58%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 55%, #020205);
}

/* Keep the cinematic overlays but make them darker & more “expensive” */
body::before{ opacity:.78; }
body::after{ opacity:.075; }
html::before{ opacity:.42; filter: blur(.55px) saturate(0.95) contrast(1.08); }
html::after{ opacity:.11; }

/* Premium “black glass” surfaces */
.card, .model-card, .faq-item, .feature, .hero-card, .drawer-panel, .fm-cookie-card, .fm-lightbox__dialog{
  background:
    radial-gradient(1200px 420px at 20% 0%, rgba(216,177,90,.06), transparent 62%),
    radial-gradient(900px 320px at 85% 0%, rgba(33,199,230,.04), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028));
  border-color: rgba(216,177,90,.14);
}

/* Borders: more gold, less neon */
.card::before, .model-card::before, .feature::before, .faq-item::before{
  opacity:.22;
  background: linear-gradient(115deg, rgba(216,177,90,.65), rgba(33,199,230,.24), rgba(199,122,42,.55));
}

/* Hover glow: tighter and more premium */
.card:hover, .model-card:hover, .feature:hover, .faq-item:hover{
  border-color: rgba(216,177,90,.24);
  box-shadow: 0 30px 110px rgba(0,0,0,.72);
}

/* Buttons: “black gold” metal */
.btn.primary{
  border-color: rgba(216,177,90,.62);
  background:
    linear-gradient(180deg, rgba(216,177,90,.30), rgba(199,122,42,.16)),
    radial-gradient(900px 220px at 20% 0%, rgba(33,199,230,.08), transparent 62%);
}
.btn:hover{
  border-color: rgba(216,177,90,.44);
  box-shadow:
    0 28px 78px rgba(0,0,0,.70),
    0 0 0 1px rgba(216,177,90,.26) inset,
    0 0 70px rgba(216,177,90,.16);
}

/* Topbar: darker + sharper gold edge */
.topbar{
  background: linear-gradient(180deg, rgba(2,2,5,.82), rgba(2,2,5,.42));
  border-bottom: 1px solid rgba(216,177,90,.16);
}
.topbar::after{
  background: linear-gradient(90deg, transparent, rgba(216,177,90,.42), rgba(33,199,230,.12), transparent);
  opacity:.85;
}

/* Hero: more “studio” (deeper blacks, gold rim) */
.hero::before{ opacity:.52; }
.hero::after{
  opacity:.92;
  background:
    radial-gradient(920px 460px at 82% 0%, rgba(216,177,90,.22), transparent 62%),
    radial-gradient(820px 420px at 12% 20%, rgba(33,199,230,.10), transparent 62%),
    radial-gradient(900px 520px at 50% 105%, rgba(199,122,42,.10), transparent 62%),
    linear-gradient(115deg, rgba(216,177,90,0) 10%, rgba(216,177,90,.14) 40%, rgba(33,199,230,.08) 55%, rgba(216,177,90,0) 80%),
    linear-gradient(180deg, rgba(0,0,0,.38), rgba(0,0,0,.78));
}

/* === Ultra+++ streak elements (generated by streaks.js / wow-safe.js) === */
.fm-streak{
  position:absolute;
  width: 180vw;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(216,177,90,.55), rgba(33,199,230,.18), rgba(199,122,42,.35), transparent);
  filter: blur(8px);
  opacity: .55;
  animation: fmStreakMove 10.5s linear infinite;
}
.fm-streak.s2{ height: 10px; opacity:.48; filter: blur(9px); animation-duration: 12.5s; }
.fm-streak.s3{ height: 14px; opacity:.36; filter: blur(10px); animation-duration: 14.5s; }
.fm-streak.s4{ height: 9px;  opacity:.42; filter: blur(9px);  animation-duration: 11.8s; }
@keyframes fmStreakMove{
  0%{ transform: translate3d(-70vw,0,0) rotate(var(--rot, -10deg)); }
  100%{ transform: translate3d(120vw,0,0) rotate(var(--rot, -10deg)); }
}

/* Make streak wrapper truly “behind everything” */
.fm-streaks{ z-index:-2; opacity:.55; mix-blend-mode: screen; }

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .fm-streak{ animation:none !important; }
}

/* =========================================================
   ULTRA++++++ PRO FIX
   - remove hard cutoff in hero background
   - make hero backdrop cinematic + seamless
   (CSS-only; no HTML/content changes)
   ========================================================= */

/* Disable the legacy hero accent layer (can create visible edges on wide screens) */
.hero:before{ display:none !important; }

/* Force a seamless hero backdrop (no image hard-edges) */
.hero::before{
  /* override any earlier background-image stacks */
  background:
    radial-gradient(1200px 720px at 18% 40%, rgba(212,175,55,.26), transparent 62%),
    radial-gradient(980px 620px at 78% 18%, rgba(241,226,183,.12), transparent 64%),
    radial-gradient(1100px 820px at 50% 120%, rgba(0,0,0,.82), transparent 62%),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.78))
    !important;
  opacity: .98 !important;
  transform: none !important;
}

/* Add a soft “spotlight” + bokeh glow without any straight edges */
.hero::after{
  background:
    radial-gradient(720px 420px at 55% 18%, rgba(212,175,55,.18), transparent 62%),
    radial-gradient(620px 360px at 65% 30%, rgba(241,226,183,.10), transparent 60%),
    radial-gradient(920px 520px at 40% 0%, rgba(212,175,55,.10), transparent 64%)
    !important;
  opacity: .85 !important;
}

/* Tighten hero card rendering (more “showroom”, less haze) */
.hero-card{
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-color: rgba(212,175,55,.16) !important;
}

/* If streaks exist, prevent any accidental “block” artifacts */
.fm-streaks{ overflow:hidden !important; }
.fm-streak{ will-change: transform; }

/* =========================================================
   ULTRA+++++ FULL GOLD & BLACK (Maybach vibes)
   CSS-only overrides (no content/HTML changes)
   ========================================================= */

:root{
  /* deeper blacks */
  --bg0:#010102;
  --bg1:#040406;
  --bg2:#09090d;

  /* classic gold / champagne */
  --accent:#d4af37;   /* Maybach gold */
  --accent2:#b8892a;  /* deeper antique gold */
  --accent3:#f1e2b7;  /* champagne highlight (no neon) */

  --goldGlow: rgba(212,175,55,.22);
  --amberGlow: rgba(184,137,42,.16);
  --cyanGlow: rgba(0,0,0,0);
}

/* Dark luxury base (gold only) */
body{
  background:
    radial-gradient(1200px 700px at 18% -10%, rgba(184,137,42,.12), transparent 62%),
    radial-gradient(980px 650px at 85% 0%, rgba(212,175,55,.14), transparent 60%),
    radial-gradient(900px 700px at 55% 120%, rgba(212,175,55,.08), transparent 62%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 55%, #010102);
}

/* Less “tech”, more “coachbuilt” */
.kicker{ color: rgba(241,226,183,.70); }
.small{ color: rgba(241,226,183,.68); }
.p{ color: rgba(242,242,242,.78); }

/* Brand mark: gold-only */
.logo{
  background:
    radial-gradient(18px 18px at 30% 30%, rgba(212,175,55,.98), transparent 62%),
    radial-gradient(18px 18px at 75% 70%, rgba(184,137,42,.88), transparent 64%),
    radial-gradient(18px 18px at 60% 25%, rgba(241,226,183,.55), transparent 66%),
    rgba(255,255,255,.04);
  border-color: rgba(212,175,55,.18);
}

/* Topbar: gold hairline */
.topbar{
  border-bottom: 1px solid rgba(212,175,55,.14);
}

/* Buttons: black-gold enamel */
.btn{ border-color: rgba(212,175,55,.18); }
.btn:hover{ border-color: rgba(212,175,55,.42); }
.btn.primary{
  border-color: rgba(212,175,55,.55);
  background:
    radial-gradient(120% 160% at 30% 10%, rgba(241,226,183,.18), transparent 55%),
    linear-gradient(180deg, rgba(212,175,55,.26), rgba(184,137,42,.14));
}

/* Premium black glass (gold lighting only) */
.card, .model-card, .faq-item, .feature, .hero-card, .drawer-panel, .fm-cookie-card, .fm-lightbox__dialog{
  background:
    radial-gradient(1200px 420px at 20% 0%, rgba(212,175,55,.07), transparent 64%),
    radial-gradient(900px 320px at 85% 0%, rgba(184,137,42,.05), transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.022));
  border-color: rgba(212,175,55,.15);
}

/* Hero: studio rim-light sweep in gold */
.hero:before{
  background:
    radial-gradient(620px 280px at 18% 45%, rgba(212,175,55,.16), transparent 62%),
    radial-gradient(520px 260px at 76% 26%, rgba(184,137,42,.12), transparent 62%);
}
.hero::after{
  background:
    radial-gradient(720px 460px at 78% 0%, rgba(212,175,55,.16), transparent 62%),
    radial-gradient(700px 440px at 16% 18%, rgba(184,137,42,.10), transparent 60%);
}

/* Cards on hover: gold edge */
.model-card:hover,
.card:hover,
.faq-item:hover,
.feature:hover{
  border-color: rgba(212,175,55,.30) !important;
}

/* Light streaks: warm-gold reflections (no cyan) */
body::before{
  background:
    radial-gradient(1200px 700px at 50% -10%, rgba(212,175,55,.12), transparent 62%),
    radial-gradient(900px 650px at 80% 15%, rgba(184,137,42,.10), transparent 64%),
    radial-gradient(1000px 720px at 15% 25%, rgba(241,226,183,.08), transparent 66%);
}

/* Any leftover “tech” highlight -> gold */
.navlinks a.active{ background: rgba(212,175,55,.12); border-color: rgba(212,175,55,.22); }

/* Shine borders: pure gold */
.fm-shine-border::before{
  background: linear-gradient(115deg, rgba(212,175,55,.70), rgba(241,226,183,.22), rgba(184,137,42,.60));
}

/* Divider glow */
.fm-divider-glow{
  background: linear-gradient(90deg, transparent, rgba(212,175,55,.55), rgba(241,226,183,.16), transparent);
}


/* =========================================================
   ULTRA+++++ MAYBACH — MORE DRAMATIC (spotlight + vignette)
   (CSS-only overrides; no content/HTML changes)
   ========================================================= */
body::before{
  /* Deeper vignette + warmer gold atmosphere */
  background:
    radial-gradient(1500px 920px at 50% -10%, rgba(212,175,55,.22), transparent 62%),
    radial-gradient(1200px 760px at 18% 8%, rgba(212,175,55,.14), transparent 60%),
    radial-gradient(1200px 760px at 88% 10%, rgba(212,175,55,.12), transparent 62%),
    radial-gradient(1500px 1100px at 50% 50%, rgba(0,0,0,0), rgba(0,0,0,.72));
  mix-blend-mode: normal;
  opacity:1;
}

/* Hero: stronger spotlight + darker edges */
.hero::before{
  opacity:.58;
  filter: contrast(1.06) saturate(1.06);
}
.hero::after{
  background:
    radial-gradient(980px 560px at 42% 18%, rgba(212,175,55,.40), transparent 58%),
    radial-gradient(820px 520px at 72% 10%, rgba(212,175,55,.22), transparent 62%),
    radial-gradient(980px 620px at 18% 22%, rgba(255, 221, 150, .10), transparent 60%),
    radial-gradient(1200px 800px at 50% 120%, rgba(0,0,0,.58), transparent 70%);
  mix-blend-mode: screen;
  opacity:1;
  animation: spotlightPulse 10s ease-in-out infinite;
}

@keyframes spotlightPulse{
  0%,100%{ transform: translate3d(0,0,0) scale(1); filter: brightness(1); }
  50%{ transform: translate3d(0,-2px,0) scale(1.015); filter: brightness(1.06); }
}

@media (prefers-reduced-motion: reduce){
  .hero::after{ animation:none; }
}



/* ==========================================================
   ULTRA+++++ "Pro polish" — gold & black, Maybach vibes
   (CSS-only overrides; no content/HTML changes)
   ========================================================== */

:root{
  /* tighter, more luxurious gold scale */
  --accent:#d4af37;
  --accent2:#b8892a;
  --accent3:#f1e2b7; /* champagne */
  --goldGlow: rgba(212,175,55,.22);
  --goldGlow2: rgba(241,226,183,.14);
}

/* Typography + rendering */
html{ text-size-adjust:100%; }
body{
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Headings: gold-foil text treatment */
.h1, .h2{
  letter-spacing: -0.02em;
}
.h1{
  color: transparent;
  background:
    linear-gradient(90deg,
      rgba(241,226,183,.95) 0%,
      rgba(212,175,55,1) 22%,
      rgba(184,137,42,1) 50%,
      rgba(212,175,55,1) 78%,
      rgba(241,226,183,.92) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  text-shadow: 0 12px 30px rgba(0,0,0,.55);
  position: relative;
}
.h1::after{
  content:"";
  position:absolute; inset:-10px -14px;
  background:
    radial-gradient(420px 120px at 20% 35%, rgba(241,226,183,.10), transparent 62%),
    radial-gradient(360px 120px at 85% 55%, rgba(212,175,55,.12), transparent 62%);
  filter: blur(1px);
  pointer-events:none;
}
.h2{
  color: rgba(242,242,242,.92);
}

/* Links: subtle luxury underline */
a{
  text-decoration-thickness: .08em;
  text-underline-offset: .22em;
  text-decoration-color: rgba(212,175,55,.35);
}
a:hover{
  text-decoration-color: rgba(212,175,55,.72);
}

/* Sections: elegant divider shimmer (very subtle) */
.section{
  position: relative;
}
.section::before{
  content:"";
  position:absolute; left:0; right:0; top:-1px; height:1px;
  background: linear-gradient(90deg, transparent, rgba(212,175,55,.22), transparent);
  opacity: .9;
  pointer-events:none;
}

/* Cards: deeper "black glass" + premium edge */
.card, .panel, .box{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border-color: rgba(212,175,55,.12);
  box-shadow:
    0 22px 70px rgba(0,0,0,.62),
    0 1px 0 rgba(241,226,183,.10) inset;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.card:hover, .panel:hover, .box:hover{
  border-color: rgba(212,175,55,.24);
  box-shadow:
    0 30px 90px rgba(0,0,0,.66),
    0 1px 0 rgba(241,226,183,.12) inset,
    0 0 0 1px rgba(212,175,55,.10);
  transform: translate3d(0,-2px,0);
}

/* Buttons: enamel black + gold edge + sheen */
.btn{
  border-color: rgba(212,175,55,.18);
  box-shadow:
    0 16px 45px rgba(0,0,0,.55),
    0 1px 0 rgba(241,226,183,.10) inset;
  position: relative;
  overflow: hidden;
}
.btn::after{
  content:"";
  position:absolute; inset:-40% -30%;
  background: linear-gradient(110deg, transparent 35%, rgba(241,226,183,.20) 50%, transparent 65%);
  transform: translateX(-40%) rotate(-8deg);
  opacity: 0;
  pointer-events:none;
}
.btn:hover::after{
  opacity:.95;
  transform: translateX(40%) rotate(-8deg);
  transition: transform .85s ease, opacity .25s ease;
}
.btn.primary{
  background:
    linear-gradient(180deg, rgba(20,18,16,.92), rgba(8,8,10,.92)),
    radial-gradient(120% 160% at 20% 0%, rgba(241,226,183,.10), transparent 55%);
  border-color: rgba(212,175,55,.30);
}
.btn.primary:hover{
  box-shadow:
    0 22px 70px rgba(0,0,0,.62),
    0 0 0 1px rgba(212,175,55,.14),
    0 1px 0 rgba(241,226,183,.12) inset;
}

/* Form fields: showroom focus */
input, textarea, select{
  background: rgba(10,12,16,.66) !important;
  border-color: rgba(242,242,242,.16) !important;
}
input:focus, textarea:focus, select:focus{
  outline: none;
  border-color: rgba(212,175,55,.42) !important;
  box-shadow:
    0 0 0 4px rgba(212,175,55,.14),
    0 16px 50px rgba(0,0,0,.55);
}

/* Focus-visible: accessibility but premium */
:focus-visible{
  outline: 2px solid rgba(241,226,183,.55);
  outline-offset: 3px;
  border-radius: 10px;
}

/* Hero: stronger spotlight + richer vignette */
.hero{
  position: relative;
}
.hero::after{
  background:
    radial-gradient(920px 520px at 48% 16%, rgba(212,175,55,.50), transparent 58%),
    radial-gradient(760px 480px at 74% 10%, rgba(241,226,183,.18), transparent 62%),
    radial-gradient(1200px 820px at 50% 120%, rgba(0,0,0,.70), transparent 70%);
  mix-blend-mode: screen;
}
body::before{
  content:"";
  position: fixed; inset:0;
  background:
    radial-gradient(1400px 900px at 50% 0%, rgba(0,0,0,0), rgba(0,0,0,.82));
  pointer-events:none;
  z-index: 0;
}

/* Reduce motion safety */
@media (prefers-reduced-motion: reduce){
  .btn::after{ transition:none; }
  .card:hover, .panel:hover, .box:hover{ transform:none; }
}


/* ===========================
   ULTRA+++++ MAYBACH — PRO++ (no HTML changes)
   Deeper black luxury, gold-foil highlights, brushed-metal microtexture,
   cinematic leaks + vignette. Safe overrides appended at end.
   =========================== */

:root{
  /* Maybach gold refinement */
  --accent:#d4af37;      /* Maybach gold */
  --accent2:#f7d27b;     /* champagne */
  --accent3:#b98a2b;     /* antique gold */
  --gold-foil-1:#fff3c4;
  --gold-foil-2:#f2d07b;
  --gold-foil-3:#b9872b;
  --ink:#050506;
  --deep:#020204;
}

/* Film-grain via SVG turbulence (subtle, premium) */
html::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='600' height='600' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  background-size: 520px 520px;
  opacity:.055;
  mix-blend-mode: overlay;
  z-index:0;
}

/* Deeper vignette + edge falloff */
body::before{
  background:
    radial-gradient(1500px 1000px at 50% 0%, rgba(0,0,0,0), rgba(0,0,0,.92)),
    radial-gradient(900px 700px at 50% 110%, rgba(0,0,0,0), rgba(0,0,0,.92)),
    radial-gradient(900px 700px at 0% 40%, rgba(0,0,0,0), rgba(0,0,0,.90)),
    radial-gradient(900px 700px at 100% 40%, rgba(0,0,0,0), rgba(0,0,0,.90));
}

/* More realistic "city leaks" (gold only), ultra slow */
body::after{
  background:
    radial-gradient(900px 520px at 12% 14%, rgba(212,175,55,.18), transparent 62%),
    radial-gradient(780px 520px at 88% 10%, rgba(247,210,123,.12), transparent 65%),
    radial-gradient(860px 520px at 70% 92%, rgba(185,135,43,.10), transparent 66%),
    linear-gradient(135deg, rgba(212,175,55,.05), rgba(0,0,0,0) 40%, rgba(247,210,123,.04));
  opacity:.40;
  animation: goldLeads 16s ease-in-out infinite alternate;
  mix-blend-mode: screen;
}
@keyframes goldLeads{
  from{ transform: translate3d(0,0,0) scale(1); filter: blur(0px); }
  to{ transform: translate3d(0,-10px,0) scale(1.02); filter: blur(.2px); }
}

/* HERO — more dramatic showroom spotlight + rim */
.hero::before{
  opacity:.58;
  filter: saturate(1.05) contrast(1.08);
}
.hero::after{
  background:
    radial-gradient(1000px 520px at 50% 12%, rgba(212,175,55,.20), transparent 58%),
    radial-gradient(840px 520px at 18% 22%, rgba(247,210,123,.10), transparent 60%),
    radial-gradient(840px 520px at 86% 24%, rgba(185,135,43,.10), transparent 62%),
    radial-gradient(1200px 900px at 50% 50%, rgba(0,0,0,.35), rgba(0,0,0,.72));
}

/* Gold-foil headings (if headings already exist, this enhances them) */
h1,h2,h3,.title,.section-title{
  background-image: linear-gradient(180deg, var(--gold-foil-1), var(--gold-foil-2) 55%, var(--gold-foil-3));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
  text-shadow:
    0 10px 34px rgba(0,0,0,.55),
    0 1px 0 rgba(255,255,255,.08);
}

/* Cards / panels — black glass + brushed-metal microtexture */
.card,.panel,.box,.pricing-card,.feature,.faq-item{
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.020));
  border: 1px solid rgba(212,175,55,.18);
  box-shadow:
    0 18px 60px rgba(0,0,0,.62),
    0 2px 0 rgba(255,255,255,.06) inset;
  position:relative;
}
.card::before,.panel::before,.box::before,.pricing-card::before,.feature::before,.faq-item::before{
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  background:
    /* brushed-metal lines */
    repeating-linear-gradient(-25deg, rgba(255,255,255,.050) 0 1px, rgba(0,0,0,0) 1px 6px),
    /* tiny specular dust */
    radial-gradient(1200px 420px at 40% 0%, rgba(255,243,196,.05), transparent 55%);
  opacity:.18;
  mix-blend-mode: overlay;
  pointer-events:none;
}
.card:hover,.panel:hover,.box:hover,.pricing-card:hover,.feature:hover,.faq-item:hover{
  transform: translateY(-3px);
  box-shadow:
    0 24px 74px rgba(0,0,0,.70),
    0 0 0 1px rgba(212,175,55,.22),
    0 2px 0 rgba(255,255,255,.06) inset;
}

/* Buttons — enamel black + gold edge with luxe sheen */
.btn, button, input[type="submit"], .button{
  border: 1px solid rgba(212,175,55,.35);
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 35%),
    radial-gradient(120% 220% at 50% -30%, rgba(247,210,123,.22), transparent 55%),
    linear-gradient(180deg, rgba(8,8,10,.92), rgba(2,2,4,.98));
  box-shadow:
    0 18px 44px rgba(0,0,0,.62),
    0 0 0 1px rgba(0,0,0,.40) inset;
  position:relative;
}
.btn::before, button::before, input[type="submit"]::before, .button::before{
  content:"";
  position:absolute; inset:-1px;
  border-radius: inherit;
  padding:1px;
  background: linear-gradient(135deg, rgba(255,243,196,.55), rgba(212,175,55,.22), rgba(185,135,43,.18));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
  opacity:.85;
}
.btn:hover, button:hover, input[type="submit"]:hover, .button:hover{
  filter: saturate(1.05) contrast(1.04);
  transform: translateY(-1px);
}
.btn:focus-visible, button:focus-visible, input[type="submit"]:focus-visible, .button:focus-visible,
a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(212,175,55,.22),
    0 0 0 1px rgba(212,175,55,.55),
    0 18px 44px rgba(0,0,0,.62);
}

/* Inputs — showroom clean */
input, textarea, select{
  background: rgba(4,4,6,.78);
  border: 1px solid rgba(212,175,55,.18);
  box-shadow: 0 10px 30px rgba(0,0,0,.55);
}
input:focus, textarea:focus, select:focus{
  border-color: rgba(212,175,55,.42);
  box-shadow:
    0 0 0 3px rgba(212,175,55,.18),
    0 12px 34px rgba(0,0,0,.62);
}

/* Reduce motion safety */
@media (prefers-reduced-motion: reduce){
  body::after{ animation:none; }
  .card:hover,.panel:hover,.box:hover,.pricing-card:hover,.feature:hover,.faq-item:hover{ transform:none; }
  .btn:hover, button:hover, input[type="submit"]:hover, .button:hover{ transform:none; }
}



/* =========================================================
   ULTRA+++++ PRO+++ (Maybach Gold & Black — Showroom Master)
   No content/HTML changes — CSS polish only.
   ========================================================= */

/* Full gold & black tuning */
:root{
  --bg0:#030304;
  --bg1:#06070a;
  --bg2:#0b0d12;

  --accent:#d4af37;   /* Maybach gold */
  --accent2:#f3d38a;  /* champagne */
  --accent3:#b8892b;  /* antique gold */
  --glass:rgba(10,10,12,.55);
  --glass2:rgba(255,255,255,.035);
  --line:rgba(255,255,255,.10);
  --line2:rgba(212,175,55,.18);

  --shadow:0 26px 90px rgba(0,0,0,.72);
  --shadow2:0 18px 50px rgba(0,0,0,.55);
}

/* Deep black base + cinematic vignette + subtle grain */
body{
  background:
    radial-gradient(1200px 680px at 50% -12%, rgba(212,175,55,.22), transparent 62%),
    radial-gradient(900px 520px at 20% 0%, rgba(243,211,138,.10), transparent 60%),
    radial-gradient(900px 720px at 85% 15%, rgba(184,137,43,.09), transparent 62%),
    linear-gradient(180deg, var(--bg0), var(--bg1) 45%, #020203);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  letter-spacing:.01em;
}

body::before{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background:
    radial-gradient(65% 55% at 50% 38%, rgba(0,0,0,0), rgba(0,0,0,.62) 62%, rgba(0,0,0,.86) 100%),
    radial-gradient(900px 700px at 50% 10%, rgba(0,0,0,.18), rgba(0,0,0,.68));
  mix-blend-mode:multiply;
  opacity:.92;
  z-index:0;
}

body::after{
  content:"";
  position:fixed; inset:0;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E");
  background-size:220px 220px;
  opacity:.10;
  mix-blend-mode:overlay;
  z-index:0;
}

/* Make sure page content stays above overlays */
body > *{ position:relative; z-index:1; }

/* Gold-foil headings (subtle, expensive) */
h1, h2, .section-title, .title{
  letter-spacing:.02em;
}
h1, .title{
  background:linear-gradient(180deg, #fff3d1 0%, var(--accent2) 18%, var(--accent) 55%, #9c7420 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  text-shadow:
    0 0 22px rgba(212,175,55,.12),
    0 12px 50px rgba(0,0,0,.45);
}
h2, .section-title{
  background:linear-gradient(180deg, #fff2c8 0%, var(--accent2) 35%, var(--accent) 85%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  text-shadow:0 0 18px rgba(212,175,55,.10);
}

/* Ultra showroom hero: stronger spotlight + rim sweep */
.hero{
  position:relative;
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(980px 520px at 50% 35%, rgba(212,175,55,.38), transparent 65%),
    radial-gradient(1200px 700px at 50% 12%, rgba(243,211,138,.22), transparent 70%),
    radial-gradient(900px 620px at 35% 120%, rgba(0,0,0,.72), rgba(0,0,0,0) 70%);
  opacity:.95;
  z-index:0;
}
.hero::after{
  content:"";
  position:absolute; inset:-40%;
  background:
    conic-gradient(from 220deg at 45% 40%,
      rgba(212,175,55,0) 0deg,
      rgba(212,175,55,.24) 18deg,
      rgba(243,211,138,.12) 28deg,
      rgba(212,175,55,0) 58deg,
      rgba(212,175,55,0) 360deg);
  filter:blur(18px);
  opacity:.55;
  mix-blend-mode:screen;
  animation:maybachSweep 9.5s ease-in-out infinite;
  z-index:0;
}
@keyframes maybachSweep{
  0%{ transform:translate3d(-6%, -2%, 0) rotate(-6deg); opacity:.35; }
  45%{ transform:translate3d(6%, 1%, 0) rotate(6deg); opacity:.62; }
  100%{ transform:translate3d(-6%, -2%, 0) rotate(-6deg); opacity:.35; }
}
.hero > *{ position:relative; z-index:1; }

/* Premium cards: black glass + brushed-metal microtexture + gold edge */
.card, .model-card, .feature, .faq-item, .contact-card{
  background:
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)),
    radial-gradient(120% 140% at 10% 0%, rgba(212,175,55,.10), transparent 55%),
    radial-gradient(120% 140% at 100% 0%, rgba(243,211,138,.08), transparent 55%),
    var(--glass) !important;
  border:1px solid rgba(255,255,255,.09) !important;
  box-shadow:var(--shadow2) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  position:relative;
  overflow:hidden;
}
.card::before, .model-card::before, .feature::before, .faq-item::before, .contact-card::before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(135deg, rgba(212,175,55,.18), rgba(212,175,55,0) 35%),
    linear-gradient(45deg, rgba(255,255,255,.06), rgba(255,255,255,0) 40%),
    repeating-linear-gradient( 95deg, rgba(255,255,255,.045) 0px, rgba(255,255,255,.045) 1px, rgba(255,255,255,0) 9px, rgba(255,255,255,0) 18px);
  opacity:.18;
  mix-blend-mode:overlay;
  pointer-events:none;
}
.card::after, .model-card::after, .feature::after, .faq-item::after, .contact-card::after{
  content:"";
  position:absolute; inset:-1px;
  border-radius:inherit;
  padding:1px;
  background:linear-gradient(135deg, rgba(243,211,138,.55), rgba(212,175,55,.20), rgba(255,255,255,.08), rgba(184,137,43,.22));
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:.40;
  pointer-events:none;
}

/* Buttons: enamel black + gold foil edge + luxury sheen */
.btn, button, input[type="submit"]{
  border-radius: calc(var(--radius) - 4px) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(8,8,10,.92), rgba(2,2,3,.92)) !important;
  border:1px solid rgba(243,211,138,.22) !important;
  box-shadow:0 18px 48px rgba(0,0,0,.55);
  position:relative;
  overflow:hidden;
}
.btn.primary, button.primary{
  border-color: rgba(212,175,55,.48) !important;
}
.btn::after, button::after, input[type="submit"]::after{
  content:"";
  position:absolute; inset:-60% -60%;
  background:linear-gradient(90deg, rgba(212,175,55,0) 0%, rgba(243,211,138,.55) 45%, rgba(212,175,55,0) 80%);
  transform:translateX(-35%) rotate(14deg);
  opacity:.0;
  transition:opacity .35s ease, transform .75s ease;
  mix-blend-mode:screen;
}
.btn:hover::after, button:hover::after, input[type="submit"]:hover::after{
  opacity:.28;
  transform:translateX(35%) rotate(14deg);
}

/* Forms: showroom clean */
input, textarea, select{
  background: rgba(8,8,10,.62) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}
input:focus, textarea:focus, select:focus{
  outline:none;
  border-color: rgba(212,175,55,.55) !important;
  box-shadow:
    0 0 0 4px rgba(212,175,55,.12),
    0 18px 45px rgba(0,0,0,.45);
}

/* Section separators: thin luxury line */
.section, section{
  position:relative;
}
.section::before, section::before{
  content:"";
  position:absolute; left:50%; top:-1px;
  transform:translateX(-50%);
  width:min(920px, 92vw);
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(243,211,138,.22), rgba(212,175,55,.22), rgba(243,211,138,.14), transparent);
  opacity:.55;
  pointer-events:none;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
  .hero::after{ animation:none !important; }
  .btn::after, button::after, input[type="submit"]::after{ transition:none !important; }
}

/* =========================================================
   FINAL HERO BACKDROP OVERRIDE (highest priority)
   Fixes any visible vertical cutoff (hard edge) in the hero.
   ========================================================= */

/* Nuke any earlier hero background images and recompose a seamless cinematic backdrop */
.hero::before{
  background-image: none !important;
  background:
    radial-gradient(1400px 820px at 18% 42%, rgba(212,175,55,.30), transparent 66%),
    radial-gradient(1200px 760px at 78% 18%, rgba(241,226,183,.14), transparent 68%),
    radial-gradient(900px 620px at 50% 6%, rgba(184,137,42,.10), transparent 65%),
    radial-gradient(1200px 900px at 50% 120%, rgba(0,0,0,.86), transparent 62%),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.82))
    !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: .98 !important;
}

.hero::after{
  background:
    radial-gradient(780px 460px at 55% 18%, rgba(212,175,55,.20), transparent 64%),
    radial-gradient(680px 420px at 65% 30%, rgba(241,226,183,.12), transparent 62%),
    radial-gradient(980px 560px at 40% 0%, rgba(212,175,55,.12), transparent 68%)
    !important;
  opacity: .90 !important;
}

/* Prevent the streak layer from ever looking like a block on ultra-wide screens */
.fm-streaks{ filter: blur(0.01px); }


/* =========================================================
   ULTRA+++++ FEATURE CARDS UPGRADE (Maybach showroom)
   Makes the 3 homepage feature rectangles look more premium.
   No HTML changes required.
   ========================================================= */

/* Base surface: black glass with gold foil edge and depth */
.section .feature{
  position: relative;
  overflow: hidden;
  padding: 28px 26px;
  border-radius: calc(var(--radius) + 12px);
  border: 1px solid rgba(212,175,55,.22);
  background:
    radial-gradient(700px 420px at 18% 10%, rgba(212,175,55,.18), transparent 62%),
    radial-gradient(560px 360px at 82% 28%, rgba(241,226,183,.10), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.26));
  box-shadow:
    0 28px 80px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -1px 0 rgba(0,0,0,.65);
  transform: translateZ(0);
}

/* Brushed-metal microtexture + soft vignette inside the card */
.section .feature::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(1000px 560px at 20% 0%, rgba(0,0,0,.0), rgba(0,0,0,.55)),
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.06) 0 1px,
      rgba(0,0,0,0) 1px 7px),
    radial-gradient(520px 320px at 86% 12%, rgba(212,175,55,.10), transparent 66%);
  opacity: .28;
  mix-blend-mode: overlay;
  pointer-events:none;
}

/* Foil corner + top edge sheen */
.section .feature::after{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(220px 120px at 10% 8%, rgba(212,175,55,.45), transparent 60%),
    radial-gradient(240px 140px at 92% 10%, rgba(241,226,183,.22), transparent 62%),
    linear-gradient(180deg, rgba(212,175,55,.22), transparent 44%);
  opacity: .18;
  pointer-events:none;
}

/* Typography polish */
.section .feature h3{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 10px;
  letter-spacing: .2px;
  line-height:1.15;
}

.section .feature h3{
  background: linear-gradient(180deg, rgba(241,226,183,1), rgba(212,175,55,1) 60%, rgba(184,137,42,1));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
  text-shadow: 0 1px 18px rgba(212,175,55,.10);
}

.section .feature p{
  color: rgba(232,236,255,.82);
}

/* Icon badge: enamel black with gold rim */
.section .feature .fm-icon{
  width:36px; height:36px;
  border-radius: 12px;
  display:grid;
  place-items:center;
  background:
    radial-gradient(18px 18px at 30% 25%, rgba(255,255,255,.10), transparent 60%),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.78));
  border: 1px solid rgba(212,175,55,.30);
  box-shadow:
    0 12px 28px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.section .feature .fm-icon svg{ color: rgba(241,226,183,.95); }

/* Luxury hover: gentle lift + moving sheen */
@media (hover:hover){
  .section .feature{
    transition: transform .38s cubic-bezier(.2,.8,.2,1),
                box-shadow .38s cubic-bezier(.2,.8,.2,1),
                border-color .38s cubic-bezier(.2,.8,.2,1);
  }
  .section .feature:hover{
    transform: translateY(-6px);
    border-color: rgba(212,175,55,.40);
    box-shadow:
      0 36px 110px rgba(0,0,0,.72),
      0 0 0 1px rgba(212,175,55,.08),
      inset 0 1px 0 rgba(255,255,255,.10),
      inset 0 -1px 0 rgba(0,0,0,.70);
  }
  .section .feature:hover::after{
    opacity: .28;
  }
  .section .feature:hover::before{
    opacity: .34;
  }
}

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .section .feature{ transition:none !important; }
}

/* =========================================================
   ULTRA++++++ FEATURE CARDS — INDIVIDUAL SHOWROOM MOTIFS
   3 unique treatments (no HTML changes): each card gets its
   own light direction + micro-pattern. Adds a premium “set” feel.
   ========================================================= */

/* Common variables for per-card accents */
.section .feature{
  --a1: rgba(212,175,55,.20);
  --a2: rgba(241,226,183,.12);
  --a3: rgba(184,137,42,.10);
  --spark: rgba(212,175,55,.55);
}

/* Unique motifs (assumes 3 feature cards in the same container) */
.section .feature:nth-of-type(1){
  --a1: rgba(212,175,55,.22);
  --a2: rgba(241,226,183,.10);
  --a3: rgba(160,110,28,.10);
}
.section .feature:nth-of-type(2){
  --a1: rgba(241,226,183,.16);
  --a2: rgba(212,175,55,.18);
  --a3: rgba(120,78,20,.10);
}
.section .feature:nth-of-type(3){
  --a1: rgba(184,137,42,.18);
  --a2: rgba(241,226,183,.12);
  --a3: rgba(212,175,55,.14);
}

/* Rebuild the surface using the per-card variables — overrides previous backgrounds safely */
.section .feature{
  background:
    radial-gradient(820px 520px at 16% 8%, var(--a1), transparent 62%),
    radial-gradient(640px 420px at 88% 26%, var(--a2), transparent 62%),
    radial-gradient(520px 360px at 52% 120%, rgba(0,0,0,.68), transparent 60%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(0,0,0,.30));
}

/* Add an “inlaid” gold pinstripe + monogram-like micro pattern (no harsh edges) */
.section .feature::before{
  background:
    /* inner vignette */
    radial-gradient(1200px 680px at 18% -8%, rgba(0,0,0,.0), rgba(0,0,0,.62)),
    /* soft diagonal brushed-metal */
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.06) 0 1px,
      rgba(0,0,0,0) 1px 8px),
    /* subtle “monogram” texture */
    repeating-radial-gradient(circle at 0 0,
      rgba(255,255,255,.05) 0 1px,
      rgba(0,0,0,0) 1px 10px),
    /* inlaid pinstripe left */
    linear-gradient(90deg, rgba(212,175,55,.00), rgba(212,175,55,.22), rgba(212,175,55,.00));
  background-size: auto, auto, auto, 2px 100%;
  background-position: center, center, center, 22px 0;
  opacity: .26;
}

/* Make the foil sheen feel “crafted”: animated on hover, but luxury-slow */
.section .feature::after{
  inset:-32px;
  background:
    radial-gradient(260px 160px at 10% 10%, rgba(212,175,55,.50), transparent 62%),
    radial-gradient(300px 180px at 92% 12%, rgba(241,226,183,.24), transparent 64%),
    conic-gradient(from 210deg at 50% 20%, rgba(212,175,55,.00), rgba(212,175,55,.20), rgba(212,175,55,.00), rgba(212,175,55,.10), rgba(212,175,55,.00)),
    linear-gradient(180deg, rgba(212,175,55,.18), transparent 50%);
  opacity: .14;
}

@keyframes fm_foilSweep{
  0%{ transform: translate3d(-6%,0,0) rotate(-1.5deg); opacity:.12; }
  50%{ transform: translate3d(6%,0,0) rotate(1.5deg); opacity:.22; }
  100%{ transform: translate3d(-6%,0,0) rotate(-1.5deg); opacity:.12; }
}

@media (hover:hover){
  .section .feature:hover::after{
    opacity: .26;
    animation: fm_foilSweep 1.8s ease-in-out infinite;
  }
  .section .feature:hover{
    box-shadow:
      0 40px 120px rgba(0,0,0,.76),
      0 0 0 1px rgba(212,175,55,.10),
      inset 0 1px 0 rgba(255,255,255,.12),
      inset 0 -1px 0 rgba(0,0,0,.74);
  }
}

/* Stronger, cleaner hierarchy in card text */
.section .feature h3{ font-size:1.10rem; }
.section .feature p{ font-size: .98rem; line-height: 1.7; }

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .section .feature:hover::after{ animation:none !important; }
}

/* =========================================================
   PRO+++++++ FEATURE CARDS — “CRAFTED SURFACES” (3 levels up)
   Each card gets a distinct luxury material feel:
   1) brushed metal + warm spotlight
   2) satin black + tight pinstripe
   3) piano black + deep lacquer
   Still: no HTML changes.
   ========================================================= */

/* Per-card material presets */
.section .feature:nth-of-type(1){ --matA: rgba(212,175,55,.24); --matB: rgba(241,226,183,.12); --grain: .30; --stripe: .18; --lacquer: .10; }
.section .feature:nth-of-type(2){ --matA: rgba(241,226,183,.18); --matB: rgba(212,175,55,.20); --grain: .18; --stripe: .30; --lacquer: .12; }
.section .feature:nth-of-type(3){ --matA: rgba(184,137,42,.18); --matB: rgba(241,226,183,.10); --grain: .10; --stripe: .12; --lacquer: .28; }

/* Recompose the base surface with a cleaner premium contrast */
.section .feature{
  background:
    radial-gradient(900px 560px at 14% 6%, var(--matA), transparent 62%),
    radial-gradient(720px 460px at 88% 24%, var(--matB), transparent 62%),
    radial-gradient(560px 380px at 52% 118%, rgba(0,0,0,.72), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.34));
}

/* Crafted inlays: pinstripe + monogram + material grain (all feathered) */
.section .feature::before{
  background:
    /* interior vignette */
    radial-gradient(1200px 680px at 18% -8%, rgba(0,0,0,.0), rgba(0,0,0,.66)),
    /* lacquer depth (stronger on piano black) */
    radial-gradient(680px 420px at 78% 14%, rgba(255,255,255,var(--lacquer)), transparent 62%),
    /* brushed grain */
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.065) 0 1px,
      rgba(0,0,0,0) 1px 10px),
    /* satin weave / micro monogram */
    repeating-radial-gradient(circle at 0 0,
      rgba(255,255,255,.055) 0 1px,
      rgba(0,0,0,0) 1px 12px),
    /* inlaid left pinstripe (feathered) */
    linear-gradient(90deg,
      rgba(212,175,55,.00),
      rgba(212,175,55,.26),
      rgba(212,175,55,.00));
  background-size: auto, auto, auto, auto, 2px 100%;
  background-position: center, center, center, center, 22px 0;
  opacity: calc(.18 + var(--grain));
  filter: blur(0.001px);
}

/* Extra per-card material identity (no HTML changes) */
.section .feature:nth-of-type(1)::before{
  /* Brushed metal reads a bit stronger */
  background:
    radial-gradient(1200px 680px at 18% -8%, rgba(0,0,0,.0), rgba(0,0,0,.66)),
    radial-gradient(680px 420px at 78% 14%, rgba(255,255,255,calc(var(--lacquer) * .8)), transparent 62%),
    repeating-linear-gradient(112deg,
      rgba(255,255,255,.085) 0 1px,
      rgba(0,0,0,0) 1px 9px),
    repeating-radial-gradient(circle at 0 0,
      rgba(255,255,255,.045) 0 1px,
      rgba(0,0,0,0) 1px 14px),
    linear-gradient(90deg, rgba(212,175,55,.00), rgba(212,175,55,.26), rgba(212,175,55,.00));
}

.section .feature:nth-of-type(2)::before{
  /* Satin black + tighter pinstripe */
  background:
    radial-gradient(1200px 680px at 18% -8%, rgba(0,0,0,.0), rgba(0,0,0,.66)),
    radial-gradient(680px 420px at 78% 14%, rgba(255,255,255,var(--lacquer)), transparent 62%),
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.06) 0 1px,
      rgba(0,0,0,0) 1px 12px),
    repeating-linear-gradient(90deg,
      rgba(212,175,55,calc(var(--stripe) * .22)) 0 1px,
      rgba(0,0,0,0) 1px 18px),
    repeating-radial-gradient(circle at 0 0,
      rgba(255,255,255,.045) 0 1px,
      rgba(0,0,0,0) 1px 13px),
    linear-gradient(90deg, rgba(212,175,55,.00), rgba(212,175,55,.26), rgba(212,175,55,.00));
}

.section .feature:nth-of-type(3)::before{
  /* Piano black lacquer: smoother grain, deeper clearcoat */
  background:
    radial-gradient(1200px 680px at 18% -8%, rgba(0,0,0,.0), rgba(0,0,0,.70)),
    radial-gradient(720px 460px at 72% 10%, rgba(255,255,255,calc(var(--lacquer) * 1.2)), transparent 58%),
    radial-gradient(620px 380px at 20% 22%, rgba(241,226,183,.10), transparent 62%),
    repeating-linear-gradient(115deg,
      rgba(255,255,255,.045) 0 1px,
      rgba(0,0,0,0) 1px 16px),
    repeating-radial-gradient(circle at 0 0,
      rgba(255,255,255,.04) 0 1px,
      rgba(0,0,0,0) 1px 16px),
    linear-gradient(90deg, rgba(212,175,55,.00), rgba(212,175,55,.22), rgba(212,175,55,.00));
}

/* Gold-foil “inset frame” (thin) + showroom specular sweep */
.section .feature::after{
  inset:-40px;
  background:
    /* thin inset frame without hard edges */
    radial-gradient(220px 140px at 12% 12%, rgba(212,175,55,.45), transparent 65%),
    radial-gradient(260px 160px at 90% 12%, rgba(241,226,183,.22), transparent 68%),
    /* subtle top frame */
    linear-gradient(180deg, rgba(212,175,55,.16), transparent 52%),
    /* specular streak across the card */
    linear-gradient(115deg,
      rgba(255,255,255,.00) 0%,
      rgba(255,255,255,.00) 38%,
      rgba(241,226,183,.18) 46%,
      rgba(212,175,55,.10) 52%,
      rgba(255,255,255,.00) 62%,
      rgba(255,255,255,.00) 100%);
  opacity: .12;
  mix-blend-mode: screen;
}

@keyframes fm_specularSweep{
  0%{ transform: translate3d(-10%,0,0) rotate(-1.2deg); opacity:.10; }
  50%{ transform: translate3d(10%,0,0) rotate(1.2deg); opacity:.22; }
  100%{ transform: translate3d(-10%,0,0) rotate(-1.2deg); opacity:.10; }
}

@media (hover:hover){
  .section .feature:hover::after{
    opacity: .26;
    animation: fm_specularSweep 2.2s ease-in-out infinite;
  }
  .section .feature:hover::before{ opacity: calc(.22 + var(--grain)); }
  .section .feature:hover{ border-color: rgba(212,175,55,.44); }
}

@media (prefers-reduced-motion: reduce){
  .section .feature:hover::after{ animation:none !important; }
}


/* === V40 WOW DEALER PATCH === */
/* ==========================================
   WOW DEALER FEATURE CARDS (NO HTML CHANGES)
   - 3 distinct "materials" with cinematic light
   ========================================== */

/* Base – premium tile with gold frame + depth */
.section .feature{
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: 32px;
  border: 1px solid transparent !important;

  background:
    /* surface */
    radial-gradient(1000px 700px at 18% 0%, rgba(212,175,55,.22), transparent 62%) padding-box,
    radial-gradient(900px 620px at 85% 20%, rgba(241,226,183,.12), transparent 60%) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.62)) padding-box,

    /* gold frame */
    linear-gradient(135deg,
      rgba(241,226,183,.55),
      rgba(212,175,55,.95) 28%,
      rgba(115,75,18,.52) 64%,
      rgba(241,226,183,.22)
    ) border-box !important;

  box-shadow:
    0 60px 220px rgba(0,0,0,.90),
    0 26px 110px rgba(0,0,0,.62),
    0 0 90px rgba(212,175,55,.10),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(0,0,0,.86),
    inset 0 0 0 1px rgba(0,0,0,.72),
    inset 0 0 0 2px rgba(212,175,55,.16),
    inset 0 0 0 3px rgba(0,0,0,.58) !important;

  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
}

/* Universal "dealer" inlay + micro pattern + inner vignette */
.section .feature::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.46;
  background:
    /* inner vignette */
    radial-gradient(1200px 760px at 20% -10%, rgba(0,0,0,0), rgba(0,0,0,.76)),
    /* micro monogram vibe */
    repeating-linear-gradient(120deg, rgba(255,255,255,.09) 0 1px, rgba(0,0,0,0) 1px 12px),
    repeating-linear-gradient(30deg, rgba(241,226,183,.06) 0 1px, rgba(0,0,0,0) 1px 14px),
    /* gold inlay pinstripe left */
    linear-gradient(90deg, rgba(212,175,55,0), rgba(212,175,55,.42), rgba(212,175,55,0));
  background-size: auto, auto, auto, 2px 100%;
  background-position: center, center, center, 24px 0;
  mix-blend-mode: overlay;
}

/* Specular layer + spotlight + sheen sweep (animated on hover) */
.section .feature::after{
  content:"";
  position:absolute;
  inset:-52px;
  pointer-events:none;

  background:
    /* corner foils */
    radial-gradient(340px 200px at 10% 10%, rgba(212,175,55,.55), transparent 66%),
    radial-gradient(360px 220px at 92% 12%, rgba(241,226,183,.22), transparent 66%),

    /* top lacquer */
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 56%),

    /* wide showroom spotlight */
    radial-gradient(900px 520px at 55% 18%, rgba(212,175,55,.18), transparent 62%),

    /* sheen sweep */
    linear-gradient(120deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 36%,
      rgba(241,226,183,.26) 46%,
      rgba(212,175,55,.16) 52%,
      rgba(255,255,255,0) 62%,
      rgba(255,255,255,0) 100%),

    /* lightline running on pinstripe */
    linear-gradient(180deg,
      rgba(241,226,183,0) 0%,
      rgba(241,226,183,.28) 42%,
      rgba(212,175,55,.18) 52%,
      rgba(241,226,183,0) 74%);
  background-size: auto, auto, auto, auto, auto, 2px 190%;
  background-position: center, center, center, center, 140% 0, 24px -90%;
  background-repeat: no-repeat;
  opacity:.14;
  mix-blend-mode: screen;
}

@keyframes fm_sheen{
  0%   { background-position: center,center,center,center, 140% 0, 24px -90%; opacity:.12; }
  45%  { opacity:.26; }
  100% { background-position: center,center,center,center, -40% 0, 24px 150%; opacity:.12; }
}

@media (hover:hover){
  .section .feature{
    transition: transform .55s cubic-bezier(.2,.85,.2,1), box-shadow .55s cubic-bezier(.2,.85,.2,1), filter .55s;
  }
  .section .feature:hover{
    transform: translateY(-8px) scale(1.01);
    filter: saturate(1.05);
    box-shadow:
      0 78px 260px rgba(0,0,0,.92),
      0 0 120px rgba(212,175,55,.14),
      inset 0 1px 0 rgba(255,255,255,.16),
      inset 0 -1px 0 rgba(0,0,0,.86),
      inset 0 0 0 1px rgba(0,0,0,.72),
      inset 0 0 0 2px rgba(212,175,55,.20),
      inset 0 0 0 3px rgba(0,0,0,.58);
  }
  .section .feature:hover::after{
    opacity:.30;
    animation: fm_sheen 1.15s ease-in-out infinite;
  }
}

/* ==========================================
   3 DISTINCT MATERIALS (WOW)
   ========================================== */

/* Card 1 – BRUSHED METAL GOLD (more texture, more shimmer) */
.section .feature:nth-child(1){
  background:
    radial-gradient(1200px 800px at 18% 0%, rgba(212,175,55,.28), transparent 62%) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.66)) padding-box,
    linear-gradient(135deg, rgba(241,226,183,.62), rgba(212,175,55,.95) 30%, rgba(95,60,15,.52) 66%, rgba(241,226,183,.18)) border-box !important;
}
.section .feature:nth-child(1)::before{
  opacity:.56;
  background:
    radial-gradient(1100px 720px at 18% -10%, rgba(0,0,0,0), rgba(0,0,0,.76)),
    /* strong brushed grain */
    repeating-linear-gradient(108deg, rgba(255,255,255,.12) 0 1px, rgba(0,0,0,0) 1px 9px),
    repeating-linear-gradient(18deg, rgba(212,175,55,.06) 0 1px, rgba(0,0,0,0) 1px 15px),
    linear-gradient(90deg, rgba(212,175,55,0), rgba(212,175,55,.48), rgba(212,175,55,0));
  background-size: auto, auto, auto, 2px 100%;
  background-position: center, center, center, 24px 0;
  mix-blend-mode: overlay;
}

/* Card 2 – SATIN BLACK + DENSE PINSTRIPE (Maybach trim vibe) */
.section .feature:nth-child(2){
  background:
    radial-gradient(1000px 680px at 80% 10%, rgba(212,175,55,.18), transparent 60%) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.70)) padding-box,
    linear-gradient(135deg, rgba(241,226,183,.50), rgba(212,175,55,.92) 26%, rgba(90,58,14,.52) 62%, rgba(241,226,183,.18)) border-box !important;
}
.section .feature:nth-child(2)::before{
  opacity:.52;
  background:
    radial-gradient(1200px 760px at 20% -10%, rgba(0,0,0,0), rgba(0,0,0,.78)),
    /* dense pinstripe field */
    repeating-linear-gradient(90deg,
      rgba(241,226,183,.08) 0 1px,
      rgba(0,0,0,0) 1px 10px),
    repeating-linear-gradient(90deg,
      rgba(212,175,55,.05) 0 1px,
      rgba(0,0,0,0) 1px 16px),
    linear-gradient(90deg, rgba(212,175,55,0), rgba(212,175,55,.44), rgba(212,175,55,0));
  background-size: auto, auto, auto, 2px 100%;
  background-position: center, center, center, 24px 0;
  mix-blend-mode: overlay;
}

/* Card 3 – PIANO BLACK LACQUER (wet clearcoat, strong specular) */
.section .feature:nth-child(3){
  background:
    radial-gradient(900px 560px at 50% 8%, rgba(241,226,183,.14), transparent 58%) padding-box,
    radial-gradient(1000px 740px at 20% 22%, rgba(212,175,55,.16), transparent 66%) padding-box,
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.76)) padding-box,
    linear-gradient(135deg, rgba(241,226,183,.56), rgba(212,175,55,.90) 26%, rgba(95,60,15,.52) 66%, rgba(241,226,183,.18)) border-box !important;
}
.section .feature:nth-child(3)::after{
  opacity:.18; /* base */
  background:
    radial-gradient(360px 220px at 12% 10%, rgba(212,175,55,.58), transparent 66%),
    radial-gradient(520px 300px at 88% 14%, rgba(255,255,255,.14), transparent 70%),
    /* lacquer top layer */
    linear-gradient(180deg, rgba(255,255,255,.10), transparent 58%),
    /* strong clearcoat specular */
    linear-gradient(118deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 35%,
      rgba(255,255,255,.22) 44%,
      rgba(241,226,183,.20) 50%,
      rgba(212,175,55,.10) 56%,
      rgba(255,255,255,0) 66%,
      rgba(255,255,255,0) 100%),
    linear-gradient(180deg,
      rgba(241,226,183,0) 0%,
      rgba(241,226,183,.30) 42%,
      rgba(212,175,55,.20) 52%,
      rgba(241,226,183,0) 74%);
  background-size: auto, auto, auto, auto, 2px 190%;
  background-position: center, center, center, 140% 0, 24px -90%;
  background-repeat: no-repeat;
  mix-blend-mode: screen;
}

@media (hover:hover){
  .section .feature:nth-child(3):hover::after{
    opacity:.34; /* bigger wow on hover */
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .section .feature, .section .feature:hover{ transition:none !important; transform:none !important; }
  .section .feature:hover::after{ animation:none !important; }
}


/* === V41 BIG VISUALS PATCH === */
/* ================================
   V41 BIG VISUALS — DEALER WEBSITE
   (no HTML changes; adds large visuals via pseudo-elements)
   ================================ */

/* 1) Cinematic hero: stronger showroom spotlight + large silhouette + pattern */
.hero, header.hero, .hero-section{
  position: relative;
  isolation: isolate;
}
.hero::before, header.hero::before, .hero-section::before{
  content:"";
  position:absolute;
  inset:-80px;
  pointer-events:none;
  background:
    radial-gradient(900px 520px at 55% 18%, rgba(212,175,55,.22), transparent 62%),
    radial-gradient(1200px 760px at 50% 25%, rgba(0,0,0,0), rgba(0,0,0,.80)),
    url("../img/lux-pattern.svg");
  background-size: auto, auto, cover;
  background-position: center, center, center;
  opacity:.55;
  mix-blend-mode: overlay;
  z-index: 0;
}
.hero::after, header.hero::after, .hero-section::after{
  content:"";
  position:absolute;
  inset:-120px;
  pointer-events:none;
  background:
    url("../img/lux-car-silhouette.svg"),
    radial-gradient(1100px 660px at 68% 30%, rgba(241,226,183,.16), transparent 65%);
  background-repeat: no-repeat, no-repeat;
  background-position: 72% 55%, center;
  background-size: min(1200px, 92vw) auto, auto;
  opacity:.35;
  mix-blend-mode: screen;
  z-index: 0;
}

/* make sure hero content stays above visuals */
.hero > *, header.hero > *, .hero-section > *{
  position: relative;
  z-index: 1;
}

/* 2) Add large section backplates (works for most sections) */
section, .section{
  position: relative;
  isolation: isolate;
}
section::before, .section::before{
  content:"";
  position:absolute;
  inset:-120px;
  pointer-events:none;
  background:
    radial-gradient(1100px 780px at 12% 18%, rgba(212,175,55,.10), transparent 62%),
    radial-gradient(900px 700px at 88% 22%, rgba(241,226,183,.06), transparent 64%),
    url("../img/lux-pattern.svg");
  background-size: auto, auto, cover;
  background-position: center, center, center;
  opacity:.22;
  mix-blend-mode: overlay;
  z-index: 0;
}
section > *, .section > *{
  position: relative;
  z-index: 1;
}

/* 3) Feature cards: add BIG "watermark visuals" (each different) */
.section .feature{
  position: relative;
}
.section .feature .icon, .section .feature svg, .section .feature img{
  position: relative;
  z-index: 2;
}

/* Watermark layer */
.section .feature .wm, .section .feature .watermark{ display:none; } /* safety if exists */
.section .feature::marker{ content:""; } /* no-op */

.section .feature::after{
  /* keep existing ::after effects and add watermark via multiple backgrounds */
  background-image:
    radial-gradient(340px 200px at 10% 10%, rgba(212,175,55,.55), transparent 66%),
    radial-gradient(360px 220px at 92% 12%, rgba(241,226,183,.22), transparent 66%),
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 56%),
    radial-gradient(900px 520px at 55% 18%, rgba(212,175,55,.18), transparent 62%),
    linear-gradient(120deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,0) 36%,
      rgba(241,226,183,.26) 46%,
      rgba(212,175,55,.16) 52%,
      rgba(255,255,255,0) 62%,
      rgba(255,255,255,0) 100%),
    linear-gradient(180deg,
      rgba(241,226,183,0) 0%,
      rgba(241,226,183,.28) 42%,
      rgba(212,175,55,.18) 52%,
      rgba(241,226,183,0) 74%),
    url("../img/lux-car-silhouette.svg");
  background-repeat: no-repeat;
  background-size: auto,auto,auto,auto,auto, 2px 190%, min(900px, 95%) auto;
  background-position: center,center,center,center, 140% 0, 24px -90%, 78% 64%;
}

/* Card-specific “wow” watermarks */
.section .feature:nth-child(1)::after{
  background-position: center,center,center,center, 140% 0, 24px -90%, 78% 62%;
  opacity:.22;
}
.section .feature:nth-child(2)::after{
  background-position: center,center,center,center, 140% 0, 24px -90%, 70% 66%;
  opacity:.20;
}
.section .feature:nth-child(3)::after{
  background-position: center,center,center,center, 140% 0, 24px -90%, 82% 68%;
  opacity:.18;
}

/* 4) Optional: make card content breathe a bit more (no layout break) */
.section .feature{
  padding-top: clamp(22px, 2.3vw, 34px);
  padding-bottom: clamp(22px, 2.3vw, 34px);
}



/* === v50: Mobile performance + video fallback === */
html, body{ overflow-x:hidden; }

@media (max-width: 768px){
  /* On mobile, show fast static background instead of heavy video */
  .hero--video{ 
    background-image: url("assets/img/hero-night-city.png");
    background-size: cover;
    background-position: center;
  }
  .hero--video .hero-bg,
  .hero--video .hero-overlay{ display:none !important; }
}

/* Make touch targets nicer */
@media (max-width: 560px){
  a, button{ -webkit-tap-highlight-color: transparent; }
  .btn, a.btn, button.btn{ min-height: 44px; }
}