/* ============================================================
   BRILLA GAS GUAJIRA — styles.css
   Fuente ÚNICA de CSS. Cero inline, cero <style> en HTML.
   Montserrat · Rojo #E8212A · Amarillo #F9B71C
   ============================================================ */

/* === RESET + BASE ========================================== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* Skip link — oculto visualmente, visible solo con teclado */
.skip-link {
  position: absolute;
  top: -100%;
  left: 0;
  z-index: 9999;
  padding: 8px 16px;
  background: var(--brilla-red, #EA0029);
  color: #fff;
  font-weight: 700;
  font-size: .875rem;
  text-decoration: none;
  transition: top .15s;
}
.skip-link:focus { top: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: 'Montserrat', sans-serif;
  font-weight: 400;
  color: var(--gray-800);
  background: var(--white);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { text-decoration: none; color: inherit; }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: inherit; }

/* === VARIABLES ============================================= */
:root {
  /* ── Paleta oficial B2B y B2C (Manual de Marca) ─────────── */
  --brilla-red:        #EA0029;   /* Pantone 185 C — dominante */
  --brilla-red-dark:   #B8001E;   /* variante oscura para hover/gradiente */
  --brilla-red-light:  #FF2A45;   /* variante clara */
  --brilla-yellow:     #FCDC3E;   /* Pantone 114 C — acento primario */
  --brilla-yellow-2:   #FFB600;   /* Pantone 7549 C — acento cálido */
  --brilla-teal:       #3BD4AE;   /* Pantone 3385 C */
  --brilla-teal-dark:  #00A19B;   /* Pantone 3272 C */
  --brilla-orange:     #FF5C35;   /* Pantone 171 C */
  --brilla-blue:       #00A0DF;   /* Pantone 299 C */
  --brilla-gray-light: #D9D8D6;   /* Pantone Cool Grey 1C */
  --brilla-gray-mid:   #A7A8A9;   /* Pantone Cool Gray 6C */
  --brilla-gray-dark:  #6F7271;   /* Pantone 424 C */

  /* ── Paleta exclusiva Seguros ────────────────────────────── */
  --seg-mint:          #47D7AC;   /* Pantone 3385 C (versión seguros) */
  --seg-blue:          #00A3E0;   /* Pantone 299 C */
  --seg-red:           #E4002B;   /* Pantone 185 C */

  /* ── Neutros ─────────────────────────────────────────────── */
  --white:             #FFFFFF;
  --gray-50:           #F9FAFB;
  --gray-100:          #F3F4F6;
  --gray-200:          #E5E7EB;
  --gray-300:          #D1D5DB;
  --gray-400:          #9CA3AF;
  --gray-600:          #4B5563;
  --gray-700:          #374151;
  --gray-800:          #1F2937;
  --gray-900:          #111827;

  /* ── Sombras / tokens ────────────────────────────────────── */
  --shadow-sm:         0 1px 3px rgba(0,0,0,.10);
  --shadow-md:         0 4px 16px rgba(0,0,0,.12);
  --shadow-lg:         0 8px 32px rgba(0,0,0,.15);
  --shadow-red:        0 4px 20px rgba(234,0,41,.30);
  --shadow-teal:       0 4px 20px rgba(71,215,172,.30);
  --radius-sm:         6px;
  --radius-md:         12px;
  --radius-lg:         20px;
  --radius-full:       9999px;
  --max-w:             1200px;
  --nav-h:             72px;
  --transition:        0.3s ease;
}

/* === UTILIDADES ============================================ */
.container { max-width: var(--max-w); margin: 0 auto; padding: 0 24px; }
.section-pad { padding: 80px 0; }
.section-pad--lg { padding: 100px 0; }
.section-pad--sm { padding: 48px 0; }
.text-center { text-align: center; }
.text-red { color: var(--brilla-red); }
.text-yellow { color: var(--brilla-yellow); }
.bg-gray { background: var(--gray-50); }
.bg-red { background: var(--brilla-red); }
.hidden { display: none !important; }
.overflow-hidden { overflow: hidden; }

/* === TIPOGRAFÍA ============================================ */
h1, h2, h3, h4 { font-family: 'Montserrat', sans-serif; line-height: 1.15; }
h1 { font-size: clamp(2rem, 5vw, 3.5rem); font-weight: 700; }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.5rem); font-weight: 700; }
h3 { font-size: clamp(1.1rem, 2vw, 1.5rem); font-weight: 600; }
h4 { font-size: 1.1rem; font-weight: 600; }
p  { line-height: 1.7; color: var(--gray-600); }

.section-label {
  display: inline-block;
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: var(--brilla-red);
  margin-bottom: 12px;
}
.section-title { margin-bottom: 16px; color: var(--gray-900); }
.section-subtitle { font-size: 1.1rem; max-width: 600px; margin: 0 auto 48px; }

/* === BOTONES =============================================== */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  font-family: 'Montserrat', sans-serif;
  font-size: .875rem;
  font-weight: 700;
  letter-spacing: .5px;
  border-radius: var(--radius-full);
  transition: var(--transition);
  cursor: pointer;
  white-space: nowrap;
}
.btn--red {
  background: var(--brilla-red);
  color: var(--white);
  box-shadow: var(--shadow-red);
}
.btn--red:hover { background: var(--brilla-red-dark); transform: translateY(-2px); }

.btn--white {
  background: var(--white);
  color: var(--brilla-red);
  box-shadow: var(--shadow-md);
}
.btn--white:hover { background: var(--gray-50); transform: translateY(-2px); }

.btn--outline-white {
  background: transparent;
  color: var(--white);
  border: 2px solid rgba(255,255,255,.7);
}
.btn--outline-white:hover { background: rgba(255,255,255,.15); border-color: var(--white); }

.btn--outline-red {
  background: transparent;
  color: var(--brilla-red);
  border: 2px solid var(--brilla-red);
}
.btn--outline-red:hover { background: var(--brilla-red); color: var(--white); }

.btn--outline-blue {
  background: transparent;
  color: var(--brilla-blue);
  border: 2px solid var(--brilla-blue);
}
.btn--outline-blue:hover { background: var(--brilla-blue); color: var(--white); }

.btn--outline-teal {
  background: transparent;
  color: var(--brilla-teal-dark);
  border: 2px solid var(--brilla-teal-dark);
}
.btn--outline-teal:hover { background: var(--brilla-teal-dark); color: var(--white); }

.btn--yellow {
  background: var(--brilla-yellow);
  color: var(--gray-900);
  box-shadow: 0 4px 20px rgba(249,183,28,.35);
}
.btn--yellow:hover { background: #e5a518; transform: translateY(-2px); }

.btn--sm { padding: 10px 22px; font-size: .8rem; }
.btn--lg { padding: 18px 42px; font-size: 1rem; }
.btn--white { background: #fff; color: #1a1a1a; box-shadow: 0 4px 20px rgba(0,0,0,.18); }
.btn--white:hover { background: #f5f5f5; transform: translateY(-2px); }

/* === NAV ================================================== */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  border-top: 5px solid var(--brilla-red);
  height: var(--nav-h);
  display: flex;
  align-items: stretch;
  transition: background var(--transition), box-shadow var(--transition);
}
.nav--solid {
  background: var(--white);
  box-shadow: var(--shadow-sm);
}
.nav--solid .nav__hamburger span { background: var(--gray-800); }

.nav__inner {
  max-width: var(--max-w);
  width: 100%;
  margin: 0 auto;
  padding: 0 24px;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
.nav__logo { display: flex; align-items: center; }
.nav__logo-img { height: 40px; width: auto; filter: brightness(0) invert(1); transition: filter var(--transition); }
.nav--solid .nav__logo-img { filter: none; }

.nav__hamburger {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
  cursor: pointer;
}
.nav__hamburger span {
  display: block;
  width: 24px;
  height: 2px;
  background: var(--white);
  border-radius: 2px;
  transition: var(--transition);
}
.nav--solid .nav__hamburger span { background: var(--gray-800); }

/* NAV desktop links (opcional para pantallas grandes) */
.nav__links {
  display: none;
  align-items: center;
  gap: 32px;
}
@media (min-width: 1024px) {
  .nav__links { display: flex; }
  .nav__hamburger { display: none; }
}
.nav__link {
  font-size: .875rem;
  font-weight: 600;
  color: var(--white);
  text-shadow: 0 1px 6px rgba(0,0,0,.45), 0 2px 12px rgba(0,0,0,.25);
  transition: color var(--transition);
  position: relative;
}
.nav__link::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 0; right: 0;
  height: 2px;
  background: var(--brilla-yellow);
  transform: scaleX(0);
  transition: transform var(--transition);
  transform-origin: left;
}
.nav__link:hover::after { transform: scaleX(1); }
.nav--solid .nav__link { color: var(--gray-800); text-shadow: none; }
.nav__cta-link { display: none; }
@media (min-width: 1024px) {
  .nav__cta-link { display: flex; }
}

/* NAV OVERLAY fullscreen */
.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000;
  background: var(--brilla-red-dark);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .4s ease;
}
.nav-overlay.is-open { opacity: 1; pointer-events: all; }

.nav-overlay__close {
  position: absolute;
  top: 24px; right: 28px;
  font-size: 1.75rem;
  color: var(--white);
  opacity: .7;
  cursor: pointer;
  transition: opacity var(--transition);
}
.nav-overlay__close:hover { opacity: 1; }

.nav-overlay__list {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.nav-overlay__list li a {
  display: block;
  font-size: clamp(1.8rem, 5vw, 3rem);
  font-weight: 700;
  color: rgba(255,255,255,.85);
  padding: 8px 0;
  transition: color var(--transition);
  letter-spacing: -1px;
}
.nav-overlay__list li a:hover { color: var(--brilla-yellow); }

.nav-overlay__social {
  margin-top: 48px;
  display: flex;
  gap: 24px;
}
.nav-overlay__social a {
  color: rgba(255,255,255,.6);
  transition: color var(--transition);
}
.nav-overlay__social a:hover { color: var(--white); }

.nav-overlay__bottom {
  position: absolute;
  bottom: 32px;
  font-size: .8rem;
  color: rgba(255,255,255,.4);
  letter-spacing: 1px;
}

/* === HERO ================================================= */
.hero {
  position: relative;
  min-height: 820px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: #0a0002;
}
@media (max-width: 1440px) {
  .hero { min-height: 680px; }
}

.hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 30%;
  background-repeat: no-repeat;
  opacity: 0;
  transition: opacity 1.4s ease;
}
.hero__bg.is-active { opacity: 1; z-index: 1; }
.hero__bg.is-zoom { animation: heroBgZoom 8s ease forwards; }
@keyframes heroBgZoom { from { transform: scale(1.03); } to { transform: scale(1); } }

/* dots del slider */
.hero__dots {
  position: absolute;
  z-index: 3;
  right: 40px;
  bottom: 40px;
  display: flex;
  gap: 10px;
}
.hero__dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.6);
  background: transparent;
  padding: 0;
  cursor: pointer;
  position: relative;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
}
.hero__dot::before { content: ''; position: absolute; inset: -8px; }
.hero__dot:hover { border-color: #fff; }
.hero__dot.is-active {
  background: var(--brilla-yellow);
  border-color: var(--brilla-yellow);
  transform: scale(1.15);
}

/* overlay quitado — imagen se ve nítida */
.hero__overlay { display: none; }

/* contenido — lado derecho, glass panel para legibilidad */
.hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 520px;
  margin-right: auto;
  margin-left: max(40px, calc((100vw - var(--max-w)) / 2 + 24px));
  padding: 48px 40px;
}

.hero__label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(255,255,255,.1);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,.18);
  padding: 6px 16px;
  border-radius: var(--radius-full);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: 2.5px;
  color: rgba(255,255,255,.88);
  text-transform: uppercase;
  margin-bottom: 18px;
  opacity: 0;
  animation: fadeUp .7s ease .15s forwards;
}
.hero__label-dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--brilla-yellow);
  flex-shrink: 0;
  box-shadow: 0 0 10px rgba(249,183,28,.9);
}

/* supertítulo de marca */
.hero__claim {
  font-size: .72rem;
  font-weight: 700;
  color: rgba(255,255,255,.9);
  text-transform: uppercase;
  letter-spacing: 3px;
  margin-bottom: 20px;
  opacity: 0;
  animation: fadeUp .7s ease .2s forwards;
  text-shadow: 0 1px 8px rgba(0,0,0,.7);
}

.hero__title {
  font-size: clamp(2.2rem, 2.8vw, 3.6rem);
  font-weight: 800;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 20px;
  opacity: 0;
  animation: fadeUp .7s ease .36s forwards;
  text-shadow: 0 2px 16px rgba(0,0,0,.8);
}
.hero__title span {
  color: var(--brilla-yellow);
  display: block;
}

.hero__subtitle {
  font-size: clamp(.95rem, 1.1vw, 1.05rem);
  color: rgba(255,255,255,.9);
  max-width: 420px;
  margin-bottom: 36px;
  line-height: 1.75;
  opacity: 0;
  animation: fadeUp .7s ease .5s forwards;
  text-shadow: 0 1px 10px rgba(0,0,0,.75);
}

/* botones hero pequeños */
.hero__ctas .btn { padding: 10px 18px; font-size: .82rem; }

.hero__ctas {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  margin-bottom: 24px;
  opacity: 0;
  animation: fadeUp .7s ease .76s forwards;
}

.hero__benefits {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  grid-auto-flow: column;
  gap: 8px 32px;
  opacity: 0;
  animation: fadeUp .7s ease .8s forwards;
}
.hero__benefit {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: .78rem;
  font-weight: 600;
  color: rgba(255,255,255,.95);
  white-space: nowrap;
  text-shadow: 0 1px 8px rgba(0,0,0,.7);
}
.hero__benefit-icon {
  width: 20px; height: 20px;
  background: var(--brilla-yellow);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.hero__benefit-icon svg { width: 12px; height: 12px; color: var(--gray-900); }

/* badge flotante con stats — esquina inferior derecha */
.hero__badge {
  position: absolute;
  z-index: 2;
  bottom: 72px;
  right: max(48px, calc((100vw - var(--max-w)) / 2 + 24px));
  display: flex;
  gap: 0;
  background: rgba(255,255,255,.09);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 16px;
  overflow: hidden;
  opacity: 0;
  animation: fadeUp .7s ease 1.05s forwards;
}
.hero__badge-item {
  padding: 18px 28px;
  text-align: center;
}
.hero__badge-num {
  display: block;
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1;
  margin-bottom: 5px;
  letter-spacing: -.5px;
}
.hero__badge-lbl {
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.68);
}
.hero__badge-sep {
  width: 1px;
  background: rgba(255,255,255,.14);
  align-self: stretch;
}

/* scroll indicator */
.hero__scroll {
  position: absolute;
  bottom: 32px; left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  opacity: .55;
}
.hero__scroll-line {
  width: 1px; height: 40px;
  background: var(--white);
  animation: scrollLine 2s ease infinite;
}
@keyframes scrollLine { 0%,100%{opacity:.3;transform:scaleY(.5)} 50%{opacity:1;transform:scaleY(1)} }

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* === ACCESOS RÁPIDOS — Quick Cards key visual ============= */
.quick-cards {
  position: relative;
  z-index: 10;
  background: var(--gray-900);
  margin-top: 0;
}
.quick-cards__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  height: 250px;
}

.quick-card--cupo { --qc-a: #C8001A; --qc-b: #EA0029; }
.quick-card--credito { --qc-a: #8C0015; --qc-b: #C8001A; }
.quick-card--factura { --qc-a: #005F8A; --qc-b: #00A0DF; }
.quick-card--seguros { --qc-a: #007A6E; --qc-b: #3BD4AE; }
.quick-card--ofertas { --qc-a: #D4A000; --qc-b: #FCDC3E; }

.quick-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 22px 20px 26px;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(145deg, var(--qc-a), var(--qc-b));
  border-right: 1px solid rgba(255,255,255,.08);
  transition: transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s;
  will-change: transform;
}
.quick-card:last-child { border-right: none; }
.quick-card:hover { transform: translateY(-6px); box-shadow: 0 20px 44px rgba(0,0,0,.4); z-index: 2; }

/* Número grande semi-transparente */
.quick-card__num {
  position: absolute;
  top: 14px; left: 18px;
  font-size: 3rem;
  font-weight: 800;
  color: rgba(255,255,255,.16);
  line-height: 1;
  letter-spacing: -2px;
  z-index: 1;
  font-family: inherit;
}
.quick-card--light .quick-card__num { color: rgba(0,0,0,.12); }

/* Anillos concéntricos decorativos */
.quick-card__rings {
  position: absolute;
  top: 50%; right: -52px;
  transform: translateY(-50%);
  width: 270px; height: 270px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.14);
  z-index: 1;
  pointer-events: none;
}
.quick-card__rings::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 190px; height: 190px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.11);
}
.quick-card__rings::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 110px; height: 110px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.09);
}
.quick-card--light .quick-card__rings { border-color: rgba(0,0,0,.1); }
.quick-card--light .quick-card__rings::before { border-color: rgba(0,0,0,.08); }
.quick-card--light .quick-card__rings::after { border-color: rgba(0,0,0,.06); }

/* Imagen circular */
.quick-card__circle {
  position: absolute;
  top: 50%; right: -28px;
  transform: translateY(-50%);
  width: 160px; height: 160px;
  border-radius: 50%;
  overflow: hidden;
  border: 3px solid rgba(255,255,255,.28);
  z-index: 2;
  transition: transform .4s cubic-bezier(.22,.61,.36,1);
  box-shadow: 0 8px 28px rgba(0,0,0,.25);
}
.quick-card__circle img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
}
.quick-card:hover .quick-card__circle { transform: translateY(-50%) scale(1.06); }
.quick-card--light .quick-card__circle { border-color: rgba(0,0,0,.15); }

/* Texto */
.quick-card__body {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 52%;
  transition: transform .3s ease;
}
.quick-card:hover .quick-card__body { transform: translateY(-4px); }

.quick-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px; height: 36px;
  border-radius: 10px;
  background: rgba(255,255,255,.18);
  color: #fff;
  margin-bottom: 10px;
  flex-shrink: 0;
}
.quick-card--light .quick-card__icon { background: rgba(0,0,0,.12); color: var(--gray-900); }

.quick-card__label {
  font-size: .82rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.quick-card--light .quick-card__label { color: var(--gray-900); }

.quick-card__sub {
  font-size: .67rem;
  font-weight: 500;
  color: rgba(255,255,255,.65);
  line-height: 1.3;
}
.quick-card--light .quick-card__sub { color: rgba(0,0,0,.5); }

/* Línea inferior hover */
.quick-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(255,255,255,.5);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.22,.61,.36,1);
}
.quick-card--light::after { background: rgba(0,0,0,.25); }
.quick-card:hover::after { transform: scaleX(1); }

/* Botón inferior izquierdo */
.quick-card__cta {
  position: absolute;
  bottom: 16px; left: 20px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 20px;
  padding: 5px 10px;
  backdrop-filter: blur(4px);
  transition: background .2s, color .2s;
}
.quick-card:hover .quick-card__cta {
  background: rgba(255,255,255,.28);
  color: #fff;
}
.quick-card--light .quick-card__cta {
  color: rgba(0,0,0,.75);
  background: rgba(0,0,0,.1);
  border-color: rgba(0,0,0,.2);
}
.quick-card--light:hover .quick-card__cta {
  background: rgba(0,0,0,.18);
  color: rgba(0,0,0,.9);
}

/* === CATEGORÍAS — cat-section bento premium ================== */

.cat-section {
  background: linear-gradient(
    to bottom,
    #004f80 0%,
    #0081c8 35%,
    #00A0DF 60%,
    #5dcfff 85%,
    #b8eaff 100%
  );
  padding: 96px 0 0;
  overflow: visible;
  position: relative;
}

/* ── Header editorial ── */
.cat-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding-bottom: 36px;
  gap: 0;
  position: relative;
  z-index: 1;
}

.cat-head__text { flex: 1 1 auto; }

.cat-head__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
  color: rgba(255,255,255,.55);
  margin-bottom: 16px;
}
.cat-head__eyebrow::before {
  content: '';
  display: inline-block;
  width: 24px;
  height: 2px;
  background: var(--brilla-red);
  flex-shrink: 0;
}

.cat-head__title {
  font-size: clamp(2rem, 3.5vw, 3.8rem);
  font-weight: 800;
  color: #fff;
  line-height: 1.0;
  letter-spacing: -.02em;
  white-space: nowrap;
}

.cat-head__accent { color: var(--brilla-yellow); }

.cat-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
  max-width: 700px;
}
.cat-tag-cta {
  margin-left: 4px;
}
.cat-tag {
  display: inline-flex;
  align-items: center;
  font-family: var(--font);
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .4px;
  color: #fff;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 999px;
  padding: 5px 14px;
  backdrop-filter: blur(6px);
  transition: background .2s, border-color .2s;
  cursor: default;
  white-space: nowrap;
}
.cat-tag:hover {
  background: rgba(255,255,255,.28);
  border-color: rgba(255,255,255,.6);
}

.cat-head__side {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
  padding-bottom: 6px;
}

.cat-head__big {
  font-size: clamp(4rem, 7vw, 8rem);
  font-weight: 900;
  line-height: 1;
  color: rgba(255,255,255,.05);
  letter-spacing: -4px;
  user-select: none;
}


/* ════════════════════════════════════════════════════════════
   BENTO GRID — card style editorial (texto sobre imagen)
   ════════════════════════════════════════════════════════════ */

/* Grid base — mobile 2 col */
.cat-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: 195px;
  gap: 6px;
  padding: 0 6px 80px;
  position: relative;
  z-index: 1;
  width: 100%;
  counter-reset: catnum;
}
.cat-grid .cat-card--last { grid-column: 1/-1; }

/* ── Card ── */
.cat-card {
  counter-increment: catnum;
  border-radius: 12px;
  position: relative;
  text-decoration: none;
  display: block;
  cursor: pointer;
  min-height: 0;
  box-shadow: 0 4px 20px rgba(0,0,0,.28);
  perspective: 1000px;
  transition: transform .4s cubic-bezier(.22,.68,0,1.08),
              box-shadow .4s ease;
}
.cat-grid .cat-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 28px 70px rgba(0,0,0,.6);
  z-index: 10;
}

/* ── Flip inner ── */
.cat-card-inner {
  position: relative;
  width: 100%; height: 100%;
  transform-style: preserve-3d;
  transition: transform .55s cubic-bezier(.4,0,.2,1);
  border-radius: inherit;
}
.cat-grid .cat-card:hover .cat-card-inner {
  transform: rotateY(180deg);
}
.cat-card__front,
.cat-card__back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border-radius: inherit;
  overflow: hidden;
}

/* ── Dorso ── */
.cat-card__back {
  transform: rotateY(180deg);
  background: var(--card-accent, #E8212A);
  padding: 26px 24px 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0;
}
.cat-card__back::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(150deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.3) 100%);
  border-radius: inherit;
  pointer-events: none;
}
.cat-card__back-eyebrow {
  position: relative;
  font-size: .58rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: rgba(255,255,255,.75);
  margin-bottom: 7px;
}
.cat-card__back-title {
  position: relative;
  font-size: .95rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255,255,255,.35);
}
.cat-card__back-list {
  position: relative;
  list-style: none;
  margin: 0 0 14px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.cat-card__back-list li {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: .74rem;
  font-weight: 500;
  color: rgba(255,255,255,.93);
  line-height: 1.3;
}
.cat-card__back-list li::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: rgba(255,255,255,.9);
  flex-shrink: 0;
}
.cat-card__back-cta {
  display: none;
}

/* Cards grandes — más espacio y tipografía mayor */
/* Card 1 — Electrodomésticos grande */
.cat-grid .cat-card:nth-child(1) .cat-card__back { padding: 32px 28px; }
.cat-grid .cat-card:nth-child(1) .cat-card__back-title { font-size: 1.2rem; margin-bottom: 18px; padding-bottom: 14px; }
.cat-grid .cat-card:nth-child(1) .cat-card__back-list li { font-size: .82rem; gap: 11px; }
.cat-grid .cat-card:nth-child(1) .cat-card__back-list { gap: 11px; margin-bottom: 18px; }

/* Cards angostas con 2 columnas: Muebles (5), Materiales (6), Gasodomésticos (7) */
.cat-grid .cat-card:nth-child(5) .cat-card__back-list,
.cat-grid .cat-card:nth-child(6) .cat-card__back-list,
.cat-grid .cat-card:nth-child(7) .cat-card__back-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 20px;
  margin-bottom: 0;
}
.cat-grid .cat-card:nth-child(5) .cat-card__back-list li,
.cat-grid .cat-card:nth-child(6) .cat-card__back-list li,
.cat-grid .cat-card:nth-child(7) .cat-card__back-list li { font-size: .7rem; gap: 7px; }

/* Card 10 — Útiles Escolares ancha: 2 columnas */
.cat-grid .cat-card:nth-child(10) .cat-card__back { padding: 32px 36px; justify-content: center; }
.cat-grid .cat-card:nth-child(10) .cat-card__back-title { font-size: 1.25rem; margin-bottom: 18px; padding-bottom: 14px; }
.cat-grid .cat-card:nth-child(10) .cat-card__back-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 40px;
  margin-bottom: 0;
}
.cat-grid .cat-card:nth-child(10) .cat-card__back-list li { font-size: .82rem; gap: 10px; }

/* Card 11 — Salud Oral ancha: 2 columnas */
.cat-grid .cat-card:nth-child(11) .cat-card__back { padding: 32px 36px; justify-content: center; }
.cat-grid .cat-card:nth-child(11) .cat-card__back-title { font-size: 1.25rem; margin-bottom: 18px; padding-bottom: 14px; }
.cat-grid .cat-card:nth-child(11) .cat-card__back-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px 40px;
  margin-bottom: 0;
}
.cat-grid .cat-card:nth-child(11) .cat-card__back-list li { font-size: .82rem; gap: 10px; }

.cat-grid .cat-card:nth-child(2) .cat-card__back { padding: 36px 32px; }
.cat-grid .cat-card:nth-child(2) .cat-card__back-title { font-size: 1.5rem; margin-bottom: 20px; padding-bottom: 16px; }
.cat-grid .cat-card:nth-child(2) .cat-card__back-list li { font-size: .88rem; gap: 12px; }
.cat-grid .cat-card:nth-child(2) .cat-card__back-list { gap: 13px; margin-bottom: 20px; }

/* ── Foto ── */
.cat-card__img {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
  transition: transform .9s cubic-bezier(.25,.46,.45,.94);
}
.cat-card:hover .cat-card__img { transform: scale(1.16); }

/* ── Gradiente cinemático ── */
.cat-card__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to top,
    rgba(0,0,0,.72) 0%,
    rgba(0,0,0,.28) 40%,
    transparent 70%
  );
  z-index: 1;
  pointer-events: none;
}

/* ── Números eliminados ── */
.cat-card::before { display: none; }

