/* ══════════════════════════════════════════
   MAPA REGULATORIO — ESTILOS
   Brandbook Manuel. v2026 — Coherente con el sitio
══════════════════════════════════════════ */

/* ── Variables locales ── */
.page-mapa-vars {
  --mr-teal:    #16A086;
  --mr-teal-hover: #1ABC9C;
  --mr-teal-subtle: rgba(22,160,134,0.08);
  --mr-teal-medium: rgba(22,160,134,0.12);
  --mr-navy:    #0B0F1A;
  --mr-charcoal: #1F2933;
  --mr-grey-600: #374151;
  --mr-grey-400: #6B7280;
  --mr-grey-200: #D1D5DB;
  --mr-grey-100: #F3F4F6;
  --mr-grey-50:  #F9FAFB;
  --mr-white:   #FFFFFF;
  --mr-shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
  --mr-shadow-md: 0 4px 12px rgba(0,0,0,0.08);
}

/* ── Contador (below photo banner) ── */
.mr-contador-section { background: var(--mr-grey-50, #F9FAFB); }
.mr-contador {
  padding: 20px 24px;
  background: #fff;
  border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 12px;
  box-shadow: var(--mr-shadow-sm);
}
.mr-contador-inner {
  display: flex; align-items: center; gap: 16px;
}
.mr-contador-icon {
  flex-shrink: 0; width: 44px; height: 44px;
  border-radius: 10px; background: rgba(230,126,34,0.08);
  display: flex; align-items: center; justify-content: center;
  color: #E67E22;
}
.mr-contador-text { flex: 1; }
.mr-contador-label {
  font-family: 'DM Sans', sans-serif; font-size: 13px;
  color: var(--mr-grey-400, #6B7280); display: block; margin-bottom: 4px;
}
.mr-contador-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.mr-contador-numero {
  font-family: 'DM Serif Display', serif; font-size: 28px; font-weight: 400;
  color: #E67E22; line-height: 1;
}
.mr-contador-numero.urgente { color: #C0392B; }
.mr-contador-fecha {
  font-family: 'DM Sans', sans-serif; font-size: 13px;
  color: var(--mr-grey-400, #6B7280);
}

/* ── Barra de progreso del período transitorio ── */
.mr-progreso-wrap {
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid rgba(0,0,0,0.05);
}
.mr-progreso-bar {
  height: 8px; background: var(--mr-grey-100, #F3F4F6);
  border-radius: 8px; overflow: hidden; position: relative;
  border: 1px solid rgba(0,0,0,0.04);
}
.mr-progreso-fill {
  height: 100%; width: 0%; border-radius: 8px;
  background: linear-gradient(90deg, #16A086, #E67E22);
  transition: width 1.2s cubic-bezier(0.22,1,0.36,1);
  position: relative;
}
.mr-progreso-fill::after {
  content: ''; position: absolute; right: 0; top: 50%;
  transform: translateY(-50%);
  width: 12px; height: 12px; border-radius: 50%;
  background: #E67E22; border: 2px solid #fff;
  box-shadow: 0 0 0 3px rgba(230,126,34,0.2);
}
.mr-progreso-labels {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 8px;
}
.mr-progreso-label {
  font-family: 'DM Sans', sans-serif; font-size: 11px;
  color: var(--mr-grey-400, #6B7280); font-weight: 500;
}
.mr-progreso-pct {
  font-family: 'DM Sans', sans-serif; font-size: 12px;
  font-weight: 700; color: #E67E22;
}

/* ── Badge de actualización ── */
.mr-actualizacion {
  display: flex; align-items: flex-start; gap: 10px;
  max-width: 700px; margin: 0 auto 8px; padding: 12px 20px;
  background: var(--mr-teal-bg, rgba(22,160,134,0.06));
  border: 1px solid var(--mr-teal-border, rgba(22,160,134,0.15));
  border-radius: 10px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; line-height: 1.6;
  color: var(--ink-soft, #5A6577);
}
.mr-actualizacion svg {
  flex-shrink: 0; margin-top: 2px;
  stroke: var(--mr-teal, #16A086);
}
.mr-actualizacion strong {
  color: var(--mr-teal, #16A086); font-weight: 600;
}
[data-theme="dark"] .mr-actualizacion {
  background: rgba(22,160,134,0.08);
  border-color: rgba(22,160,134,0.2);
  color: rgba(255,255,255,0.65);
}

/* ── Tabs ── */
.mapa-tabs {
  display: flex; gap: 6px; padding: 14px 24px;
  justify-content: center;
  border-bottom: 1px solid var(--mr-grey-200, #D1D5DB);
  background: #fff;
  position: sticky; top: 60px; z-index: 100;
  overflow-x: auto; scrollbar-width: none;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.mapa-tabs::-webkit-scrollbar { display: none; }
.mapa-tab {
  padding: 11px 22px; border-radius: 10px;
  border: 1px solid var(--mr-grey-200, #D1D5DB); background: transparent;
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 600;
  color: var(--ink-soft, #4A5568); cursor: pointer; white-space: nowrap;
  display: inline-flex; align-items: center; gap: 8px;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.mapa-tab svg { width: 16px; height: 16px; flex-shrink: 0; }
.mapa-tab:hover {
  background: var(--navy-50, #F3F7FB); color: var(--navy-700, #1E3A5F);
  border-color: var(--navy-300, #7C9BBF);
}
.mapa-tab.active {
  background: var(--navy-800, #0B1222); color: #fff;
  border-color: var(--navy-800, #0B1222);
  box-shadow: 0 4px 12px rgba(11,18,34,0.25);
}
.mapa-tab:focus-visible {
  outline: 2px solid var(--mr-teal, #16A086); outline-offset: 2px;
}

/* ── Vistas ── */
.mapa-vista { }
.mapa-vista[hidden] { display: none; }
.mapa-vista .section { padding: 48px 32px; }

/* ══════════════════════════════════════════
   VISTA 1 — MAPA SVG DE NORMATIVAS
══════════════════════════════════════════ */
.mapa-svg-wrap {
  width: 100%; max-width: 900px; margin: 0 auto;
  background: linear-gradient(135deg, #F8FAFB 0%, #F0F4F8 100%);
  border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 14px; overflow: hidden; position: relative;
  box-shadow: var(--mr-shadow-sm);
  transition: box-shadow 0.4s ease;
}
.mapa-svg-wrap:hover { box-shadow: 0 8px 32px rgba(0,0,0,0.08); }
.mapa-svg { width: 100%; height: auto; min-height: 380px; display: block; }

/* SVG hint overlay — below the map, not overlapping content */
.mapa-svg-hint-overlay {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 20px; background: rgba(11,18,34,0.85);
  color: #fff; border-radius: 24px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  pointer-events: none; z-index: 5;
  animation: mrHintFadeIn 0.6s ease 0.8s both;
  margin: 16px auto 0; width: fit-content;
}
.mapa-svg-hint-pulse {
  width: 10px; height: 10px; border-radius: 50%;
  background: var(--mr-teal, #16A086);
  animation: mrPulse 2s ease-in-out infinite;
}
@keyframes mrHintFadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes mrPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(22,160,134,0.5); }
  50% { box-shadow: 0 0 0 8px rgba(22,160,134,0); }
}

/* SVG Nodes */
.mapa-nodo { cursor: pointer; }
.mapa-nodo circle {
  transition: filter 0.3s ease, opacity 0.3s ease, stroke-width 0.3s ease;
}
.mapa-nodo:hover circle {
  filter: brightness(1.1) drop-shadow(0 0 16px rgba(22,160,134,0.5));
  stroke-width: 3.5;
}
.mapa-nodo:hover { transform: scale(1.06); transform-origin: center; }
.mapa-nodo { transition: transform 0.3s cubic-bezier(0.22,1,0.36,1); }
.mapa-nodo-subtipo {
  font-family: 'DM Sans', sans-serif; font-weight: 500;
  pointer-events: none; paint-order: stroke;
  stroke: #fff; stroke-width: 3px; stroke-linejoin: round;
}
.mapa-nodo.atenuado { opacity: 0.25; }
.mapa-nodo.atenuado:hover { opacity: 0.6; }
.mapa-nodo text {
  font-family: 'DM Sans', sans-serif; font-weight: 700;
  pointer-events: none; paint-order: stroke;
  stroke: #fff; stroke-width: 4px; stroke-linejoin: round;
}
/* Connection lines */
.mapa-linea {
  stroke-dasharray: 6 5; stroke-width: 1.5; fill: none;
  opacity: 0.25; cursor: pointer;
  transition: opacity 0.3s ease, stroke-width 0.3s ease;
}
.mapa-linea:hover { opacity: 0.8; stroke-width: 2.5; }
.mapa-linea.activa { opacity: 0.7; stroke-width: 2; }
.mapa-linea.atenuada { opacity: 0.04; }
/* Hit area invisible para facilitar hover en líneas */
.mapa-linea-hit { fill: none; pointer-events: stroke; }

/* ── Indicadores de relación en conexiones ── */
.mapa-conexion-indicador {
  transition: opacity 0.3s ease;
  opacity: 0.5;
}
.mapa-conexion-indicador:hover {
  opacity: 1;
}
.mapa-conexion-indicador.atenuado { opacity: 0.06; pointer-events: none; }
.mapa-conexion-indicador.activo { opacity: 0.85; }
.mapa-indicador-bg {
  transition: fill 0.3s ease, opacity 0.3s ease;
}
.mapa-conexion-indicador:hover .mapa-indicador-bg {
  opacity: 1;
}

/* Tooltip */
.mapa-tooltip {
  position: fixed; background: var(--mr-charcoal, #1F2933);
  color: #fff; padding: 12px 16px; border-radius: 10px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; line-height: 1.6;
  max-width: 320px; pointer-events: none; z-index: 600;
  opacity: 0; transition: opacity 0.15s ease;
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
}
.mapa-tooltip.visible { opacity: 1; }

/* Info Panel */
.mapa-panel {
  margin-top: 24px; padding: 32px;
  border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 14px; background: #fff;
  position: relative; box-shadow: var(--mr-shadow-md);
  animation: mrPanelEntrada 0.4s cubic-bezier(0.22,1,0.36,1);
  max-width: 900px; margin-left: auto; margin-right: auto;
}
.mapa-panel[hidden] { display: none; }
@keyframes mrPanelEntrada {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.mapa-panel-cerrar {
  position: absolute; top: 16px; right: 16px;
  width: 36px; height: 36px; border: 1px solid var(--mr-grey-200, #D1D5DB);
  background: #fff; font-size: 18px; cursor: pointer;
  color: var(--mr-grey-400, #6B7280); border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.3s ease;
}
.mapa-panel-cerrar:hover { background: var(--mr-grey-100, #F3F4F6); border-color: var(--mr-grey-400); }
.mapa-panel-tipo {
  display: inline-block; font-family: 'DM Sans', sans-serif;
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; margin-bottom: 8px;
  padding: 4px 12px; border-radius: 20px;
  background: rgba(22,160,134,0.08); opacity: 0.9;
}
.mapa-panel h3 {
  font-family: 'DM Serif Display', serif; font-size: 22px; margin-bottom: 10px;
  color: var(--mr-teal, #16A086);
}
.mapa-panel p {
  font-family: 'DM Sans', sans-serif; font-size: 15px;
  line-height: 1.75; color: var(--ink-soft, #5A6577); margin-bottom: 12px;
}
.mapa-panel-badge {
  display: inline-block; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  padding: 3px 10px; border-radius: 20px; margin-bottom: 12px;
}
.mapa-panel h4 {
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--navy-400, #4A7AB8); margin: 16px 0 10px;
}
.mapa-panel ul { padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.mapa-panel li {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.6;
  color: var(--ink-soft, #5A6577); padding-left: 16px; position: relative;
}
.mapa-panel li::before {
  content: ''; position: absolute; left: 0; top: 7px;
  width: 6px; height: 6px; border-radius: 50%; background: var(--mr-teal, #16A086);
}
.mapa-panel .btn-panel-accion {
  margin-top: 16px; padding: 10px 20px;
  background: var(--navy-800, #0B1222); color: #fff;
  border: none; border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.mapa-panel .btn-panel-accion:hover { background: var(--navy-700, #162C4A); transform: translateY(-1px); }
/* Enlace a fuente oficial */
.btn-fuente-oficial {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 12px; margin-left: 8px; padding: 10px 18px;
  background: transparent; color: var(--navy-600, #2D4A73);
  border: 1px solid var(--navy-200, #C6D4E5); border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 600;
  text-decoration: none; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.btn-fuente-oficial:hover {
  background: var(--navy-50, #F3F7FB); border-color: var(--navy-400, #4A7AB8);
  transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.btn-fuente-oficial svg { flex-shrink: 0; }
[data-theme="dark"] .btn-fuente-oficial {
  color: rgba(255,255,255,0.7); border-color: rgba(255,255,255,0.12);
}
[data-theme="dark"] .btn-fuente-oficial:hover {
  background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.2);
}

/* ══════════════════════════════════════════
   VISTA 2 — CATEGORÍAS DE RIESGO
══════════════════════════════════════════ */
.riesgo-lista {
  display: flex; flex-direction: column; gap: 12px;
  max-width: 800px; margin: 0 auto 32px;
}
.riesgo-item {
  padding: 24px; border-radius: 14px;
  border: 1px solid var(--mr-grey-200, #D1D5DB);
  background: #fff; cursor: pointer;
  transition: all 0.4s cubic-bezier(0.22,1,0.36,1);
  position: relative; overflow: hidden;
}
.riesgo-item::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: currentColor; border-radius: 14px 0 0 14px;
  opacity: 0; transition: opacity 0.3s ease;
}
.riesgo-item:hover { transform: translateY(-2px); box-shadow: var(--mr-shadow-md); }
.riesgo-item:hover::before { opacity: 1; }
.riesgo-item.abierto {
  border-color: currentColor; box-shadow: var(--mr-shadow-md);
}
.riesgo-item.abierto::before { opacity: 1; }
.riesgo-item-header { display: flex; align-items: center; gap: 16px; }
.riesgo-item-icono {
  flex-shrink: 0; width: 42px; height: 42px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px; background: rgba(0,0,0,0.03);
}
.riesgo-item-icono svg { stroke: currentColor; }
.riesgo-item-texto { flex: 1; }
.riesgo-item-titulo {
  font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 17px; margin-bottom: 2px;
}
.riesgo-item-subtitulo {
  font-family: 'DM Sans', sans-serif; font-size: 14px; opacity: 0.65;
}
.riesgo-item-badge {
  font-family: 'DM Sans', sans-serif; font-size: 10px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  padding: 5px 10px; border-radius: 20px; flex-shrink: 0; white-space: nowrap;
}
.riesgo-item-chevron {
  flex-shrink: 0; width: 20px; height: 20px;
  transition: transform 0.3s ease; color: currentColor; opacity: 0.4;
}
.riesgo-item.abierto .riesgo-item-chevron { transform: rotate(180deg); opacity: 0.8; }
.riesgo-item-detalle {
  display: none; padding-top: 16px; margin-top: 16px;
  border-top: 1px solid rgba(0,0,0,0.06);
  animation: mrPanelEntrada 0.3s ease;
}
.riesgo-item.abierto .riesgo-item-detalle { display: block; }
.riesgo-item-detalle p {
  font-family: 'DM Sans', sans-serif; font-size: 15px; line-height: 1.75;
  color: var(--ink-soft, #5A6577); margin-bottom: 12px;
}
.riesgo-lista-ejemplos {
  list-style: none; padding: 0;
  display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px;
}
.riesgo-lista-ejemplos li {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.6;
  color: var(--ink-soft, #5A6577); padding-left: 16px; position: relative;
}
.riesgo-lista-ejemplos li::before {
  content: ''; position: absolute; left: 0; top: 7px;
  width: 6px; height: 6px; border-radius: 50%; background: currentColor;
}
.riesgo-obligaciones {
  padding: 16px; background: var(--navy-50, #F3F7FB);
  border-radius: 10px; margin-top: 16px;
}
.riesgo-obligaciones-titulo {
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .1em;
  color: var(--navy-400, #4A7AB8); margin-bottom: 10px;
}
.riesgo-cat-titulo {
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 600;
  margin: 12px 0 4px; color: currentColor;
}
.btn-riesgo-accion {
  margin-top: 16px; padding: 10px 20px;
  background: var(--navy-800, #0B1222); color: #fff;
  border: none; border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.btn-riesgo-accion:hover { background: var(--navy-700, #162C4A); transform: translateY(-1px); }
/* ── Wizard ¿Mi sistema es de alto riesgo? ── */
.wizard-riesgo {
  max-width: 800px; margin: 0 auto 28px;
  border: 1px solid var(--mr-grey-200, #D1D5DB); border-radius: 14px;
  background: #fff; overflow: hidden;
  box-shadow: var(--mr-shadow-sm);
  transition: box-shadow 0.3s ease;
}
.wizard-riesgo:hover { box-shadow: var(--mr-shadow-md); }
.wizard-riesgo-header {
  display: flex; align-items: center; gap: 14px;
  padding: 20px 24px;
}
.wizard-riesgo-icono {
  flex-shrink: 0; width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 12px; background: rgba(22,160,134,0.08);
  color: var(--mr-teal, #16A086);
}
.wizard-riesgo-titulo {
  font-family: 'DM Serif Display', serif; font-size: 18px;
  color: var(--ink, #1E2D44); margin: 0 0 2px;
}
.wizard-riesgo-sub {
  font-family: 'DM Sans', sans-serif; font-size: 13px;
  color: var(--ink-soft, #6B7280); margin: 0; line-height: 1.5;
}
.wizard-riesgo-toggle {
  flex-shrink: 0; margin-left: auto;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 20px; background: var(--mr-teal, #16A086); color: #fff;
  border: none; border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
  white-space: nowrap;
}
.wizard-riesgo-toggle:hover { background: var(--mr-teal-hover, #1ABC9C); transform: translateY(-1px); }
.wizard-riesgo-toggle[aria-expanded="true"] svg { transform: rotate(90deg); }
.wizard-riesgo-body {
  padding: 0 24px 24px;
  animation: mrPanelEntrada 0.35s cubic-bezier(0.22,1,0.36,1);
}
.wizard-riesgo-body[hidden] { display: none; }
.wizard-riesgo-progreso {
  height: 4px; background: var(--mr-grey-100, #F3F4F6);
  border-radius: 4px; margin-bottom: 24px; overflow: hidden;
}
.wizard-riesgo-progreso-fill {
  height: 100%; width: 0%; border-radius: 4px;
  background: var(--mr-teal, #16A086);
  transition: width 0.4s cubic-bezier(0.22,1,0.36,1);
}
.wizard-pregunta {
  font-family: 'DM Sans', sans-serif; font-size: 16px; font-weight: 600;
  color: var(--ink, #1E2D44); margin-bottom: 6px; line-height: 1.5;
}
.wizard-nota {
  font-family: 'DM Sans', sans-serif; font-size: 13px;
  color: var(--ink-soft, #6B7280); margin-bottom: 16px; line-height: 1.55;
}
.wizard-opciones { display: flex; gap: 10px; flex-wrap: wrap; }
.wizard-opcion {
  flex: 1; min-width: 120px; padding: 14px 20px;
  border: 1px solid var(--mr-grey-200, #D1D5DB); border-radius: 10px;
  background: #fff; cursor: pointer;
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 600;
  color: var(--ink, #1E2D44); text-align: center;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.wizard-opcion:hover {
  border-color: var(--mr-teal, #16A086); background: rgba(22,160,134,0.04);
  transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
/* Resultado del wizard */
.wizard-resultado {
  padding: 20px 24px; border-radius: 12px; margin-top: 8px;
  animation: mrPanelEntrada 0.4s cubic-bezier(0.22,1,0.36,1);
}
.wizard-resultado-titulo {
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: 8px;
  display: flex; align-items: center; gap: 8px;
}
.wizard-resultado p {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.65;
  color: var(--ink-soft, #5A6577); margin: 0 0 12px;
}
.wizard-resultado-alto { background: rgba(192,57,43,0.06); border: 1px solid rgba(192,57,43,0.15); }
.wizard-resultado-alto .wizard-resultado-titulo { color: #C0392B; }
.wizard-resultado-limitado { background: rgba(183,150,12,0.06); border: 1px solid rgba(183,150,12,0.15); }
.wizard-resultado-limitado .wizard-resultado-titulo { color: #B7960C; }
.wizard-resultado-minimo { background: rgba(39,174,96,0.06); border: 1px solid rgba(39,174,96,0.15); }
.wizard-resultado-minimo .wizard-resultado-titulo { color: #27AE60; }
.wizard-resultado-prohibido { background: rgba(192,57,43,0.08); border: 1px solid rgba(192,57,43,0.2); }
.wizard-resultado-prohibido .wizard-resultado-titulo { color: #C0392B; }
.wizard-reiniciar {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 8px 16px; background: transparent;
  border: 1px solid var(--mr-grey-200, #D1D5DB); border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  color: var(--ink-soft, #6B7280); cursor: pointer;
  transition: all 0.3s ease;
}
.wizard-reiniciar:hover { background: var(--mr-grey-50, #F9FAFB); border-color: var(--mr-grey-400); }
[data-theme="dark"] .wizard-riesgo { background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07); }
[data-theme="dark"] .wizard-riesgo-titulo { color: #E8EDF2; }
[data-theme="dark"] .wizard-pregunta { color: #E8EDF2; }
[data-theme="dark"] .wizard-opcion { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.1); color: #E8EDF2; }
[data-theme="dark"] .wizard-opcion:hover { border-color: var(--mr-teal); background: rgba(22,160,134,0.08); }
[data-theme="dark"] .wizard-reiniciar { border-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.5); }

/* ── Tabla comparativa de niveles ── */
.riesgo-tabla-wrap {
  max-width: 800px; margin: 32px auto 28px;
  border: 1px solid var(--mr-grey-200, #D1D5DB); border-radius: 14px;
  background: #fff; overflow: hidden;
  box-shadow: var(--mr-shadow-sm);
}
.riesgo-tabla-titulo {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 24px; margin: 0;
  font-family: 'DM Sans', sans-serif; font-size: 15px; font-weight: 700;
  color: var(--ink, #1E2D44);
  border-bottom: 1px solid var(--mr-grey-100, #F3F4F6);
}
.riesgo-tabla-scroll { overflow-x: auto; }
.riesgo-tabla {
  width: 100%; border-collapse: collapse;
  font-family: 'DM Sans', sans-serif; font-size: 13px;
}
.riesgo-tabla th {
  padding: 12px 16px; text-align: left;
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .06em; color: var(--ink-soft, #6B7280);
  background: var(--mr-grey-50, #F9FAFB);
  border-bottom: 1px solid var(--mr-grey-200, #D1D5DB);
  white-space: nowrap;
}
.riesgo-tabla td {
  padding: 14px 16px; line-height: 1.55;
  color: var(--ink-soft, #5A6577);
  border-bottom: 1px solid var(--mr-grey-100, #F3F4F6);
  vertical-align: top;
}
.riesgo-tabla tr:last-child td { border-bottom: none; }
.riesgo-tabla tr:hover td { background: rgba(22,160,134,0.02); }
.riesgo-tabla-badge {
  display: inline-block; padding: 4px 10px; border-radius: 20px;
  font-size: 11px; font-weight: 700; white-space: nowrap;
}
[data-theme="dark"] .riesgo-tabla-wrap { background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07); }
[data-theme="dark"] .riesgo-tabla th { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.06); color: rgba(255,255,255,0.5); }
[data-theme="dark"] .riesgo-tabla td { color: rgba(255,255,255,0.65); border-color: rgba(255,255,255,0.04); }
[data-theme="dark"] .riesgo-tabla-titulo { color: #E8EDF2; border-color: rgba(255,255,255,0.06); }

/* Nota Digital Omnibus */
.omnibus-nota {
  display: flex; gap: 12px; padding: 16px 24px;
  background: rgba(241,196,15,0.06); border: 1px solid rgba(241,196,15,0.2);
  border-radius: 12px; max-width: 800px; margin: 0 auto;
}
.omnibus-icono { font-size: 18px; flex-shrink: 0; margin-top: 1px; }
.omnibus-nota p {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.65;
  color: var(--ink-soft, #5A6577); margin: 0;
}

/* ══════════════════════════════════════════
   VISTA 3 — TIMELINE
══════════════════════════════════════════ */
.timeline-filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; justify-content: center; }
.timeline-filtro {
  padding: 7px 16px; border-radius: 20px;
  border: 1px solid var(--navy-200, #C6D4E5); background: transparent;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  color: var(--ink-soft, #6B7280); cursor: pointer;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.timeline-filtro.active, .timeline-filtro:hover {
  background: var(--navy-800, #0B1222); border-color: var(--navy-800, #0B1222); color: #fff;
}
.timeline-scroll {
  overflow-x: auto; padding-bottom: 16px;
  scrollbar-width: thin; scrollbar-color: var(--navy-300, #7C9BBF) transparent;
}
.timeline-track {
  display: flex; gap: 12px; min-width: 1060px; padding: 48px 32px; position: relative;
}
.timeline-track::before {
  content: ''; position: absolute; top: 57px; left: 24px; right: 24px;
  height: 2px; background: linear-gradient(90deg, var(--mr-grey-200, #D1D5DB), var(--navy-200, #C6D4E5), var(--mr-grey-200, #D1D5DB));
}
.timeline-hito {
  flex: 1; min-width: 150px; display: flex; flex-direction: column; align-items: center;
  position: relative; cursor: pointer; z-index: 1; padding: 0 8px;
  transition: all 0.4s cubic-bezier(0.22,1,0.36,1);
}
.timeline-hito:hover { transform: translateY(-4px); }
.timeline-hito.atenuado { opacity: 0.1; pointer-events: none; }
.timeline-punto {
  width: 18px; height: 18px; border-radius: 50%;
  border: 3px solid #fff; outline: 2px solid var(--mr-grey-200, #D1D5DB);
  margin-bottom: 12px; flex-shrink: 0;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.timeline-hito:hover .timeline-punto {
  transform: scale(1.6); outline-color: currentColor;
}
.timeline-hito.vigente .timeline-punto {
  outline-color: var(--mr-teal, #16A086);
  box-shadow: 0 0 0 5px rgba(22,160,134,0.12);
}
.timeline-hito.proximo .timeline-punto {
  outline-color: #E67E22;
  box-shadow: 0 0 0 5px rgba(230,126,34,0.1);
  animation: mrTimelinePulse 2.5s ease-in-out infinite;
}
@keyframes mrTimelinePulse {
  0%, 100% { box-shadow: 0 0 0 5px rgba(230,126,34,0.1); }
  50% { box-shadow: 0 0 0 10px rgba(230,126,34,0); }
}
.timeline-fecha {
  font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 14px;
  color: var(--ink, #1E2D44); margin-bottom: 6px; text-align: center;
}
.timeline-titulo-hito {
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 600;
  color: var(--ink-soft, #6B7280); text-align: center; line-height: 1.45; max-width: 160px;
}
.timeline-estado {
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-top: 8px; padding: 5px 14px; border-radius: 20px;
}
.estado-pasado  { background: rgba(107,114,128,0.08); color: var(--mr-grey-400, #6B7280); }
.estado-vigente { background: rgba(22,160,134,0.1); color: var(--mr-teal, #16A086); }
.estado-proximo { background: rgba(230,126,34,0.1); color: #E67E22; }
.estado-futuro  { background: rgba(183,150,12,0.08); color: #B7960C; }
/* Resumen visible bajo cada hito del timeline */
.timeline-resumen {
  font-family: 'DM Sans', sans-serif; font-size: 12px; line-height: 1.55;
  color: var(--ink-faint, #8C9BB5); text-align: center;
  max-width: 170px; margin-top: 8px; opacity: 0.85;
}
.timeline-hito.seleccionado { transform: translateY(-6px); }
.timeline-hito.seleccionado .timeline-punto {
  transform: scale(1.4); outline-width: 3px;
}
/* Etiquetas de "afecta a" en el detalle */
.timeline-afecta {
  display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
  margin-bottom: 16px;
}
.timeline-afecta-label {
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .06em;
  color: var(--ink-faint, #8C9BB5);
}
.timeline-afecta-tag {
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 500;
  padding: 3px 10px; border-radius: 20px;
  background: var(--navy-50, #F3F7FB); color: var(--navy-600, #2D4A73);
  border: 1px solid var(--navy-100, #E1E9F4);
}
.timeline-detalle {
  margin-top: 24px; padding: 28px; border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 14px; background: #fff; box-shadow: var(--mr-shadow-md);
  animation: mrPanelEntrada 0.4s cubic-bezier(0.22,1,0.36,1);
}
.timeline-detalle[hidden] { display: none; }
.timeline-detalle h3 {
  font-family: 'DM Serif Display', serif; font-size: 22px; margin-bottom: 6px;
}
.timeline-detalle .timeline-meta {
  font-family: 'DM Sans', sans-serif; font-size: 13px;
  color: var(--ink-faint, #8C9BB5); margin-bottom: 16px;
}
.timeline-detalle p {
  font-family: 'DM Sans', sans-serif; font-size: 15px; line-height: 1.75;
  color: var(--ink-soft, #5A6577);
}
/* Botón añadir al calendario */
.btn-ics-calendario {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 16px; padding: 10px 20px;
  background: #fff; color: var(--navy-700, #1E3A5F);
  border: 1px solid var(--navy-200, #C6D4E5); border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 600;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.btn-ics-calendario:hover {
  background: var(--navy-50, #F3F7FB); border-color: var(--navy-400, #4A7AB8);
  transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.btn-ics-calendario svg { flex-shrink: 0; stroke: var(--navy-500, #3A5F8A); }
[data-theme="dark"] .btn-ics-calendario {
  background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.75);
}
[data-theme="dark"] .btn-ics-calendario:hover {
  background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2);
}
[data-theme="dark"] .btn-ics-calendario svg { stroke: rgba(255,255,255,0.6); }

/* ══════════════════════════════════════════
   VISTA 4 — PERFIL
══════════════════════════════════════════ */
.perfil-grid {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 16px; max-width: 900px; margin: 0 auto 32px;
}
.perfil-grid .perfil-btn {
  flex: 0 1 calc(33.333% - 12px); min-width: 160px; max-width: 260px;
}
.perfil-btn {
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  padding: 28px 16px; border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 14px; background: #fff; cursor: pointer;
  font-family: 'DM Sans', sans-serif; text-align: center;
  transition: all 0.4s cubic-bezier(0.22,1,0.36,1);
  box-shadow: var(--mr-shadow-sm); position: relative; overflow: hidden;
}
.perfil-btn::before {
  content: ''; position: absolute; top: 0; left: -100%; width: 60%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.8), transparent);
  pointer-events: none;
}
.perfil-btn:hover::before { animation: shineSlide 0.7s ease-out; }
.perfil-btn:hover {
  border-color: var(--navy-300, #7C9BBF);
  transform: translateY(-4px); box-shadow: 0 14px 40px rgba(30,52,96,0.1);
}
.perfil-btn.seleccionado {
  border-color: var(--mr-teal, #16A086);
  background: var(--mr-teal-subtle); box-shadow: 0 0 0 3px rgba(22,160,134,0.08);
}
.perfil-btn:focus-visible { outline: 2px solid var(--mr-teal, #16A086); outline-offset: 2px; }
.perfil-icono-grande {
  width: 52px; height: 52px; display: flex;
  align-items: center; justify-content: center;
  border-radius: 14px; background: var(--navy-50, #F3F7FB);
  border: 1px solid var(--navy-100, #E1E9F4);
  transition: all 0.3s ease;
}
.perfil-icono-grande svg { width: 28px; height: 28px; }
.perfil-btn:hover .perfil-icono-grande {
  background: var(--mr-teal-subtle, rgba(22,160,134,0.08));
  border-color: rgba(22,160,134,0.2);
}
.perfil-btn:hover .perfil-icono-grande svg { stroke: var(--mr-teal, #16A086); }
.perfil-btn.seleccionado .perfil-icono-grande {
  background: rgba(22,160,134,0.12); border-color: rgba(22,160,134,0.3);
}
.perfil-btn.seleccionado .perfil-icono-grande svg { stroke: var(--mr-teal, #16A086); }
.perfil-nombre-btn {
  font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 14px;
  color: var(--ink, #1E2D44); line-height: 1.3;
}
.perfil-desc-btn {
  font-family: 'DM Sans', sans-serif; font-size: 11px;
  color: var(--ink-soft, #6B7280); line-height: 1.45;
}
/* Resultado perfil */
.perfil-resultado {
  max-width: 720px; margin: 0 auto;
  animation: mrPanelEntrada 0.5s cubic-bezier(0.22,1,0.36,1);
}
.perfil-resultado[hidden] { display: none; }
.perfil-resultado-titulo {
  font-family: 'DM Serif Display', serif; font-size: 22px;
  color: var(--ink, #1E2D44); margin-bottom: 24px;
  display: flex; align-items: center; gap: 12px;
}
.perfil-resultado-icono {
  width: 44px; height: 44px; display: inline-flex;
  align-items: center; justify-content: center;
  border-radius: 12px; background: var(--navy-50, #F3F7FB);
  border: 1px solid var(--navy-100, #E1E9F4); flex-shrink: 0;
}
.perfil-resultado-icono svg { width: 24px; height: 24px; }
.semaforo-dot {
  display: inline-block; width: 8px; height: 8px;
  border-radius: 50%; flex-shrink: 0;
}
.semaforo { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 32px; }
.semaforo-col {
  padding: 24px; border-radius: 14px; box-shadow: var(--mr-shadow-sm);
  border: 1px solid transparent;
}
.semaforo-rojo   { background: rgba(192,57,43,0.04); border-color: rgba(192,57,43,0.12); }
.semaforo-amarillo { background: rgba(241,196,15,0.05); border-color: rgba(241,196,15,0.15); }
.semaforo-verde  { background: rgba(39,174,96,0.04); border-color: rgba(39,174,96,0.12); }
.semaforo-titulo {
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em; margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}
.semaforo-lista { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.semaforo-lista li {
  font-family: 'DM Sans', sans-serif; font-size: 13px; line-height: 1.6;
  color: var(--ink-soft, #5A6577); padding-left: 14px; position: relative;
}
.semaforo-lista li::before {
  content: ''; position: absolute; left: 0; top: 6px;
  width: 5px; height: 5px; border-radius: 50%; background: var(--mr-grey-400, #6B7280);
}
/* ── Checklist interactivo ── */
.checklist-progreso-wrap {
  margin-bottom: 20px; padding: 14px 20px;
  background: var(--navy-50, #F3F7FB); border-radius: 10px;
  border: 1px solid var(--navy-100, #E1E9F4);
}
.checklist-progreso-info {
  display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px;
}
.checklist-progreso-label {
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 600;
  color: var(--ink-soft, #6B7280); text-transform: uppercase; letter-spacing: .06em;
}
.checklist-progreso-pct {
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 700;
  color: var(--mr-teal, #16A086);
}
.checklist-progreso-bar {
  height: 6px; background: rgba(0,0,0,0.06); border-radius: 6px; overflow: hidden;
}
.checklist-progreso-fill {
  height: 100%; width: 0%; border-radius: 6px;
  background: linear-gradient(90deg, #16A086, #27AE60);
  transition: width 0.5s cubic-bezier(0.22,1,0.36,1);
}
.checklist-lista { gap: 10px !important; }
.checklist-item { padding-left: 0 !important; }
.checklist-item::before { display: none !important; }
.checklist-label {
  display: flex; align-items: flex-start; gap: 10px; cursor: pointer;
  transition: opacity 0.3s ease;
}
.checklist-cb { position: absolute; opacity: 0; width: 0; height: 0; }
.checklist-box {
  flex-shrink: 0; width: 20px; height: 20px; border-radius: 5px;
  border: 2px solid var(--mr-grey-300, #9CA3AF);
  display: flex; align-items: center; justify-content: center;
  transition: all 0.25s cubic-bezier(0.22,1,0.36,1);
  margin-top: 1px; background: #fff;
}
.checklist-box svg { opacity: 0; transition: opacity 0.2s ease; }
.checklist-cb:checked + .checklist-box {
  background: currentColor; border-color: currentColor;
}
.checklist-cb:checked + .checklist-box svg { opacity: 1; }
.checklist-text { font-size: 13px; line-height: 1.55; }
.checklist-done .checklist-text { text-decoration: line-through; opacity: 0.5; }
.checklist-label:hover .checklist-box {
  transform: scale(1.1); box-shadow: 0 0 0 3px rgba(0,0,0,0.04);
}
[data-theme="dark"] .checklist-progreso-wrap { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
[data-theme="dark"] .checklist-box { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.2); }
[data-theme="dark"] .checklist-progreso-bar { background: rgba(255,255,255,0.06); }

.perfil-acciones { margin-bottom: 32px; }
.perfil-acciones-titulo {
  font-family: 'DM Serif Display', serif; font-size: 18px;
  color: var(--ink, #1E2D44); margin-bottom: 16px;
}
.perfil-acciones-lista {
  list-style: none; padding: 0; display: flex; flex-direction: column; gap: 16px;
  counter-reset: acciones;
}
.perfil-acciones-lista li {
  display: flex; gap: 16px; align-items: flex-start;
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.65;
  color: var(--ink-soft, #5A6577); counter-increment: acciones;
}
.perfil-acciones-lista li::before {
  content: counter(acciones); flex-shrink: 0; width: 30px; height: 30px;
  border-radius: 50%; background: var(--navy-800, #0B1222); color: #fff;
  font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.perfil-cta {
  padding: 32px; background: linear-gradient(135deg, #0B1222, #162C4A);
  border-radius: 14px; text-align: center;
}
.perfil-cta p {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.65;
  color: rgba(255,255,255,0.65); margin-bottom: 16px;
}
.perfil-cta .btn-cta-contactar {
  padding: 12px 24px; background: var(--mr-teal, #16A086); color: #fff;
  border: none; border-radius: 8px;
  font-family: 'DM Sans', sans-serif; font-size: 14px; font-weight: 500;
  cursor: pointer; transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.perfil-cta .btn-cta-contactar:hover { background: var(--mr-teal-hover, #1ABC9C); transform: translateY(-1px); }

/* ══════════════════════════════════════════
   CTA SECTION
══════════════════════════════════════════ */
/* Staggered entrance animations for profile result */
.semaforo-anim {
  animation: mrSlideUp 0.5s cubic-bezier(0.22,1,0.36,1) both;
}
.perfil-acciones-anim {
  animation: mrSlideUp 0.5s cubic-bezier(0.22,1,0.36,1) 0.35s both;
}
.accion-anim {
  animation: mrSlideUp 0.4s cubic-bezier(0.22,1,0.36,1) both;
}
.perfil-cta-anim {
  animation: mrSlideUp 0.5s cubic-bezier(0.22,1,0.36,1) 0.55s both;
}
@keyframes mrSlideUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Hover effect on semáforo cols */
.semaforo-col {
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.semaforo-col:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

.mapa-cta-section .btn-white svg { color: #0A66C2; }

/* Nota de portapapeles bajo botones LinkedIn */
.mapa-cta-clipboard-nota {
  display: flex; align-items: flex-start; gap: 8px; justify-content: center;
  max-width: 480px; margin: 16px auto 0;
  font-family: 'DM Sans', sans-serif; font-size: 12px; line-height: 1.55;
  color: rgba(255,255,255,0.38); text-align: left;
}
.mapa-cta-clipboard-nota svg {
  flex-shrink: 0; margin-top: 1px; opacity: 0.5;
}

/* LinkedIn copy notification */
.linkedin-copy-aviso {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(12px);
  padding: 12px 20px; background: #0B1222; color: #fff;
  border-radius: 10px; font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 500;
  z-index: 9999; display: flex; align-items: center; gap: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.25);
  opacity: 0; transition: all 0.35s cubic-bezier(0.22,1,0.36,1);
  pointer-events: none;
}
.linkedin-copy-aviso.visible { opacity: 1; transform: translateX(-50%) translateY(0); }
.linkedin-copy-aviso svg { color: var(--mr-teal, #16A086); flex-shrink: 0; }

/* ══════════════════════════════════════════
   TEASER EN INICIO
══════════════════════════════════════════ */
.mapa-teaser {
  padding: 64px 24px; background: var(--navy-50, #F3F7FB);
  border-top: 1px solid var(--navy-100, #E1E9F4);
  text-align: center;
}
.mapa-teaser h2 {
  font-size: clamp(22px, 3vw, 30px); margin: 12px 0 16px; line-height: 1.25;
}
.mapa-teaser-badges {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 24px;
}
.mapa-teaser-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 12px; font-weight: 500; color: var(--ink-soft, #5A6577);
  background: #fff; border: 1px solid var(--navy-100, #E1E9F4);
  border-radius: 20px; padding: 6px 14px;
  transition: all 0.3s ease;
}
.mapa-teaser-badge:hover { border-color: var(--navy-300); transform: translateY(-1px); }
.mapa-teaser-badge svg { stroke: var(--navy-500, #3A5F8A); flex-shrink: 0; }
.btn-teal {
  padding: 12px 24px; background: var(--mr-teal, #16A086); color: #fff;
  border: none; border-radius: 8px; font-family: 'DM Sans', sans-serif;
  font-size: 14px; font-weight: 500; cursor: pointer;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.btn-teal:hover { background: var(--mr-teal-hover, #1ABC9C); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(22,160,134,0.25); }

/* ══════════════════════════════════════════
   PDF DESCARGABLE POR PERFIL
══════════════════════════════════════════ */
.perfil-cta-botones {
  display: flex; gap: 12px; justify-content: center; flex-wrap: wrap;
}
.btn-pdf-perfil {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 12px 20px; background: transparent;
  color: var(--mr-teal, #16A086);
  border: 1.5px solid var(--mr-teal, #16A086);
  border-radius: 8px; font-family: 'DM Sans', sans-serif;
  font-size: 14px; font-weight: 500; cursor: pointer;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.btn-pdf-perfil:hover {
  background: var(--mr-teal, #16A086); color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(22,160,134,0.2);
}
.btn-pdf-perfil svg { transition: stroke 0.2s ease; }
.btn-pdf-perfil:hover svg { stroke: #fff; }

/* ══════════════════════════════════════════
   GLOSARIO TOOLTIPS
══════════════════════════════════════════ */
.glosario-term {
  border-bottom: 1.5px dotted var(--mr-teal, #16A086);
  cursor: help; position: relative;
  transition: color 0.2s ease;
}
.glosario-term:hover { color: var(--mr-teal, #16A086); }

.glosario-tooltip {
  position: fixed; z-index: 10000;
  max-width: 340px; min-width: 200px;
  pointer-events: none; opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.25s cubic-bezier(0.22,1,0.36,1), transform 0.25s cubic-bezier(0.22,1,0.36,1);
}
.glosario-tooltip.visible { opacity: 1; transform: translateY(0); pointer-events: auto; }
.glosario-tooltip.below { transform: translateY(-4px); }
.glosario-tooltip.below.visible { transform: translateY(0); }

.glosario-tooltip-inner {
  background: var(--mr-charcoal, #1F2933); color: #fff;
  font-family: 'DM Sans', sans-serif; font-size: 12.5px; line-height: 1.6;
  padding: 10px 14px; border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}
.glosario-tooltip-inner::before {
  content: ''; position: absolute;
  bottom: -5px; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--mr-charcoal, #1F2933);
}
.glosario-tooltip.below .glosario-tooltip-inner::before {
  bottom: auto; top: -5px;
  border-top-color: transparent; border-bottom-color: var(--mr-charcoal, #1F2933);
}

/* ══════════════════════════════════════════
   MITOS Y REALIDADES FAQ
══════════════════════════════════════════ */
.mitos-lista {
  max-width: 780px; margin: 0 auto;
  display: flex; flex-direction: column; gap: 12px;
}
.mito-item {
  background: #fff;
  border: 1px solid var(--mr-grey-200, #D1D5DB);
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s cubic-bezier(0.22,1,0.36,1);
}
.mito-item:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.mito-item.abierto { border-color: var(--mr-teal, #16A086); box-shadow: 0 4px 20px rgba(22,160,134,0.08); }

.mito-header {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 16px 20px; cursor: pointer;
  background: none; border: none; width: 100%; text-align: left;
  font-family: 'DM Sans', sans-serif;
  transition: background 0.2s ease;
}
.mito-header:hover { background: var(--mr-grey-50, #F9FAFB); }

.mito-badge {
  flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  padding: 4px 10px; border-radius: 20px; margin-top: 2px;
  white-space: nowrap;
}
.mito-badge-falso {
  background: rgba(192,57,43,0.08); color: #C0392B;
}
.mito-badge-matiz {
  background: rgba(183,150,12,0.08); color: #B7960C;
}
.mito-badge-dot {
  width: 6px; height: 6px; border-radius: 50%; display: inline-block;
}
.mito-badge-falso .mito-badge-dot { background: #C0392B; }
.mito-badge-matiz .mito-badge-dot { background: #B7960C; }

.mito-titulo {
  flex: 1; font-size: 15px; font-weight: 600; line-height: 1.45;
  color: var(--mr-charcoal, #1F2933);
}

.mito-chevron {
  flex-shrink: 0; width: 20px; height: 20px; margin-top: 2px;
  color: var(--mr-grey-400, #6B7280);
  transition: transform 0.3s cubic-bezier(0.22,1,0.36,1);
}
.mito-item.abierto .mito-chevron { transform: rotate(180deg); color: var(--mr-teal, #16A086); }

.mito-body {
  max-height: 0; overflow: hidden;
  transition: max-height 0.4s cubic-bezier(0.22,1,0.36,1), padding 0.3s ease;
}
.mito-item.abierto .mito-body { max-height: 500px; }

.mito-contenido {
  padding: 0 20px 20px;
  margin-left: 0;
  border-top: 1px solid var(--mr-grey-100, #F3F4F6);
}
.mito-realidad-label {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
  color: #27AE60; margin: 16px 0 8px;
}
.mito-realidad-dot {
  width: 6px; height: 6px; border-radius: 50%; background: #27AE60; display: inline-block;
}
.mito-realidad-text {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.7;
  color: var(--mr-grey-600, #374151); margin: 0;
}
.mito-articulo {
  display: inline-flex; align-items: center; gap: 4px;
  font-family: 'DM Sans', sans-serif; font-size: 11px; font-weight: 600;
  color: var(--mr-teal, #16A086); background: var(--mr-teal-subtle, rgba(22,160,134,0.08));
  padding: 3px 10px; border-radius: 20px; margin-top: 10px;
}

/* ══════════════════════════════════════════
   DARK MODE
══════════════════════════════════════════ */
[data-theme="dark"] .mr-contador { background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07); }
[data-theme="dark"] .mr-contador-label,
[data-theme="dark"] .mr-contador-fecha { color: rgba(255,255,255,0.5); }
[data-theme="dark"] .mr-contador-section { background: var(--bg-surface, #161B22); }
[data-theme="dark"] .mr-progreso-wrap { border-top-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .mr-progreso-bar { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.04); }
[data-theme="dark"] .mr-progreso-label { color: rgba(255,255,255,0.4); }
[data-theme="dark"] .mapa-svg-wrap {
  background: linear-gradient(135deg, #0D1117, #161B22);
  border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .mapa-nodo text { stroke: #161B22; }
[data-theme="dark"] .mapa-nodo-subtipo { stroke: #161B22; }
[data-theme="dark"] .mapa-indicador-bg { fill: #1F2733; }
[data-theme="dark"] .mapa-conexion-indicador:hover .mapa-indicador-bg { fill: #2A3545; }
[data-theme="dark"] .mapa-panel-tipo { background: rgba(22,160,134,0.15); }
[data-theme="dark"] .perfil-icono-grande,
[data-theme="dark"] .perfil-resultado-icono { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .perfil-icono-grande svg,
[data-theme="dark"] .perfil-resultado-icono svg { stroke: rgba(255,255,255,0.6); }
[data-theme="dark"] .mapa-panel,
[data-theme="dark"] .timeline-detalle {
  background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .mapa-panel h3 { color: var(--mr-teal, #16A086); }
[data-theme="dark"] .mapa-panel p,
[data-theme="dark"] .mapa-panel li,
[data-theme="dark"] .timeline-detalle p,
[data-theme="dark"] .riesgo-item-detalle p,
[data-theme="dark"] .riesgo-lista-ejemplos li,
[data-theme="dark"] .semaforo-lista li,
[data-theme="dark"] .perfil-acciones-lista li,
[data-theme="dark"] .perfil-desc-btn,
[data-theme="dark"] .omnibus-nota p { color: rgba(255,255,255,0.65); }
[data-theme="dark"] .mapa-tabs {
  background: var(--bg-surface, #161B22); border-color: rgba(255,255,255,0.07);
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}
[data-theme="dark"] .mapa-tab { color: rgba(255,255,255,0.55); border-color: rgba(255,255,255,0.1); }
[data-theme="dark"] .mapa-tab:hover { color: #fff; background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.2); }
[data-theme="dark"] .mapa-tab.active {
  color: #fff; background: var(--navy-600, #2D4A73);
  border-color: var(--navy-600, #2D4A73);
}
[data-theme="dark"] .riesgo-item {
  background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .riesgo-obligaciones { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .perfil-btn {
  background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .perfil-btn::before { background: linear-gradient(90deg, transparent, rgba(255,255,255,0.04), transparent); }
[data-theme="dark"] .perfil-nombre-btn,
[data-theme="dark"] .perfil-resultado-titulo,
[data-theme="dark"] .perfil-acciones-titulo,
[data-theme="dark"] .timeline-fecha { color: #E8EDF2; }
[data-theme="dark"] .semaforo-col { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .timeline-afecta-tag { background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.6); }
[data-theme="dark"] .timeline-resumen { color: rgba(255,255,255,0.4); }
[data-theme="dark"] .timeline-filtro { border-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.5); }
[data-theme="dark"] .timeline-filtro.active,
[data-theme="dark"] .timeline-filtro:hover {
  background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2); color: #fff;
}
[data-theme="dark"] .mapa-svg-hint-overlay { background: rgba(255,255,255,0.1); }
/* ── Mapa teaser variante oscura (homepage) ── */
.mapa-teaser--dark {
  background: linear-gradient(160deg, #0B1222 0%, #0F1A2E 30%, #132D4A 70%, #1B3A5E 100%);
  border-top: none;
}
.mapa-teaser--dark h2 { color: #fff; }
.mapa-teaser--dark p { color: rgba(255,255,255,0.6); }
.mapa-teaser--dark .eyebrow { color: #1ABC9C; }
.mapa-teaser--dark .mapa-teaser-badge {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.7);
}
.mapa-teaser--dark .mapa-teaser-badge svg { stroke: #1ABC9C; }
.mapa-teaser--dark .mapa-teaser-badge:hover {
  border-color: rgba(255,255,255,0.25);
  background: rgba(255,255,255,0.12);
}

[data-theme="dark"] .mapa-teaser {
  background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07);
}
[data-theme="dark"] .mapa-teaser-badge {
  background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.1); color: #9CA3AF;
}
[data-theme="dark"] .omnibus-nota { background: rgba(241,196,15,0.04); border-color: rgba(241,196,15,0.12); }
[data-theme="dark"] .mapa-panel-cerrar { background: transparent; border-color: rgba(255,255,255,0.1); color: rgba(255,255,255,0.5); }
[data-theme="dark"] .mapa-panel-cerrar:hover { background: rgba(255,255,255,0.06); }
/* PDF button dark */
[data-theme="dark"] .btn-pdf-perfil { border-color: rgba(22,160,134,0.5); color: var(--mr-teal, #16A086); }
[data-theme="dark"] .btn-pdf-perfil:hover { background: var(--mr-teal, #16A086); color: #fff; border-color: var(--mr-teal, #16A086); }
/* Glosario tooltips dark */
[data-theme="dark"] .glosario-term { border-bottom-color: rgba(22,160,134,0.5); }
[data-theme="dark"] .glosario-tooltip-inner { background: #0D1117; box-shadow: 0 8px 24px rgba(0,0,0,0.4); }
[data-theme="dark"] .glosario-tooltip-inner::before { border-top-color: #0D1117; }
[data-theme="dark"] .glosario-tooltip.below .glosario-tooltip-inner::before { border-top-color: transparent; border-bottom-color: #0D1117; }
/* Mitos FAQ dark */
[data-theme="dark"] .mito-item { background: var(--bg-elevated, #1F2733); border-color: rgba(255,255,255,0.07); }
[data-theme="dark"] .mito-item.abierto { border-color: var(--mr-teal, #16A086); }
[data-theme="dark"] .mito-header:hover { background: rgba(255,255,255,0.04); }
[data-theme="dark"] .mito-titulo { color: #E8EDF2; }
[data-theme="dark"] .mito-chevron { color: rgba(255,255,255,0.4); }
[data-theme="dark"] .mito-contenido { border-top-color: rgba(255,255,255,0.06); }
[data-theme="dark"] .mito-realidad-text { color: rgba(255,255,255,0.65); }
[data-theme="dark"] .mito-badge-falso { background: rgba(192,57,43,0.15); }
[data-theme="dark"] .mito-badge-matiz { background: rgba(183,150,12,0.15); }
[data-theme="dark"] .mito-articulo { background: rgba(22,160,134,0.12); }

/* ══════════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════════ */
@media (max-width: 768px) {
  .mapa-tabs { top: 56px; padding: 10px 16px; }
  .mapa-vista .section { padding: 32px 16px; }
  .timeline-track { min-width: 900px; }
  .semaforo { grid-template-columns: 1fr; }
  .perfil-grid .perfil-btn { flex: 0 1 calc(50% - 10px); }
  .mapa-panel { padding: 24px 16px; }
  .mr-contador-inner { flex-direction: column; align-items: flex-start; gap: 12px; }
  .mr-contador-numero { font-size: 24px; }
  .mito-header { padding: 14px 16px; gap: 10px; }
  .mito-titulo { font-size: 14px; }
  .mito-contenido { padding: 0 16px 16px; }
}
@media (max-width: 480px) {
  .mapa-tabs { top: 52px; }
  .mapa-tab { padding: 9px 14px; font-size: 13px; }
  .perfil-grid .perfil-btn { flex: 0 1 100%; }
  .riesgo-item { padding: 16px; }
  .riesgo-item-header { flex-wrap: wrap; gap: 8px; }
  .riesgo-item-badge { order: -1; }
  .mapa-svg-hint-overlay { font-size: 11px; padding: 8px 14px; }
}

/* ── Reduced motion ── */
@media (prefers-reduced-motion: reduce) {
  .mapa-nodo circle, .mapa-linea, .riesgo-item, .timeline-punto,
  .perfil-btn, .timeline-hito, .mapa-tab { transition: none; }
  .mapa-panel, .timeline-detalle, .perfil-resultado,
  .riesgo-item-detalle { animation: none; }
  .mapa-svg-hint-pulse, .timeline-hito.proximo .timeline-punto,
  .mapa-indicador-pulse { animation: none; }
  .mapa-svg-hint-overlay { animation: none; opacity: 1; }
}