/**
 * Landing publica de VHIVHE Informes (F1) — tokens propios + estilos que las
 * utilidades de Tailwind no cubren directamente (mockups, gauges, acordeon FAQ).
 *
 * Contrato de color (R10_DESIGN_SYSTEM.md §2.1, ratificado): el color primario
 * vive UNICAMENTE en --vh-primary. Ningun componente debe repetir el hex; los
 * partials referencian el token vía Tailwind arbitrary value bg-[var(--vh-primary)]
 * o directamente var(--vh-primary) en CSS. Cambiar la marca = cambiar esta variable.
 */
.vh-informes-page {
  --vh-primary: #3454b4;
  --vh-primary-hover: #2b4494;
  --vh-primary-contrast: #ffffff;
  --vh-primary-soft: #eef1fb;
}

/* Tema oscuro diferido a F4 (layout del informe) — GATE/decisión usuario 2026-07-15.
   No se define aqui ninguna variante [data-theme="dark"] todavia. */

.vh-informes-landing__hero-mockup {
  background: linear-gradient(160deg, var(--vh-primary-soft) 0%, #ffffff 60%);
  border: 1px solid #e2e8f0;
}

.vh-informes-landing__score-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-weight: 700;
}

.vh-informes-landing__faq-item[open] .vh-informes-landing__faq-icon {
  transform: rotate(180deg);
}

.vh-informes-landing__faq-icon {
  transition: transform 150ms ease-out;
}

.vh-informes-landing__pricing-card--highlight {
  border-color: var(--vh-primary);
  box-shadow: 0 12px 24px -12px rgba(52, 84, 180, 0.35);
}