/* ── Color de acento por carta (variable compartida) ── */
.cat-grid .cat-card:nth-child(1)  { --card-accent: #E8212A; }
.cat-grid .cat-card:nth-child(2)  { --card-accent: #F9B71C; }
.cat-grid .cat-card:nth-child(3)  { --card-accent: #E8212A; }
.cat-grid .cat-card:nth-child(4)  { --card-accent: #F47A30; }
.cat-grid .cat-card:nth-child(5)  { --card-accent: #F9B71C; }
.cat-grid .cat-card:nth-child(6)  { --card-accent: #E8212A; }
.cat-grid .cat-card:nth-child(7)  { --card-accent: #F47A30; }
.cat-grid .cat-card:nth-child(8)  { --card-accent: #12B09A; }
.cat-grid .cat-card:nth-child(9)  { --card-accent: #F9B71C; }
.cat-grid .cat-card:nth-child(10) { --card-accent: #E8212A; }
.cat-grid .cat-card:nth-child(11) { --card-accent: #12B09A; }

/* ── Línea de acento inferior en hover ── */
.cat-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  height: 4px;
  width: 0;
  background: var(--card-accent, #E8212A);
  border-radius: 0 0 12px 12px;
  z-index: 5;
  transition: width .45s cubic-bezier(.25,.46,.45,.94);
}
.cat-card:hover::after { width: 100%; }

/* ── Body — texto directamente sobre imagen ── */
.cat-card__body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 20px 18px 22px 20px;
  z-index: 3;
  background: none;
}
.cat-card__body::before { display: none; }

/* ── Nombre ── */
.cat-card__name {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  margin-bottom: 7px;
  letter-spacing: -.01em;
  text-shadow: 0 1px 8px rgba(0,0,0,.5);
  transition: transform .3s ease;
}
.cat-card__name::before {
  content: '';
  display: block;
  width: 28px;
  height: 3px;
  border-radius: 2px;
  background: var(--card-accent, #E8212A);
  margin-bottom: 9px;
  transition: width .35s cubic-bezier(.25,.46,.45,.94);
}
.cat-card:hover .cat-card__name::before { width: 48px; }
.cat-card:hover .cat-card__name { transform: translateY(-3px); }

/* ── Link Explorar — visible siempre como caption ── */
.cat-card__link {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: .65rem;
  font-weight: 600;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: 1.5px;
  transition: color .3s ease, gap .25s ease;
}
.cat-card:hover .cat-card__link { color: var(--brilla-yellow); gap: 10px; }

/* ── Badge MEGACUPO ── */
.cat-card__badge {
  position: absolute;
  top: 14px; left: 14px;
  background: var(--brilla-red);
  color: #fff;
  font-size: .58rem;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 5px 12px;
  border-radius: 20px;
  z-index: 6;
  box-shadow: 0 4px 14px rgba(232,33,42,.5);
}

/* ════════════════════════════════════════════════════════════
   BENTO DESKTOP — Mosaico editorial asimétrico premium
   6 cols, 4 filas:
   r1-r2: Elec GRANDE 2×2 | col gap | Movilidad HERO 2×3 | col borde
   r3:    Gas | Audio WIDE | Movilidad cont. | Moda
   r4:    Útiles 2c (1/3) + Salud Oral 4c (2/3) — fila asimétrica
   ════════════════════════════════════════════════════════════ */
@media (min-width: 1024px) {
  .cat-grid {
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 225px 190px 190px 215px;
    gap: 6px;
    padding: 0 6px 80px;
  }
  .cat-grid .cat-card--last { grid-column: auto; }

  /* ── Mosaico asimétrico editorial ── */
  .cat-grid .cat-card:nth-child(1)  { grid-column: 1/3; grid-row: 1/3; }  /* Electrodomésticos GRANDE 2×2 */
  .cat-grid .cat-card:nth-child(2)  { grid-column: 4/6; grid-row: 1/4; }  /* Movilidad HERO 2×3 */
  .cat-grid .cat-card:nth-child(3)  { grid-column: 3/4; grid-row: 1/2; }  /* Tecnología */
  .cat-grid .cat-card:nth-child(4)  { grid-column: 6/7; grid-row: 1/2; }  /* Celulares */
  .cat-grid .cat-card:nth-child(5)  { grid-column: 3/4; grid-row: 2/3; }  /* Muebles */
  .cat-grid .cat-card:nth-child(6)  { grid-column: 6/7; grid-row: 2/3; }  /* Materiales */
  .cat-grid .cat-card:nth-child(7)  { grid-column: 1/2; grid-row: 3/4; }  /* Gasodomésticos */
  .cat-grid .cat-card:nth-child(8)  { grid-column: 2/4; grid-row: 3/4; }  /* Audio y Video WIDE */
  .cat-grid .cat-card:nth-child(9)  { grid-column: 6/7; grid-row: 3/4; }  /* Moda y Textil */
  .cat-grid .cat-card:nth-child(10) { grid-column: 1/4; grid-row: 4/5; }  /* Útiles Escolares 3 cols */
  .cat-grid .cat-card:nth-child(11) { grid-column: 4/7; grid-row: 4/5; }  /* Salud Oral 3 cols */

  .cat-card { border-radius: 12px; }

  /* ── Electrodomésticos GRANDE 2×2 ── */
  .cat-grid .cat-card:nth-child(1) .cat-card__name { font-size: 1.55rem; font-weight: 800; margin-bottom: 10px; }
  .cat-grid .cat-card:nth-child(1) .cat-card__body  { padding: 24px 22px 28px 26px; }

  /* ── Movilidad HERO 2×3 ── */
  .cat-grid .cat-card:nth-child(2) .cat-card__name { font-size: 2.2rem; font-weight: 800; margin-bottom: 14px; letter-spacing: -.02em; }
  .cat-grid .cat-card:nth-child(2) .cat-card__body  { padding: 32px 28px 36px 32px; }
  .cat-grid .cat-card:nth-child(2) .cat-card__link  { font-size: .75rem; }
  .cat-grid .cat-card:nth-child(2) .cat-card__badge { top: 22px; left: 22px; font-size: .65rem; padding: 7px 16px; }
  .cat-grid .cat-card:nth-child(2):hover             { transform: translateY(-6px); box-shadow: 0 40px 100px rgba(0,0,0,.7); z-index: 10; }

  /* ── Audio WIDE fila 3 ── */
  .cat-grid .cat-card:nth-child(8) .cat-card__name  { font-size: 1.05rem; }

  /* ── Salud Oral 3 cols fila final ── */
  .cat-grid .cat-card:nth-child(11) .cat-card__name { font-size: 1.65rem; font-weight: 800; margin-bottom: 10px; letter-spacing: -.01em; }
  .cat-grid .cat-card:nth-child(11) .cat-card__body  { padding: 24px 28px 30px 32px; }
}

/* ── 1024–1279px — pantallas medianas ── */
@media (min-width: 1024px) and (max-width: 1279px) {
  .cat-section { padding-top: 48px; }
  .cat-head { padding-bottom: 28px; }
  .cat-head__title { font-size: 2.4rem; line-height: 1.1; }
  .cat-tags { margin-top: 14px; gap: 7px; }
  .cat-tag { font-size: .68rem; padding: 5px 12px; }
  .cat-grid {
    grid-template-rows: 175px 155px 155px 175px;
    gap: 6px;
  }
}

/* ── 1280px+ — desktop estándar y wide ── */
@media (min-width: 1280px) {
  .cat-section { padding-top: 64px; }
  .cat-head { padding-bottom: 36px; }
  .cat-head__title { font-size: 3rem; line-height: 1.1; }
  .cat-tags { margin-top: 18px; gap: 8px; }
  .cat-tag { font-size: .72rem; padding: 6px 14px; }
  .cat-grid {
    grid-template-rows: 215px 185px 185px 215px;
    gap: 7px;
  }
}

/* === CÓMO USAR BRILLA — steps-section ===================== */

.steps-section {
  position: relative;
  background: #fff;
  padding: 100px 0 90px;
  overflow: hidden;
}

/* Círculo decorativo grande — acento amarillo sutil */
.steps-section::before {
  content: '';
  position: absolute;
  top: 50%; right: -280px;
  transform: translateY(-50%);
  width: 700px; height: 700px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(249,183,28,.12) 0%, transparent 70%);
  z-index: 0;
  pointer-events: none;
}

/* Segundo acento — esquina inferior izquierda */
.steps-section::after {
  content: '';
  position: absolute;
  bottom: -160px; left: -160px;
  width: 500px; height: 500px;
  border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(232,33,42,.07) 0%, transparent 70%);
  z-index: 0;
  pointer-events: none;
}

/* Brazos decorativos — quitar X, usar línea horizontal sutil */
.steps-deco {
  display: none;
}

.steps-head {
  text-align: center;
  margin-bottom: 72px;
  position: relative;
  z-index: 1;
}

.steps-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--brilla-red);
  margin-bottom: 16px;
}
.steps-eyebrow::before,
.steps-eyebrow::after {
  content: '';
  display: block;
  width: 24px;
  height: 1.5px;
  background: var(--brilla-red);
  opacity: .5;
}

.steps-title {
  font-size: clamp(2.2rem, 4vw, 3.8rem);
  font-weight: 800;
  color: var(--gray-900);
  line-height: 1.06;
  margin-bottom: 16px;
}
.steps-accent { color: var(--brilla-red); }

.steps-sub {
  font-size: 1rem;
  color: var(--gray-500);
  max-width: 480px;
  margin: 0 auto;
  line-height: 1.7;
}

/* Grid de pasos + conectores */
.steps-grid {
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: 0;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
  position: relative;
  z-index: 1;
}

/* Flecha conectora */
.step-connector {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  margin-top: 60px;
  opacity: .6;
}

/* Card de paso */
.step-card {
  flex: 1;
  position: relative;
  background: #fff;
  border: 1px solid var(--gray-100);
  border-radius: 24px;
  padding: 36px 28px 40px;
  box-shadow: 0 4px 24px rgba(0,0,0,.06);
  transition: box-shadow .3s ease, border-color .3s ease, transform .35s ease;
  overflow: hidden;
}
.step-card:hover {
  box-shadow: 0 16px 48px rgba(0,0,0,.12);
  border-color: var(--sc);
  transform: translateY(-8px);
}

/* Número decorativo de fondo */
.step-card__num {
  position: absolute;
  top: -16px;
  right: 16px;
  font-size: 7.5rem;
  font-weight: 900;
  color: rgba(0,0,0,.04);
  line-height: 1;
  user-select: none;
  pointer-events: none;
  transition: color .3s ease;
}
.step-card:hover .step-card__num { color: rgba(0,0,0,.07); }

/* Top con icono */
.step-card__top {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  margin-bottom: 28px;
}

.step-card__icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  background: var(--sc);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 8px 24px color-mix(in srgb, var(--sc) 40%, transparent);
  transition: box-shadow .3s ease, transform .3s ease;
}
.step-card:hover .step-card__icon {
  transform: scale(1.08);
  box-shadow: 0 12px 32px color-mix(in srgb, var(--sc) 55%, transparent);
}

/* Contenido */
.step-card__body { position: relative; z-index: 1; }

.step-card__title {
  font-size: 1.08rem;
  font-weight: 700;
  color: var(--gray-900);
  line-height: 1.3;
  margin-bottom: 12px;
}

.step-card__text {
  font-size: .88rem;
  color: var(--gray-500);
  line-height: 1.8;
}

/* Barrita de color en la parte inferior */
.step-card__bar {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 48px;
  height: 3px;
  border-radius: 2px 2px 0 0;
  background: var(--sc);
  transition: width .3s ease;
}
.step-card:hover .step-card__bar { width: 80px; }

/* CTA */
.steps-cta {
  text-align: center;
  margin-top: 64px;
  position: relative;
  z-index: 1;
}

/* Responsive */
@media (max-width: 1023px) {
  .steps-grid { flex-wrap: wrap; gap: 16px; padding: 0 24px; }
  .step-connector { display: none; }
  .step-card { flex: 1 1 calc(50% - 8px); }
}
@media (max-width: 767px) {
  .steps-section { padding: 64px 0 56px; }
  .steps-grid { flex-direction: column; padding: 0 20px; gap: 12px; }
  .step-card { padding: 28px 22px 36px; }
  .step-card__num { font-size: 5rem; }
  .step-card__icon { width: 60px; height: 60px; border-radius: 16px; }
}

/* === CARDS CATEGORÍAS (legacy, mantenidas para otras páginas) */
.category-card {
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 32px 24px;
  text-align: center;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-100);
  transition: var(--transition);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.category-card:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--brilla-red);
  transform: translateY(-4px);
}
.category-card__icon {
  width: 72px; height: 72px;
  border-radius: var(--radius-md);
  background: rgba(232,33,42,.08);
  display: flex; align-items: center; justify-content: center;
  transition: var(--transition);
}
.category-card:hover .category-card__icon { background: var(--brilla-red); }
.category-card__icon svg { width: 36px; height: 36px; color: var(--brilla-red); transition: var(--transition); }
.category-card:hover .category-card__icon svg { color: var(--white); }
.category-card__name {
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-800);
}

/* === GRID ================================================= */
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }

/* === SIMULADOR ============================================ */
.simulator {
  background: var(--gray-900);
  color: var(--white);
  border-radius: var(--radius-lg);
  padding: 48px;
}
.simulator__title { color: var(--white); margin-bottom: 8px; }
.simulator__subtitle { color: rgba(255,255,255,.6); margin-bottom: 40px; }

.simulator__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 32px;
  margin-bottom: 32px;
}
.sim-label {
  display: block;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: rgba(255,255,255,.85);
  margin-bottom: 12px;
}
.sim-value {
  font-size: 2rem;
  font-weight: 700;
  color: var(--brilla-yellow);
  margin-bottom: 16px;
}
.sim-range {
  -webkit-appearance: none;
  width: 100%;
  height: 4px;
  border-radius: 2px;
  background: rgba(255,255,255,.2);
  outline: none;
  cursor: pointer;
}
.sim-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--brilla-yellow);
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(249,183,28,.5);
}
.sim-range::-moz-range-thumb {
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--brilla-yellow);
  cursor: pointer;
  border: none;
}
.sim-plazo {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}
.sim-plazo-btn {
  padding: 10px 4px;
  border-radius: var(--radius-sm);
  font-size: .8rem;
  font-weight: 700;
  color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  transition: var(--transition);
  cursor: pointer;
}
.sim-plazo-btn.active,
.sim-plazo-btn:hover {
  background: var(--brilla-yellow);
  color: var(--gray-900);
  border-color: var(--brilla-yellow);
}
.simulator__result {
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-md);
  padding: 32px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}
.sim-result-item { text-align: center; }
.sim-result-label {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.4);
  margin-bottom: 8px;
}
.sim-result-value {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--white);
}
.sim-result-value.highlight { color: var(--brilla-yellow); font-size: 1.8rem; }

/* === BLOG CARDS =========================================== */
.blog-card {
  background: var(--white);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-100);
  transition: var(--transition);
  display: flex;
  flex-direction: column;
}
.blog-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.blog-card__img {
  aspect-ratio: 630/350;
  background: var(--gray-100);
  overflow: hidden;
  position: relative;
}
.blog-card__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
}
.blog-card:hover .blog-card__img img { transform: scale(1.05); }
.blog-card__badge {
  position: absolute;
  top: 12px; left: 12px;
  background: var(--brilla-red);
  color: var(--white);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: var(--radius-full);
}
.blog-card__body {
  padding: 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.blog-card__meta {
  font-size: .75rem;
  color: var(--gray-400);
  font-weight: 600;
  margin-bottom: 10px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.blog-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 12px;
  line-height: 1.4;
}
.blog-card__excerpt {
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.6;
  flex: 1;
  margin-bottom: 20px;
}
.blog-card__link {
  font-size: .8rem;
  font-weight: 700;
  color: var(--brilla-red);
  display: flex;
  align-items: center;
  gap: 6px;
  transition: gap var(--transition);
}
.blog-card:hover .blog-card__link { gap: 10px; }

/* === OFERTA CARDS ========================================= */
.oferta-card {
  background: var(--white);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-100);
  transition: var(--transition);
}
.oferta-card:hover { box-shadow: var(--shadow-md); transform: translateY(-4px); }
.oferta-card__img {
  aspect-ratio: 1/1;
  background: var(--gray-100);
  overflow: hidden;
  position: relative;
}
.oferta-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.oferta-card:hover .oferta-card__img img { transform: scale(1.05); }
.oferta-card__vigencia {
  position: absolute;
  top: 12px; right: 12px;
  background: var(--brilla-yellow);
  color: var(--gray-900);
  font-size: .7rem;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: var(--radius-full);
}
.oferta-card__body { padding: 20px; }
.oferta-card__aliado { font-size: .75rem; color: var(--gray-400); font-weight: 600; text-transform: uppercase; margin-bottom: 8px; }
.oferta-card__name { font-size: .95rem; font-weight: 700; color: var(--gray-900); margin-bottom: 8px; }
.oferta-card__desc { font-size: .8rem; color: var(--gray-600); margin-bottom: 16px; line-height: 1.5; }

/* === STATS BAR ============================================ */
.stats-bar { background: var(--brilla-red); }
.stats-bar__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.stats-bar__item {
  text-align: center;
  padding: 40px 20px;
  border-right: 1px solid rgba(255,255,255,.15);
}
.stats-bar__item:last-child { border-right: none; }
.stats-bar__num {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1;
  margin-bottom: 8px;
}
.stats-bar__num span { color: var(--brilla-yellow); }
.stats-bar__label {
  font-size: .8rem;
  font-weight: 600;
  color: rgba(255,255,255,.7);
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* === INNER HERO =========================================== */
.inner-hero {
  background: var(--brilla-red-dark);
  padding: calc(var(--nav-h) + 48px) 0 64px;
  position: relative;
  overflow: hidden;
}
.inner-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--brilla-red-dark) 0%, var(--brilla-red) 60%, var(--brilla-red-light) 100%);
  opacity: .9;
}
.inner-hero__bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: .25;
}
.inner-hero__content { position: relative; z-index: 1; }
.inner-hero__breadcrumb {
  font-size: .8rem;
  color: rgba(255,255,255,.6);
  font-weight: 600;
  margin-bottom: 12px;
}
.inner-hero__breadcrumb a { color: rgba(255,255,255,.6); }
.inner-hero__breadcrumb a:hover { color: var(--white); }
.inner-hero__title { color: var(--white); margin-bottom: 16px; }
.inner-hero__subtitle { color: rgba(255,255,255,.8); max-width: 600px; }

/* === FORM ================================================= */
.form-group { margin-bottom: 20px; }
.form-label {
  display: block;
  font-size: .8rem;
  font-weight: 700;
  color: var(--gray-700);
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.form-control {
  width: 100%;
  padding: 14px 16px;
  border: 2px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: 'Montserrat', sans-serif;
  font-size: .9rem;
  color: var(--gray-800);
  background: var(--white);
  transition: border-color var(--transition);
  outline: none;
}
.form-control:focus { border-color: var(--brilla-red); }
select.form-control { cursor: pointer; }
textarea.form-control { resize: vertical; min-height: 120px; }
.form-hint {
  font-size: .75rem;
  color: var(--gray-400);
  margin-top: 6px;
}

/* === TABS ================================================= */
.tabs { display: flex; gap: 0; border-bottom: 2px solid var(--gray-200); margin-bottom: 32px; }
.tab-btn {
  padding: 14px 24px;
  font-family: 'Montserrat', sans-serif;
  font-size: .875rem;
  font-weight: 700;
  color: var(--gray-400);
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: var(--transition);
  cursor: pointer;
}
.tab-btn.active { color: var(--brilla-red); border-bottom-color: var(--brilla-red); }
.tab-btn:hover:not(.active) { color: var(--gray-700); }
.tab-content { display: none; }
.tab-content.active { display: block; }

/* === FILTERS ============================================== */
.filter-bar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 32px; justify-content: center; }
.filter-btn {
  padding: 8px 20px;
  border-radius: var(--radius-full);
  font-size: .8rem;
  font-weight: 700;
  background: var(--gray-100);
  color: var(--gray-600);
  border: 2px solid transparent;
  transition: var(--transition);
  cursor: pointer;
}
.filter-btn.active,
.filter-btn:hover { background: var(--brilla-red); color: var(--white); }

/* === SEGURO CARDS ========================================= */
.seguro-card {
  background: #fff;
  border-radius: var(--radius-md);
  border: 1px solid var(--gray-100);
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .3s ease, box-shadow .3s ease;
}
.seguro-card:hover { box-shadow: 0 12px 36px rgba(0,100,190,.14); transform: translateY(-5px); }

