/* ============================================================
   FROSTED MONOLITH LUXURY — Design Override
   Architectural minimalism. Monochromatic silver & slate.
   Heavy frosted glass monoliths. Zero gold. Extreme negative space.
   Applies to EVERYTHING except .configurator
   ============================================================ */

/* ── Token Overrides — only add silver vars, DON'T override gold ─ */
:root {
  --fm-void:         #070709;
  --fm-slate:        #0d0e11;
  --fm-slate-mid:    #13141a;
  --fm-slate-soft:   #1c1e26;
  --fm-silver:       #c8cad0;
  --fm-silver-dim:   #7a7d88;
  --fm-silver-faint: #3a3d48;
  --fm-white:        #eceef2;
  --fm-frost:        rgba(255,255,255,0.04);
  --fm-frost-mid:    rgba(255,255,255,0.07);
  --fm-frost-strong: rgba(255,255,255,0.11);
  --fm-border:       rgba(255,255,255,0.08);
  --fm-border-strong:rgba(255,255,255,0.14);
  --fm-glow:         rgba(180,185,200,0.06);

  /* Keep original Bentley gold — hero needs it */
  /* --bm-gold untouched */
}

/* ── Global body ─────────────────────────────────────────── */
body {
  background: var(--fm-void);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* ── Header — frosted bar but keep gold CTA ─────────────── */
.header {
  background: rgba(7,7,9,0.75) !important;
  backdrop-filter: blur(28px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(180%) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
}

/* HERO — NO overrides. Let original style.css take full control */


/* ── Models section ─────────────────────────────────────── */
.models {
  background: var(--fm-void) !important;
}

.section-label {
  color: var(--fm-silver-faint) !important;
  letter-spacing: 0.3em !important;
  font-size: 0.6rem !important;
  font-weight: 400 !important;
  text-transform: uppercase !important;
  font-family: 'SF Mono', monospace !important;
}

.section-title {
  color: var(--fm-white) !important;
  font-weight: 200 !important;
  letter-spacing: -0.025em !important;
}

.model-card {
  background: var(--fm-slate) !important;
  border: 1px solid var(--fm-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  transition: all 0.5s var(--ease-luxury) !important;
  box-shadow: none !important;
}

.model-card:hover {
  border-color: var(--fm-border-strong) !important;
  transform: translateY(-4px) !important;
  box-shadow: 0 24px 64px rgba(0,0,0,0.6) !important;
}

.model-card__badge {
  background: var(--fm-frost-strong) !important;
  border: 1px solid var(--fm-border) !important;
  color: var(--fm-silver-dim) !important;
  font-size: 0.6rem !important;
  letter-spacing: 0.2em !important;
  font-weight: 400 !important;
  backdrop-filter: blur(12px) !important;
  border-radius: 2px !important;
}

.model-card__name {
  color: var(--fm-white) !important;
  font-weight: 200 !important;
  letter-spacing: -0.01em !important;
}

.model-card__category {
  color: var(--fm-silver-dim) !important;
  font-size: 0.7rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.1em !important;
}

.model-card__price {
  color: var(--fm-silver) !important;
  font-weight: 300 !important;
}

.model-card__cta {
  color: var(--fm-silver-dim) !important;
  border-color: var(--fm-border) !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  transition: all 0.3s ease !important;
}

.model-card__cta:hover {
  color: var(--fm-white) !important;
  border-color: var(--fm-silver-dim) !important;
  background: var(--fm-frost-mid) !important;
}

/* ── Driving section ────────────────────────────────────── */
.driving__gradient {
  background: linear-gradient(to top, rgba(7,7,9,0.85) 0%, transparent 60%) !important;
}

.driving__spec-value {
  color: var(--fm-white) !important;
  font-weight: 100 !important;
  letter-spacing: -0.04em !important;
}

.driving__spec-value span {
  color: var(--fm-silver-dim) !important;
  font-weight: 300 !important;
}

.driving__spec-label {
  color: var(--fm-silver-dim) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.2em !important;
  font-weight: 300 !important;
  text-transform: uppercase !important;
}

.driving__bottom-text h3 {
  color: var(--fm-white) !important;
  font-weight: 200 !important;
}

.driving__bottom-text p {
  color: var(--fm-silver-dim) !important;
  font-weight: 300 !important;
}

/* ── Horizon / Showcase slides ──────────────────────────── */
.horizon {
  background: var(--fm-void) !important;
}

.horizon__slide-bg::after {
  background: linear-gradient(to right, rgba(7,7,9,0.92) 30%, rgba(7,7,9,0.4) 100%) !important;
}

.horizon__slide-label {
  color: var(--fm-silver-faint) !important;
  letter-spacing: 0.25em !important;
  font-size: 0.6rem !important;
  text-transform: uppercase !important;
  font-weight: 400 !important;
}

.horizon__slide-title {
  color: var(--fm-white) !important;
  font-weight: 100 !important;
  letter-spacing: -0.03em !important;
}

.horizon__slide-body {
  color: var(--fm-silver-dim) !important;
  font-weight: 300 !important;
  line-height: 1.9 !important;
}

.horizon__nav-dot {
  background: var(--fm-silver-faint) !important;
  border-radius: 1px !important;
  transition: all 0.3s ease !important;
}

.horizon__nav-dot.active {
  background: var(--fm-silver) !important;
}

/* ── Craft / Materials section ──────────────────────────── */
.craft {
  background: var(--fm-void) !important;
}

/* Frosted monolith card */
.craft__item,
.craft-card,
[class*="craft__"] {
  background: var(--fm-frost) !important;
  border: 1px solid var(--fm-border) !important;
  backdrop-filter: blur(20px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(160%) !important;
  border-radius: 4px !important;
}

/* ── Bento grid ─────────────────────────────────────────── */
.bento {
  background: var(--fm-void) !important;
}

.bento__cell {
  background: var(--fm-slate) !important;
  border: 1px solid var(--fm-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}

.bento__stat-value {
  color: var(--fm-white) !important;
  font-weight: 100 !important;
  letter-spacing: -0.04em !important;
}

.bento__stat-label {
  color: var(--fm-silver-dim) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-weight: 300 !important;
}

.bento__quote {
  color: var(--fm-silver) !important;
  font-weight: 200 !important;
  font-style: italic !important;
  line-height: 1.6 !important;
}

/* ── Gallery ────────────────────────────────────────────── */
.gallery {
  background: var(--fm-void) !important;
}

.gallery__item {
  border: 1px solid var(--fm-border) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
}

.gallery__caption {
  background: linear-gradient(to top, rgba(7,7,9,0.9), transparent) !important;
  color: var(--fm-silver-dim) !important;
  font-size: 0.65rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  font-weight: 300 !important;
}

/* ── Perf-mode section ──────────────────────────────────── */
.perf-mode {
  background: var(--fm-void) !important;
}

/* ── Desert section ─────────────────────────────────────── */
.desert__gradient-top {
  background: linear-gradient(to bottom, rgba(7,7,9,0.7) 0%, transparent 100%) !important;
}

.desert__gradient-bottom {
  background: linear-gradient(to top, rgba(7,7,9,0.9) 0%, transparent 60%) !important;
}

/* ── Contact section ────────────────────────────────────── */
.contact {
  background: var(--fm-slate) !important;
  border-top: 1px solid var(--fm-border) !important;
}

.contact__title {
  color: var(--fm-white) !important;
  font-weight: 100 !important;
  letter-spacing: -0.025em !important;
}

.contact__subtitle {
  color: var(--fm-silver-dim) !important;
  font-weight: 300 !important;
}

/* Frosted input fields */
.contact__input,
.contact__select,
.contact__textarea,
input, select, textarea {
  background: var(--fm-frost) !important;
  border: 1px solid var(--fm-border) !important;
  color: var(--fm-silver) !important;
  border-radius: 3px !important;
  backdrop-filter: blur(12px) !important;
  transition: border-color 0.3s ease, box-shadow 0.3s ease !important;
  font-weight: 300 !important;
}

input:focus, select:focus, textarea:focus,
.contact__input:focus, .contact__select:focus, .contact__textarea:focus {
  border-color: var(--fm-silver-dim) !important;
  box-shadow: 0 0 0 3px rgba(200,202,208,0.06) !important;
  outline: none !important;
}

input::placeholder, textarea::placeholder {
  color: var(--fm-silver-faint) !important;
  font-weight: 300 !important;
}

/* Primary submit button */
.contact__submit,
button[type="submit"] {
  background: var(--fm-frost-strong) !important;
  border: 1px solid var(--fm-border-strong) !important;
  color: var(--fm-white) !important;
  letter-spacing: 0.15em !important;
  font-size: 0.7rem !important;
  font-weight: 300 !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  backdrop-filter: blur(16px) !important;
  transition: all 0.3s ease !important;
}

.contact__submit:hover,
button[type="submit"]:hover {
  background: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.22) !important;
  transform: translateY(-1px) !important;
}

/* ── Footer ─────────────────────────────────────────────── */
footer, .footer {
  background: var(--fm-void) !important;
  border-top: 1px solid var(--fm-border) !important;
}

.footer__brand-name,
.footer__tagline,
.footer__links-heading {
  color: var(--fm-silver-dim) !important;
  font-weight: 300 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-size: 0.65rem !important;
}

.footer__link {
  color: var(--fm-silver-faint) !important;
  font-weight: 300 !important;
  font-size: 0.78rem !important;
  transition: color 0.25s ease !important;
}

.footer__link:hover {
  color: var(--fm-silver) !important;
}

.footer__legal {
  color: rgba(122,125,136,0.5) !important;
  font-size: 0.65rem !important;
  font-weight: 300 !important;
  letter-spacing: 0.05em !important;
}

/* ── Scrollbar ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--fm-void); }
::-webkit-scrollbar-thumb { background: var(--fm-silver-faint); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: var(--fm-silver-dim); }

/* ── Custom cursor dot ───────────────────────────────────── */
.cursor,
.cursor-dot {
  border-color: var(--fm-silver) !important;
  background: rgba(200,202,208,0.15) !important;
}

/* ── Selection ───────────────────────────────────────────── */
::selection {
  background: rgba(200,202,208,0.15);
  color: var(--fm-white);
}

/* ── Frosted glass utility — applies to floating panels ──── */
.frosted-monolith {
  background: var(--fm-frost-mid);
  border: 1px solid var(--fm-border);
  backdrop-filter: blur(32px) saturate(200%);
  -webkit-backdrop-filter: blur(32px) saturate(200%);
  border-radius: 4px;
}

/* ── Section dividers ────────────────────────────────────── */
.section-header {
  border-bottom: 1px solid var(--fm-border) !important;
  padding-bottom: 2rem !important;
  margin-bottom: 4rem !important;
}

/* ── HUD monospace items ─────────────────────────────────── */
.hud__item,
[id*="hud"] {
  font-family: 'SF Mono', 'Fira Code', 'Courier New', monospace !important;
  letter-spacing: 0.15em !important;
  font-size: 0.6rem !important;
  color: rgba(200,202,208,0.45) !important;
}
