/* nom035-landing.css — lo propio de la landing del NOM-035 (nom035#19) sobre el molde de haon.com.mx (que no se toca).
   Calculadora, tabla de precios, preguntas frecuentes, tema claro, tamaño de letra y foco visible. Esquinas de 4 px en lo nuevo. */

/* accesibilidad */
.sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.saltar { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 4px; background: var(--haon-accent); color: #0f2847; font-weight: 700; text-decoration: none; }
.saltar:focus { top: 12px; }
a:focus-visible, button:focus-visible, summary:focus-visible, input:focus-visible { outline: 3px solid var(--haon-accent); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .hero-v6 video.bg { display: none; } .hero-v6 { background: url(/video/haon-acceso.jpg) center / cover; } }

/* barra: marca con sello NOM-035 y ajustes de lectura */
nav.haon-nav .marca-nav { display: inline-flex; align-items: center; gap: 10px; }
nav.haon-nav .sello-nom { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.15rem; color: #0f2847; background: var(--haon-accent); padding: 3px 8px; border-radius: 4px; }
nav.haon-nav .ajustes { display: inline-flex; gap: 4px; }
nav.haon-nav .ajuste { min-width: 34px; height: 30px; padding: 0 6px; border-radius: 4px; border: 1px solid var(--bg-glass-border); background: var(--bg-glass); color: var(--text-primary); font-size: 0.85rem; font-weight: 700; cursor: pointer; }
nav.haon-nav .ajuste:hover { border-color: var(--haon-accent); color: var(--haon-accent); }
nav.haon-nav .idioma-trigger { border-radius: 4px; }
nav.haon-nav .idioma-menu { border-radius: 4px; }

/* hero: dos botones */
.hero-v6 .hero-cta { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-v6 .cifras b { font-size: 1.4rem; }

/* tarjetas: el sello amarillo a 4 px en lo nuevo */
#norma .sello { border-radius: 4px; }
#norma .modulo .dato { margin-top: auto; }

/* calculadora */
.calc-col { grid-template-columns: 6fr 6fr; }
.calculadora { display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: 4px; background: rgba(15,40,71,0.6); border: 1px solid rgba(255,255,255,0.18); }
.calculadora label { font-size: 1.15rem; font-weight: 700; }
.calc-fila { display: flex; align-items: center; gap: 12px; }
.calc-fila input { width: 9rem; padding: 12px 14px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.1); color: #fff; font-size: 1.6rem; font-weight: 800; }
.calc-unidad { color: rgba(255,255,255,0.85); }
.calc-ayuda, .calc-nota { margin: 0; color: rgba(255,255,255,0.78); font-size: 0.92rem; line-height: 1.5; }
.calc-resultado dl { margin: 6px 0 0; display: flex; flex-direction: column; gap: 6px; }
.calc-resultado dl > div { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,0.14); }
.calc-resultado dt { color: rgba(255,255,255,0.8); }
.calc-resultado dd { margin: 0; font-variant-numeric: tabular-nums; font-weight: 600; }
.calc-resultado .total dt, .calc-resultado .total dd { font-size: 1.35rem; font-weight: 800; color: var(--haon-accent); }
.calc-banda { margin: 4px 0 0; color: rgba(255,255,255,0.85); min-height: 1.5em; }
.calc-banda.error { color: #ffb4a8; font-weight: 600; }
.calc-comprar { align-self: flex-start; border-radius: 4px; }

/* tabla de precios */
.tabla-precios table { width: 100%; border-collapse: collapse; }
.tabla-precios caption { text-align: left; margin-bottom: 10px; color: rgba(255,255,255,0.8); font-size: 0.95rem; }
.tabla-precios th, .tabla-precios td { padding: 10px 12px; text-align: left; border-bottom: 1px solid rgba(255,255,255,0.16); }
.tabla-precios thead th { font-size: 0.75rem; letter-spacing: 0.15rem; text-transform: uppercase; color: var(--haon-accent); }
.tabla-precios tbody th { font-weight: 700; font-variant-numeric: tabular-nums; }
.tabla-precios td { font-variant-numeric: tabular-nums; font-weight: 400; }
.tabla-precios td b { font-weight: 700; }
.tabla-precios td span { font-weight: 400; color: rgba(255,255,255,0.75); font-size: 0.9rem; }
.tabla-precios td a { color: var(--haon-accent); font-weight: 700; }
.tabla-precios tr.activa th, .tabla-precios tr.activa td { background: rgba(245,196,74,0.16); }
.incluye { margin: 22px 0 0; padding-left: 20px; display: flex; flex-direction: column; gap: 8px; color: rgba(255,255,255,0.85); line-height: 1.5; }

/* preguntas frecuentes */
.faq { display: flex; flex-direction: column; gap: 10px; max-width: 900px; }
.faq details { border: 1px solid rgba(255,255,255,0.18); border-radius: 4px; background: rgba(15,40,71,0.35); }
.faq summary { cursor: pointer; padding: 16px 18px; font-weight: 700; font-size: 1.05rem; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--haon-accent); font-size: 1.3rem; line-height: 1; }
.faq details[open] summary::after { content: "\2212"; }
.faq details p { margin: 0; padding: 0 18px 18px; line-height: 1.6; color: rgba(255,255,255,0.85); }
.cta-final { display: flex; flex-wrap: wrap; align-items: center; gap: 22px; margin-top: 32px; }
.cta-final .btn { border-radius: 4px; }
.lnk-cotizar { color: var(--haon-accent); font-weight: 600; }

/* HAON con su corazón */
#haon .avatar-haon { width: 140px; }
#haon .dos-col > .cita { grid-column: 1 / -1; margin-top: 8px; }

/* pie: los títulos de columna son h2 por orden de encabezados, con la cara de los h4 del molde */
.pie .h4 { margin: 0 0 6px; font-size: 0.75rem; letter-spacing: 0.25rem; text-transform: uppercase; color: var(--haon-accent); }

@media (max-width: 900px) {
  .calc-col { grid-template-columns: 1fr; }
  nav.haon-nav .ajustes .ajuste { min-width: 30px; }
}
@media (max-width: 640px) {
  nav.haon-nav .sello-nom { display: none; }
  nav.haon-nav .nav-corazon { display: none; }
}

/* ===== tema claro (el hero se queda sobre el video) ===== */
[data-tema="claro"] body { background: #eef3fa; color: #0f2847; }
[data-tema="claro"] nav.haon-nav { background: rgba(255,255,255,0.92); border-bottom-color: rgba(15,40,71,0.14); }
[data-tema="claro"] nav.haon-nav a { color: #0f2847; }
[data-tema="claro"] nav.haon-nav a:hover { color: #1a5bb8; }
[data-tema="claro"] nav.haon-nav .ajuste, [data-tema="claro"] nav.haon-nav .idioma-trigger { color: #0f2847; background: #fff; border-color: rgba(15,40,71,0.25); }
[data-tema="claro"] nav.haon-nav .idioma-menu { background: #fff; border-color: rgba(15,40,71,0.2); }
[data-tema="claro"] nav.haon-nav .idioma-menu a:hover { background: #eef3fa; }
[data-tema="claro"] nav.haon-nav .btn.secundario { color: #0f2847; }
[data-tema="claro"] .banda { color: #0f2847; }
[data-tema="claro"] .banda.vidrio { background: #ffffff; border-color: rgba(15,40,71,0.1); }
[data-tema="claro"] .banda.gris { background: #e3ebf5; }
[data-tema="claro"] .banda.azul { background: #dbe8fa; }
[data-tema="claro"] .banda .kicker, [data-tema="claro"] .sub-h, [data-tema="claro"] .mini b, [data-tema="claro"] .modulo .idx,
[data-tema="claro"] .modulo .dato, [data-tema="claro"] .tabla-precios thead th, [data-tema="claro"] .lnk-cotizar,
[data-tema="claro"] .tabla-precios td a, [data-tema="claro"] .faq summary::after { color: #8a5a00; }
[data-tema="claro"] .banda .lead, [data-tema="claro"] .modulo p, [data-tema="claro"] .nota, [data-tema="claro"] .narrativa p,
[data-tema="claro"] .mini span, [data-tema="claro"] .pasos p, [data-tema="claro"] .cita, [data-tema="claro"] .kpi span,
[data-tema="claro"] .incluye, [data-tema="claro"] .faq details p, [data-tema="claro"] .calc-ayuda, [data-tema="claro"] .calc-nota,
[data-tema="claro"] .calc-unidad, [data-tema="claro"] .calc-resultado dt, [data-tema="claro"] .calc-banda,
[data-tema="claro"] .tabla-precios caption, [data-tema="claro"] .tabla-precios td span { color: #2b3f58; }
[data-tema="claro"] .modulo, [data-tema="claro"] .kpi, [data-tema="claro"] .faq details, [data-tema="claro"] .calculadora {
  background: #ffffff; border-color: rgba(15,40,71,0.16); box-shadow: 0 6px 20px rgba(15,40,71,0.08); }
[data-tema="claro"] .banda.vidrio .modulo, [data-tema="claro"] .banda.vidrio .calculadora { background: #f5f8fc; }
[data-tema="claro"] .kpi b, [data-tema="claro"] .calc-resultado .total dt, [data-tema="claro"] .calc-resultado .total dd { color: #0f2847; }
[data-tema="claro"] .pasos li, [data-tema="claro"] .mini li, [data-tema="claro"] .calc-resultado dl > div,
[data-tema="claro"] .tabla-precios th, [data-tema="claro"] .tabla-precios td { border-color: rgba(15,40,71,0.16); }
[data-tema="claro"] .calc-fila input { color: #0f2847; background: #fff; border-color: rgba(15,40,71,0.35); }
[data-tema="claro"] .cita { border-left-color: #c78a00; }
[data-tema="claro"] .calc-banda.error { color: #a12a14; }
[data-tema="claro"] .tabla-precios tr.activa th, [data-tema="claro"] .tabla-precios tr.activa td { background: #fff1c9; }
[data-tema="claro"] a:focus-visible, [data-tema="claro"] button:focus-visible, [data-tema="claro"] summary:focus-visible,
[data-tema="claro"] input:focus-visible { outline-color: #1a5bb8; }
#como .col-txt .foto { margin-top: 28px; }
.banda.azul .nota { color: rgba(255,255,255,0.92); }   /* contraste AA sobre el azul de la banda (axe) */
[data-tema="claro"] .banda.azul .nota { color: #2b3f58; }
#haon .mini li { grid-template-columns: minmax(90px, 150px) 1fr; }   /* "No exhibe respuestas" en un renglón (revisión de Juan, 13-oct) */