/* Imagen superior */
.seguro-card__img {
  position: relative;
  aspect-ratio: 3/2;
  overflow: hidden;
}
.seguro-card__img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .45s ease;
}
.seguro-card:hover .seguro-card__img img { transform: scale(1.06); }
.seguro-card__img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 35%, rgba(0,60,120,.55) 100%);
}
/* Icono badge sobre imagen */
.seguro-card__icon {
  position: absolute;
  bottom: 14px; left: 16px;
  width: 44px; height: 44px;
  border-radius: 10px;
  background: var(--brilla-blue);
  display: flex; align-items: center; justify-content: center;
  border: 2px solid rgba(255,255,255,.35);
  box-shadow: 0 4px 14px rgba(0,0,0,.25);
}
.seguro-card__icon svg { width: 22px; height: 22px; color: #fff; }

/* Cuerpo */
.seguro-card__body {
  padding: 20px 24px 24px;
  display: flex;
  flex-direction: column;
  flex: 1;
  border-top: 3px solid var(--brilla-teal);
}
.seguro-card__name { font-size: 1.05rem; font-weight: 700; color: var(--gray-900); margin-bottom: 10px; }
.seguro-card__desc { font-size: .875rem; color: var(--gray-600); line-height: 1.6; margin-bottom: 20px; flex: 1; }

/* Botones y textos seguros — teal */
.btn--teal { background: var(--brilla-teal-dark); color: #fff; font-weight: 700; }
.btn--teal:hover { background: #008a82; transform: translateY(-2px); }
.text-teal { color: var(--brilla-teal-dark); }

/* === CTA SECTION ========================================== */
.cta-section {
  background: #fff;
  padding: 80px 0;
  text-align: center;
}
.cta-section__title { color: var(--gray-900); margin-bottom: 16px; }
.cta-section__subtitle { color: var(--gray-500); max-width: 500px; margin: 0 auto 40px; }
.cta-section__btns { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }

/* === FAB ACCESOS RÁPIDOS ================================== */
.qfab {
  position: fixed;
  bottom: 96px; right: 28px;
  z-index: 500;
  height: 44px;
  padding: 0 16px 0 12px;
  background: var(--brilla-red);
  border: none; border-radius: 999px;
  display: flex; align-items: center; gap: 7px;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(232,33,42,.45);
  transition: transform var(--transition), box-shadow var(--transition), padding var(--transition);
  white-space: nowrap;
}
.qfab:hover { transform: scale(1.04); box-shadow: 0 6px 28px rgba(232,33,42,.6); }
.qfab__icon { color: #fff; transition: opacity .2s, transform .2s; flex-shrink: 0; }
.qfab__icon--close { display: none; }
.qfab.is-open .qfab__icon--grid { display: none; }
.qfab.is-open .qfab__icon--close { display: block; }
.qfab__label {
  font-family: var(--font);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase;
  color: #fff;
  transition: opacity .2s;
}
.qfab.is-open .qfab__label { opacity: 0; width: 0; overflow: hidden; padding: 0; }

.qfab__menu {
  position: fixed;
  bottom: 164px; right: 28px;
  z-index: 499;
  width: 260px;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(0,0,0,.18);
  overflow: hidden;
  transform: scale(.9) translateY(10px);
  opacity: 0;
  pointer-events: none;
  transform-origin: bottom right;
  transition: transform .22s cubic-bezier(.34,1.56,.64,1), opacity .18s ease;
}
.qfab__menu.is-open {
  transform: scale(1) translateY(0);
  opacity: 1;
  pointer-events: all;
}
.qfab__item {
  display: flex; align-items: center; gap: 14px;
  padding: 13px 16px;
  text-decoration: none;
  transition: background .15s;
  border-bottom: 1px solid #f0f0f0;
}
.qfab__item:last-child { border-bottom: none; }
.qfab__item:hover { background: #fafafa; }
.qfab__item-icon {
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: #fff;
}
.qfab__item-label {
  display: flex; flex-direction: column;
  font-size: .88rem; font-weight: 600;
  color: var(--gray-900); line-height: 1.2;
}
.qfab__item-label small {
  font-size: .72rem; font-weight: 400;
  color: var(--gray-500); margin-top: 2px;
}

/* === WHATSAPP ============================================= */
.wa-fab {
  position: fixed;
  bottom: 28px; right: 28px;
  z-index: 500;
  width: 56px; height: 56px;
  background: #25D366;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(37,211,102,.45);
  cursor: pointer;
  transition: transform var(--transition), box-shadow var(--transition);
}
.wa-fab::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow: 0 4px 32px rgba(37,211,102,.7);
  opacity: 0;
  pointer-events: none;
  animation: waPulse 2.5s ease infinite;
}
.wa-fab:hover { transform: scale(1.08); }
@keyframes waPulse {
  0%,100% { opacity: 0; }
  50% { opacity: 1; }
}
.wa-popup {
  position: fixed;
  bottom: 96px; right: 28px;
  z-index: 499;
  width: 300px;
  background: var(--white);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  transform: scale(.9) translateY(8px);
  opacity: 0;
  pointer-events: none;
  transform-origin: bottom right;
  transition: transform var(--transition), opacity var(--transition);
}
.wa-popup.is-open { transform: scale(1) translateY(0); opacity: 1; pointer-events: all; z-index: 501; }
.wa-popup__head {
  background: #075E54;
  padding: 16px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.wa-popup__avatar {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: #25D366;
  display: flex; align-items: center; justify-content: center;
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--white);
  flex-shrink: 0;
}
.wa-popup__head strong { display: block; color: var(--white); font-size: .9rem; }
.wa-popup__head span { color: #a5d6a7; font-size: .75rem; }
.wa-popup__head button { margin-left: auto; color: rgba(255,255,255,.6); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.wa-popup__body { padding: 20px; background: #e5ddd5; }
.wa-popup__bubble {
  background: var(--white);
  padding: 10px 14px;
  border-radius: 0 10px 10px 10px;
  font-size: .875rem;
  color: var(--gray-800);
  line-height: 1.5;
  box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.wa-popup__btn {
  display: block;
  margin: 16px;
  padding: 12px;
  background: #25D366;
  color: var(--white);
  font-weight: 700;
  font-size: .875rem;
  text-align: center;
  border-radius: var(--radius-sm);
  transition: background var(--transition);
}
.wa-popup__btn:hover { background: #128C7E; }

/* ═══════════════════════════════════════════════════════════
   FOOTER — naranja PANTONE 171C, grid 4 columnas
   ═══════════════════════════════════════════════════════════ */
.footer {
  background: linear-gradient(135deg, #B82C0C 0%, #D94020 38%, #FF5C35 70%, #FF7244 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}

/* Línea superior amarilla */
.footer::before {
  content: '';
  display: block;
  height: 3px;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.3) 20%, var(--brilla-yellow) 55%, rgba(255,255,255,.3) 85%, transparent 100%);
  position: relative;
  z-index: 2;
}

/* Anillos concéntricos — derecha */
.footer__rings {
  position: absolute;
  top: 50%; right: -8%;
  transform: translateY(-50%);
  width: 680px; height: 680px;
  background: radial-gradient(circle,
    transparent calc(20% - 1px), rgba(255,255,255,.2) 20%, rgba(255,255,255,.2) calc(20% + 2px), transparent calc(20% + 2px),
    transparent calc(38% - 1px), rgba(255,255,255,.12) 38%, rgba(255,255,255,.12) calc(38% + 2px), transparent calc(38% + 2px),
    transparent calc(57% - 1px), rgba(255,255,255,.07) 57%, rgba(255,255,255,.07) calc(57% + 1.5px), transparent calc(57% + 1.5px),
    transparent calc(76% - 1px), rgba(255,255,255,.04) 76%, rgba(255,255,255,.04) calc(76% + 1px), transparent calc(76% + 1px)
  );
  pointer-events: none;
  z-index: 0;
}

/* Watermark BRILLA */
.footer__watermark {
  position: absolute;
  bottom: -0.08em;
  left: 50%;
  transform: translateX(-50%);
  font-size: 15rem;
  font-weight: 900;
  line-height: 1;
  white-space: nowrap;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,.1);
  pointer-events: none;
  user-select: none;
  z-index: 0;
  letter-spacing: -0.02em;
}

/* ─── FILA 1: marca + nav ─── */
.footer__top {
  padding: 52px 0 44px;
  position: relative;
  z-index: 1;
}

.footer__top-grid {
  display: grid;
  grid-template-columns: 200px 1fr 148px 148px;
  gap: 48px;
  align-items: start;
}

.footer__brand {
  display: flex;
  flex-direction: column;
  gap: 24px;
  grid-column: 1 / 3;
}

.footer__logo {
  width: 160px;
  height: auto;
  display: block;
  filter: brightness(0) invert(1);
}

.footer__vigilado { display: flex; }
.footer__vigilado-img {
  height: 52px;
  width: auto;
  display: block;
}

.footer__col { /* nav column */ }

.footer__col-title {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .15em;
  color: rgba(255,255,255,.55);
  margin-bottom: 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255,255,255,.22);
}

.footer__links { display: flex; flex-direction: column; gap: 12px; list-style: none; }
.footer__link {
  font-size: .875rem;
  color: rgba(255,255,255,.8);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0;
  transition: color .2s, gap .2s;
}
.footer__link::before {
  content: '';
  display: inline-block;
  width: 0; height: 1.5px;
  background: var(--brilla-yellow);
  transition: width .22s;
  flex-shrink: 0;
}
.footer__link:hover { color: #fff; gap: 8px; }
.footer__link:hover::before { width: 10px; }

/* ─── FILA 2: banda de contacto — ancho 100%, nunca se corta ─── */
.footer__cband {
  background: rgba(0,0,0,.28);
  border-top: 1px solid rgba(255,255,255,.18);
  border-bottom: 1px solid rgba(255,255,255,.08);
  padding: 28px 0;
  position: relative;
  z-index: 1;
}

.footer__cband-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  align-items: start;
}

.footer__citem {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 6px 24px;
}
.footer__citem:first-child { padding-left: 0; }
.footer__citem:last-child  { padding-right: 0; }
.footer__citem:not(:last-child) { border-right: 1px solid rgba(255,255,255,.15); }

.footer__citem-icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.22);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  color: #fff;
  transition: background .2s;
}
.footer__citem-icon svg { width: 17px; height: 17px; }

/* Ícono de acento amarillo — línea gratuita */
.footer__citem-icon--accent {
  background: rgba(249,183,28,.18);
  border-color: rgba(249,183,28,.38);
  color: #F9B71C;
}

.footer__citem-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.footer__citem-label {
  font-size: .58rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: #F9B71C;
  display: block;
  margin-bottom: 2px;
}

.footer__citem-val {
  font-size: .88rem;
  font-weight: 600;
  color: #ffffff;
  line-height: 1.5;
  display: block;
}

/* Links clickables — teléfonos y email */
.footer__citem-val--link {
  display: inline-block;
  min-height: 24px;
  padding: 2px 0;
  text-decoration: none;
  color: #ffffff;
  transition: color .2s;
  cursor: pointer;
}
.footer__citem-val--link:hover { color: #F9B71C; }

/* Sub-texto contextual (calle, línea gratuita, PQR) */
.footer__citem-sub {
  font-size: .72rem;
  color: rgba(255,255,255,.5);
  display: block;
  margin-top: 2px;
}

/* ─── Barra inferior ─── */
.footer__bottom-wrap {
  padding: 18px 0 20px;
  position: relative;
  z-index: 1;
  border-top: 1px solid rgba(255,255,255,.18);
  background: rgba(0,0,0,.18);
}
.footer__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.footer__copy { font-size: .75rem; color: rgba(255,255,255,.6); }
.footer__bottom-links {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 20px;
}
.footer__bottom-link {
  font-size: .72rem;
  color: rgba(255,255,255,.6);
  text-decoration: none;
  transition: color .2s;
}
.footer__bottom-link:hover { color: #fff; }
.footer__legal {
  font-size: .67rem;
  color: rgba(255,255,255,.42);
  line-height: 1.6;
}

/* === LOGOS COBRANDING ===================================== */
.logo-divider {
  width: 1px; height: 32px;
  background: rgba(255,255,255,.3);
  flex-shrink: 0;
}
.nav__cobrand {
  display: flex;
  align-items: center;
  gap: 14px;
  background: var(--brilla-red);
  border-radius: 0 0 18px 18px;
  padding: 0 28px 0 24px;
  margin-top: -5px; /* sube para tocar el borde rojo superior */
  flex-shrink: 0;
}
.nav__cobrand-img { height: 34px; width: auto; }

/* Estado inicial — nav rojo: solo Brilla */
.nav__logo--hero  { display: block; filter: none; }
.nav__logo--solid { display: none; }
.nav__cobrand .logo-divider { display: none; }
.nav__gdc--solid  { display: none; }

/* Estado scroll — nav blanco: Brilla 2021 + GDC color */
.nav--solid .nav__cobrand {
  background: transparent;
  border-radius: 0;
  margin-top: 0;
  padding: 0 20px 0 0;
}
.nav--solid .nav__logo--hero  { display: none; }
.nav--solid .nav__logo--solid { display: block; filter: none; }
.nav--solid .nav__cobrand .logo-divider { display: block; }
.nav--solid .nav__gdc--solid  { display: block; opacity: .9; }

/* === VIGILADO SUPERSERVICIOS ============================== */
.footer__vigilado { display: flex; align-items: center; gap: 12px; }
.footer__vigilado-img { height: 40px; opacity: .6; }

/* === REVEAL ANIMATION ===================================== */
[data-reveal] {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s ease, transform .6s ease;
}
[data-reveal].revealed { opacity: 1; transform: translateY(0); }

/* === RESPONSIVE =========================================== */
@media (max-width: 1023px) {
  /* Cat tablet */
  .cat-head { padding-bottom: 28px; }
  .cat-head__title { font-size: 2.4rem; }
  .cat-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-auto-rows: 210px;
    gap: 6px;
  }
  .cat-grid .cat-card--last { grid-column: 2/3; }
  .cat-grid .cat-card:nth-child(2) { grid-column: 1/3; grid-row: 1/3; }

  .nav__links { display: none; }
  .nav__hamburger { display: flex; }
  .nav__cta-link { display: none; }

  /* hero tablet */
  .hero__badge { display: none; }
  .hero__content {
    margin-left: 24px;
    margin-right: 24px;
    max-width: 100%;
    padding: 48px 32px;
  }

  .quick-cards__grid { grid-template-columns: repeat(3, 1fr); height: auto; }
  .quick-card { height: 160px; border-right: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06); }
  .quick-card:nth-child(3) { border-right: none; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .footer__top-grid { grid-template-columns: 200px 1fr 1fr; gap: 32px; }
  .footer__brand { grid-column: 1 / 2; }
  .footer__cband-grid { grid-template-columns: repeat(2, 1fr); }
  .footer__citem { padding: 16px 20px; border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); }
  .footer__citem:first-child { padding-left: 20px; }
  .footer__citem:last-child  { padding-right: 20px; border-bottom: none; }
  .footer__citem:nth-child(odd):not(:last-child) { border-right: 1px solid rgba(255,255,255,.1); }
  .footer__citem:nth-child(3) { border-bottom: none; }
  .simulator__row { grid-template-columns: 1fr; }
  .stats-bar__grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 767px) {
  /* Cat móvil */
  .cat-section { padding-top: 56px; }
  .cat-head__big { display: none; }
  .cat-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 180px;
    gap: 5px;
  }
  .cat-grid .cat-card:nth-child(2) { grid-column: 1 / -1; grid-row: auto; }
  .cat-grid .cat-card--last { grid-column: 1 / -1; }
  .cat-card { border-radius: 6px; }
  .cat-card__name { font-size: .82rem; }
  .cat-card__body { padding: 12px 12px 14px 16px; }
  .cat-card__link { font-size: .6rem; }

  :root { --nav-h: 64px; }
  .section-pad { padding: 56px 0; }
  .section-pad--lg { padding: 64px 0; }

  .hero__title { font-size: 2.5rem; }
  .hero__ctas { flex-direction: column; }
  .hero__ctas { flex-wrap: wrap; }
  .hero__ctas .btn { width: 100%; justify-content: center; }
  .hero__ctas .btn--lg { padding: 14px 22px; }
  .hero__benefits { gap: 12px; }

  .quick-cards__grid { grid-template-columns: repeat(2, 1fr); height: auto; }
  .quick-card { height: 140px; border-right: 1px solid rgba(255,255,255,.06); border-bottom: 1px solid rgba(255,255,255,.06); }
  .quick-card:nth-child(2n) { border-right: none; }
  .quick-card:nth-child(5) { grid-column: span 2; }

  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-6 { grid-template-columns: repeat(2, 1fr); }

  .simulator { padding: 28px 20px; }
  .sim-plazo { grid-template-columns: repeat(4, 1fr); }
  .simulator__result { grid-template-columns: 1fr; gap: 16px; }

  .stats-bar__grid { grid-template-columns: repeat(2, 1fr); }
  .stats-bar__item { padding: 28px 16px; border-right: 1px solid rgba(255,255,255,.15); }
  .stats-bar__num { font-size: 1.8rem; }

  .footer__grid { grid-template-columns: 1fr; gap: 28px; }
  .footer__top-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
  .footer__brand { grid-column: 1 / -1; }
  .footer__cband-grid { grid-template-columns: 1fr; }
  .footer__citem,
  .footer__citem:first-child,
  .footer__citem:last-child { padding: 14px 0; border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); }
  .footer__citem:nth-child(odd):not(:last-child) { border-right: none; }
  .footer__citem:nth-child(3) { border-bottom: 1px solid rgba(255,255,255,.1); }
  .footer__citem:last-child { border-bottom: none; }
  .footer__watermark { font-size: 8rem; }
  .footer__bottom { flex-direction: column; text-align: center; }
  .footer__bottom-links { justify-content: center; }

  .wa-popup { width: calc(100vw - 56px); right: 16px; }
  .wa-fab { right: 16px; bottom: 20px; }

  .tabs { overflow-x: auto; }
  .filter-bar { gap: 8px; }
  .filter-btn { padding: 7px 14px; font-size: .75rem; }

  .cta-section { padding: 56px 0; }
}

@media (max-width: 479px) {
  .grid-4 { grid-template-columns: 1fr; }
  .grid-6 { grid-template-columns: 1fr; }
  .hero__title { font-size: 2rem; }
}

/* === SUBNAV (que-es-brilla sticky section nav) ============ */
.subnav {
  position: sticky;
  top: var(--nav-h);
  z-index: 90;
  background: var(--white);
  border-bottom: 2px solid var(--gray-100);
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
.subnav__inner {
  display: flex;
  gap: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.subnav__inner::-webkit-scrollbar { display: none; }
.subnav__link {
  padding: 16px 24px;
  font-size: .8rem;
  font-weight: 700;
  color: var(--gray-500);
  white-space: nowrap;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  transition: color var(--transition), border-color var(--transition);
}
.subnav__link:hover { color: var(--gray-800); }
.subnav__link.active { color: var(--brilla-red); border-bottom-color: var(--brilla-red); }

/* === BENEFICIO ITEMS (que-es-brilla numbered benefits) ===== */
.beneficio-item {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 24px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-100);
  transition: box-shadow var(--transition), transform var(--transition);
}
.beneficio-item:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.beneficio-item__num {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--brilla-red);
  opacity: .18;
  line-height: 1;
  flex-shrink: 0;
  min-width: 44px;
}
.beneficio-item__title {
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 6px;
}
.beneficio-item__text {
  font-size: .85rem;
  color: var(--gray-600);
  line-height: 1.6;
}

/* === REQ CARDS (que-es-brilla requirements) ================ */
.req-card {
  background: var(--white);
  border-radius: var(--radius-md);
  padding: 32px 24px;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-100);
  border-top: 4px solid var(--brilla-red);
  text-align: center;
  transition: box-shadow var(--transition), transform var(--transition);
}
.req-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.req-card__icon {
  width: 64px; height: 64px;
  border-radius: var(--radius-md);
  background: rgba(234,0,41,.08);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px;
}
.req-card__icon svg { width: 32px; height: 32px; color: var(--brilla-red); }
.req-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 10px;
}
.req-card__text {
  font-size: .85rem;
  color: var(--gray-600);
  line-height: 1.6;
}

/* === FAQ ACCORDION (que-es-brilla) ========================= */
.faq-list { display: flex; flex-direction: column; gap: 0; }
.faq-item {
  border-bottom: 1px solid var(--gray-200);
}
.faq-item:first-child { border-top: 1px solid var(--gray-200); }
.faq-item__q {
  list-style: none;
  padding: 20px 0;
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-800);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  transition: color var(--transition);
  user-select: none;
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q::after {
  content: '+';
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--brilla-red);
  flex-shrink: 0;
  transition: transform var(--transition);
}
.faq-item[open] .faq-item__q { color: var(--brilla-red); }
.faq-item[open] .faq-item__q::after { content: '×'; }
.faq-item__a {
  padding: 0 0 20px;
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.7;
}
.faq-item__a p + p { margin-top: 10px; }
.faq-item__a ul { padding-left: 20px; margin-top: 8px; }
.faq-item__a ul li { margin-bottom: 6px; }

@media (max-width: 767px) {
  .subnav__link { padding: 14px 16px; font-size: .75rem; }
  .beneficio-item { padding: 18px; gap: 14px; }
  .beneficio-item__num { font-size: 1.4rem; min-width: 36px; }
  .req-card { padding: 24px 16px; }
}

/* ═══════════════════════════════════════════════════════════
   INDEX — SECCIÓN 3: QUÉ ES BRILLA (intro)
═══════════════════════════════════════════════════════════ */
.qbi-section {
  position: relative;
  overflow: hidden;
  background: #fff;
  padding: 100px 0 110px;
}

/* Formas decorativas cruzadas (gris suave sobre blanco) */
.qbi-deco { position: absolute; inset: 0; pointer-events: none; }
.qbi-deco__shape {
  position: absolute;
  width: 560px; height: 560px;
  border: 2px solid rgba(0,0,0,.06);
  border-radius: 80px;
  top: 50%; left: -220px;
  transform: translateY(-50%);
}
.qbi-deco__shape--a { transform: translateY(-50%) rotate(20deg); }
.qbi-deco__shape--b { transform: translateY(-50%) rotate(55deg); border-color: rgba(0,0,0,.04); }

.qbi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}

/* Texto — oscuro sobre blanco */
.qbi-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 4px;
  color: var(--brilla-red);
  margin-bottom: 22px;
}
.qbi-eyebrow::before {
  content: '';
  display: block;
  width: 28px;
  height: 2px;
  background: var(--brilla-red);
  flex-shrink: 0;
}
.qbi-heading {
  font-size: clamp(2.4rem, 3.2vw, 3.8rem);
  font-weight: 800;
  color: var(--gray-900);
  line-height: 1.06;
  margin-bottom: 0;
}
/* Acento amarillo en el texto del heading */
.qbi-mark {
  background: none;
  color: inherit;
  position: relative;
  white-space: nowrap;
}
.qbi-mark::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  bottom: 2px;
  height: 6px;
  background: var(--brilla-yellow);
  opacity: .55;
  z-index: -1;
  border-radius: 2px;
}
.qbi-desc {
  font-size: .97rem;
  color: var(--gray-500);
  line-height: 1.9;
  margin-bottom: 40px;
  padding-top: 28px;
  margin-top: 28px;
  border-top: 1px solid var(--gray-100);
  max-width: 500px;
}
.qbi-desc--sm { font-size: .9rem; }
.qbi-desc strong { color: var(--gray-800); font-weight: 700; }

.qbi-cta-row { display: flex; justify-content: flex-end; }

/* Visual lado derecho: imagen única grande */
.qbi-visual {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.qbi-img-wrap {
  position: relative;
  width: 480px;
  height: 480px;
}

/* Marco circular */
.qbi-img-frame {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  border: 6px solid var(--brilla-yellow);
  box-shadow: 0 24px 60px rgba(0,0,0,.14);
}
.qbi-img-frame img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  transition: transform .8s cubic-bezier(.25,.46,.45,.94);
}
.qbi-visual:hover .qbi-img-frame img { transform: scale(1.1); }

/* Imagen flotante esquina inferior derecha */
.qbi-img-float {
  position: absolute;
  bottom: -14px;
  right: -18px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid #12B09A;
  box-shadow: 0 12px 36px rgba(0,0,0,.22);
  transition: transform .5s cubic-bezier(.25,.46,.45,.94), box-shadow .5s;
}
.qbi-visual:hover .qbi-img-float { transform: translateY(-6px) scale(1.04); box-shadow: 0 20px 48px rgba(0,0,0,.3); }
.qbi-img-float img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1023px) { .qbi-img-float { width: 100px; height: 100px; bottom: -10px; right: -10px; } }
@media (max-width: 767px)  { .qbi-img-float { width: 80px;  height: 80px;  bottom: -8px;  right: -6px;  } }

/* Chip (se usa en otras páginas) */
.qbi-chip {
  display: flex; align-items: flex-start; gap: 14px;
  background: var(--gray-50); border: 1px solid var(--gray-100);
  border-radius: var(--radius-md); padding: 18px 16px;
  transition: box-shadow var(--transition), transform var(--transition);
}
.qbi-chip:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }
.qbi-chip__icon { width: 40px; height: 40px; border-radius: var(--radius-sm); background: rgba(234,0,41,.08); color: var(--brilla-red); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qbi-chip__icon--yellow { background: var(--brilla-yellow); color: var(--gray-900); }
.qbi-chip__icon svg { width: 20px; height: 20px; }
.qbi-chip__val { display: block; font-size: .85rem; font-weight: 700; color: var(--gray-900); margin-bottom: 4px; line-height: 1.3; }
.qbi-chip__val--red { color: var(--brilla-red); }
.qbi-chip__label { display: block; font-size: .78rem; color: var(--gray-500); line-height: 1.45; }

@media (max-width: 1023px) {
  .qbi-grid { grid-template-columns: 1fr; gap: 40px; }
  .qbi-img-wrap { width: 340px; height: 340px; }
}
@media (max-width: 767px) {
  .qbi-img-wrap { width: 270px; height: 270px; }
}

/* ═══════════════════════════════════════════════════════════
   INDEX — SECCIÓN 6: CONSULTA TU CUPO + SIMULADOR (split)
═══════════════════════════════════════════════════════════ */
.cuposim-section {
  background: linear-gradient(135deg, #B82C0C 0%, #D94020 38%, #FF5C35 70%, #FF7244 100%);
  position: relative;
  overflow: hidden;
}
/* Línea accent degradada en el borde superior */
.cuposim-section::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--brilla-red) 25%, var(--brilla-yellow) 75%, transparent 100%);
  z-index: 10;
}
/* Anillo decorativo central */
.cuposim-section::after {
  content: '';
  position: absolute;
  top: -200px; right: 38%;
  width: 520px; height: 520px;
  border-radius: 50%;
  border: 1px solid rgba(232,33,42,.07);
  pointer-events: none; z-index: 0;
}

.cuposim-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 600px;
  position: relative;
  z-index: 1;
}

/* Panel base */
.cuposim-panel {
  padding: 64px 52px;
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}

/* Panel izquierdo — tonos amarillo Brilla (gradiente radial) */
.cuposim-panel--cupo {
  background: radial-gradient(ellipse 58% 75% at 88% 50%,
    #C47A00 0%,
    #D98D08 16%,
    #ECA016 32%,
    #F5AD1A 48%,
    #F8B41C 62%,
    #F9B71C 78%
  );
  border-right: 1px solid rgba(0,0,0,.08);
  padding-right: 52px;
  overflow: hidden;
}
/* Anillos concéntricos — estilo manual de marca Brilla */
.cuposim-panel--cupo::before {
  content: '';
  position: absolute;
  top: 50%; left: 82%;
  transform: translate(-50%, -50%);
  width: 720px; height: 720px;
  background: radial-gradient(circle,
    transparent           calc(41% - 1px),
    rgba(255,255,255,.55) 41%,
    rgba(255,255,255,.55) calc(41% + 2px),
    transparent           calc(41% + 2px),
    transparent           calc(60% - 1px),
    rgba(255,255,255,.32) 60%,
    rgba(255,255,255,.32) calc(60% + 1.5px),
    transparent           calc(60% + 1.5px),
    transparent           calc(79% - 1px),
    rgba(255,255,255,.16) 79%,
    rgba(255,255,255,.16) calc(79% + 1px),
    transparent           calc(79% + 1px)
  );
  pointer-events: none; z-index: 0;
}
/* Cuarto anillo exterior más sutil */
.cuposim-panel--cupo::after {
  content: '';
  position: absolute;
  top: 50%; left: 82%;
  transform: translate(-50%, -50%);
  width: 960px; height: 960px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.09);
  pointer-events: none; z-index: 0;
}

/* Wrapper contenido — por encima de la persona */
.cuposim-content {
  position: relative;
  z-index: 2;
  max-width: 360px;
}

/* Imagen de la promotora — decorativa derecha */
.cuposim-persona {
  position: absolute;
  bottom: 0;
  right: -80px;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}
