/* ── Fuentes ────────────────────────────────────────────────────────────── */
body         { font-family: 'Inter', sans-serif; }
h1, h2, h3,
.font-heading { font-family: 'Montserrat', sans-serif; }

/* ── Navegación ─────────────────────────────────────────────────────────── */
.nav-link {
  color: #b0b8d8;
  padding: 8px 16px;
  border-radius: 8px;
  font-family: 'Inter', sans-serif;
  font-size: 0.875rem;
  font-weight: 500;
  transition: color .2s, background .2s;
  text-decoration: none;
}
.nav-link:hover { color: #fff; background: rgba(255,255,255,.1); }
.nav-link.active { color: #5B6CE2; background: rgba(91,108,226,.15); }

.mob-link {
  display: block;
  color: #b0b8d8;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: 500;
  transition: color .2s, background .2s;
  text-decoration: none;
}
.mob-link:hover { color: #fff; background: rgba(255,255,255,.1); }
.mob-link.active { color: #5B6CE2; }

/* ── Hero ───────────────────────────────────────────────────────────────── */
.hero-bg {
  /* Degradado con el dark del logo + tinte de la marca */
  background: linear-gradient(135deg, #12121F 0%, #1C1C2E 45%, #23234A 100%);
  position: relative;
  overflow: hidden;
}
.hero-grid {
  background-image:
    linear-gradient(rgba(91,108,226,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(91,108,226,.07) 1px, transparent 1px);
  background-size: 72px 72px;
}
/* Acento de luz en el hero */
.hero-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(90px);
  pointer-events: none;
}

/* ── Cards de vehículo ──────────────────────────────────────────────────── */
.card-vehicle {
  transition: transform .25s ease, box-shadow .25s ease;
}
.card-vehicle:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 50px rgba(0,0,0,.1);
}
.card-vehicle .car-img {
  aspect-ratio: 16/9;
  object-fit: cover;
  width: 100%;
  transition: transform .4s ease;
}
.card-vehicle:hover .car-img { transform: scale(1.05); }

/* ── Galería detalle ────────────────────────────────────────────────────── */
.thumb-img {
  aspect-ratio: 16/9;
  object-fit: cover;
  cursor: pointer;
  transition: opacity .2s;
}
.ring-brand { outline: 3px solid #5B6CE2; outline-offset: 2px; }

/* ── WhatsApp ───────────────────────────────────────────────────────────── */
.btn-whatsapp {
  background: #25d366;
  color: #fff;
  transition: background .2s, transform .15s;
}
.btn-whatsapp:hover { background: #1db954; transform: scale(1.02); }

/* ── Formularios ────────────────────────────────────────────────────────── */
.input-web {
  width: 100%;
  padding: 12px 16px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  font-size: 0.95rem;
  font-family: 'Inter', sans-serif;
  transition: border-color .2s, box-shadow .2s;
  outline: none;
  background: #fff;
}
.input-web:focus {
  border-color: #5B6CE2;
  box-shadow: 0 0 0 3px rgba(91,108,226,.14);
}
.input-web::placeholder { color: #94a3b8; }

/* ── Precio destacado ───────────────────────────────────────────────────── */
.price-badge {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.75rem;
  font-weight: 900;
  color: #5B6CE2;
  letter-spacing: -0.5px;
}

/* ── Sección CTA ────────────────────────────────────────────────────────── */
.cta-section {
  background: linear-gradient(135deg, #1C1C2E 0%, #2A2A50 50%, #1C1C2E 100%);
  position: relative;
  overflow: hidden;
}
.cta-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 60% 50%, rgba(91,108,226,.25) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Stats bar ──────────────────────────────────────────────────────────── */
.stats-bar { background: #5B6CE2; }

/* ── Animación entrada ──────────────────────────────────────────────────── */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.fade-up { animation: fadeUp .55s ease both; }

html { scroll-behavior: smooth; }
