/* normanda.cl — capa de página. Solo composición: todo el color, tipo y
   estado viene de styles.css. Sin dependencias, sin build. */
.site { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.site--tight { max-width: var(--container-tight); }
section[id] { scroll-margin-top: 84px; }

/* ---- encabezado ---- */
.hdr { position: sticky; top: 0; z-index: 50; background: var(--surface-page); border-bottom: var(--border-hair); }
.hdr__in { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); height: 64px; display: flex; align-items: center; gap: var(--space-8); }
.hdr__nav { display: flex; gap: var(--space-6); margin-left: auto; }
.hdr__nav a { font: var(--weight-medium) var(--size-caption)/1 var(--font-text); color: var(--text-muted); border: 0; }
.hdr__nav a:hover { color: var(--text-strong); }
.hdr__act { display: flex; align-items: center; gap: var(--space-3); }
@media (max-width: 900px) { .hdr__nav { display: none; } .hdr__act { margin-left: auto; } }

/* ---- rótulo de sección ---- */
.sec { padding-top: var(--section-y); }
.sec__rule { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: var(--space-4); padding-bottom: var(--space-5); border-bottom: var(--border-heavy); margin-bottom: var(--space-8); }
.sec__no { font: var(--type-folio); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--text-faint); flex: none; }
.sec__t { font-family: var(--font-display); font-weight: var(--weight-bold); font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: var(--lh-title); letter-spacing: var(--track-title); color: var(--text-strong); }
.sec__lead { max-width: var(--measure); font: var(--type-body); color: var(--text-muted); margin-bottom: var(--space-8); }

/* ---- hero ---- */
.hero { padding-top: clamp(2.5rem, 5vw, 4.5rem); padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(310px, 0.72fr); gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.hero__stamp { display: inline-flex; align-items: center; gap: var(--space-2); white-space: nowrap; padding: 5px var(--space-3); border: var(--hairline) solid var(--border-default); border-radius: var(--radius-1); font: var(--type-folio); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--text-muted); margin-bottom: var(--space-6); }
.hero__stamp b { flex: none; color: var(--text-strong); font-weight: var(--weight-semibold); }
.hero h1 { font-family: var(--font-display); font-weight: var(--weight-bold); line-height: 1.04; letter-spacing: -0.024em; font-size: clamp(2rem, 3.9vw, 3.25rem); max-width: 27ch; margin-bottom: var(--space-5); text-wrap: balance; }
.hero h1 em { font-style: normal; color: inherit; box-shadow: inset 0 -0.09em 0 var(--accent); }
.hero__lead { max-width: 58ch; font: var(--type-body); color: var(--text-muted); margin-bottom: var(--space-8); }
.hero__cta { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.hero__fine { margin-top: var(--space-6); padding-top: var(--space-4); border-top: var(--border-hair); font: var(--type-folio); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--text-faint); }
.ficha { display: flex; flex-direction: column; gap: var(--space-5); }
.ficha__row { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding-bottom: var(--space-3); border-bottom: var(--border-hair); }
.ficha__row:last-of-type { border-bottom: 0; padding-bottom: 0; }
.ficha__k { font: var(--type-caption); color: var(--text-muted); }
.ficha__v { font: var(--weight-medium) var(--size-caption)/1 var(--font-mono); color: var(--text-strong); font-variant-numeric: tabular-nums; }
@media (max-width: 860px) { .hero__grid { grid-template-columns: 1fr; } }