.cuposim-persona img {
  height: 100%;
  width: auto;
  display: block;
  filter: drop-shadow(-8px 0 32px rgba(0,0,0,.5));
  mask-image: linear-gradient(to right, transparent 5%, #000 35%);
  -webkit-mask-image: linear-gradient(to right, transparent 5%, #000 35%);
}

/* Panel derecho — naranja PANTONE 171 C con anillos estilo cinturón */
.cuposim-panel--sim {
  background: linear-gradient(135deg, #B82C0C 0%, #D94020 38%, #FF5C35 70%, #FF7244 100%);
  border-left: none;
  padding-left: 52px;
  overflow: hidden;
}
/* Anillos decorativos — mismo estilo que cinturón y pqub-section */
.cuposim-panel--sim::before {
  content: '';
  position: absolute;
  top: 50%; right: -80px;
  transform: translateY(-50%);
  width: 420px; height: 420px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.1);
  pointer-events: none;
  z-index: 0;
  box-shadow:
    0 0 0 64px rgba(255,255,255,.05),
    0 0 0 128px rgba(255,255,255,.03),
    0 0 0 192px rgba(255,255,255,.02);
}
.cuposim-panel--sim .cuposim-eyebrow  { color: rgba(255,255,255,.75); }
.cuposim-panel--sim .cuposim-title    { color: #fff; }
.cuposim-panel--sim .cuposim-desc     { color: rgba(255,255,255,.82); }
.cuposim-panel--sim .sim-label        { color: rgba(255,255,255,.82); }
.cuposim-panel--sim .sim-value        { color: #fff; }
.cuposim-panel--sim .sim-range-minmax { color: rgba(255,255,255,.6); }
.cuposim-panel--sim .cuposim-disclaimer { color: rgba(255,255,255,.5); }
.cuposim-panel--sim .cuposim-result {
  background: rgba(0,0,0,.1);
  border: 1px solid rgba(255,255,255,.18);
}
.cuposim-panel--sim .sim-result-label { color: rgba(255,255,255,.72); font-size: .72rem; }
.cuposim-panel--sim .sim-result-value { color: #fff; }
.cuposim-panel--sim .highlight        { color: #fff !important; }
.cuposim-panel--sim .sim-plazo-btn {
  background: rgba(255,255,255,.15);
  color: rgba(255,255,255,.9);
  border: 1px solid rgba(255,255,255,.22);
}
.cuposim-panel--sim .sim-plazo-btn.active,
.cuposim-panel--sim .sim-plazo-btn:hover {
  background: #fff;
  color: #D94020;
  border-color: #fff;
}
.cuposim-panel--sim .btn--yellow {
  background: #fff;
  color: #D94020;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.cuposim-panel--sim .btn--yellow:hover { background: rgba(255,255,255,.92); }

.cuposim-eyebrow {
  display: block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: 14px;
}
/* Overrides texto sobre fondo amarillo */
.cuposim-panel--cupo .cuposim-eyebrow  { color: var(--brilla-red); }
.cuposim-panel--cupo .cuposim-title    { color: #0A0A10; }
.cuposim-panel--cupo .cuposim-desc     { color: rgba(0,0,0,.65); }
.cuposim-panel--cupo .cuposim-link     { color: rgba(0,0,0,.45); }
.cuposim-panel--cupo .cuposim-link:hover { color: var(--brilla-red); }
.cuposim-panel--cupo .cupo-bullet      { color: rgba(0,0,0,.78); }
.cuposim-panel--cupo .cupo-bullet svg  { color: var(--brilla-red); }
/* Form glass oscuro sobre amarillo */
.cuposim-panel--cupo .cupo-form {
  background: rgba(0,0,0,.1);
  border: 1px solid rgba(0,0,0,.12);
}
.cuposim-panel--cupo .cupo-form__label { color: rgba(0,0,0,.5); }
.cuposim-panel--cupo .cupo-form__input {
  background: rgba(255,255,255,.75);
  border: 1.5px solid rgba(0,0,0,.14);
  color: #1A1A1A;
}
.cuposim-panel--cupo .cupo-form__input::placeholder { color: rgba(0,0,0,.38); }
.cuposim-panel--cupo .cupo-form__input:focus {
  border-color: var(--brilla-red);
  background: rgba(255,255,255,.92);
  box-shadow: 0 0 0 3px rgba(232,33,42,.2);
}
.cuposim-panel--cupo .cupo-form__note  { color: rgba(0,0,0,.45); }

.cuposim-title {
  font-size: clamp(2.2rem, 3vw, 3rem);
  font-weight: 900;
  color: #fff;
  line-height: 1.05;
  margin-bottom: 14px;
  letter-spacing: -.025em;
}
.cuposim-desc {
  font-size: .88rem;
  color: rgba(255,255,255,.58);
  line-height: 1.75;
  margin-bottom: 28px;
}

/* Cupo form — glassmorphism premium */
.cupo-form {
  background: rgba(255,255,255,.05);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  padding: 22px 24px;
  margin-bottom: 20px;
}
.cupo-form__label {
  display: block;
  font-size: .68rem;
  font-weight: 700;
  color: rgba(255,255,255,.48);
  margin-bottom: 10px;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.cupo-form__row { display: flex; gap: 8px; }
.cupo-form__input {
  flex: 1;
  background: rgba(255,255,255,.07);
  border: 1.5px solid rgba(255,255,255,.12);
  border-radius: 12px;
  color: #fff;
  font-family: var(--font);
  font-size: .95rem;
  padding: 14px 18px;
  outline: none;
  transition: border-color .2s, box-shadow .2s;
}
.cupo-form__input::placeholder { color: rgba(255,255,255,.28); }
.cupo-form__input:focus {
  border-color: var(--brilla-red);
  box-shadow: 0 0 0 3px rgba(232,33,42,.2);
  background: rgba(255,255,255,.09);
}
.cupo-form__btn {
  background: var(--brilla-red);
  border: none;
  border-radius: 12px;
  color: #fff;
  padding: 0 22px;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, transform .15s, box-shadow .2s;
  font-weight: 700;
  min-width: 52px;
  box-shadow: 0 8px 24px rgba(232,33,42,.35);
}
.cupo-form__btn:hover {
  background: #c8181f;
  transform: scale(1.06);
  box-shadow: 0 12px 32px rgba(232,33,42,.5);
}
.cupo-form__note {
  margin-top: 10px;
  font-size: .74rem;
  color: rgba(255,255,255,.3);
}

/* Cupo bullets */
.cupo-bullets { display: flex; flex-direction: column; gap: 10px; margin-bottom: 22px; }
.cupo-bullet {
  display: flex; align-items: center; gap: 10px;
  font-size: .82rem;
  color: rgba(255,255,255,.68);
}
.cupo-bullet svg { color: var(--brilla-yellow); flex-shrink: 0; }

.cuposim-link {
  font-size: .78rem;
  font-weight: 700;
  color: rgba(255,255,255,.38);
  text-decoration: none;
  letter-spacing: .04em;
  transition: color .2s;
  margin-top: auto;
}
.cuposim-link:hover { color: var(--brilla-yellow); }

/* Simulador dentro del split */
.cuposim-sim-body { display: flex; flex-direction: column; gap: 0; flex: 1; }
.sim-field { margin-bottom: 24px; }
.sim-range-minmax {
  display: flex; justify-content: space-between;
  margin-top: 8px; font-size: .72rem;
  color: rgba(255,255,255,.35);
}
.cuposim-result {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  padding: 20px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}
.cuposim-disclaimer {
  font-size: .72rem;
  color: rgba(255,255,255,.2);
  margin-bottom: 20px;
  line-height: 1.5;
}

/* Sim plazo buttons */
.sim-plazo-btn {
  background: rgba(255,255,255,.07);
  color: rgba(255,255,255,.7);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 8px 0;
  font-size: .82rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .18s;
}
.sim-plazo-btn.active,
.sim-plazo-btn:hover {
  background: var(--brilla-yellow);
  color: var(--gray-900);
  border-color: var(--brilla-yellow);
}

@media (min-width: 1280px) {
  .cuposim-panel--cupo {
    flex-direction: row;
    align-items: stretch;
    padding: 52px 0 0 52px;
    gap: 0;
  }
  .cuposim-content {
    flex: 0 0 300px;
    max-width: 300px;
    padding-bottom: 52px;
    z-index: 2;
    order: 1;
  }
  .cuposim-persona {
    position: relative;
    right: auto;
    bottom: auto;
    height: auto;
    flex: 1;
    order: 2;
    overflow: hidden;
    align-self: stretch;
  }
  .cuposim-persona img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    filter: drop-shadow(-8px 0 32px rgba(0,0,0,.35));
  }
}

@media (min-width: 1440px) {
  .cuposim-content { flex: 0 0 320px; max-width: 320px; }
}

@media (max-width: 1023px) {
  .cuposim-persona { display: none; }
  .cuposim-grid { grid-template-columns: 1fr; }
  .cuposim-panel { padding: 48px 32px; }
  .cuposim-panel--cupo { border-right: none; border-bottom: 1px solid rgba(255,255,255,.1); padding-right: 32px; }
  .cuposim-panel--sim { padding-left: 32px; border-left: none; }
  .cuposim-result { grid-template-columns: 1fr 1fr 1fr; }
  .cuposim-title { font-size: 1.8rem; }
  .cuposim-content { max-width: 100%; }
}
@media (max-width: 599px) {
  .cuposim-panel { padding: 40px 20px; }
  .cuposim-title { font-size: 1.6rem; }
  .cuposim-result { grid-template-columns: 1fr; gap: 8px; }
}

/* ═══════════════════════════════════════════════════════════
   INDEX — SECCIÓN 8: POR QUÉ USAR BRILLA (fondo oscuro)
═══════════════════════════════════════════════════════════ */
.pqub-section {
  background: linear-gradient(145deg, #8C0015, #C8001A);
  position: relative;
  overflow: hidden;
}
/* Anillos decorativos — mismo estilo que quick-cards del cinturón */
.pqub-section::before {
  content: '';
  position: absolute;
  top: 50%; right: -120px;
  transform: translateY(-50%);
  width: 520px; height: 520px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.1);
  pointer-events: none;
  z-index: 0;
  box-shadow:
    0 0 0 80px rgba(255,255,255,.05),
    0 0 0 160px rgba(255,255,255,.035),
    0 0 0 240px rgba(255,255,255,.02);
}
.pqub-section .container { position: relative; z-index: 1; }

/* Textos del header sobre fondo rojo */
.pqub-label--dark { color: rgba(255,255,255,.6); }
.pqub-title--dark { color: var(--white); }
.pqub-sub--dark   { color: rgba(255,255,255,.75); }

.pqub-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.pqub-card {
  border: 1px solid rgba(255,255,255,.18);
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  position: relative;
  overflow: hidden;
  transition: box-shadow var(--transition), transform var(--transition);
}
.pqub-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(255,255,255,.5);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.22,.61,.36,1);
}
.pqub-card:hover {
  box-shadow: 0 20px 60px rgba(0,0,0,.3);
  transform: translateY(-5px);
}
.pqub-card:hover::after { transform: scaleX(1); }

/* Colores del manual — un color por card */
.pqub-grid .pqub-card:nth-child(1) { background: linear-gradient(145deg, #B5000E, var(--brilla-red)); }
.pqub-grid .pqub-card:nth-child(2) { background: linear-gradient(145deg, #D4920A, var(--brilla-yellow)); border-color: rgba(0,0,0,.1); }
.pqub-grid .pqub-card:nth-child(3) { background: linear-gradient(145deg, #C85A10, var(--brilla-orange)); }
.pqub-grid .pqub-card:nth-child(4) { background: linear-gradient(145deg, #0A7A6A, var(--brilla-teal)); }

/* Card amarilla — texto oscuro para legibilidad */
.pqub-grid .pqub-card:nth-child(2) .pqub-card__title { color: #1A0A00; }
.pqub-grid .pqub-card:nth-child(2) .pqub-card__text  { color: rgba(0,0,0,.65); }
.pqub-grid .pqub-card:nth-child(2) .pqub-card__icon-wrap { background: rgba(0,0,0,.12); color: #1A0A00; }
.pqub-grid .pqub-card:nth-child(2)::after { background: rgba(0,0,0,.25); }

.pqub-card__icon-wrap {
  width: 60px; height: 60px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.2);
  color: var(--white);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 24px;
  transition: transform .4s cubic-bezier(.34,1.56,.64,1), background var(--transition);
}
.pqub-card:hover .pqub-card__icon-wrap { transform: scale(1.12) rotate(5deg); }

.pqub-card__icon-wrap--yellow {
  background: rgba(255,255,255,.2);
  color: var(--white);
}

.pqub-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 12px;
  line-height: 1.3;
}
.pqub-card__text {
  font-size: .875rem;
  color: rgba(255,255,255,.8);
  line-height: 1.7;
}

/* CTA button override para fondo rojo */
.pqub-section .btn--red {
  background: var(--white);
  color: var(--brilla-red);
  box-shadow: 0 4px 20px rgba(0,0,0,.2);
}
.pqub-section .btn--red:hover {
  background: var(--brilla-yellow);
  color: var(--gray-900);
}

@media (max-width: 1023px) {
  .pqub-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 599px) {
  .pqub-grid { grid-template-columns: 1fr; }
  .pqub-card { padding: 28px 20px; }
}

/* ═══════════════════════════════════════════════════════════
   INDEX — SECCIÓN 9: NOTICIAS — Editorial oscuro
═══════════════════════════════════════════════════════════ */
.noticias-section {
  background: var(--gray-50);
  padding: 80px 0;
}

.noticias-section__label { color: var(--brilla-red); }
.noticias-section__title {
  color: var(--gray-900);
  margin-bottom: 0;
}

.noticias-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}

.noticias-grid {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 20px;
  align-items: stretch;
}

/* ── Destacado: imagen de fondo completo con overlay ── */
.noticia-featured {
  position: relative;
  min-height: 480px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  cursor: pointer;
}

.noticia-featured__bg {
  position: absolute; inset: 0;
  overflow: hidden;
  transition: transform .7s cubic-bezier(.22,.61,.36,1);
}
.noticia-featured__bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
  transition: transform .7s cubic-bezier(.22,.61,.36,1);
}
.noticia-featured:hover .noticia-featured__bg img { transform: scale(1.04); }

.noticia-featured__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    to top,
    rgba(10,5,5,.95) 0%,
    rgba(10,5,5,.55) 45%,
    transparent 100%
  );
}

.noticia-featured__content {
  position: relative;
  z-index: 1;
  padding: 32px;
}

.noticia-featured__title {
  font-size: 1.55rem;
  font-weight: 700;
  color: var(--white);
  line-height: 1.3;
  margin: 12px 0 10px;
}

.noticia-featured__excerpt {
  font-size: .9rem;
  color: rgba(255,255,255,.68);
  line-height: 1.65;
  margin-bottom: 24px;
}

.noticia-featured__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.noticia-featured__link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .85rem;
  font-weight: 700;
  color: var(--brilla-yellow);
  text-decoration: none;
  transition: gap var(--transition);
}
.noticia-featured__link:hover { gap: 12px; }

/* ── Categoría ── */
.noticia-cat {
  display: inline-block;
  background: var(--brilla-red);
  color: var(--white);
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  padding: 4px 10px;
  border-radius: var(--radius-full);
}
.noticia-cat--sm {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--brilla-red);
  background: rgba(234,0,41,.12);
  padding: 3px 8px;
  border-radius: var(--radius-full);
  margin-bottom: 7px;
}

/* ── Fecha ── */
.noticia-date {
  font-size: .75rem;
  color: rgba(255,255,255,.38);
  font-weight: 600;
  letter-spacing: .04em;
}
.noticia-date--sm {
  display: block;
  font-size: .7rem;
  color: var(--gray-400);
  margin-top: 6px;
}

/* ── Stack: 3 mini noticias ── */
.noticias-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.noticia-mini {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding: 20px 0;
  border-bottom: 1px solid var(--gray-200);
  transition: background var(--transition);
}
.noticia-mini:first-child { padding-top: 0; }
.noticia-mini:last-child { border-bottom: none; padding-bottom: 0; }

.noticia-mini__img-wrap {
  flex-shrink: 0;
  width: 100px;
  height: 76px;
  border-radius: var(--radius-sm);
  overflow: hidden;
  display: block;
  background: var(--gray-200);
}
.noticia-mini__img-wrap img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .5s cubic-bezier(.22,.61,.36,1);
}
.noticia-mini:hover .noticia-mini__img-wrap img { transform: scale(1.07); }

.noticia-mini__body { flex: 1; min-width: 0; }

.noticia-mini__title {
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.4;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.noticia-mini__title a {
  color: var(--gray-900);
  text-decoration: none;
  transition: color var(--transition);
}
.noticia-mini:hover .noticia-mini__title a { color: var(--brilla-red); }

/* ── Responsive ── */
@media (max-width: 1023px) {
  .noticias-grid { grid-template-columns: 1fr; }
  .noticia-featured { min-height: 340px; }
  .noticias-stack {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
  .noticia-mini {
    flex-direction: column;
    border-bottom: none;
    padding: 0;
  }
  .noticia-mini__img-wrap { width: 100%; height: 130px; }
}
@media (max-width: 599px) {
  .noticias-section { padding: 60px 0; }
  .noticias-stack {
    grid-template-columns: 1fr;
  }
  .noticia-mini {
    flex-direction: row;
    border-bottom: 1px solid var(--gray-200);
    padding: 16px 0;
  }
  .noticia-mini:last-child { border-bottom: none; }
  .noticia-mini__img-wrap { width: 88px; height: 66px; }
}


/* ═══════════════════════════════════════════════════════════
   QUÉ ES BRILLA — CÁLCULO DE CUOTA
═══════════════════════════════════════════════════════════ */
.calculo-section {
  position: relative;
  padding: 80px 0;
  background: #080c14;
}
.calculo-section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('../imagenes/brilla/nueva-1.webp') center center / cover no-repeat;
  opacity: .18;
  z-index: 0;
}
.calculo-section > * {
  position: relative;
  z-index: 1;
}
.calculo-section .container {
  position: relative;
  z-index: 1;
}
.calculo-label  { color: var(--brilla-red); }
.calculo-title  { color: var(--white); margin-bottom: 0; }
.calculo-subtitle { color: rgba(255,255,255,.6); }
.calculo-header { margin-bottom: 56px; }

/* ── Tarjeta de la fórmula ── */
.calculo-formula-card {
  position: relative;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 24px;
  padding: 52px 40px;
  display: flex;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 40px;
  transition: background var(--transition), border-color var(--transition), transform var(--transition), box-shadow var(--transition);
  cursor: default;
}
.calculo-formula-card:hover {
  background: rgba(255,255,255,.07);
  border-color: rgba(234,0,41,.3);
  transform: translateY(-4px);
  box-shadow: 0 20px 48px rgba(0,0,0,.4);
}
.calculo-glow {
  position: absolute;
  width: 480px; height: 200px;
  background: radial-gradient(ellipse, rgba(234,0,41,.18) 0%, transparent 70%);
  bottom: -60px; left: 50%; transform: translateX(-50%);
  pointer-events: none;
}

/* ── Fórmula interior ── */
.calculo-formula-inner {
  display: flex;
  align-items: center;
  gap: 28px;
  position: relative;
  z-index: 1;
}
.formula-result {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
}
.formula-result__letter {
  font-size: 3.6rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  font-style: italic;
  line-height: 1;
}
.formula-result__eq {
  font-size: 3rem;
  font-weight: 300;
  color: rgba(255,255,255,.4);
  line-height: 1;
}
.formula-frac {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}
.formula-num,
.formula-den {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.45rem;
  font-weight: 700;
  color: var(--white);
  padding: 10px 20px;
  white-space: nowrap;
}
.formula-bar {
  width: 100%;
  height: 2px;
  background: rgba(255,255,255,.3);
  border-radius: 2px;
}
.fv-op  { color: rgba(255,255,255,.4); font-weight: 400; }
.fv-num { color: rgba(255,255,255,.6); }
.fv-group { display: inline-flex; align-items: baseline; gap: 1px; }

/* Variables con color */
.fv { font-weight: 800; font-style: italic; }
.fv--red    { color: #FF5C7A; }
.fv--cyan   { color: #38D9F5; }
.fv--orange { color: #FFB060; }
sup.fv      { font-size: .65em; font-style: italic; }

/* ── Grid de variables ── */
.calculo-vars {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 40px;
}
.calculo-var {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--radius-md);
  padding: 18px 16px;
  transition: background var(--transition), border-color var(--transition), transform var(--transition), box-shadow var(--transition);
  cursor: default;
}
.calculo-var:hover {
  background: rgba(255,255,255,.09);
  border-color: rgba(255,255,255,.18);
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,.3);
}
.calculo-var__key {
  flex-shrink: 0;
  width: 46px; height: 46px;
  border-radius: var(--radius-sm);
  font-size: 1.3rem;
  font-weight: 800;
  font-style: italic;
  display: flex; align-items: center; justify-content: center;
}
.calculo-var__key--yellow { background: rgba(252,220,62,.12); color: var(--brilla-yellow); }
.calculo-var__key--red    { background: rgba(255,92,122,.12); color: #FF5C7A; }
.calculo-var__key--cyan   { background: rgba(56,217,245,.10); color: #38D9F5; }
.calculo-var__key--orange { background: rgba(255,176,96,.12); color: #FFB060; }
.calculo-var__name { display: block; font-size: .82rem; font-weight: 700; color: var(--white); margin-bottom: 4px; }
.calculo-var__desc { display: block; font-size: .73rem; color: rgba(255,255,255,.45); line-height: 1.45; }

/* ── Cards de tasas ── */
.calculo-rates {
  display: grid;
  grid-template-columns: 1fr 1.4fr 1fr;
  gap: 20px;
  margin-bottom: 32px;
}
.calculo-rate-card {
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  border: 1px solid rgba(255,255,255,.08);
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), background var(--transition);
  cursor: default;
}
.calculo-rate-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0,0,0,.35);
}
.calculo-rate-card--tasa      { background: rgba(255,92,122,.08); border-color: rgba(255,92,122,.15); }
.calculo-rate-card--tasa:hover { background: rgba(255,92,122,.14); border-color: rgba(255,92,122,.3); }
.calculo-rate-card--cobertura { background: rgba(255,255,255,.03); }
.calculo-rate-card--cobertura:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.16); }
.calculo-rate-card--plazos    { background: rgba(252,220,62,.06); border-color: rgba(252,220,62,.12); }
.calculo-rate-card--plazos:hover { background: rgba(252,220,62,.12); border-color: rgba(252,220,62,.28); }

.calculo-rate-card__icon {
  width: 44px; height: 44px;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.07);
  color: var(--white);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
}
.calculo-rate-card--tasa   .calculo-rate-card__icon { color: #FF5C7A; background: rgba(255,92,122,.12); }
.calculo-rate-card--plazos .calculo-rate-card__icon { color: var(--brilla-yellow); background: rgba(252,220,62,.12); }
.calculo-rate-card__title { font-size: .85rem; font-weight: 700; color: var(--white); margin-bottom: 14px; }
.calculo-rate-card__val   { font-size: 3rem; font-weight: 800; color: #FF5C7A; line-height: 1; margin-bottom: 10px; }
.calculo-rate-card__desc  { font-size: .78rem; color: rgba(255,255,255,.5); line-height: 1.6; }
.calculo-rate-card__note  { font-size: .72rem; color: rgba(255,255,255,.35); margin-top: 12px; line-height: 1.5; }

.calculo-rate-rows { display: flex; flex-direction: column; gap: 10px; }
.calculo-rate-row {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 10px 14px;
  background: rgba(255,255,255,.04);
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255,255,255,.06);
}
.calculo-rate-row--accent { background: rgba(255,92,122,.08); border-color: rgba(255,92,122,.15); }
.calculo-rate-row__label { font-size: .75rem; color: rgba(255,255,255,.55); flex: 1; }
.calculo-rate-row__val   { font-size: .8rem; font-weight: 700; color: var(--white); white-space: nowrap; }

.calculo-plazo-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.calculo-plazo-chip {
  padding: 6px 12px;
  border-radius: var(--radius-full);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.1);
  font-size: .75rem; font-weight: 700;
  color: rgba(255,255,255,.6);
}
.calculo-plazo-chip--max { background: rgba(252,220,62,.15); border-color: rgba(252,220,62,.3); color: var(--brilla-yellow); }

.calculo-disclaimer {
  font-size: .75rem; color: rgba(255,255,255,.3);
  line-height: 1.7; text-align: center;
  max-width: 760px; margin: 0 auto; padding-top: 8px;
}

@media (max-width: 1023px) {
  .formula-num, .formula-den { font-size: 1.15rem; padding: 8px 14px; }
  .formula-result__letter { font-size: 2.8rem; }
  .calculo-vars  { grid-template-columns: 1fr 1fr; }
  .calculo-rates { grid-template-columns: 1fr; }
}
@media (max-width: 599px) {
  .calculo-formula-card { padding: 32px 20px; }
  .calculo-formula-inner { gap: 16px; }
  .formula-num, .formula-den { font-size: .95rem; padding: 6px 10px; gap: 5px; }
  .formula-result__letter { font-size: 2.2rem; }
  .formula-result__eq { font-size: 2rem; }
  .calculo-vars  { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   QUÉ ES BRILLA — CÁLCULO: bloque intro rediseñado
═══════════════════════════════════════════════════════════ */
.calculo-intro-grid {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: 32px;
  align-items: start;
  margin-bottom: 48px;
}

/* Tarjeta con imagen */
.calculo-sim-card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  transition: transform var(--transition), box-shadow var(--transition);
  cursor: default;
}
.calculo-sim-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 24px 56px rgba(0,0,0,.5);
}
.calculo-sim-card:hover .calculo-sim-card__img {
  transform: scale(1.04);
}
.calculo-sim-card__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  object-fit: cover;
  display: block;
}
.calculo-sim-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.1) 100%);
}
.calculo-sim-card__body {
  position: relative;
  z-index: 2;
  padding: 28px 28px 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.calculo-sim-card__label {
  font-size: 1.05rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
  margin: 0;
}
.calculo-sim-card__sub {
  font-size: .78rem;
  color: rgba(255,255,255,.8);
  line-height: 1.65;
  margin: 0;
}

/* Lista de puntos clave */
.calculo-keypoints {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.calculo-keypoint {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.calculo-keypoint__dot {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brilla-red);
  margin-top: 7px;
}
.calculo-keypoint span:last-child {
  font-size: .84rem;
  color: rgba(255,255,255,.78);
  line-height: 1.72;
}
.calculo-keypoint strong {
  color: #fff;
  font-weight: 700;
}

.calculo-formula-lead {
  font-size: .82rem;
  color: rgba(255,255,255,.45);
  text-align: center;
  margin-bottom: 28px;
  font-style: italic;
}

@media (max-width: 768px) {
  .calculo-intro-grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   QUÉ ES BRILLA — FAQ TABS
═══════════════════════════════════════════════════════════ */
.faq-tabs {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  overflow: hidden;
}

/* ── Nav de tabs ── */
.faq-tabs__nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  background: var(--gray-50);
  border-bottom: 1px solid var(--gray-200);
  padding: 4px;
}
.faq-tab-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 10px 16px;
  font-family: var(--font);
  font-size: .78rem;
  font-weight: 600;
  color: var(--gray-500);
  background: transparent;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background var(--transition), color var(--transition);
  white-space: nowrap;
}
.faq-tab-btn:hover {
  background: var(--white);
  color: var(--gray-900);
}
.faq-tab-btn.active {
  background: var(--white);
  color: var(--brilla-red);
  box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.faq-tab-btn svg { flex-shrink: 0; opacity: .7; }
.faq-tab-btn.active svg { opacity: 1; }

/* ── Paneles ── */
.faq-panel {
  padding: 32px 36px;
}
.faq-panel[hidden] { display: none; }
.faq-panel.active  { display: block; }

/* ── Lista de acordeones ── */
.faq-list { display: flex; flex-direction: column; gap: 0; }

.faq-item {
  border-bottom: 1px solid var(--gray-100);
}
.faq-item:last-child { border-bottom: none; }

.faq-item__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 0;
  font-size: .9rem;
  font-weight: 600;
  color: var(--gray-900);
  cursor: pointer;
  list-style: none;
  transition: color var(--transition);
}
.faq-item__q::-webkit-details-marker { display: none; }
.faq-item__q::after {
  content: '+';
  flex-shrink: 0;
  width: 26px; height: 26px;
  border-radius: 50%;
  background: var(--gray-100);
  color: var(--gray-500);
  font-size: 1.1rem;
  font-weight: 400;
  display: flex; align-items: center; justify-content: center;
  transition: background var(--transition), color var(--transition), transform .3s;
}
.faq-item[open] .faq-item__q {
  color: var(--brilla-red);
}
.faq-item[open] .faq-item__q::after {
  content: '−';
  background: rgba(234,0,41,.1);
  color: var(--brilla-red);
  transform: rotate(180deg);
}
.faq-item__q:hover { color: var(--brilla-red); }

.faq-item__a {
  padding: 0 0 20px 0;
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.75;
}
.faq-item__a p + p { margin-top: 10px; }
.faq-item__a ul {
  margin: 10px 0 0 20px;
  display: flex; flex-direction: column; gap: 6px;
}
.faq-item__a li { list-style: disc; }
.faq-item__a a { color: var(--brilla-red); font-weight: 600; }

/* ── Info grid (Megacupo) ── */
.faq-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 24px;
}
.faq-info-card {
  border-radius: var(--radius-md);
  padding: 28px 24px;
  text-align: center;
}
.faq-info-card--red  { background: var(--brilla-red); }
.faq-info-card--dark { background: var(--gray-900); }
.faq-info-card__eyebrow {
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(255,255,255,.6);
  margin-bottom: 8px;
}
.faq-info-card__val {
  font-size: 1.9rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1.1;
  margin-bottom: 12px;
}
.faq-info-card__desc {
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  line-height: 1.65;
}

/* ── CTA informativo (paneles 5,6,7) ── */
.faq-info-cta {
  text-align: center;
  padding: 16px 0 8px;
}
.faq-info-cta--col {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
}
.faq-info-cta__text {
  max-width: 560px;
  font-size: .9rem;
  color: var(--gray-600);
  line-height: 1.75;
}

/* ── Contacto final del FAQ ── */
.faq-contacto {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-top: 32px;
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-md);
  padding: 20px 24px;
  font-size: .85rem;
  color: var(--gray-600);
  line-height: 1.65;
}
.faq-contacto svg { flex-shrink: 0; color: var(--brilla-red); margin-top: 2px; }
.faq-contacto a { color: var(--brilla-red); font-weight: 700; }

/* ── Responsive ── */
@media (max-width: 1023px) {
  .faq-tabs__nav { flex-wrap: wrap; }
  .faq-tab-btn   { font-size: .72rem; padding: 8px 12px; }
  .faq-panel     { padding: 24px 20px; }
  .faq-info-grid { grid-template-columns: 1fr; }
}
@media (max-width: 599px) {
  .faq-tab-btn { font-size: .7rem; padding: 7px 10px; gap: 4px; }
  .faq-tab-btn svg { display: none; }
  .faq-panel   { padding: 20px 16px; }
}

/* ═══════════════════════════════════════════════════════════
   QUÉ ES BRILLA — FAQ v2 REDISEÑO IMPACTANTE
═══════════════════════════════════════════════════════════ */

/* ── Sección base ── */
.faq2-section {
  position: relative;
  background: linear-gradient(145deg, #8C0015, #C8001A);
  padding: 100px 0 80px;
  overflow: hidden;
}
.faq2-section::before {
  content: '';
  position: absolute;
  top: 50%; right: -120px;
  transform: translateY(-50%);
  width: 520px; height: 520px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.1);
  pointer-events: none;
  z-index: 0;
  box-shadow:
    0 0 0 80px rgba(255,255,255,.05),
    0 0 0 160px rgba(255,255,255,.035),
    0 0 0 240px rgba(255,255,255,.02);
}
.faq2-section > * {
  position: relative;
  z-index: 1;
}

/* Textura de ruido sutil */
.faq2-noise {
  position: absolute; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");
  background-size: 200px 200px;
  pointer-events: none;
  opacity: .4;
}

/* ── Header split ── */
.faq2-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px 80px;
  align-items: end;
  margin-bottom: 64px;
}
.faq2-label {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--brilla-red);
  margin-bottom: 16px;
}
.faq2-title {
  font-size: clamp(2.6rem, 5vw, 4.2rem);
  font-weight: 800;
  color: var(--white);
  line-height: 1.05;
  margin: 0;
}
.faq2-lead {
  font-size: .95rem;
  color: rgba(255,255,255,.5);
  line-height: 1.8;
  margin-bottom: 28px;
}
.faq2-stats {
  display: flex;
  align-items: center;
  gap: 20px;
}
.faq2-stat { text-align: center; }
.faq2-stat__num {
  display: block;
  font-size: 1.6rem;
  font-weight: 800;
  color: var(--white);
  line-height: 1;
}
.faq2-stat__label {
  display: block;
  font-size: .68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.3);
  margin-top: 4px;
}
.faq2-stat__div {
  width: 1px;
  height: 36px;
  background: rgba(255,255,255,.1);
}

/* ── Grid de categorías ── */
.faq2-cats {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 8px;
  margin-bottom: 4px;
}

.faq2-cat {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 24px 12px 20px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 16px;
  cursor: pointer;
  font-family: var(--font);
  text-align: center;
  transition: background .25s, border-color .25s, transform .25s, box-shadow .25s;
  overflow: hidden;
}
.faq2-cat::before {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(135deg, var(--brilla-red) 0%, #C8001A 100%);
  opacity: 0;
  transition: opacity .25s;
  border-radius: inherit;
}
.faq2-cat:hover {
  background: rgba(255,255,255,.07);
  border-color: rgba(255,255,255,.14);
  transform: translateY(-4px);
}
.faq2-cat.active {
  border-color: transparent;
  transform: translateY(-4px);
  box-shadow: 0 16px 48px rgba(232,33,42,.35), 0 4px 12px rgba(0,0,0,.3);
}
.faq2-cat.active::before { opacity: 1; }

/* Número watermark */
.faq2-cat__num {
  position: absolute;
  top: 6px; right: 10px;
  font-size: 2.4rem;
  font-weight: 800;
  color: rgba(255,255,255,.06);
  line-height: 1;
  pointer-events: none;
  transition: color .25s;
  z-index: 0;
}
.faq2-cat.active .faq2-cat__num { color: rgba(255,255,255,.12); }

/* Icono */
.faq2-cat__icon {
  position: relative;
  z-index: 1;
  width: 44px; height: 44px;
  border-radius: 12px;
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.5);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  transition: background .25s, color .25s;
}
.faq2-cat:hover .faq2-cat__icon {
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.8);
}
.faq2-cat.active .faq2-cat__icon {
  background: rgba(255,255,255,.2);
  color: var(--white);
}

/* Nombre */
.faq2-cat__name {
  position: relative;
  z-index: 1;
  font-size: .72rem;
  font-weight: 700;
  color: var(--brilla-yellow);
  line-height: 1.35;
  transition: color .25s;
}
.faq2-cat:hover .faq2-cat__name { color: var(--brilla-yellow); }
.faq2-cat.active .faq2-cat__name { color: #fff; }

/* Flecha indicadora de activo */
.faq2-cat__arrow {
  position: relative;
  z-index: 1;
  font-size: .85rem;
  color: var(--brilla-yellow);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .25s, transform .25s;
}
.faq2-cat.active .faq2-cat__arrow { opacity: 1; transform: translateY(0); }

/* ── Panel contenido ── */
.faq2-body {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 20px;
  min-height: 200px;
  margin-bottom: 28px;
  overflow: hidden;
}

.faq2-panel { display: none; padding: 40px 44px; }
.faq2-panel.active { display: block; animation: faq2FadeIn .3s ease; }

@keyframes faq2FadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Eyebrow del panel */
.faq2-panel__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--brilla-yellow);
  background: rgba(255,255,255,.1);
  padding: 6px 14px;
  border-radius: var(--radius-full);
  margin-bottom: 28px;
}

/* ── Acordeones del panel — 2 columnas ── */
.faq2-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
}

.faq2-item {
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.faq2-item:last-child { border-bottom: none; }

.faq2-item__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 0;
  font-size: .95rem;
  font-weight: 600;
  color: #fff;
  cursor: pointer;
  list-style: none;
  transition: color .2s;
}
.faq2-item__q::-webkit-details-marker { display: none; }

/* Icono + / − */
.faq2-item__q::after {
  content: '';
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.15);
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='12' y1='5' x2='12' y2='19' stroke='rgba(255,255,255,.5)' stroke-width='2' stroke-linecap='round'/%3E%3Cline x1='5' y1='12' x2='19' y2='12' stroke='rgba(255,255,255,.5)' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;
  transition: background .2s, border-color .2s, transform .3s;
}
.faq2-item[open] .faq2-item__q {
  color: var(--brilla-yellow);
}
.faq2-item[open] .faq2-item__q::after {
  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='5' y1='12' x2='19' y2='12' stroke='%23F9B71C' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;
  border-color: rgba(249,183,28,.3);
  transform: rotate(180deg);
}
.faq2-item__q:hover { color: var(--white); }

.faq2-item__a {
  padding: 0 40px 24px 0;
  font-size: .875rem;
  color: rgba(255,255,255,.9);
  line-height: 1.8;
}
.faq2-item__a p + p { margin-top: 12px; }
.faq2-item__a ul {
  margin: 12px 0 0 18px;
  display: flex; flex-direction: column; gap: 7px;
}
.faq2-item__a li::marker { color: var(--brilla-yellow); }
.faq2-item__a strong { color: #fff; }
.faq2-item__a a { color: var(--brilla-yellow); font-weight: 600; }

/* ── Tabla dentro de acordeón ── */
.faq2-table {
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.07);
  margin-top: 16px;
}
.faq2-table__head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 16px;
  background: rgba(255,255,255,.06);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.85);
}
.faq2-table__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 12px 16px;
  border-top: 1px solid rgba(255,255,255,.05);
  font-size: .82rem;
  color: rgba(255,255,255,.9);
}
.faq2-table__row strong { color: #fff; font-size: .85rem; }
.faq2-table__row--accent { background: rgba(249,183,28,.08); }
.faq2-table__row--accent strong { color: var(--brilla-yellow); }

/* ── Panel Megacupo ── */
.faq2-mega-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.faq2-mega-card {
  position: relative;
  border-radius: 18px;
  padding: 36px 32px;
  overflow: hidden;
}
.faq2-mega-card--red  { background: linear-gradient(135deg, #A0001A 0%, #E8212A 100%); }
.faq2-mega-card--dark { background: linear-gradient(135deg, #B8460A 0%, #F47A30 100%); border: none; }

.faq2-mega-card__bg {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.08) 0%, transparent 60%);
  pointer-events: none;
}
.faq2-mega-card__badge {
  display: inline-block;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.12);
  padding: 5px 12px;
  border-radius: var(--radius-full);
  margin-bottom: 20px;
}
.faq2-mega-card__val {
  font-size: 3.2rem;
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  margin-bottom: 8px;
}
.faq2-mega-card--dark .faq2-mega-card__val { color: #fff; }
.faq2-mega-card__val span { font-size: 1.6rem; font-weight: 700; }
.faq2-mega-card__tag {
  font-size: .78rem;
  font-weight: 700;
  color: rgba(255,255,255,.6);
  text-transform: uppercase;
  letter-spacing: .8px;
  margin-bottom: 14px;
}
.faq2-mega-card__desc {
  font-size: .84rem;
  color: rgba(255,255,255,.6);
  line-height: 1.7;
  margin-bottom: 24px;
}
.faq2-mega-card__cta {
  display: inline-block;
  font-size: .82rem;
  font-weight: 700;
  color: var(--white);
  background: rgba(255,255,255,.15);
  padding: 10px 20px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background .2s;
}
.faq2-mega-card--dark .faq2-mega-card__cta { background: rgba(255,255,255,.2); color: #fff; }
.faq2-mega-card__cta:hover { background: rgba(255,255,255,.25); }
.faq2-mega-card--dark .faq2-mega-card__cta:hover { background: rgba(255,255,255,.32); }

/* ── Paneles redirect (5,6,7) ── */
.faq2-redirect {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  padding: 8px 0 8px;
}
.faq2-redirect__count {
  font-size: clamp(1.6rem, 3vw, 2.4rem);
  font-weight: 800;
  color: rgba(255,255,255,.9);
  line-height: 1.1;
  margin: 0;
}
.faq2-redirect__count span { color: var(--brilla-yellow); }
.faq2-redirect__text {
  max-width: 600px;
  font-size: .9rem;
  color: rgba(255,255,255,.9);
  line-height: 1.8;
}

/* ── Barra de contacto ── */
.faq2-contact {
  border-radius: 16px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.07);
  padding: 24px 32px;
}
.faq2-contact__inner {
  display: flex;
  align-items: center;
  gap: 20px;
}
.faq2-contact__icon {
  flex-shrink: 0;
  width: 48px; height: 48px;
  border-radius: 12px;
  background: rgba(255,255,255,.15);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.faq2-contact__title {
  font-size: .88rem;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 4px;
}
.faq2-contact__text {
  flex: 1;
  font-size: .8rem;
  color: rgba(255,255,255,.9);
  line-height: 1.65;
}
.faq2-contact__text a { color: #fff; font-weight: 700; transition: color .2s; }
.faq2-contact__text a:hover { color: var(--brilla-yellow); }
.faq2-contact__btn {
  flex-shrink: 0;
  display: inline-block;
  font-size: .82rem;
  font-weight: 700;
  color: #1F2937;
  background: var(--brilla-yellow);
  border: 1px solid var(--brilla-yellow);
  padding: 12px 22px;
  border-radius: var(--radius-sm);
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s, border-color .2s, transform .2s;
}
.faq2-contact__btn:hover { background: #FFE566; border-color: #FFE566; transform: translateY(-2px); }

/* Fuerza texto blanco dentro de la sección FAQ (la regla global p{color:gray} la pisa) */
.faq2-section p,
.faq2-section li,
.faq2-section span:not(.faq2-cat__name):not(.faq2-cat__arrow):not(.faq2-label):not(.faq2-stat__num):not(.faq2-stat__label):not(.faq2-mega-card__badge):not(.faq2-strata__label):not(.faq2-strata__val) {
  color: rgba(255,255,255,.88);
}
.faq2-section p a { color: var(--brilla-yellow); }
.faq2-section strong { color: #fff; }

/* ── Responsive ── */
@media (max-width: 1200px) {
  .faq2-cats { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 1023px) {
  .faq2-header { grid-template-columns: 1fr; gap: 24px; margin-bottom: 48px; }
  .faq2-cats   { grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .faq2-mega-grid { grid-template-columns: 1fr; }
  .faq2-panel { padding: 28px 24px; }
  .faq2-contact__inner { flex-wrap: wrap; gap: 16px; }
  .faq2-contact__btn { width: 100%; text-align: center; }
}
@media (max-width: 767px) {
  .faq2-cats { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .faq2-cat  { padding: 18px 10px 14px; }
  .faq2-cat__icon { width: 38px; height: 38px; }
}
@media (max-width: 599px) {
  .faq2-section { padding: 64px 0 56px; }
  .faq2-cats  { grid-template-columns: repeat(2, 1fr); }
  .faq2-panel { padding: 24px 16px; }
  .faq2-list  { grid-template-columns: 1fr; }
  .faq2-item__a { padding-right: 0; }
  .faq2-stats { gap: 14px; }
  .faq2-stat__num { font-size: 1.3rem; }
  .faq2-table__row { flex-direction: column; align-items: flex-start; gap: 4px; }
  .faq2-mega-card { padding: 28px 20px; }
  .faq2-mega-card__val { font-size: 2.4rem; }
}

/* ── Tabla de estratos (panel Mi Cupo) ── */
.faq2-strata {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-top: 14px;
}
.faq2-strata__row {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--radius-sm);
  padding: 12px 14px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.faq2-strata__row--hi {
  background: rgba(249,183,28,.06);
  border-color: rgba(249,183,28,.15);
}
.faq2-strata__label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.8);
}
.faq2-strata__val {
  font-size: .95rem;
  font-weight: 800;
  color: var(--white);
}
.faq2-strata__row--hi .faq2-strata__val { color: var(--brilla-yellow); }

/* ── Hint de fórmula dentro de acordeón ── */
.faq2-formula-hint {
  margin: 14px 0 !important;
  padding: 10px 16px;
  background: rgba(249,183,28,.08);
  border-left: 3px solid var(--brilla-yellow);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: .85rem;
  font-weight: 700;
  color: var(--brilla-yellow) !important;
}

@media (max-width: 599px) {
  .faq2-strata { grid-template-columns: repeat(2, 1fr); }
}

/* ═══════════════════════════════════════════════════════════
   TU CUPO — ACCESOS RÁPIDOS
═══════════════════════════════════════════════════════════ */
.tcupo-quick {
  background: var(--gray-50);
  border-bottom: 1px solid var(--gray-200);
  padding: 0;
}
.tcupo-quick__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}
.tcupo-quick__item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 18px 24px;
  border-right: 1px solid var(--gray-200);
  text-decoration: none;
  color: var(--gray-700);
  font-size: .82rem;
  transition: background var(--transition), color var(--transition);
  cursor: pointer;
}
.tcupo-quick__item:last-child { border-right: none; }
.tcupo-quick__item:hover {
  background: var(--white);
  color: var(--gray-900);
}
.tcupo-quick__item--active {
  background: var(--white);
  border-bottom: 2px solid var(--brilla-red);
  color: var(--brilla-red);
}
.tcupo-quick__item--active strong { color: var(--brilla-red); }
.tcupo-quick__item strong {
  display: block;
  font-size: .85rem;
  font-weight: 700;
  margin-bottom: 2px;
}
.tcupo-quick__item span {
  display: block;
  font-size: .72rem;
  color: var(--gray-400);
  line-height: 1.3;
}
.tcupo-quick__icon {
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: var(--radius-sm);
  background: var(--gray-100);
  color: var(--gray-500);
  display: flex; align-items: center; justify-content: center;
  transition: background var(--transition), color var(--transition);
}
.tcupo-quick__item--active .tcupo-quick__icon {
  background: rgba(232,33,42,.08);
  color: var(--brilla-red);
}
.tcupo-quick__item:hover .tcupo-quick__icon {
  background: var(--gray-200);
  color: var(--gray-700);
}

/* ═══════════════════════════════════════════════════════════
   TU CUPO — SECCIÓN CONSULTA (split layout)
═══════════════════════════════════════════════════════════ */
.tcupo-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}
.tcupo-info { padding-top: 8px; }

.tcupo-steps {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 32px 0;
}
.tcupo-step {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.tcupo-step__num {
  flex-shrink: 0;
  width: 32px; height: 32px;
  border-radius: 50%;
  background: var(--brilla-red);
  color: var(--white);
  font-size: .82rem;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  margin-top: 2px;
}
.tcupo-step p {
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.65;
}
.tcupo-step strong { color: var(--gray-900); }

.tcf__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.tcf__grid .form-group { margin-bottom: 16px; }
.tcf__grid .form-hint { margin-bottom: 0; }
.tcf__moto { border: 2px solid var(--gray-200); border-radius: var(--radius-sm); padding: 14px 16px; margin: 4px 0 16px; }
.tcf__moto legend { padding: 0 6px; margin: 0 0 0 -6px; text-transform: none; letter-spacing: 0; font-size: .85rem; color: var(--gray-800); }
.tcf__moto .form-hint { margin: 0 0 10px; }
.tcf__radios { display: flex; gap: 24px; }
.tcf__radio { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: .9rem; color: var(--gray-800); cursor: pointer; }
.tcf__radio input { width: 18px; height: 18px; accent-color: var(--brilla-red); cursor: pointer; }
.tcf input[type="date"] { min-height: 51px; }
.brilla-acepta { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 16px; font-size: .82rem; line-height: 1.55; color: var(--gray-600); cursor: pointer; }
.brilla-acepta input { flex-shrink: 0; width: 18px; height: 18px; margin-top: 1px; accent-color: var(--brilla-red); cursor: pointer; }
.brilla-acepta a { color: var(--brilla-red); font-weight: 700; text-decoration: underline; }
.brilla-captcha { margin: 0 0 18px; min-height: 65px; }
.tcf .brilla-captcha { display: flex; justify-content: center; }
.form-control.is-invalid { border-color: var(--brilla-red); background: rgba(234,0,41,.04); box-shadow: 0 0 0 3px rgba(234,0,41,.1); }
.brilla-acepta.is-invalid { color: var(--brilla-red); }
.brilla-acepta.is-invalid input { outline: 2px solid var(--brilla-red); outline-offset: 2px; }
.contact-form__msg { margin: 0 0 16px; padding: 12px 16px; border-radius: var(--radius-sm); font-size: .85rem; font-weight: 600; line-height: 1.5; }
.contact-form__msg--error { background: rgba(234,0,41,.07); color: var(--brilla-red-dark); }
.contact-form__msg--ok { background: rgba(59,212,174,.14); color: #00756F; }
.contact-form__msg--info { background: var(--gray-100); color: var(--gray-700); }
@media (max-width: 575px) { .tcf__grid { grid-template-columns: 1fr; } }

.tcm { display: none; position: fixed; inset: 0; background: rgba(17,24,39,.6); z-index: 9998; align-items: center; justify-content: center; padding: 20px; }
.tcm.is-open { display: flex; }
.tcm__box { background: var(--white); border-radius: var(--radius-lg); padding: 36px 28px 28px; max-width: 440px; width: 100%; max-height: 90vh; overflow-y: auto; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.3); }
.tcm__close { position: absolute; top: 10px; right: 14px; background: none; border: none; font-size: 28px; line-height: 1; cursor: pointer; color: var(--gray-400); }
.tcm--bloqueado .tcm__close { display: none; }
.tcm__res { text-align: center; }
.tcm__ico { width: 72px; height: 72px; margin: 0 auto 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.tcm__ico svg { width: 38px; height: 38px; }
.tcm__res--ok .tcm__ico { background: rgba(59,212,174,.15); color: var(--brilla-teal-dark); }
.tcm__res--error .tcm__ico { background: rgba(234,0,41,.1); color: var(--brilla-red); }
.tcm__res--warn .tcm__ico { background: rgba(255,182,0,.15); color: #C98A00; }
.tcm__tit { font-size: 1.4rem; font-weight: 800; color: var(--gray-900); margin: 0 0 10px; }
.tcm__res--error .tcm__tit { color: var(--brilla-red); }
.tcm__msg { color: var(--gray-600); font-size: .92rem; line-height: 1.6; margin: 0 0 22px; }
.tcm__msg a { color: var(--brilla-red); font-weight: 700; }
.tcm__val { display: block; font-size: 2.3rem; font-weight: 800; color: var(--brilla-red); line-height: 1.1; margin: 10px 0 6px; }
.tcm__contrato { display: block; font-size: .78rem; color: var(--gray-400); }
.tcm__desc { display: block; font-size: .88rem; color: var(--gray-600); line-height: 1.5; margin: 6px 0 14px; }
.tcm__chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 0 0 14px; }
.tcm__chips span { background: var(--gray-100); color: var(--gray-700); font-size: .74rem; font-weight: 700; padding: 5px 11px; border-radius: 999px; }
.tcm__btn { width: 100%; justify-content: center; }
.tcm__sec { display: block; margin-top: 14px; font-size: .85rem; font-weight: 700; color: var(--brilla-red); }
.tcm__spinner { width: 48px; height: 48px; margin: 0 auto 18px; border: 4px solid var(--gray-200); border-top-color: var(--brilla-red); border-radius: 50%; animation: tcm-spin 1s linear infinite; }
@keyframes tcm-spin { to { transform: rotate(360deg); } }

/* ═══════════════════════════════════════════════════════════
   TU CUPO — SIMULATOR SECTION
═══════════════════════════════════════════════════════════ */
.simulator-section {
  background: linear-gradient(135deg, #B82C0C 0%, #D94020 38%, #FF5C35 70%, #FF7244 100%);
  padding: 100px 0 80px;
  position: relative;
  overflow: hidden;
}
.simulator-section::before {
  content: '';
  position: absolute;
  top: 50%; right: -80px;
  transform: translateY(-50%);
  width: 420px; height: 420px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.1);
  pointer-events: none;
  z-index: 0;
  box-shadow:
    0 0 0 64px rgba(255,255,255,.05),
    0 0 0 128px rgba(255,255,255,.03),
    0 0 0 192px rgba(255,255,255,.02);
}

/* Scoped overrides — simulator on red gradient bg */
.simulator-section .btn--yellow {
  background: #fff;
  color: #D94020;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
.simulator-section .btn--yellow:hover { background: rgba(255,255,255,.92); }
.simulator-section .simulator {
  background: transparent;
  padding: 0;
  border-radius: 0;
}
.simulator-section .simulator__result {
  background: rgba(0,0,0,.12);
  border-color: rgba(255,255,255,.18);
}
.simulator-section .sim-plazo-btn {
  background: rgba(255,255,255,.15);
  color: rgba(255,255,255,.9);
  border: 1px solid rgba(255,255,255,.22);
}
.simulator-section .sim-plazo-btn.active,
.simulator-section .sim-plazo-btn:hover {
  background: #fff;
  color: #D94020;
  border-color: #fff;
}
.simulator-section .sim-result-label { color: rgba(255,255,255,.72); }
.simulator-section .sim-result-value { color: #fff; }
.simulator-section .highlight { color: #fff !important; }
.simulator-section .sim-label { color: rgba(255,255,255,.82); }
.simulator-section .sim-value { color: #fff; font-size: 1.9rem; font-weight: 800; }
.simulator-section .sim-range-minmax { color: rgba(255,255,255,.6); }

.sim-row-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-bottom: 0;
}

.sim-select {
  width: 100%;
  padding: 12px 16px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-sm);
  color: var(--white);
  font-family: var(--font);
  font-size: .875rem;
  font-weight: 600;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9' stroke='rgba(255,255,255,.4)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 18px;
  transition: border-color var(--transition);
}
.sim-select:focus {
  outline: none;
  border-color: rgba(255,255,255,.7);
}
.sim-select option { background: #B82C0C; color: var(--white); }

.sim-plazo-max {
  font-size: .72rem;
  font-weight: 600;
  color: rgba(255,255,255,.6);
  margin-left: 4px;
}

.sim-plazo-btn:disabled {
  opacity: .2;
  cursor: not-allowed;
  pointer-events: none;
}

.sim-cobertura {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  background: rgba(0,0,0,.12);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: var(--radius-sm);
  padding: 12px 16px;
  font-size: .8rem;
  color: rgba(255,255,255,.7);
  line-height: 1.5;
  margin-bottom: 16px;
}
.sim-cobertura svg { flex-shrink: 0; color: rgba(255,255,255,.9); margin-top: 2px; }
.sim-cobertura strong { color: #fff; }

.sim-disclaimer {
  font-size: .72rem;
  color: rgba(255,255,255,.5);
  line-height: 1.6;
  margin-bottom: 20px;
}

/* ═══════════════════════════════════════════════════════════
   TU CUPO — PASOS (¿Cómo usar tu Cupo?)
═══════════════════════════════════════════════════════════ */
.tcupo-paso {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  padding: 32px 28px;
  position: relative;
  overflow: hidden;
  transition: box-shadow var(--transition), transform var(--transition);
}
.tcupo-paso:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-4px);
}
.tcupo-paso--yellow {
  background: var(--brilla-yellow);
  border-color: var(--brilla-yellow);
}
.tcupo-paso__num {
  font-size: 4rem;
  font-weight: 800;
  color: var(--gray-100);
  line-height: 1;
  margin-bottom: 20px;
  display: block;
}
.tcupo-paso--yellow .tcupo-paso__num { color: rgba(255,255,255,.35); }
.tcupo-paso__num--yellow { color: rgba(255,255,255,.35); }
.tcupo-paso__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 10px;
}
.tcupo-paso--yellow .tcupo-paso__title { color: var(--gray-900); }
.tcupo-paso__text {
  font-size: .875rem;
  color: var(--gray-500);
  line-height: 1.7;
}
.tcupo-paso--yellow .tcupo-paso__text { color: rgba(0,0,0,.55); }

/* ═══════════════════════════════════════════════════════════
   TU CUPO — ESTRATOS 2026
═══════════════════════════════════════════════════════════ */
.tcupo-estratos {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 12px;
  margin-bottom: 40px;
}
.tcupo-estrato {
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-md);
  padding: 24px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  text-align: center;
  transition: box-shadow var(--transition), transform var(--transition);
}
.tcupo-estrato:hover {
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}
.tcupo-estrato--hi {
  background: rgba(232,33,42,.04);
  border-color: rgba(232,33,42,.15);
}
.tcupo-estrato__num {
  font-size: .65rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: rgba(0,0,0,.25);
}
.tcupo-estrato--hi .tcupo-estrato__num { color: var(--brilla-red); }
.tcupo-estrato__label {
  font-size: .75rem;
  font-weight: 600;
  color: var(--gray-500);
}
.tcupo-estrato__val {
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--gray-900);
  line-height: 1;
}
.tcupo-estrato--hi .tcupo-estrato__val { color: var(--brilla-red); }

.tcupo-mega-banner {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 20px;
}
.tcupo-mega-banner__item {
  position: relative;
  border-radius: var(--radius-lg);
  padding: 36px 28px;
  overflow: hidden;
  min-height: 200px;
}
.tcupo-mega-banner__item--red  { background: linear-gradient(135deg, #A0001A 0%, #E8212A 100%); }
.tcupo-mega-banner__item--dark { background: linear-gradient(135deg, #0e1118 0%, #1a1f2e 100%); border: 1px solid rgba(255,255,255,.08); }
.tcupo-mega-banner__item--gray { background: linear-gradient(135deg, #2a2f3a 0%, #1f2330 100%); border: 1px solid rgba(255,255,255,.06); }
.tcupo-mega-banner__bg {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 80% 20%, rgba(255,255,255,.08) 0%, transparent 60%);
  pointer-events: none;
}
.tcupo-mega-banner__badge {
  position: relative;
  display: inline-block;
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.12);
  padding: 5px 12px;
  border-radius: var(--radius-full);
  margin-bottom: 18px;
}
.tcupo-mega-banner__val {
  position: relative;
  font-size: 2.6rem;
  font-weight: 800;
  color: var(--white);
  line-height: 1;
  margin-bottom: 10px;
}
.tcupo-mega-banner__item--dark .tcupo-mega-banner__val { color: var(--brilla-yellow); }
.tcupo-mega-banner__desc {
  position: relative;
  font-size: .82rem;
  color: rgba(255,255,255,.55);
  line-height: 1.7;
}

/* ═══════════════════════════════════════════════════════════
   TU CUPO — RESPONSIVE
═══════════════════════════════════════════════════════════ */
@media (max-width: 1200px) {
  .tcupo-estratos { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 1023px) {
  .tcupo-quick__grid { grid-template-columns: repeat(2, 1fr); }
  .tcupo-quick__item { border-right: none; border-bottom: 1px solid var(--gray-200); }
  .tcupo-split { grid-template-columns: 1fr; gap: 40px; }
  .tcupo-form-wrap { position: static; }
  .sim-row-2 { grid-template-columns: 1fr; gap: 16px; }
  .tcupo-mega-banner { grid-template-columns: 1fr; }
  .simulator-section { padding: 72px 0 60px; }
}
@media (max-width: 767px) {
  .tcupo-estratos { grid-template-columns: repeat(2, 1fr); }
  .tcupo-mega-banner { grid-template-columns: 1fr; }
}
@media (max-width: 599px) {
  .tcupo-quick__grid { grid-template-columns: 1fr; }
  .tcupo-estratos { grid-template-columns: repeat(2, 1fr); }
  .simulator-section { padding: 64px 0 56px; }
  .tcupo-mega-banner__val { font-size: 2rem; }
  .tcupo-mega-banner__item { padding: 28px 20px; }
  .tcupo-result-ok__val { font-size: 2rem; }
  .tcupo-result-ok, .tcupo-result-err { margin-left: 20px; margin-right: 20px; }
}

/* ═══════════════════════════════════════════════════════════
   TU CUPO — CALCULADORA DE CUOTAS
═══════════════════════════════════════════════════════════ */
.calc-section {
  background: var(--white);
  padding: 100px 0 80px;
  border-top: 1px solid var(--gray-100);
}

.calc-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: start;
}

/* ── Columna info ── */
.calc-info { display: flex; flex-direction: column; gap: 24px; }

.calc-info__title {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 800;
  color: var(--gray-900);
  line-height: 1.1;
}
.calc-info__title em {
  font-style: normal;
  color: var(--brilla-red);
}
.calc-info__sub {
  font-size: .95rem;
  color: var(--gray-500);
  line-height: 1.7;
  margin-top: -12px;
}

/* Imagen ambientación calculadora */
.calc-visual-img {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  height: 200px;
  box-shadow: var(--shadow-md);
}
.calc-visual-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
}
.calc-visual-img__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10,10,20,.65) 0%, transparent 55%);
}
.calc-visual-img__badge {
  position: absolute;
  bottom: 16px; left: 16px;
  background: var(--brilla-red);
  color: #fff;
  font-size: .72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  padding: 6px 14px;
  border-radius: 100px;
}

.calc-how {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 0;
}
.calc-how__item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
}
.calc-how__dot {
  flex-shrink: 0;
  width: 28px; height: 28px;
  border-radius: 50%;
  background: var(--brilla-red);
  color: var(--white);
  font-size: .75rem;
  font-weight: 800;
  display: flex; align-items: center; justify-content: center;
  margin-top: 2px;
}
.calc-how__item p {
  font-size: .875rem;
  color: var(--gray-600);
  line-height: 1.65;
}
.calc-how__item strong { color: var(--gray-900); }

.calc-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: rgba(232,33,42,.04);
  border: 1px solid rgba(232,33,42,.12);
  border-radius: var(--radius-sm);
  padding: 16px 18px;
}
.calc-note svg { flex-shrink: 0; color: var(--brilla-red); margin-top: 2px; }
.calc-note p { color: var(--gray-600); font-size: .8rem; line-height: 1.65; }

/* ── Card calculadora ── */
.calc-card {
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  padding: 36px 32px;
  box-shadow: var(--shadow-md);
}

.calc-field { margin-bottom: 28px; }

.calc-label {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .5px;
  color: var(--gray-700);
  margin-bottom: 10px;
}

.calc-input-wrap {
  display: flex;
  align-items: center;
  background: var(--white);
  border: 1.5px solid var(--gray-300);
  border-radius: var(--radius-sm);
  overflow: hidden;
  transition: border-color var(--transition);
}
.calc-input-wrap:focus-within {
  border-color: var(--brilla-red);
}
.calc-input-prefix {
  padding: 0 12px;
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-400);
  background: var(--gray-50);
  border-right: 1px solid var(--gray-200);
  height: 48px;
  display: flex; align-items: center;
  flex-shrink: 0;
}
.calc-input {
  flex: 1;
  border: none;
  outline: none;
  padding: 0 16px;
  height: 48px;
  font-family: var(--font);
  font-size: 1rem;
  font-weight: 700;
  color: var(--gray-900);
  background: transparent;
  -moz-appearance: textfield;
}
.calc-input::-webkit-inner-spin-button,
.calc-input::-webkit-outer-spin-button { -webkit-appearance: none; }

.calc-range-row {
  margin-top: 10px;
}

/* ── Resultado ── */
.calc-result {
  background: var(--white);
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 20px;
}
.calc-result__main {
  padding: 28px 24px 24px;
  text-align: center;
  border-bottom: 1px solid var(--gray-100);
}
.calc-result__label {
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--gray-400);
  margin-bottom: 10px;
}
.calc-result__num {
  font-size: 2.8rem;
  font-weight: 800;
  color: var(--brilla-red);
  line-height: 1;
  margin-bottom: 6px;
}
.calc-result__sub {
  font-size: .85rem;
  color: var(--gray-500);
  font-weight: 600;
}
.calc-result__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.calc-result__item {
  padding: 16px 14px;
  text-align: center;
  border-right: 1px solid var(--gray-100);
}
.calc-result__item:last-child { border-right: none; }
.calc-result__item-label {
  font-size: .68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: var(--gray-400);
  display: block;
  margin-bottom: 5px;
}
.calc-result__item-val {
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-900);
  display: block;
}

/* Aviso / advertencia */
.calc-result__warn {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 16px 20px;
  background: rgba(232,33,42,.04);
  border-top: 1px solid rgba(232,33,42,.1);
  font-size: .8rem;
  color: var(--gray-700);
  line-height: 1.6;
}
.calc-result__warn svg { flex-shrink: 0; color: var(--brilla-red); margin-top: 2px; }

/* ── Deslizadores en fondo blanco ── */
.calc-section .sim-range {
  background: var(--gray-200);
}
.calc-section .sim-range-minmax {
  color: var(--gray-400);
}

/* ── Responsive ── */
@media (max-width: 1023px) {
  .calc-layout { grid-template-columns: 1fr; gap: 40px; }
  .calc-section { padding: 72px 0 60px; }
  .calc-info { gap: 20px; }
}
@media (max-width: 767px) {
  .calc-visual-img { height: 180px; }
  .calc-how { gap: 10px; }
  .calc-info__title { font-size: 1.7rem; }
  .calc-result__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 599px) {
  .calc-section { padding: 60px 0 48px; }
  .calc-card { padding: 24px 18px; }
  .calc-visual-img { height: 160px; }
  .calc-info { gap: 16px; }
  .calc-info__title { font-size: 1.6rem; }
  .calc-info__sub { font-size: .9rem; }
  .calc-how__item { gap: 12px; }
  .calc-how__dot { width: 24px; height: 24px; font-size: .7rem; }
  .calc-result__main { padding: 20px 16px; }
  .calc-result__num { font-size: 2.2rem; }
  .calc-result__grid { grid-template-columns: 1fr; }
  .calc-result__item { border-right: none; border-bottom: 1px solid var(--gray-100); }
  .calc-result__item:last-child { border-bottom: none; }
  .calc-field { margin-bottom: 20px; }
}

/* ═══════════════════════════════════════════════════════════
   QUÉ PUEDO FINANCIAR — INTRO
═══════════════════════════════════════════════════════════ */
.qpf-intro {
  padding: 80px 0 72px;
  background: var(--white);
  border-bottom: 1px solid var(--gray-100);
}
.qpf-intro__layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: stretch;
}
.qpf-intro__visual {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  min-height: 400px;
  box-shadow: 0 20px 60px rgba(0,0,0,.14);
}
.qpf-intro__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
  position: absolute;
  inset: 0;
}
.qpf-intro__visual-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(10,10,20,.45) 0%, transparent 55%);
}
.qpf-intro__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 32px;
}
.qpf-intro__title {
  font-size: clamp(1.9rem, 3vw, 2.8rem);
  font-weight: 800;
  line-height: 1.1;
  color: var(--gray-900);
  margin-bottom: 20px;
}
.qpf-intro__title em {
  font-style: normal;
  color: var(--brilla-red);
}
.qpf-intro__desc {
  font-size: 1rem;
  color: var(--gray-600);
  line-height: 1.75;
}
.qpf-intro__stat {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid var(--gray-100);
}
.qpf-intro__stat-num {
  font-size: 3.6rem;
  font-weight: 800;
  color: var(--brilla-red);
  line-height: 1;
}
.qpf-intro__stat-label {
  font-size: .75rem;
  color: var(--gray-500);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .08em;
  line-height: 1.4;
}
.qpf-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-content: flex-start;
}
.qpf-cat-chip {
  display: inline-flex;
  align-items: center;
  padding: 10px 20px;
  background: var(--gray-50);
  border: 1.5px solid var(--gray-200);
  border-radius: 40px;
  font-size: .82rem;
  font-weight: 600;
  color: var(--gray-700);
  text-decoration: none;
  font-family: var(--font);
  letter-spacing: .01em;
  transition: background .2s, border-color .2s, color .2s, transform .2s, box-shadow .2s;
  cursor: pointer;
}
.qpf-cat-chip:hover {
  background: var(--brilla-red);
  border-color: var(--brilla-red);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(232,33,42,.22);
}
@media (max-width: 1023px) {
  .qpf-intro__layout { gap: 40px; }
}
@media (max-width: 767px) {
  .qpf-intro { padding: 48px 0 40px; }
  .qpf-intro__layout { grid-template-columns: 1fr; gap: 28px; }
  .qpf-intro__visual {
    aspect-ratio: 16/9;
    min-height: 0;        /* libera el aspect-ratio en móvil */
  }
  .qpf-intro__content { gap: 24px; }
  .qpf-intro__title { font-size: 1.55rem; }
  .qpf-intro__desc { font-size: .95rem; }
  .qpf-cat-chip {
    padding: 11px 16px;   /* al menos 44px de alto para touch */
    font-size: .78rem;
  }
}
@media (max-width: 479px) {
  .qpf-intro__title { font-size: 1.4rem; }
  .qpf-cat-chip { padding: 10px 14px; font-size: .75rem; }
}