/* ---- cifras ---- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--space-8) var(--space-6); padding-bottom: var(--space-10); }
.stats > * { border-left: var(--border-hair); padding-left: var(--space-5); }
.stats > *:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 720px) { .stats > * { border-left: 0; padding-left: 0; } }

/* ---- matriz ---- */
.mtx { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: var(--space-8); align-items: start; }
.mtx__bar { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5) var(--space-6); padding-bottom: var(--space-6); }
.mtx__legend { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.mtx__panel { position: sticky; top: 88px; display: flex; flex-direction: column; gap: var(--space-4); }
.mtx__ql { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.mtx__ql li { display: flex; gap: var(--space-3); font: var(--type-caption); color: var(--text-body); padding-bottom: var(--space-3); border-bottom: var(--border-hair); }
.mtx__ql li:last-child { border-bottom: 0; padding-bottom: 0; }
.mtx__ql .n-folio { flex: none; padding-top: 2px; }
@media (max-width: 900px) { .mtx { grid-template-columns: 1fr; } .mtx__panel { position: static; } }

/* ---- pasos ---- */
.pasos { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-6); counter-reset: paso; }
.paso { position: relative; padding-top: var(--space-6); border-top: var(--border-heavy); }
.paso__no { font: var(--type-folio); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--accent); display: block; margin-bottom: var(--space-3); }
.paso h3 { font: var(--type-title); margin-bottom: var(--space-3); }
.paso p { font: var(--type-caption); color: var(--text-muted); max-width: 34ch; }

/* ---- grupos de instrumentos ---- */
.grupos { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: var(--space-4); }
.grupo { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); border: var(--border-hair); border-radius: var(--radius-2); background: var(--surface-card); }
.grupo__n { font: var(--type-folio); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--text-faint); }
.grupo__t { font: var(--weight-semibold) var(--size-body-sm)/1.3 var(--font-text); color: var(--text-strong); }
.grupo__d { font: var(--type-caption); color: var(--text-muted); }

/* ---- plazo ---- */
.plazo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 0.7fr); gap: var(--space-8); align-items: center; }
.plazo__dias { display: flex; align-items: baseline; gap: var(--space-4); }
.plazo__n { font: var(--weight-black) clamp(3.25rem, 8vw, 5.5rem)/0.9 var(--font-display); letter-spacing: var(--track-display); color: var(--text-strong); font-variant-numeric: tabular-nums; }
.plazo__u { font: var(--weight-medium) var(--size-body)/1.3 var(--font-mono); color: var(--text-muted); max-width: 12ch; }
@media (max-width: 860px) { .plazo { grid-template-columns: 1fr; } }

/* ---- cierre ---- */
.cierre { margin: var(--section-y) 0 var(--space-16); padding: clamp(2.5rem, 6vw, 4.5rem); background: var(--surface-invert); border-radius: var(--radius-3); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-8); align-items: center; }
.cierre h2 { color: var(--text-inverse); font-family: var(--font-display); font-weight: var(--weight-bold); line-height: 1.06; letter-spacing: -0.022em; font-size: clamp(1.625rem, 3.2vw, 2.375rem); max-width: 24ch; }
.cierre p { color: var(--ink-400); font: var(--type-caption); max-width: 44ch; margin-top: var(--space-4); }
.theme-dark .cierre p, [data-theme="dark"] .cierre p { color: var(--ink-600); }
@media (max-width: 780px) { .cierre { grid-template-columns: 1fr; } }

/* ---- pie ---- */
.ftr { border-top: var(--border-hair); margin-top: var(--space-10); padding-top: var(--space-10); padding-bottom: var(--space-16); }
.ftr__in { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-8); }
.ftr__t { font: var(--type-overline); letter-spacing: var(--track-overline); text-transform: uppercase; color: var(--text-faint); margin-bottom: var(--space-3); }
.ftr ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.ftr li, .ftr p { font: var(--type-caption); color: var(--text-muted); }

/* Las cifras de esta fila no miden lo mismo: "116" son tres caracteres y
   "$1.004.270.955" son catorce. Dos correcciones:
   · min-width:0 — sin esto una celda de grid no puede encoger por debajo de su
     contenido, y el monto se sale encima del dato vecino.
   · el monto largo baja un escalón de la escala tipográfica; a igual tamaño que
     un número de tres cifras, no cabe en ninguna columna razonable. */
.stats > * { min-width: 0; }
.stats .n-stat__value { overflow-wrap: anywhere; }
.stats .n-stat__value--largo { font-size: clamp(1.35rem, 2.2vw, 2rem); }