/* ═══════════════════════════════════════════════════════════
   QUÉ PUEDO FINANCIAR — GRID DE CATEGORÍAS
═══════════════════════════════════════════════════════════ */
.qpf-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.qpf-card {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg);
  padding: 28px 24px;
  display: flex;
  flex-direction: column;
  gap: 0;
  transition: box-shadow var(--transition), transform var(--transition);
}
.qpf-card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-3px);
}
.qpf-card--featured {
  grid-column: 1 / -1;
  background: var(--gray-900);
  border-color: transparent;
}

/* Head: icono + título */
.qpf-card__head {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-bottom: 18px;
}
.qpf-card__icon {
  flex-shrink: 0;
  width: 48px; height: 48px;
  border-radius: var(--radius-md);
  background: rgba(232,33,42,.07);
  color: var(--brilla-red);
  display: flex; align-items: center; justify-content: center;
}
.qpf-card__icon--featured {
  background: rgba(232,33,42,.2);
  color: var(--brilla-yellow);
}
.qpf-card__title {
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-900);
  margin: 0 0 4px;
  line-height: 1.3;
}
.qpf-card--featured .qpf-card__title { color: var(--white); }
.qpf-card__plazo {
  display: inline-block;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--brilla-red);
  background: rgba(232,33,42,.07);
  padding: 3px 9px;
  border-radius: var(--radius-full);
}
.qpf-card--featured .qpf-card__plazo {
  color: var(--brilla-yellow);
  background: rgba(249,183,28,.12);
}
.qpf-card__badge {
  display: inline-block;
  font-size: .62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  color: var(--gray-900);
  background: var(--brilla-yellow);
  padding: 4px 10px;
  border-radius: var(--radius-full);
}

/* Lista de productos */
.qpf-card__list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 7px;
  flex: 1;
  margin-bottom: 20px;
}
.qpf-card__list li {
  font-size: .82rem;
  color: var(--gray-600);
  padding-left: 16px;
  position: relative;
  line-height: 1.5;
}
.qpf-card--featured .qpf-card__list li { color: rgba(255,255,255,.55); }
.qpf-card__list li::before {
  content: '';
  position: absolute;
  left: 0; top: 8px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--brilla-red);
  flex-shrink: 0;
}
.qpf-card--featured .qpf-card__list li::before { background: var(--brilla-yellow); }

/* CTA link */
.qpf-card__cta {
  display: inline-flex;
  align-items: center;
  font-size: .8rem;
  font-weight: 700;
  color: var(--brilla-red);
  text-decoration: none;
  margin-top: auto;
  transition: gap var(--transition);
}
.qpf-card__cta:hover { text-decoration: underline; }
.qpf-card--featured .qpf-card__cta { color: var(--brilla-yellow); }

/* Tabla de plazos movilidad */
.qpf-mov-table {
  border-radius: var(--radius-sm);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.08);
  margin-bottom: 4px;
}
.qpf-mov-table__head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 16px;
  background: rgba(255,255,255,.06);
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: rgba(255,255,255,.35);
}
.qpf-mov-table__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 11px 16px;
  border-top: 1px solid rgba(255,255,255,.05);
  font-size: .82rem;
  color: rgba(255,255,255,.55);
}
.qpf-mov-table__row:hover { background: rgba(255,255,255,.03); }
.qpf-mov-table__val {
  font-weight: 700;
  color: var(--brilla-yellow);
  white-space: nowrap;
  flex-shrink: 0;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
  .qpf-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 599px) {
  .qpf-grid { grid-template-columns: 1fr; }
  .qpf-card--featured { grid-column: auto; }
  .qpf-mov-table__row { flex-direction: column; align-items: flex-start; gap: 2px; }
}

/* ============================================================
   ALIADOS — filtros + grid + tarjetas
   ============================================================ */

.aliados-filters {
  background: #f8f8f8;
  border-bottom: 1px solid #e8e8e8;
  padding: 1.5rem 0;
}

.aliados-filter-group {
  margin-bottom: 1rem;
}
.aliados-filter-group:last-child { margin-bottom: 0; }

.aliados-filter-label {
  display: block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #888;
  margin-bottom: .5rem;
}

.aliados-filter-row {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}

.aliado-btn {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .38rem .85rem;
  border: 1.5px solid #d5d5d5;
  border-radius: 999px;
  background: #fff;
  font-family: 'Montserrat', sans-serif;
  font-size: .78rem;
  font-weight: 600;
  color: #444;
  cursor: pointer;
  transition: border-color .18s, background .18s, color .18s;
  line-height: 1;
}
.aliado-btn:hover {
  border-color: var(--brilla-red);
  color: var(--brilla-red);
}
.aliado-btn.is-active {
  background: var(--brilla-red);
  border-color: var(--brilla-red);
  color: #fff;
}

.aliado-btn--cat {
  border-color: #f2c2c4;
}
.aliado-btn--cat:hover {
  border-color: var(--brilla-red);
}
.aliado-btn--cat.is-active {
  background: var(--brilla-red);
  border-color: var(--brilla-red);
  color: #fff;
}

.aliados-count {
  font-size: .82rem;
  color: #999;
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid #e8e8e8;
}
.aliados-count strong {
  color: var(--brilla-red);
  font-weight: 700;
}

.aliados-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin-top: 2rem;
}

.aliado-card {
  background: #fff;
  border: 1.5px solid #ebebeb;
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow .22s, transform .22s;
}
.aliado-card:hover {
  box-shadow: 0 8px 28px rgba(0,0,0,.09);
  transform: translateY(-3px);
}

.aliado-card__head {
  padding: 1.1rem 1.1rem .6rem;
  border-bottom: 1px solid #f0f0f0;
}

.aliado-card__name {
  font-size: .97rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 .5rem;
  line-height: 1.3;
}

.aliado-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
}

.aliado-tag {
  display: inline-block;
  padding: .18rem .55rem;
  border-radius: 999px;
  font-size: .68rem;
  font-weight: 600;
  line-height: 1.4;
  background: #f0f0f0;
  color: #666;
}

.aliado-tag--cat {
  background: #fde8e9;
  color: var(--brilla-red);
}

.aliado-tag--multi {
  background: #fff3e0;
  color: #e65c00;
}

.aliado-card__locs {
  list-style: none;
  margin: 0;
  padding: .7rem 1.1rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .55rem;
}

.aliado-card__locs li {
  font-size: .78rem;
  color: #555;
  line-height: 1.45;
}

.aliado-card__locs li strong {
  display: block;
  font-size: .73rem;
  font-weight: 700;
  color: #222;
  margin-bottom: .05rem;
}

.aliado-card__locs li a {
  color: var(--brilla-red);
  text-decoration: none;
  font-weight: 600;
}
.aliado-card__locs li a:hover { text-decoration: underline; }

.aliados-empty {
  display: none;
  grid-column: 1 / -1;
  text-align: center;
  padding: 3.5rem 1rem;
  color: #aaa;
}
.aliados-empty svg {
  width: 48px;
  height: 48px;
  margin-bottom: 1rem;
  opacity: .35;
}
.aliados-empty p {
  font-size: .9rem;
  font-weight: 600;
}

@media (max-width: 1023px) {
  .aliados-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 599px) {
  .aliados-grid {
    grid-template-columns: 1fr;
  }
  .aliados-filter-row {
    gap: .3rem;
  }
  .aliado-btn {
    font-size: .72rem;
    padding: .32rem .7rem;
  }
}

/* ============================================================
   ALIADOS — NUEVO DIRECTORIO PREMIUM (.al-*)
   ============================================================ */

.al-dir { padding: 80px 0 100px; background: var(--gray-50); }

.al-dir__title {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 800; color: var(--gray-900); margin-bottom: 10px;
}
.al-dir__title em { font-style: normal; color: var(--brilla-red); }
.al-dir__subtitle { font-size: .95rem; color: var(--gray-500); line-height: 1.55; }

/* ── Cabecera ── */
.al-hdr { margin-bottom: 24px; text-align: center; }

/* ── Barra de municipios premium ── */
.al-city-row {
  display: flex;
  align-items: center;
  gap: 0;
  background: #fff;
  border-radius: 60px;
  padding: 6px 8px 6px 20px;
  box-shadow: 0 2px 16px rgba(0,0,0,.07);
  border: 1px solid var(--gray-100);
  margin-bottom: 24px;
  min-width: 0;
}
.al-city-row__label {
  display: flex;
  align-items: center;
  color: var(--brilla-red);
  flex-shrink: 0;
  padding-right: 14px;
  margin-right: 6px;
  border-right: 1.5px solid var(--gray-100);
}
.al-city-row__scroll {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  flex: 1;
  min-width: 0;
  -webkit-overflow-scrolling: touch;
}
.al-city-row__scroll::-webkit-scrollbar { display: none; }

.al-city-btn {
  background: none;
  border: none;
  padding: 10px 22px;
  border-radius: 40px;
  font-size: .9rem;
  font-weight: 600;
  color: var(--gray-500);
  cursor: pointer;
  font-family: var(--font);
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .16s, color .16s;
  line-height: 1;
}
.al-city-btn:hover { background: var(--gray-100); color: var(--gray-800); }
.al-city-btn.is-active { background: var(--brilla-red); color: #fff; font-weight: 700; }

/* ── Select municipio (móvil) ── */
.al-city-select-wrap {
  display: none;
  align-items: center;
  gap: 0;
  background: #fff;
  border-radius: 60px;
  padding: 0 18px 0 18px;
  box-shadow: 0 2px 16px rgba(0,0,0,.07);
  border: 1px solid var(--gray-100);
  margin-bottom: 20px;
  position: relative;
  min-width: 0;
  transition: border-color .18s, box-shadow .18s;
}
.al-city-select-wrap:focus-within {
  border-color: var(--brilla-red);
  box-shadow: 0 0 0 3px rgba(234,0,41,.1), 0 2px 16px rgba(0,0,0,.07);
}
.al-city-select__icon {
  display: flex;
  align-items: center;
  color: var(--brilla-red);
  flex-shrink: 0;
  padding-right: 12px;
  border-right: 1.5px solid var(--gray-200);
  margin-right: 4px;
}
.al-city-select {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  appearance: none;
  -webkit-appearance: none;
  font-family: var(--font);
  font-size: .9rem;
  font-weight: 600;
  color: var(--gray-700);
  padding: 14px 8px 14px 12px;
  cursor: pointer;
}
.al-city-select__arrow {
  display: flex;
  align-items: center;
  color: var(--gray-400);
  flex-shrink: 0;
  pointer-events: none;
}

/* ── Navegador visual de categorías ── */
.al-cats {
  display: flex;
  gap: 10px;
  margin-bottom: 24px;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: none;
  padding-top: 8px;
  padding-bottom: 14px;
  margin-top: -8px;
}
.al-cats::-webkit-scrollbar { display: none; }

/* Tile — botón contenedor */
.al-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 0;
  min-width: 108px;
  flex: 1;
  max-width: 132px;
  border: none;
  background: none;
  cursor: pointer;
  font-family: var(--font);
  opacity: 0.45;
  transition: opacity .2s ease, transform .2s ease;
}
.al-tile.is-active { opacity: 1; }
.al-tile:hover:not(.is-active) { opacity: .78; }

/* Tarjeta de imagen */
.al-tile__img {
  width: 100%;
  height: 200px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 0 0 transparent;
  transition: transform .22s ease, box-shadow .22s ease;
}
.al-tile.is-active .al-tile__img {
  transform: translateY(-6px);
  box-shadow: 0 6px 0 0 var(--tile-color, var(--brilla-red));
}
.al-tile:hover:not(.is-active) .al-tile__img { transform: translateY(-2px); }

/* Círculo glass detrás del ícono */
.al-tile__img::before {
  content: '';
  position: absolute;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: rgba(255,255,255,.28);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Imágenes de fondo por categoría */
.al-tile--all             { --tile-color: var(--brilla-red); }
.al-tile--electrodomesticos { --tile-color: var(--brilla-red); }
.al-tile--movilidad       { --tile-color: var(--brilla-orange); }
.al-tile--construccion    { --tile-color: #C97B22; }
.al-tile--tecnologia      { --tile-color: #2563EB; }
.al-tile--saludoral       { --tile-color: #0D9488; }
.al-tile--utilesescolares { --tile-color: #16A34A; }
.al-tile--muebles         { --tile-color: #6B7280; }
.al-tile--modatextil      { --tile-color: #DB2777; }
.al-tile--hogar           { --tile-color: #7C3AED; }

.al-tile--all .al-tile__img             { background: url('../imagenes/brilla/img-1.webp') center/cover no-repeat; }
.al-tile--electrodomesticos .al-tile__img { background: url('../imagenes/brilla/categorias/electrodomesticos.png') center/cover no-repeat; }
.al-tile--movilidad .al-tile__img       { background: url('../imagenes/brilla/categorias/Movilidad.png') center/cover no-repeat; }
.al-tile--construccion .al-tile__img    { background: url('../imagenes/brilla/categorias/materiales-construccion.png') center/cover no-repeat; }
.al-tile--tecnologia .al-tile__img      { background: url('../imagenes/brilla/categorias/tegnologia.webp') center/cover no-repeat; }
.al-tile--saludoral .al-tile__img       { background: url('../imagenes/brilla/categorias/salud-oral.webp') center/cover no-repeat; }
.al-tile--utilesescolares .al-tile__img { background: url('../imagenes/brilla/categorias/utiles-escolares.webp') center/cover no-repeat; }
.al-tile--muebles .al-tile__img         { background: url('../imagenes/brilla/categorias/muebles.png') center/cover no-repeat; }
.al-tile--modatextil .al-tile__img      { background: url('../imagenes/brilla/categorias/ropa-textl.webp') center/cover no-repeat; }
.al-tile--hogar .al-tile__img           { background: linear-gradient(135deg, #7C3AED, #A78BFA); }

/* Ícono */
.al-tile__ico {
  position: relative;
  z-index: 1;
  color: #fff;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.45));
}

/* Nombre fuera de la card */
.al-tile__name {
  font-size: .7rem;
  font-weight: 700;
  color: var(--gray-700);
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: center;
  line-height: 1.3;
}

/* ── Barra de resultados ── */
.al-resultbar {
  display: flex;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--gray-200);
  margin-bottom: 28px;
}
.al-count { font-size: .8rem; color: var(--gray-400); font-weight: 500; }
.al-count strong { color: var(--brilla-red); font-weight: 800; font-size: .95rem; margin-right: 2px; }

/* ── Grid ── */
.al-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

/* ── Card ── */
.al-card {
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  border: 1px solid var(--gray-100);
  display: flex;
  flex-direction: column;
  transition: transform .22s, box-shadow .22s;
  cursor: pointer;
}
.al-card:hover { transform: translateY(-4px); box-shadow: 0 12px 36px rgba(0,0,0,.12); }

/* Logo area */
.al-card__logo {
  height: 160px;
  display: flex; align-items: center; justify-content: center;
  background: var(--white);
}
.al-logo-bg--electrodomesticos,
.al-logo-bg--movilidad,
.al-logo-bg--construccion,
.al-logo-bg--tecnologia,
.al-logo-bg--saludoral,
.al-logo-bg--utilesescolares,
.al-logo-bg--muebles,
.al-logo-bg--modatextil,
.al-logo-bg--hogar { background: var(--white); }

/* Monogram */
.al-card__mono {
  width: 72px; height: 72px;
  border-radius: 20px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; font-weight: 800; font-family: var(--font);
  color: #fff; letter-spacing: -.02em;
}
.al-mono--electrodomesticos { background: var(--brilla-red); }
.al-mono--movilidad          { background: var(--brilla-orange); }
.al-mono--construccion       { background: #C97B22; }
.al-mono--tecnologia         { background: #2563EB; }
.al-mono--saludoral          { background: #0D9488; }
.al-mono--utilesescolares    { background: #16A34A; }
.al-mono--muebles            { background: #6B7280; }
.al-mono--modatextil         { background: #DB2777; }
.al-mono--hogar              { background: #7C3AED; }

/* Real ally logo (replaces monogram) — fills the full logo area */
.al-card__logo-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 14px 22px;
}
@media (max-width: 479px) {
  .al-card__logo-img { padding: 10px 16px; }
}

/* Card body */
.al-card__body {
  padding: 18px 20px 22px;
  display: flex; flex-direction: column; gap: 8px; flex: 1;
}
.al-card__meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Badge categoria */
.al-badge {
  display: inline-flex; align-items: center;
  padding: 3px 10px; border-radius: 20px;
  font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em;
}
.al-badge--electrodomesticos { background: rgba(234,0,41,.1);    color: var(--brilla-red); }
.al-badge--movilidad          { background: rgba(244,122,48,.12); color: #C85E1C; }
.al-badge--construccion       { background: rgba(201,123,34,.12); color: #7A4E0A; }
.al-badge--tecnologia         { background: rgba(37,99,235,.1);   color: #1D4ED8; }
.al-badge--saludoral          { background: rgba(13,148,136,.1);  color: #0A7170; }
.al-badge--utilesescolares    { background: rgba(22,163,74,.1);   color: #15803D; }
.al-badge--muebles            { background: rgba(107,114,128,.1); color: #4B5563; }
.al-badge--modatextil          { background: rgba(219,39,119,.1);  color: #BE185D; }
.al-badge--hogar               { background: rgba(124,58,237,.1);  color: #6D28D9; }

/* Ciudad */
.al-city {
  font-size: .72rem; font-weight: 600; color: var(--gray-400);
  display: flex; align-items: center; gap: 4px;
}
.al-city::before {
  content: ''; display: inline-block;
  width: 5px; height: 5px; border-radius: 50%; background: var(--gray-300);
}

/* Nombre */
.al-card__name { font-size: .98rem; font-weight: 700; color: var(--gray-900); line-height: 1.25; }

/* Ubicaciones */
.al-card__locs {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 6px;
  border-top: 1px solid var(--gray-100); padding-top: 10px; margin-top: 2px;
}
.al-card__locs li {
  display: flex; align-items: flex-start; gap: 6px;
  font-size: .76rem; color: var(--gray-600); line-height: 1.45;
}
.al-card__locs li svg { flex-shrink: 0; color: var(--gray-400); margin-top: 2px; }
.al-card__locs a { color: var(--brilla-red); text-decoration: none; font-weight: 600; }
.al-card__locs a:hover { text-decoration: underline; }

/* Estado vacío */
.al-empty {
  display: none; grid-column: 1/-1;
  flex-direction: column; align-items: center; justify-content: center;
  padding: 60px 20px; gap: 16px; text-align: center; color: var(--gray-400);
}
.al-empty svg { opacity: .35; }
.al-empty p { font-size: .9rem; line-height: 1.6; font-weight: 600; }

/* ── Responsive ── */
@media (max-width: 1023px) {
  .al-grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .al-tile { min-width: 96px; max-width: 118px; }
  .al-tile__img { height: 170px; }
}
@media (max-width: 767px) {
  .al-dir { padding: 40px 0 56px; }
  .al-hdr { margin-bottom: 20px; }
  .al-dir__title { font-size: 1.7rem; }
  .al-dir__subtitle { font-size: .88rem; }

  /* Ciudad — select en móvil, ocultar pill bar */
  .al-city-row { display: none; }
  .al-city-select-wrap { display: flex; }

  /* Tiles */
  .al-cats { gap: 8px; padding-top: 6px; padding-bottom: 12px; margin-top: -6px; }
  .al-tile { min-width: 90px; max-width: 110px; gap: 8px; }
  .al-tile__img { height: 130px; border-radius: 12px; }
  .al-tile__img::before { width: 40px; height: 40px; }
  .al-tile__name { font-size: .65rem; }

  /* Cards */
  .al-grid { grid-template-columns: 1fr; gap: 14px; }
  .al-card__logo { height: 130px; }
  .al-card__mono { width: 58px; height: 58px; font-size: 1.2rem; border-radius: 16px; }
}
@media (max-width: 479px) {
  .al-dir__title { font-size: 1.45rem; }
  .al-tile { min-width: 78px; max-width: 96px; }
  .al-tile__img { height: 108px; }
  .al-tile__ico { width: 20px; height: 20px; }
  .al-tile__name { font-size: .6rem; }
}

/* ============================================================
   UX GUIDELINES — Trust & Authority · Finance Service LATAM
   ============================================================ */

/* 1. Cursor pointer en todos los elementos interactivos */
.cat-card,
.quick-card,
.step-card,
.aliado-card,
.nav__link,
.nav__cobrand {
  cursor: pointer;
}

/* 2. Focus ring visible — accesibilidad teclado (WCAG 2.1 AA) */
:focus-visible {
  outline: 3px solid var(--brilla-yellow);
  outline-offset: 2px;
  border-radius: 4px;
}
.btn:focus-visible {
  outline: 3px solid var(--brilla-yellow);
  outline-offset: 3px;
}
.cat-card:focus-visible {
  outline: 3px solid var(--brilla-yellow);
  outline-offset: 3px;
  border-radius: 12px;
}
.nav__link:focus-visible {
  outline: 3px solid var(--brilla-yellow);
  outline-offset: 4px;
  border-radius: 6px;
}

/* 3. Reduce-motion — respeta preferencia del usuario */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════
   MOBILE COMPREHENSIVE FIX — 390px
   Correctivos globales para móvil. Estos overrides se aplican
   después de todos los breakpoints anteriores.
═══════════════════════════════════════════════════════════ */
@media (max-width: 767px) {

  /* ── 1. HERO: beneficios sin recorte de texto ───────────── */
  .hero__claim  { display: none; }
  .hero__benefit { white-space: normal; }

  /* ── 2. CAT TÍTULO: wrap, sin desbordamiento horizontal ─── */
  .cat-head__title {
    white-space: normal;
    font-size: clamp(1.55rem, 7vw, 2rem);
    text-align: center;
  }

  /* ── 3. CAT GRID: todas las cards en flujo 2-col normal ─── */
  /* Card 1 en desktop: grid-column:1/3 grid-row:1/3           */
  /* Card 2 en desktop: grid-column:4/6 grid-row:1/4           */
  /* Card 2 en 767px:   grid-column:1/-1 (full width)          */
  /* Resultado: card 1 sola en row 1. Fix: ambas van a auto.   */
  .cat-grid .cat-card:nth-child(1) {
    grid-column: auto !important;
    grid-row: auto !important;
  }
  .cat-grid .cat-card:nth-child(2) {
    grid-column: auto !important;
    grid-row: auto !important;
  }

  /* ── 4. QUICK-CARDS (cinturón): carousel 1 card a la vez ── */
  /* Cada card ocupa ~85vw → 1 card visible + peek siguiente  */
  .quick-cards {
    overflow: hidden;      /* evitar scroll horizontal en la página */
  }
  .quick-cards__grid {
    display: flex;
    flex-direction: row;
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    height: 240px;
    gap: 0;
  }
  .quick-cards__grid::-webkit-scrollbar { display: none; }
  .quick-card {
    flex: 0 0 88vw !important;
    width: 88vw !important;
    height: 240px !important;
    scroll-snap-align: start;
    border-radius: 0 !important;
    border-right: none !important;
    border-bottom: none !important;
    overflow: hidden;
  }
  /* Anular overrides de grid anteriores */
  .quick-card:nth-child(2n) { border-right: none !important; }
  .quick-card:nth-child(5)  { flex: 0 0 88vw !important; }

  /* ── 5. QBI SECTION: eliminar espacio vacío excesivo ────── */
  .qbi-section { padding: 56px 0 48px; }
  .qbi-deco    { display: none; }
  .qbi-grid    { gap: 28px; }
  .qbi-img-wrap { width: 220px !important; height: 220px !important; }
  .qbi-desc    { max-width: 100%; }
  .qbi-cta-row { justify-content: flex-start; }

  /* ── 6. FOOTER: ocultar anillos blancos decorativos ─────── */
  .footer__rings { display: none !important; }

  /* ── 7. FAB OFICINA VIRTUAL: no tapar botón del simulador ─ */
  .qfab      { bottom: 74px; right: 16px; }
  .qfab__menu { right: 16px; bottom: 132px; }
}

/* ============================================================
   QUÉ ES BRILLA — Página Rediseñada (prefijo qeb-)
   ============================================================ */

/* === QEB HERO ============================================== */
.qeb-hero {
  position: relative;
  min-height: 380px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding-bottom: 64px;
  color: #fff;
}

.qeb-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.qeb-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 25%;
}

.qeb-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    rgba(10,10,10,.88) 0%,
    rgba(10,10,10,.65) 55%,
    rgba(10,10,10,.18) 100%
  );
}

.qeb-hero__overlay--red {
  background: linear-gradient(
    to top,
    rgba(184,44,12,.55) 0%,
    transparent 55%
  );
}

.qeb-hero__content {
  position: relative;
  z-index: 2;
  padding-top: var(--nav-h);
  text-align: center;
}

.qeb-hero__breadcrumb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: .72rem;
  color: rgba(255,255,255,.45);
  margin-bottom: 16px;
}

.qeb-hero__breadcrumb a {
  color: rgba(255,255,255,.45);
  transition: color var(--transition);
}

.qeb-hero__breadcrumb a:hover { color: #fff; }

.qeb-hero__badge {
  display: inline-flex;
  align-items: center;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--brilla-yellow);
  border: 1px solid rgba(252,220,62,.35);
  border-radius: var(--radius-full);
  padding: 5px 16px;
  margin-bottom: 22px;
}

.qeb-hero__title {
  font-size: clamp(2rem, 4vw, 3.2rem);
  font-weight: 800;
  line-height: 1.1;
  margin-bottom: 0;
}

.qeb-hero__accent {
  font-style: normal;
  color: var(--brilla-yellow);
}

.qeb-hero__sub {
  font-size: clamp(.9rem, 1.2vw, 1.08rem);
  color: rgba(255,255,255,.72);
  max-width: 520px;
  line-height: 1.7;
  margin-bottom: 36px;
}

.qeb-hero__actions {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: 52px;
  flex-wrap: wrap;
}

.qeb-hero__scroll {
  font-size: .75rem;
  font-weight: 700;
  color: rgba(255,255,255,.5);
  text-transform: uppercase;
  letter-spacing: 2px;
  transition: color var(--transition);
}

.qeb-hero__scroll:hover { color: #fff; }

.qeb-hero__stats {
  display: flex;
  align-items: center;
  border-top: 1px solid rgba(255,255,255,.14);
  padding-top: 28px;
  width: fit-content;
  gap: 0;
}

.qeb-hero__stat {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 0 32px;
}

.qeb-hero__stat:first-child { padding-left: 0; }

.qeb-hero__stat-num {
  font-size: 1.85rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1;
}

.qeb-hero__stat-label {
  font-size: .62rem;
  color: rgba(255,255,255,.45);
  text-transform: uppercase;
  letter-spacing: 1.2px;
  white-space: nowrap;
}

.qeb-hero__stat-div {
  width: 1px;
  height: 44px;
  background: rgba(255,255,255,.14);
  flex-shrink: 0;
}

/* === QEB DEFINICIÓN ======================================== */
.qeb-def {
  background: #fff;
  padding: 108px 0 100px;
  position: relative;
  overflow: hidden;
}

.qeb-def__deco {
  position: absolute;
  right: -160px;
  top: -80px;
  width: 580px;
  height: 580px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(234,0,41,.05) 0%, transparent 72%);
  pointer-events: none;
}

.qeb-def__grid {
  display: grid;
  grid-template-columns: 1fr 460px;
  gap: 80px;
  align-items: center;
}

/* Columna texto */
.qeb-def__text {
  position: relative;
}

.qeb-def__step {
  position: absolute;
  top: -32px;
  left: -12px;
  font-size: 9rem;
  font-weight: 800;
  line-height: 1;
  color: rgba(234,0,41,.055);
  pointer-events: none;
  user-select: none;
  letter-spacing: -4px;
}

.qeb-def__heading {
  font-size: clamp(1.85rem, 3.2vw, 2.75rem);
  font-weight: 800;
  line-height: 1.12;
  color: var(--gray-900);
  margin: 0 0 14px;
}

.qeb-def__heading strong { color: var(--brilla-red); }

.qeb-def__body {
  font-size: .94rem;
  line-height: 1.78;
  color: var(--gray-600);
  margin-bottom: 14px;
  margin-top: 20px;
  max-width: 540px;
}

.qeb-def__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 36px;
}

/* Columna visual: stack de cards */
.qeb-def__visual {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.qeb-def__photo-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  height: 290px;
  box-shadow: var(--shadow-lg);
}

.qeb-def__photo-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 15%;
}

.qeb-def__photo-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(184,44,12,.80) 0%,
    rgba(234,0,41,.55) 55%,
    transparent 90%
  );
}

.qeb-def__photo-brand {
  position: absolute;
  bottom: 22px;
  left: 24px;
  filter: brightness(0) invert(1);
}

.qeb-def__cupo-card {
  background: var(--gray-900);
  border-radius: var(--radius-lg);
  padding: 26px 28px;
  display: flex;
  align-items: center;
  gap: 24px;
  box-shadow: var(--shadow-md);
}

.qeb-def__cupo-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex: 1;
}

.qeb-def__cupo-label {
  font-size: .58rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: rgba(255,255,255,.38);
}

.qeb-def__cupo-val {
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1.1;
}

.qeb-def__cupo-sub {
  font-size: .68rem;
  color: rgba(255,255,255,.48);
  line-height: 1.4;
}

.qeb-def__cupo-divider {
  width: 1px;
  height: 60px;
  background: rgba(255,255,255,.1);
  flex-shrink: 0;
}

/* === QEB BENEFICIOS ======================================== */
.qeb-ben {
  background: linear-gradient(135deg, #7D2200 0%, #B84010 40%, #D95A1A 75%, #F07030 100%);
  padding: 108px 0 100px;
  position: relative;
  overflow: hidden;
}

.qeb-ben::before {
  content: '';
  position: absolute;
  top: -80px;
  right: -80px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.04) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.qeb-ben > .container { position: relative; z-index: 1; }

/* Encabezado split */
.qeb-ben__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 48px;
  margin-bottom: 72px;
  flex-wrap: wrap;
}

.qeb-ben__label {
  color: rgba(255,255,255,.35) !important;
  border-color: rgba(255,255,255,.12) !important;
}

.qeb-ben__title {
  font-size: clamp(2rem, 3.8vw, 3rem);
  font-weight: 800;
  color: #fff;
  line-height: 1.1;
  margin-top: 12px;
}

.qeb-ben__sub {
  font-size: .93rem;
  color: #fff;
  line-height: 1.72;
  max-width: 380px;
  align-self: flex-end;
}

/* Grid 2 columnas */
.qeb-ben__grid {
  display: grid;
  grid-template-columns: 360px 1fr;
  gap: 72px;
  align-items: center;
  margin-bottom: 56px;
}

/* Columna visual */
.qeb-ben__visual {
  position: relative;
}

.qeb-ben__img-wrap {
  position: relative;
  width: 310px;
  height: 310px;
  margin: 0 auto;
}

.qeb-ben__img-rings {
  position: absolute;
  inset: -28px;
  border-radius: 50%;
  border: 1px solid rgba(234,0,41,.22);
  animation: qeb-ring-spin 8s linear infinite;
}

.qeb-ben__img-rings::before {
  content: '';
  position: absolute;
  inset: -22px;
  border-radius: 50%;
  border: 1px solid rgba(234,0,41,.1);
  animation: qeb-ring-spin 12s linear infinite reverse;
}

@keyframes qeb-ring-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.qeb-ben__img-circle {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
  border: 4px solid rgba(255,255,255,.08);
  box-shadow: 0 0 48px rgba(234,0,41,.2);
}

.qeb-ben__img-circle img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.qeb-ben__badge {
  position: absolute;
  bottom: -12px;
  right: 0;
  background: var(--brilla-yellow);
  border-radius: var(--radius-md);
  padding: 16px 22px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #1F2937;
  box-shadow: 0 12px 32px rgba(252,220,62,.35);
}

.qeb-ben__badge-num {
  font-size: 2.2rem;
  font-weight: 800;
  line-height: 1;
  color: #1F2937;
}

.qeb-ben__badge-text {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.2px;
  opacity: .75;
  line-height: 1.45;
  color: #1F2937;
}

/* Lista de beneficios 01–05 */
.qeb-ben__items {
  display: flex;
  flex-direction: column;
}

.qeb-ben__item {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 18px;
  align-items: flex-start;
  padding: 22px 12px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  border-radius: 8px;
  transition: background var(--transition), border-color var(--transition);
  cursor: default;
}

.qeb-ben__item:hover {
  background: rgba(255,255,255,.07);
  border-bottom-color: rgba(255,255,255,.14);
}

.qeb-ben__item:last-child { border-bottom: none; }

.qeb-ben__item-num {
  font-size: 1.9rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  opacity: .7;
  line-height: 1.1;
}

.qeb-ben__item-title {
  font-size: .94rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.3;
}

.qeb-ben__item-text {
  font-size: .8rem;
  color: rgba(255,255,255,.78);
  line-height: 1.68;
}

/* Cards inferiores 06–10 */
.qeb-ben__cards {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}

.qeb-ben__card {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: var(--radius-md);
  padding: 24px 18px;
  transition: background var(--transition), border-color var(--transition), transform var(--transition);
  cursor: default;
}

.qeb-ben__card:hover {
  background: rgba(255,255,255,.07);
  border-color: rgba(234,0,41,.28);
  transform: translateY(-3px);
}

.qeb-ben__card--highlight {
  background: #004f80 !important;
  border-color: #0069a8 !important;
}
.qeb-ben__card--highlight .qeb-ben__card-num {
  color: rgba(255,255,255,.25);
  opacity: 1;
}
.qeb-ben__card--highlight .qeb-ben__card-title,
.qeb-ben__card--highlight .qeb-ben__card-text {
  color: #fff;
}

.qeb-ben__card-num {
  display: block;
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  opacity: .75;
  margin-bottom: 12px;
  line-height: 1;
}

.qeb-ben__card-title {
  font-size: .84rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 8px;
  line-height: 1.3;
}

.qeb-ben__card-text {
  font-size: .74rem;
  color: rgba(255,255,255,.82);
  line-height: 1.62;
}

/* Nota interés — card horizontal con imagen */
.qeb-tasa {
  margin-top: 56px;
  display: grid;
  grid-template-columns: 280px 1fr;
  border-radius: 16px;
  overflow: hidden;
  background: rgba(0,0,0,.32);
  border: 1px solid rgba(255,255,255,.1);
  backdrop-filter: blur(6px);
}

.qeb-tasa__img {
  position: relative;
  min-height: 220px;
}

.qeb-tasa__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.qeb-tasa__img-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,.1) 0%, rgba(0,0,0,.45) 100%);
}

.qeb-tasa__content {
  padding: 36px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
}

.qeb-tasa__icon {
  color: var(--brilla-yellow);
  line-height: 1;
}

.qeb-tasa__label {
  display: block;
  font-size: .66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: var(--brilla-yellow);
}

.qeb-tasa__text {
  font-size: .78rem;
  color: rgba(255,255,255,.82);
  line-height: 1.78;
  margin: 0;
}

@media (max-width: 768px) {
  .qeb-tasa { grid-template-columns: 1fr; }
  .qeb-tasa__img { min-height: 160px; }
  .qeb-tasa__content { padding: 28px 24px; }
}

/* === QEB REQUISITOS ======================================== */
.qeb-req {
  background: #fff;
  padding: 108px 0 100px;
}

.qeb-req__header {
  text-align: center;
  max-width: 620px;
  margin: 0 auto 64px;
}

.qeb-req__title {
  font-size: clamp(1.85rem, 3.2vw, 2.6rem);
  font-weight: 800;
  color: var(--gray-900);
  line-height: 1.12;
  margin: 14px 0 16px;
}

.qeb-req__sub {
  font-size: .94rem;
  color: var(--gray-600);
  line-height: 1.7;
  max-width: 540px;
  margin: 0 auto;
}

.qeb-req__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.qeb-req__card {
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: box-shadow var(--transition), transform var(--transition);
}

.qeb-req__card:hover {
  box-shadow: var(--shadow-md);
  transform: translateY(-5px);
}

.qeb-req__card-top {
  position: relative;
  height: 180px;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  padding: 20px 20px;
}

.qeb-req__card-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.qeb-req__card:hover .qeb-req__card-img {
  transform: scale(1.06);
}

.qeb-req__card-overlay {
  position: absolute;
  inset: 0;
}

/* Color overlay por card */
.qeb-req__card:nth-child(1) .qeb-req__card-overlay {
  background: linear-gradient(135deg, rgba(184,0,30,.72) 0%, rgba(234,0,41,.55) 100%);
}
.qeb-req__card:nth-child(2) .qeb-req__card-overlay {
  background: linear-gradient(135deg, rgba(212,184,0,.75) 0%, rgba(252,220,62,.58) 100%);
}
.qeb-req__card:nth-child(3) .qeb-req__card-overlay {
  background: linear-gradient(135deg, rgba(200,58,0,.75) 0%, rgba(255,92,53,.58) 100%);
}
.qeb-req__card:nth-child(4) .qeb-req__card-overlay {
  background: linear-gradient(135deg, rgba(125,0,21,.78) 0%, rgba(184,0,30,.62) 100%);
}

.qeb-req__card-icon {
  position: relative;
  z-index: 2;
  width: 52px;
  height: 52px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  backdrop-filter: blur(4px);
}

.qeb-req__card-body {
  padding: 24px 24px 28px;
}

.qeb-req__card-title {
  font-size: .98rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 10px;
  line-height: 1.3;
}

.qeb-req__card-text {
  font-size: .82rem;
  color: var(--gray-600);
  line-height: 1.68;
}

.qeb-req__cta {
  text-align: center;
  margin-top: 48px;
}

/* === QEB RESPONSIVE — TABLET (768–1023px) ================== */
@media (min-width: 768px) and (max-width: 1023px) {
  .qeb-hero { min-height: 340px; }

  .qeb-def__grid {
    grid-template-columns: 1fr 360px;
    gap: 48px;
  }

  .qeb-ben__grid {
    grid-template-columns: 300px 1fr;
    gap: 48px;
  }

  .qeb-ben__img-wrap { width: 260px; height: 260px; }

  .qeb-ben__cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }

  .qeb-req__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* === QEB RESPONSIVE — MOBILE (<768px) ====================== */
@media (max-width: 767px) {
  .qeb-hero {
    min-height: 280px;
    padding-bottom: 40px;
  }

  .qeb-hero__title { font-size: clamp(1.6rem, 7vw, 2.2rem); }

  /* Definición */
  .qeb-def { padding: 72px 0 64px; }

  .qeb-def__grid {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .qeb-def__step { font-size: 5.5rem; top: -20px; }

  .qeb-def__cupo-card {
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
  }

  .qeb-def__cupo-divider {
    width: 100%;
    height: 1px;
  }

  /* Beneficios */
  .qeb-ben { padding: 72px 0 64px; }

  .qeb-ben__header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 48px;
  }

  .qeb-ben__sub { max-width: 100%; }

  .qeb-ben__grid {
    grid-template-columns: 1fr;
    gap: 48px;
    margin-bottom: 40px;
  }

  .qeb-ben__img-wrap { width: 240px; height: 240px; }

  .qeb-ben__badge { right: auto; left: calc(50% + 80px); bottom: -8px; }

  .qeb-ben__cards {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .qeb-ben__cards .qeb-ben__card:last-child {
    grid-column: 1 / -1;
  }

  /* Requisitos */
  .qeb-req { padding: 72px 0 64px; }

  .qeb-req__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   QUICK-CARDS 4 columnas — modificador para tu-cupo.html
══════════════════════════════════════════════════════════════════════ */
.quick-cards--4col .quick-cards__grid {
  grid-template-columns: repeat(4, 1fr);
}

@media (max-width: 1024px) {
  .quick-cards--4col .quick-cards__grid {
    grid-template-columns: repeat(4, 1fr);
    height: auto;
  }
  .quick-cards--4col .quick-card { height: 160px; }
}

@media (max-width: 768px) {
  .quick-cards--4col .quick-cards__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .quick-cards--4col .quick-card:nth-child(3) {
    border-right: 1px solid rgba(255,255,255,.06);
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   TC-HERO — Hero editorial Tu Cupo (basado en qeb-hero)
   Prefijo: tc- (tu-cupo)
══════════════════════════════════════════════════════════════════════ */

.tc-hero {
  position: relative;
  min-height: 540px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding-bottom: 72px;
  color: #fff;
}

.tc-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.tc-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
}

.tc-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    rgba(5,5,10,.92) 0%,
    rgba(5,5,10,.72) 52%,
    rgba(5,5,10,.2) 100%
  );
}

.tc-hero__overlay--red {
  background: linear-gradient(
    to top,
    rgba(184,44,12,.6) 0%,
    transparent 52%
  );
}

.tc-hero__content {
  position: relative;
  z-index: 2;
  padding-top: calc(var(--nav-h, 80px) + 20px);
}

.tc-hero__breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: .72rem;
  color: rgba(255,255,255,.4);
  margin-bottom: 20px;
}

.tc-hero__breadcrumb a {
  color: rgba(255,255,255,.4);
  text-decoration: none;
  transition: color var(--transition);
}

.tc-hero__breadcrumb a:hover { color: #fff; }

.tc-hero__badge {
  display: inline-flex;
  align-items: center;
  font-size: .66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: var(--brilla-yellow);
  border: 1px solid rgba(252,220,62,.3);
  border-radius: 100px;
  padding: 5px 18px;
  margin-bottom: 22px;
}

.tc-hero__title {
  font-size: clamp(2.8rem, 5.5vw, 4.4rem);
  font-weight: 800;
  line-height: 1.0;
  margin-bottom: 20px;
  max-width: 560px;
}

.tc-hero__accent {
  font-style: normal;
  color: var(--brilla-yellow);
}

.tc-hero__sub {
  font-size: clamp(.9rem, 1.3vw, 1.06rem);
  color: rgba(255,255,255,.7);
  max-width: 480px;
  line-height: 1.72;
  margin-bottom: 36px;
}

.tc-hero__actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 60px;
  flex-wrap: wrap;
}

.tc-hero__stats {
  display: flex;
  align-items: center;
  border-top: 1px solid rgba(255,255,255,.12);
  padding-top: 28px;
  width: fit-content;
  gap: 0;
}

.tc-hero__stat {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 0 28px;
}

.tc-hero__stat:first-child { padding-left: 0; }

.tc-hero__stat-num {
  font-size: 1.65rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1;
}

.tc-hero__stat-label {
  font-size: .59rem;
  color: rgba(255,255,255,.42);
  text-transform: uppercase;
  letter-spacing: 1.3px;
  white-space: nowrap;
}

.tc-hero__stat-div {
  width: 1px;
  height: 40px;
  background: rgba(255,255,255,.13);
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   TC-SEC — Ghost number system (01 / 02 / 03)
══════════════════════════════════════════════════════════════════════ */

.tc-sec {
  position: relative;
  overflow: hidden;
}

.tc-sec__ghost {
  position: absolute;
  font-size: clamp(10rem, 22vw, 19rem);
  font-weight: 800;
  line-height: 1;
  color: rgba(232,33,42,.052);
  user-select: none;
  pointer-events: none;
  top: -10px;
  right: -30px;
  letter-spacing: -0.04em;
  z-index: 0;
}

.tc-sec__ghost--light {
  color: rgba(255,255,255,.065);
}

.tc-sec__ghost--calc {
  color: rgba(232,33,42,.04);
  top: auto;
  bottom: -20px;
  right: -20px;
}

.tc-sec > .container {
  position: relative;
  z-index: 1;
}

/* ═══════════════════════════════════════════════════════════════════════
   TCUPO STEPS v2 — Pasos con línea conectora vertical
══════════════════════════════════════════════════════════════════════ */

.tcupo-steps--v2 {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 32px 0;
  position: relative;
}

.tcupo-steps--v2::before {
  content: '';
  position: absolute;
  left: 15px;
  top: 28px;
  bottom: 28px;
  width: 2px;
  background: linear-gradient(
    to bottom,
    var(--brilla-red) 0%,
    rgba(232,33,42,.12) 100%
  );
  z-index: 0;
}

.tcupo-step--v2 {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding-bottom: 26px;
  position: relative;
}

.tcupo-step--v2:last-child { padding-bottom: 0; }

.tcupo-step__num--v2 {
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--brilla-red);
  color: var(--white);
  font-size: .78rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  box-shadow: 0 0 0 5px rgba(232,33,42,.1), 0 0 0 9px rgba(232,33,42,.04);
}

.tcupo-step--v2 p {
  font-size: .88rem;
  color: var(--gray-600);
  line-height: 1.66;
  padding-top: 5px;
}

.tcupo-step--v2 strong { color: var(--gray-900); }

/* ═══════════════════════════════════════════════════════════════════════
   TC-SIM-HEADER — Header editorial 2 columnas para simulador
══════════════════════════════════════════════════════════════════════ */

.tc-sim-header {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: start;
  margin-bottom: 56px;
}

.tc-sim-header__label {
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2.5px;
  color: rgba(255,255,255,.75);
  margin-bottom: 12px;
}

.tc-sim-header__title {
  font-size: clamp(1.9rem, 3.5vw, 2.9rem);
  font-weight: 800;
  line-height: 1.08;
  color: #fff;
  margin-bottom: 0;
}

.tc-sim-header__title em {
  font-style: normal;
  color: var(--brilla-yellow);
}

.tc-sim-header__sub {
  font-size: .96rem;
  color: rgba(255,255,255,.58);
  line-height: 1.72;
  margin-top: 14px;
}

.tc-sim-header__img {
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
  height: 160px;
  width: 100%;
}
.tc-sim-header__img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to left,
    transparent 40%,
    rgba(184, 44, 12, 0.55) 100%
  );
  border-radius: inherit;
}
.tc-sim-header__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}

.tc-sim-ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 8px;
  justify-content: flex-end;
}

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE — tc-* breakpoints
══════════════════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
  .tc-hero { min-height: 460px; }
}

@media (max-width: 768px) {
  .tc-hero { min-height: 400px; padding-bottom: 52px; }
  .tc-hero__title { font-size: clamp(2rem, 7vw, 2.8rem); }
  .tc-hero__stat { padding: 0 16px; }
  .tc-hero__stat:first-child { padding-left: 0; }
  .tc-hero__stat-num { font-size: 1.3rem; }
  .tc-sec__ghost { font-size: clamp(7rem, 24vw, 12rem); }
  .tc-sim-header { grid-template-columns: 1fr; gap: 20px; margin-bottom: 36px; }
}

@media (max-width: 480px) {
  .tc-hero__stats { display: none; }
  .tc-hero__actions { flex-direction: column; align-items: flex-start; gap: 10px; }
  .tc-hero__actions .btn { width: 100%; justify-content: center; }
}

/* ═══════════════════════════════════════════════════════════════════════
   TCX — Consulta tu Cupo: intro (imagen + pasos) y tarjeta del formulario
══════════════════════════════════════════════════════════════════════ */

.tcx-head { text-align: center; max-width: 720px; margin: 0 auto 44px; }
.tcx-head__title { margin-bottom: 0; }

.tcx-intro {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: stretch;
  margin-bottom: 56px;
}
.tcx-intro__img {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-height: 340px;
  box-shadow: 0 20px 50px rgba(0,0,0,.14);
}
.tcx-intro__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; display: block; }
.tcx-intro__text { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.tcx-intro__sub { margin-bottom: 0; }
.tcx-intro .tcupo-steps--v2 { margin: 28px 0 0; }

.tcx-scroll {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: 32px;
  padding: 10px 22px 10px 10px;
  border-radius: var(--radius-full);
  background: rgba(234,0,41,.07);
  color: var(--brilla-red);
  font-weight: 800;
  font-size: .9rem;
  transition: background var(--transition);
}
.tcx-scroll:hover { background: rgba(234,0,41,.13); }
.tcx-scroll__ico {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--brilla-red);
  color: var(--white);
  display: flex; align-items: center; justify-content: center;
  animation: tcx-rebote 1.6s ease-in-out infinite;
}
@keyframes tcx-rebote { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(5px); } }
@media (prefers-reduced-motion: reduce) { .tcx-scroll__ico { animation: none; } }

.tcx-card {
  scroll-margin-top: calc(var(--nav-h) + 20px);
  display: grid;
  grid-template-columns: 340px 1fr;
  background: var(--white);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 24px 60px rgba(17,24,39,.12);
  border: 1px solid var(--gray-100);
}
.tcx-card__aside {
  position: relative;
  background: linear-gradient(155deg, var(--brilla-red) 0%, var(--brilla-red-dark) 100%);
  color: var(--white);
  padding: 40px 32px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.tcx-card__aside::after {
  content: '';
  position: absolute;
  width: 260px; height: 260px;
  right: -120px; bottom: -120px;
  border-radius: 50%;
  border: 40px solid rgba(252,220,62,.14);
  pointer-events: none;
}
.tcx-card__icon {
  width: 52px; height: 52px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.16);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 20px;
}
.tcx-card__title { font-size: 1.45rem; font-weight: 800; line-height: 1.2; margin: 0 0 10px; color: var(--white); }
.tcx-card__sub { font-size: .88rem; line-height: 1.6; color: rgba(255,255,255,.82); margin: 0 0 24px; }
.tcx-card__list { list-style: none; padding: 0; margin: 0 0 28px; display: flex; flex-direction: column; gap: 10px; }
.tcx-card__list li { display: flex; align-items: center; gap: 10px; font-size: .85rem; font-weight: 600; }
.tcx-card__list svg { flex-shrink: 0; color: var(--brilla-yellow); }
.tcx-card__tel {
  display: flex; gap: 10px; align-items: flex-start;
  background: rgba(0,0,0,.14);
  border-radius: var(--radius-md);
  padding: 14px 16px;
  font-size: .8rem; line-height: 1.55;
  margin-top: auto;
}
.tcx-card__tel svg { flex-shrink: 0; margin-top: 2px; color: var(--brilla-yellow); }
.tcx-card__tel p { margin: 0; color: rgba(255,255,255,.88); }
.tcx-card__tel a { color: var(--brilla-yellow); font-weight: 800; }
.tcx-card__aviso { position: relative; z-index: 1; font-size: .74rem; line-height: 1.55; color: rgba(255,255,255,.7); margin: 16px 0 0; }
.tcx-card__aviso strong { color: var(--white); }
.tcx-card__body { padding: 40px 44px; }
.tcx-card__body .tcf__grid { gap: 0 20px; }

@media (max-width: 1024px) {
  .tcx-intro { gap: 36px; }
  .tcx-card { grid-template-columns: 290px 1fr; }
  .tcx-card__body { padding: 32px 28px; }
}

@media (max-width: 768px) {
  .tcx-intro { grid-template-columns: 1fr; gap: 28px; margin-bottom: 36px; }
  .tcx-intro__img { min-height: 0; aspect-ratio: 16 / 10; }
  .tcx-head { margin-bottom: 28px; }
  .tcx-card { grid-template-columns: 1fr; border-radius: var(--radius-lg); }
  .tcx-card__aside { padding: 28px 24px; }
  .tcx-card__tel { margin-top: 0; }
  .tcx-card__body { padding: 28px 20px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   TC AMBIENT IMAGES — Imágenes de ambientación por sección
══════════════════════════════════════════════════════════════════════ */

/* --- 01 Consulta: tarjeta imagen al pie de la columna info --- */
.tc-ambient-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-top: 28px;
  height: 186px;
}

.tc-ambient-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  transition: transform .6s ease;
}

.tc-ambient-card:hover img { transform: scale(1.04); }

.tc-ambient-card__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    rgba(10,10,10,.88) 0%,
    rgba(10,10,10,.42) 55%,
    rgba(184,44,12,.3) 100%
  );
}

.tc-ambient-card__content {
  position: absolute;
  left: 22px;
  bottom: 20px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.tc-ambient-card__num {
  font-size: 1.7rem;
  font-weight: 800;
  color: var(--brilla-yellow);
  line-height: 1;
}

.tc-ambient-card__label {
  font-size: .63rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1.8px;
  color: rgba(255,255,255,.62);
}

/* --- 02 Simulador: imagen atmosférica lateral derecha --- */
.tc-sim-ambience {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 42%;
  z-index: 0;
  pointer-events: none;
}

.tc-sim-ambience img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  opacity: 0.14;
  mix-blend-mode: luminosity;
}

.tc-sim-ambience::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to right,
    #0e1118 0%,
    transparent 35%
  );
}

.tc-sim-ambience::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to left,
    #0e1118 0%,
    transparent 25%
  );
}

/* --- 03 Calculadora: imagen en columna info --- */
.tc-calc-img-wrap {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-top: 28px;
  height: 210px;
}

.tc-calc-img-wrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  transition: transform .6s ease;
}

.tc-calc-img-wrap:hover img { transform: scale(1.04); }

.tc-calc-img-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(184,44,12,.6) 0%,
    rgba(10,10,10,.45) 100%
  );
}

.tc-calc-img__tag {
  position: absolute;
  bottom: 18px;
  left: 18px;
  font-size: .66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fff;
  z-index: 1;
  background: rgba(232,33,42,.9);
  border-radius: 100px;
  padding: 5px 14px;
}

/* Responsive ambient images */
@media (max-width: 1024px) {
  .tc-sim-ambience { width: 36%; opacity: 0.85; }
}

@media (max-width: 768px) {
  .tc-sim-ambience { display: none; }
  .tc-ambient-card { height: 160px; }
  .tc-calc-img-wrap { height: 170px; }
}

/* ============================================================
   MI MUNDO BRILLA — BLOG + ARTÍCULO
   ============================================================ */

/* ── Layout blog (index + artículo) ── */
.blog-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 40px;
  align-items: start;
}

.blog-layout--article {
  grid-template-columns: 2fr 320px;
}

/* ── Sidebar widgets ── */
.sidebar-widget {
  border-radius: 16px;
  padding: 24px 28px;
  margin-bottom: 24px;
}

.sidebar-widget:last-child { margin-bottom: 0; }

.sidebar-widget--red {
  background: var(--brilla-red);
  text-align: center;
}

.sidebar-widget--gray { background: var(--gray-50); }

.sidebar-widget--dark { background: var(--gray-900); }

.sidebar-widget--white {
  background: var(--white);
  border: 1px solid var(--gray-200);
}

.sidebar-widget__title {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--gray-900);
}

.sidebar-widget--red .sidebar-widget__title { color: #fff; font-size: 1.1rem; }
.sidebar-widget--dark .sidebar-widget__title { color: #fff; }

.sidebar-widget__desc {
  font-size: .85rem;
  color: var(--gray-600);
  margin-bottom: 16px;
  line-height: 1.5;
}

.sidebar-widget--red .sidebar-widget__desc { color: rgba(255,255,255,.8); }
.sidebar-widget--dark .sidebar-widget__desc { color: rgba(255,255,255,.5); font-size: .8rem; }

.sidebar-widget__cta {
  width: 100%;
  justify-content: center;
}

/* Sidebar categories list */
.sidebar-cats {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sidebar-cats a {
  font-size: .875rem;
  color: var(--gray-600);
  text-decoration: none;
  font-weight: 500;
  transition: color .15s;
}

.sidebar-cats a:hover { color: var(--brilla-red); }
.sidebar-cats a.is-active { color: var(--brilla-red); font-weight: 700; }

/* Sidebar credit lines list */
.sidebar-lines {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 20px;
}

.sidebar-lines li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .85rem;
  color: var(--gray-700);
  font-weight: 600;
}

.sidebar-lines__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--brilla-red);
  flex-shrink: 0;
}

.sidebar-lines__dot--yellow { background: var(--brilla-yellow); }

/* ── Article styles ── */
.breadcrumb-art {
  font-size: .8rem;
  color: var(--gray-400);
  font-weight: 600;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.breadcrumb-art a { color: var(--brilla-red); }
.breadcrumb-art a:hover { text-decoration: underline; }
.breadcrumb-art span[aria-hidden] { color: var(--gray-300); }

.article-meta {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.article-meta__tag {
  background: var(--brilla-red);
  color: var(--white);
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 4px 12px;
  border-radius: var(--radius-full);
}

.article-meta__date,
.article-meta__time {
  font-size: .8rem;
  color: var(--gray-400);
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 5px;
}

.article-h1 {
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  font-weight: 700;
  color: var(--gray-900);
  line-height: 1.2;
  margin-bottom: 24px;
}

/* Article hero image placeholder */
.article-hero-img {
  width: 100%;
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 32px;
  position: relative;
}

.article-hero-img img {
  display: block;
  width: 100%;
  height: auto;
}

/* Article body typography */
.article-body h2 {
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  font-weight: 700;
  color: var(--gray-900);
  margin: 40px 0 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--gray-100);
}

.article-body h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--gray-800);
  margin: 24px 0 10px;
}

.article-body p {
  font-size: .95rem;
  line-height: 1.8;
  color: var(--gray-600);
  margin-bottom: 16px;
}

.article-body ul {
  margin: 0 0 20px 0;
  padding: 0;
  list-style: none;
}

.article-body ul li {
  font-size: .95rem;
  color: var(--gray-600);
  line-height: 1.7;
  padding: 6px 0 6px 24px;
  position: relative;
  border-bottom: 1px solid var(--gray-100);
}

.article-body ul li:last-child { border-bottom: none; }

.article-body ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background: var(--brilla-red);
  border-radius: 50%;
}

/* Article CTA inline */
.article-cta-inline {
  background: linear-gradient(135deg, #B8001E, #EA0029);
  border-radius: 12px;
  padding: 28px;
  margin: 32px 0;
  text-align: center;
}

.article-cta-inline p {
  color: rgba(255,255,255,.85);
  margin-bottom: 16px;
  font-weight: 600;
}

/* Tip box */
.article-tip-box {
  background: var(--gray-50);
  border-left: 4px solid var(--brilla-yellow);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  padding: 20px 24px;
  margin: 24px 0;
}

.article-tip-box p {
  margin-bottom: 0;
  font-weight: 600;
  color: var(--gray-700);
}

/* FAQ items */
.faq-item {
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-sm);
  margin-bottom: 12px;
  overflow: hidden;
}

.faq-item h3 {
  background: var(--gray-50);
  padding: 16px 20px;
  font-size: .95rem;
  font-weight: 700;
  color: var(--gray-800);
  margin: 0;
  border-bottom: 1px solid var(--gray-200);
}

.faq-item p {
  padding: 16px 20px;
  margin: 0;
  font-size: .9rem;
  color: var(--gray-600);
  line-height: 1.7;
}

/* Related section */
.related-section {
  margin-top: 48px;
  padding-top: 40px;
  border-top: 2px solid var(--gray-100);
}

.related-section h2 {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--gray-900);
  margin-bottom: 24px;
}

/* ── Blog responsive ── */
@media (max-width: 900px) {
  .blog-layout,
  .blog-layout--article {
    grid-template-columns: 1fr;
  }

  .blog-sidebar { order: -1; }
}

/* ============================================================
   COMPONENTES — OFERTAS / SEGUROS / CONTACTO
   ============================================================ */

/* ── Section intro (centrado sin inline) ── */
.section-intro {
  text-align: center;
  margin-bottom: 48px;
}
.section-intro .section-subtitle {
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

/* ── Oferta card CTA ── */
.oferta-card__cta {
  width: 100%;
  justify-content: center;
  margin-top: 12px;
}

/* ── CTA Section — variante roja (ofertas-aliados) ── */
.cta-section--red {
  background: linear-gradient(135deg, #7A0012 0%, #B8001E 40%, var(--brilla-red) 100%);
  position: relative;
  overflow: hidden;
}
.cta-section--red::before {
  content: '';
  position: absolute;
  top: -120px; right: -120px;
  width: 480px; height: 480px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  pointer-events: none;
}
.cta-section--red::after {
  content: '';
  position: absolute;
  bottom: -80px; left: -60px;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: rgba(255,255,255,.03);
  pointer-events: none;
}
.cta-section--red .cta-section__title {
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 800;
}
.cta-section--red .cta-section__subtitle {
  color: rgba(255,255,255,.82);
  font-size: 1rem;
  line-height: 1.7;
  max-width: 560px;
}
.cta-section--red .accent--yellow { color: var(--brilla-yellow); font-style: normal; }
.cta-section--red .cta-section__content { position: relative; z-index: 1; }
.cta-section--red .cta-section__btns { margin-top: 8px; }
.cta-section--red .cta-section__note {
  margin-top: 28px;
  color: rgba(255,255,255,.55);
  font-size: .78rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}
.cta-section--red .cta-section__note span {
  display: flex; align-items: center; gap: 6px;
}
.cta-section--red .cta-section__note span::before {
  content: '✓';
  color: var(--brilla-yellow);
  font-weight: 700;
}

/* ── Nota de vigencia ofertas ── */
.oferta-nota {
  text-align: center;
  margin-top: 32px;
  color: var(--gray-500);
  font-size: .875rem;
}

/* ── Filter button fix (is-active) ── */
.filter-btn.is-active {
  background: var(--brilla-red);
  color: var(--white);
}

/* ── QEB Hero — variante azul (Seguros) ── */
.qeb-hero__overlay--teal {
  background: linear-gradient(
    135deg,
    rgba(0,95,138,.75) 0%,
    rgba(0,160,223,.45) 50%,
    rgba(59,212,174,.3) 100%
  );
}

.qeb-hero__accent--teal {
  font-style: normal;
  color: #47D7AC;
}

/* ── Benefit items — Seguros ── */
.seg-benefit {
  text-align: center;
  padding: 32px 24px;
}

.seg-benefit__icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--brilla-teal-dark);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
}

.seg-benefit__icon svg {
  width: 30px;
  height: 30px;
  color: #fff;
  stroke: #fff;
}

.seg-benefit__title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--gray-900);
}

.seg-benefit__desc {
  color: var(--gray-600);
  font-size: .9rem;
  line-height: 1.6;
}

/* ── Listas de hipervínculos (Microseguros / Otros seguros) ── */
.seg-links {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 100%;
}

.seg-links__item { margin: 0; }

.seg-links__link {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 22px;
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius-md, 12px);
  text-decoration: none;
  transition: var(--transition);
}

.seg-links__link:hover {
  border-color: var(--brilla-teal-dark);
  box-shadow: var(--shadow-md);
  transform: translateY(-2px);
}

.seg-links__title {
  font-weight: 700;
  color: var(--gray-900);
  flex: 1;
}

.seg-links__price {
  font-size: .85rem;
  font-weight: 700;
  color: var(--brilla-teal-dark);
  white-space: nowrap;
}

.seg-links__arrow {
  width: 18px;
  height: 18px;
  color: var(--brilla-teal-dark);
  flex-shrink: 0;
}

/* ── CTA Seguros (teal) ── */
.seg-cta {
  background: linear-gradient(135deg, #005F8A, #00A0DF, #3BD4AE);
  padding: 80px 0;
  text-align: center;
}

.seg-cta__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.seg-cta__label {
  color: rgba(255,255,255,.7);
  margin-bottom: 8px;
}

.seg-cta__title {
  color: #fff;
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
  margin-bottom: 16px;
}

.seg-cta__sub {
  color: rgba(255,255,255,.85);
  max-width: 520px;
  margin: 0 auto 40px;
  line-height: 1.7;
}

/* ── Contacto — grid principal ── */
.contact-grid {
  gap: 64px;
  align-items: start;
}

/* ── Emergencias ── */
.contact-emergency {
  background: var(--brilla-red);
  border-radius: 16px;
  padding: 28px 32px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.contact-emergency__icon {
  width: 56px;
  height: 56px;
  background: rgba(255,255,255,.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* ── Info cards (teléfonos, dirección, email, horario) ── */
.contact-info-card {
  background: var(--gray-50);
  border: 1px solid var(--gray-200);
  border-radius: 16px;
  padding: 24px 28px;
  margin-bottom: 16px;
  display: flex;
  align-items: flex-start;
  gap: 16px;
}

.contact-info-card:last-child { margin-bottom: 0; }

.contact-info-card__icon {
  width: 44px;
  height: 44px;
  background: var(--gray-100);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}

/* ── Canal cards ── */
.canal-card {
  background: #fff;
  border-radius: 20px;
  padding: 40px 32px;
  text-align: center;
  box-shadow: 0 2px 20px rgba(0,0,0,.06);
  transition: box-shadow .22s ease, transform .22s ease;
  overflow: hidden;
}
.canal-card:hover {
  box-shadow: 0 8px 32px rgba(0,0,0,.1);
  transform: translateY(-4px);
}
.canal-card__img {
  aspect-ratio: 16/9;
  overflow: hidden;
  margin: -40px -32px 28px;
  position: relative;
}
.canal-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.canal-card:hover .canal-card__img img { transform: scale(1.05); }
.canal-card__icon {
  width: 60px; height: 60px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 20px;
}
.canal-card__icon--wa     { background: #25D366; }
.canal-card__icon--red    { background: var(--brilla-red); }
.canal-card__icon--yellow { background: var(--brilla-yellow); }
.canal-card__title { font-size: 1.2rem; font-weight: 700; color: var(--gray-900); margin-bottom: 12px; }
.canal-card__desc  { color: var(--gray-600); line-height: 1.6; margin-bottom: 24px; font-size: .9rem; }

/* ── Contact — imagen en columna de datos ── */
.contact-col-img {
  aspect-ratio: 16/9;
  border-radius: var(--radius-md);
  overflow: hidden;
  margin-bottom: 24px;
}
.contact-col-img img { width: 100%; height: 100%; object-fit: cover; }

/* ── Contact — helpers de texto ── */
.contact-col__title { font-size: 1.75rem; margin-bottom: 8px; }
.contact-col__intro { color: var(--gray-600); margin-bottom: 32px; line-height: 1.6; }
.contact-submit     { width: 100%; justify-content: center; }
.contact-form__footnote { text-align: center; margin-top: 20px; color: var(--gray-500); font-size: .875rem; }
.contact-form__footnote a { color: var(--brilla-red); font-weight: 600; text-decoration: none; }

/* ══════════════════════════════════════════════════════════
   CONTACTENOS — PREMIUM REDESIGN
   ══════════════════════════════════════════════════════════ */

/* ── Contact info — container-based ── */
.contact-info-split {
  padding: 88px 0;
  background: #fff;
}
.contact-info-split__inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: stretch;
}
.contact-info-split__img {
  border-radius: var(--radius-lg);
  overflow: hidden;
  position: relative;
  min-height: 420px;
}
.contact-info-split__img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.contact-info-split__body {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Chip 164 */
.contact-164-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: var(--brilla-red);
  color: #fff;
  padding: 8px 20px 8px 14px;
  border-radius: var(--radius-full);
  font-size: 1.6rem;
  font-weight: 800;
  margin-bottom: 6px;
  align-self: flex-start;
  line-height: 1;
  box-shadow: var(--shadow-red);
}
.contact-164-chip__dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  background: rgba(255,255,255,.7);
  animation: pulse-dot 1.8s ease-in-out infinite;
  flex-shrink: 0;
}
@keyframes pulse-dot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: .4; transform: scale(.65); }
}
.contact-164-label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gray-400);
  margin-bottom: 32px;
}

/* Tarjeta 164 — estilo quick-card */
.contact-emergency-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 24px 20px 44px;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  background: linear-gradient(145deg, #C8001A, #EA0029);
  border-radius: var(--radius-md);
  margin-bottom: 16px;
  transition: transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s;
  will-change: transform;
}
.contact-emergency-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(0,0,0,.35);
}
/* Número fantasma */
.contact-emergency-card__ghost {
  position: absolute;
  top: 10px; left: 12px;
  font-size: 88px;
  font-weight: 800;
  color: rgba(255,255,255,.07);
  line-height: 1;
  letter-spacing: -3px;
  pointer-events: none;
  user-select: none;
}
/* Anillos concéntricos */
.contact-emergency-card__rings {
  position: absolute;
  top: 50%; right: -20px;
  width: 180px; height: 180px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.12);
  transform: translateY(-50%);
  pointer-events: none;
}
.contact-emergency-card__rings::before {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 230px; height: 230px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.09);
}
.contact-emergency-card__rings::after {
  content: '';
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  width: 285px; height: 285px;
  border-radius: 50%;
  border: 1.5px solid rgba(255,255,255,.06);
}
/* Imagen circular */
.contact-emergency-card__circle {
  position: absolute;
  top: 50%; right: 16px;
  transform: translateY(-50%);
  width: 108px; height: 108px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid rgba(255,255,255,.3);
  box-shadow: 0 8px 28px rgba(0,0,0,.25);
  transition: transform .3s ease;
}
.contact-emergency-card__circle img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: top center;
}
.contact-emergency-card:hover .contact-emergency-card__circle {
  transform: translateY(-50%) scale(1.05);
}
/* Cuerpo de texto */
.contact-emergency-card__body {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.contact-emergency-card__dot {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: .63rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.8);
  margin-bottom: 8px;
}
.contact-emergency-card__dot::before {
  content: '';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--brilla-yellow);
  animation: pulse-dot 1.8s ease-in-out infinite;
  flex-shrink: 0;
}
.contact-emergency-card__label {
  font-size: .85rem;
  font-weight: 800;
  color: #fff;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.contact-emergency-card__sub {
  font-size: .67rem;
  font-weight: 500;
  color: rgba(255,255,255,.65);
  line-height: 1.3;
}
/* CTA pill inferior */
.contact-emergency-card__cta {
  position: absolute;
  bottom: 14px; left: 20px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .8px;
  color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 20px;
  padding: 5px 12px;
}
/* Línea inferior hover */
.contact-emergency-card::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: rgba(255,255,255,.5);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .4s cubic-bezier(.22,.61,.36,1);
}
.contact-emergency-card:hover::after { transform: scaleX(1); }

/* Mini cards de contacto */
.contact-mini-cards {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.contact-mini-card {
  background: #fff;
  border-radius: var(--radius-md);
  padding: 18px 18px 16px;
  border: 1px solid var(--gray-100);
  border-top: 3px solid var(--brilla-red);
  box-shadow: 0 2px 10px rgba(0,0,0,.05);
  transition: box-shadow .2s, transform .2s;
}
.contact-mini-card:hover {
  box-shadow: 0 6px 20px rgba(0,0,0,.09);
  transform: translateY(-2px);
}
.contact-mini-card__icon {
  width: 32px; height: 32px;
  background: #FFF0F1;
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 10px;
}
.contact-mini-card__label {
  font-size: .6rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gray-400);
  margin-bottom: 5px;
}
.contact-mini-card__value {
  font-size: .84rem;
  font-weight: 600;
  color: var(--gray-800);
  line-height: 1.6;
}
.contact-mini-card__value a {
  color: var(--gray-800);
  text-decoration: none;
  transition: color .2s;
}
.contact-mini-card__value a:hover { color: var(--brilla-red); }

/* Responsive */
@media (max-width: 860px) {
  .contact-info-split__inner { grid-template-columns: 1fr; }
  .contact-info-split__img { display: none; }
}
@media (max-width: 480px) {
  .contact-mini-cards { grid-template-columns: 1fr; }
}

/* Bloque del formulario — split imagen + form */
.contact-form-section {
  background: var(--gray-100);
  padding: 100px 0;
}
.contact-form-card {
  background: #fff;
  border-radius: var(--radius-lg);
  box-shadow: 0 20px 60px rgba(0,0,0,.1), 0 4px 16px rgba(0,0,0,.05);
  border: 1px solid var(--gray-100);
  max-width: 1040px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 2fr 3fr;
  overflow: hidden;
}
.contact-form-card__img {
  position: relative;
  min-height: 540px;
}
.contact-form-card__img::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--brilla-red);
  z-index: 3;
}
.contact-form-card__img img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.contact-form-card__img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.08) 0%, rgba(0,0,0,.62) 100%);
  z-index: 1;
}
/* Glass trust badges over image */
.contact-form-badges {
  position: absolute;
  bottom: 28px;
  left: 20px;
  right: 20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.contact-form-badge {
  background: rgba(255,255,255,.11);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 10px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
}
.contact-form-badge__icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--brilla-red);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.contact-form-badge__text strong {
  display: block;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.2;
}
.contact-form-badge__text span {
  font-size: .71rem;
  opacity: .75;
}
.contact-form-card__body {
  padding: 56px 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
/* Botones de acción del formulario */
.contact-form-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 4px;
}
.contact-form-actions .btn {
  flex: 1;
  justify-content: center;
  min-width: 140px;
}

@media (max-width: 860px) {
  .contact-form-card { grid-template-columns: 1fr; }
  .contact-form-card__img { min-height: 240px; }
  .contact-form-card__body { padding: 40px 32px; }
  .contact-form-card__img::before { width: 100%; height: 4px; top: 0; bottom: auto; left: 0; right: 0; }
}

/* Responsive contactenos */
@media (max-width: 900px) {
  .contact-dark__inner {
    grid-template-columns: 1fr;
    gap: 48px;
  }
  .contact-dark__ghost { display: none; }
  .contact-form-card { padding: 40px 28px; }
}
@media (max-width: 600px) {
  .contact-pills { grid-template-columns: 1fr; }
  .contact-164-num { font-size: clamp(72px, 20vw, 120px); }
}

/* ── WhatsApp button ── */
.btn--wa {
  background: #25D366;
  color: #fff;
  border-color: #25D366;
  width: 100%;
  justify-content: center;
}

.btn--wa:hover {
  background: #1da851;
  border-color: #1da851;
  color: #fff;
}

/* ── Responsive ── */
@media (max-width: 767px) {
  .contact-grid { gap: 40px; }
  .seg-cta { padding: 56px 0; }
  .canal-card { padding: 32px 24px; }
  .contact-emergency { flex-direction: column; text-align: center; padding: 24px; }
}

/* === 404 =================================================== */
.e404-hero {
  position: relative;
  overflow: hidden;
  padding: 120px 0 110px;
  background: linear-gradient(135deg, var(--brilla-red) 0%, var(--brilla-red-dark) 100%);
  text-align: center;
}
.e404-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  bottom: -160px;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: var(--brilla-yellow);
  opacity: .12;
  pointer-events: none;
}
.e404-hero__inner { position: relative; z-index: 1; max-width: 720px; }
.e404-hero__label { color: var(--brilla-yellow); }
.e404-hero__num {
  font-size: clamp(96px, 18vw, 180px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -4px;
  color: var(--brilla-yellow);
  margin-bottom: 16px;
}
.e404-hero__title { color: var(--white); font-size: clamp(1.5rem, 3.5vw, 2.25rem); }
.e404-hero__msg { color: rgba(255,255,255,.9); font-size: 1.05rem; margin: 0 auto 36px; max-width: 560px; }
.e404-hero__btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 767px) {
  .e404-hero { padding: 80px 0 72px; }
  .e404-hero__btns .btn { width: 100%; justify-content: center; }
}

.blog-pager { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin-top: 40px; }
.blog-pager__btn {
  min-width: 42px; height: 42px; padding: 0 12px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 999px; background: var(--white); color: var(--gray-800);
  font-weight: 700; text-decoration: none; box-shadow: var(--shadow-sm);
  transition: background .2s ease, color .2s ease;
}
.blog-pager__btn:hover { background: var(--brilla-yellow); color: var(--gray-900); }
.blog-pager__btn.is-active { background: var(--brilla-red); color: var(--white); box-shadow: var(--shadow-red); }

.cta-section--yellow { background: var(--brilla-yellow); }
.cta-section--yellow .cta-section__title { color: var(--gray-900); }
.cta-section--yellow .cta-section__subtitle { color: var(--gray-800); }

.sidebar-lines { gap: 0; }
.sidebar-lines li { padding: 9px 0; border-bottom: 1px solid var(--gray-100); line-height: 1.3; }
.sidebar-lines li:last-child { border-bottom: 0; }
.sidebar-lines__name { flex: 1; min-width: 0; }
.sidebar-lines__tag {
  flex-shrink: 0; white-space: nowrap;
  padding: 3px 10px; border-radius: 999px;
  background: var(--gray-100); color: var(--gray-700);
  font-size: .72rem; font-weight: 700;
}
.sidebar-lines__tag--yellow { background: var(--brilla-yellow); color: var(--gray-900); }
.sidebar-lines__head {
  display: flex; justify-content: space-between;
  margin: 0 0 4px; padding-bottom: 6px; border-bottom: 2px solid var(--gray-100);
  font-size: .68rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-400);
}

.seguro-card__row { display: flex; align-items: flex-start; gap: 20px; }
.seguro-card__text { flex: 1; min-width: 0; }
.seguro-card__cta { margin-top: auto; align-self: center; }
.seguro-card__logo { display: block; flex-shrink: 0; width: 130px; max-height: 90px; height: auto; object-fit: contain; }
@media (max-width: 520px) {
  .seguro-card__row { flex-direction: column-reverse; gap: 12px; }
  .seguro-card__logo { width: 120px; }
}
.seguro-detalle__logo { display: block; max-height: 110px; max-width: 100%; width: auto; height: auto; object-fit: contain; margin: 0 auto 20px; }

.seg-det { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 32px; align-items: start; }
.seg-det__aside { position: sticky; top: 100px; }
.seg-det__card { background: var(--white); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); border-top: 4px solid var(--brilla-teal); padding: 28px 24px; text-align: center; }
.seg-det__nombre { font-size: 1.2rem; line-height: 1.3; color: var(--gray-900); margin: 0 0 10px; }
.seg-det__precio { margin: 0 0 12px; font-size: 1.5rem; font-weight: 800; color: var(--brilla-teal-dark); }
.seg-det__precio span { display: block; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gray-400); }
.seg-det__desc { font-size: .9rem; line-height: 1.6; color: var(--gray-600); margin: 0 0 20px; }
.seg-det__btns { display: flex; flex-direction: column; gap: 10px; }
.seg-det__btns .btn { width: 100%; justify-content: center; }
.seg-det__main { display: flex; flex-direction: column; gap: 20px; }
.seg-det__foto { border-radius: var(--radius-md); overflow: hidden; box-shadow: var(--shadow-sm); }
.seg-det__foto img { display: block; width: 100%; height: auto; }
.seg-det__intro { background: var(--white); border-radius: var(--radius-md); padding: 24px 28px; border-left: 4px solid var(--brilla-teal); font-size: 1.05rem; }
.seg-det__intro p:last-child, .seg-det__block p:last-child, .seg-det__block ul:last-child, .seg-det__block ol:last-child { margin-bottom: 0; }
.seg-det__block { background: var(--white); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: 24px 28px; }
.seg-det__block h3 { margin: 0 0 14px; padding-bottom: 12px; border-bottom: 2px solid var(--gray-100); color: var(--brilla-teal-dark); font-size: 1.1rem; }
@media (max-width: 900px) {
  .seg-det { grid-template-columns: 1fr; }
  .seg-det__aside { position: static; }
}

.noticia-mini {
  background: var(--white);
  border: 0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow var(--transition), transform var(--transition);
}
.noticia-mini:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.noticia-mini__body { padding: 14px 16px 14px 0; }
.noticia-mini__title { font-size: 1rem; -webkit-line-clamp: 3; }
.noticia-mini__img-wrap { border-radius: 0; }
@media (min-width: 1024px) {
  .noticias-grid { grid-template-columns: 1fr 440px; }
  .noticias-stack { gap: 16px; }
  .noticia-mini, .noticia-mini:first-child, .noticia-mini:last-child { flex: 1; align-items: stretch; padding: 0; border-bottom: 0; }
  .noticia-mini__img-wrap { width: 170px; height: auto; min-height: 120px; }
  .noticia-mini__body { display: flex; flex-direction: column; justify-content: center; }
}
@media (min-width: 600px) and (max-width: 1023px) {
  .noticia-mini__img-wrap { height: 170px; }
  .noticia-mini__body { padding: 14px 16px 16px; }
}
@media (max-width: 599px) {
  .noticias-stack { gap: 12px; }
  .noticia-mini, .noticia-mini:last-child { padding: 0; border-bottom: 0; align-items: stretch; }
  .noticia-mini__img-wrap { width: 120px; height: auto; min-height: 96px; }
  .noticia-mini__body { padding: 12px 12px 12px 0; }
  .noticia-mini__title { font-size: .92rem; }
}

.noticia-mini__img-wrap { height: auto; min-height: 0; aspect-ratio: 630/350; align-self: center; background: var(--gray-100); }
.noticia-mini__img-wrap img { object-fit: contain; }
@media (min-width: 1024px) {
  .noticia-mini, .noticia-mini:first-child, .noticia-mini:last-child { align-items: center; }
  .noticia-mini__img-wrap { width: 190px; align-self: center; margin-left: 12px; border-radius: var(--radius-sm); }
  .noticia-mini__body { padding: 14px 16px 14px 0; }
}
@media (min-width: 600px) and (max-width: 1023px) {
  .noticia-mini__img-wrap { width: 100%; height: auto; margin: 0; align-self: stretch; }
}
@media (max-width: 599px) {
  .noticia-mini, .noticia-mini:last-child { align-items: center; }
  .noticia-mini__img-wrap { width: 130px; min-height: 0; margin-left: 10px; border-radius: var(--radius-sm); }
}

.noticia-featured { min-height: 0; justify-content: flex-start; background: var(--gray-900); }
.noticia-featured__bg { position: relative; inset: auto; aspect-ratio: 630/350; flex-shrink: 0; background: var(--gray-800); }
.noticia-featured__bg img { object-fit: contain; }
.noticia-featured__overlay { display: none; }
.noticia-featured__content { flex: 1; display: flex; flex-direction: column; justify-content: center; padding: 24px 28px 28px; }
.noticia-featured__title { margin-top: 10px; }
.noticia-featured__excerpt { color: rgba(255,255,255,.75); }
@media (max-width: 1023px) {
  .noticia-featured { min-height: 0; }
}

/* ===== Banner de cookies ===== */
.geh-cookies { position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 9999; display: flex; justify-content: center; pointer-events: none; font-family: 'Montserrat', sans-serif; }
.geh-cookies[hidden] { display: none; }
.geh-cookies__card { pointer-events: auto; display: flex; gap: 16px; align-items: flex-start; max-width: 960px; width: 100%; background: var(--white, #fff); color: #222; border-radius: 16px; box-shadow: 0 12px 40px rgba(0,0,0,.18); padding: 20px 24px; border-top: 4px solid var(--brilla-red, #EA0029); }
.geh-cookies__icon { font-size: 32px; line-height: 1; flex-shrink: 0; }
.geh-cookies__content { flex: 1; min-width: 0; }
.geh-cookies__titulo { margin: 0 0 6px; font-size: 17px; font-weight: 700; color: var(--brilla-red, #EA0029); }
.geh-cookies__cuerpo { margin: 0 0 6px; font-size: 14px; line-height: 1.5; }
.geh-cookies__legal { margin: 0; font-size: 12px; color: var(--brilla-gray-dark, #6F7271); }
.geh-cookies__legal a { color: var(--brilla-red, #EA0029); text-decoration: underline; font-weight: 600; }
.geh-cookies__opts { display: flex; flex-wrap: wrap; gap: 10px 20px; margin-top: 12px; }
.geh-cookies__opts[hidden] { display: none; }
.geh-cookies__opt { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; cursor: pointer; }
.geh-cookies__opt--disabled { cursor: default; opacity: .75; }
.geh-cookies__chk { position: absolute; opacity: 0; width: 1px; height: 1px; }
.geh-cookies__check { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 2px solid var(--brilla-gray-mid, #A7A8A9); border-radius: 5px; font-size: 13px; font-weight: 700; color: #fff; }
.geh-cookies__check--on { background: var(--brilla-red, #EA0029); border-color: var(--brilla-red, #EA0029); color: #fff; }
.geh-cookies__chk:focus-visible + .geh-cookies__check { outline: 2px solid var(--brilla-blue, #00A0DF); outline-offset: 2px; }
.geh-cookies__actions { display: flex; flex-direction: column; gap: 8px; flex-shrink: 0; min-width: 190px; }
.geh-cookies__btn { border: 2px solid var(--brilla-red, #EA0029); border-radius: 999px; padding: 10px 18px; font: 600 14px 'Montserrat', sans-serif; cursor: pointer; background: transparent; color: var(--brilla-red, #EA0029); transition: background .2s, color .2s; }
.geh-cookies__btn[hidden] { display: none; }
.geh-cookies__btn:hover { background: rgba(234,0,41,.08); }
.geh-cookies__btn--aceptar, .geh-cookies__btn--guardar { background: var(--brilla-red, #EA0029); color: #fff; }
.geh-cookies__btn--aceptar:hover, .geh-cookies__btn--guardar:hover { background: var(--brilla-red-dark, #B8001E); color: #fff; }
.geh-cookies__btn--config { border-color: transparent; text-decoration: underline; }
@media (max-width: 767px) {
  .geh-cookies { left: 8px; right: 8px; bottom: 8px; }
  .geh-cookies__card { flex-direction: column; padding: 16px; max-height: 80vh; overflow-y: auto; }
  .geh-cookies__icon { display: none; }
  .geh-cookies__actions { width: 100%; min-width: 0; }
}