/* =====================================================================
   DOSSIER TECFOCON · estilos de impresión
   Mismos tokens que styles.css de la web (colores, Manrope, radios,
   botones, eyebrows) trasladados a milímetros y puntos.
   Coordenadas: todo se posiciona dentro de .trim (210 × 297 mm).
   Lo que va «a sangre» se extiende con var(--b) fuera del corte.
   ===================================================================== */

@font-face { font-family: 'Manrope'; font-weight: 400; src: url('../fonts/manrope-400.woff') format('woff'); }
@font-face { font-family: 'Manrope'; font-weight: 600; src: url('../fonts/manrope-600.woff') format('woff'); }
@font-face { font-family: 'Manrope'; font-weight: 700; src: url('../fonts/manrope-700.woff') format('woff'); }
@font-face { font-family: 'Manrope'; font-weight: 800; src: url('../fonts/manrope-800.woff') format('woff'); }

:root {
  --ink: #0e0e0f;
  --ink-2: #3a3a3e;
  --muted: #6c6c71;
  --line: #e6e5e2;
  --soft: #f4f3f0;
  --paper: #ffffff;
  --lima: #8bc148;
  --verde: #007044;
  --bosque: #053e23;
  --verde-soft: #eef6e4;

  --b: 0mm;            /* sangrado: 0 (digital) · 3mm (imprenta) — lo fija el generador */
  --m: 16mm;           /* margen de seguridad interior */
  --r: 6mm;            /* radio de las fotos (equivale a --r-xl de la web) */
  --r-s: 3.5mm;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { background: #fff; }
body {
  font-family: 'Manrope', sans-serif;
  color: var(--ink);
  font-size: 9.6pt;
  line-height: 1.55;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
  font-kerning: normal;
  text-rendering: geometricPrecision;
}
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
h1, h2, h3 { font-weight: 600; letter-spacing: -.035em; line-height: 1.02; }

/* ------------------------------------------------------------- páginas */
.page {
  position: relative;
  width: calc(210mm + 2 * var(--b));
  height: calc(297mm + 2 * var(--b));
  overflow: hidden;
  break-after: page;
  background: var(--paper);
}
.page:last-child { break-after: auto; }
.page--ink { background: var(--ink); color: #fff; }
.page--soft { background: var(--soft); }
.trim { position: absolute; left: var(--b); top: var(--b); width: 210mm; height: 297mm; }

/* Elementos a sangre: .fb cubre toda la página con su sangrado */
.fb { position: absolute; top: calc(-1 * var(--b)); left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); bottom: calc(-1 * var(--b)); }

/* ------------------------------------------------------------- fotos */
.foto { position: relative; overflow: hidden; background: #26262a; }
.foto > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.foto--r { border-radius: var(--r); }
.foto.fb, .fb > .foto { position: absolute; }
.tile .foto, .se__t .foto { position: absolute; }
/* Sin archivo: el mismo fondo de reserva que usa la web (.is-fallback) */
.foto--falta {
  background:
    radial-gradient(120% 90% at 85% 10%, rgba(0, 112, 68, .45), transparent 55%),
    linear-gradient(160deg, #2b2b30, #151517);
}
.foto__falta {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 78%; max-width: 120mm; text-align: center;
  color: rgba(255, 255, 255, .55); font-size: 6.6pt; line-height: 1.45; letter-spacing: .02em;
  border: .25mm dashed rgba(255, 255, 255, .28); border-radius: 2.5mm; padding: 2.4mm 3mm;
}
.foto__falta b { display: block; color: rgba(255, 255, 255, .8); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: 5.8pt; margin-bottom: .6mm; }
.pie-foto {
  position: absolute; left: 4mm; bottom: 4mm;
  display: inline-flex; align-items: center; gap: 1.8mm;
  padding: 1.5mm 3.2mm; border-radius: 99px;
  background: rgba(14, 14, 15, .55); color: #fff; border: .2mm solid rgba(255, 255, 255, .25);
  font-size: 6.8pt; font-weight: 600;
}
.pie-foto::before { content: ''; width: 1.6mm; height: 1.6mm; border-radius: 50%; background: var(--lima); }

/* ------------------------------------------------------------- logotipo */
.logo { display: inline-flex; align-items: center; gap: 2.4mm; font-weight: 800; letter-spacing: .08em; font-size: 10.5pt; line-height: 1; }
.logo svg { width: 6.2mm; height: 6.2mm; flex: none; }
.logo--l { font-size: 15pt; gap: 3.2mm; }
.logo--l svg { width: 9mm; height: 9mm; }
.logo--blanco { color: #fff; }

/* ------------------------------------------------------------- tipografía */
.eyebrow { display: inline-flex; align-items: center; gap: 2mm; font-size: 6.6pt; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); line-height: 1.2; }
.eyebrow::before { content: ''; width: 1.5mm; height: 1.5mm; border-radius: .45mm; background: currentColor; flex: none; }
.eyebrow--verde { color: var(--verde); }
.eyebrow--lima { color: var(--lima); }
.eyebrow--blanco { color: rgba(255, 255, 255, .75); }

.h-xxl { font-size: 54pt; letter-spacing: -.048em; line-height: .96; }
.h-xl { font-size: 40pt; letter-spacing: -.045em; line-height: .98; }
.h-l { font-size: 29pt; letter-spacing: -.04em; line-height: 1.02; }
.h-m { font-size: 19pt; letter-spacing: -.03em; line-height: 1.08; }
.h-s { font-size: 11.2pt; letter-spacing: -.015em; line-height: 1.2; font-weight: 700; }
.lead { font-size: 11.6pt; line-height: 1.5; color: var(--ink-2); }
.lead--blanco { color: rgba(255, 255, 255, .8); }
.txt { font-size: 9.4pt; line-height: 1.6; color: var(--ink-2); }
.txt--blanco { color: rgba(255, 255, 255, .72); }
.muted { color: var(--muted); }
.num { font-weight: 800; color: var(--verde); font-size: 7.4pt; letter-spacing: .08em; }
.num--lima { color: var(--lima); }
.gris { color: #a5a5aa; }

/* ------------------------------------------------------------- botones (como .btn de la web) */
.acciones { display: flex; flex-wrap: wrap; gap: 2.4mm; align-items: center; }
.btn {
  display: inline-flex; align-items: center; gap: 2.6mm;
  height: 11mm; padding: 0 5mm; border-radius: 99px;
  font-size: 8.8pt; font-weight: 600; white-space: nowrap; border: .25mm solid transparent;
}
.btn--dot { padding-right: 1.4mm; }
.btn__dot { display: grid; place-items: center; width: 8.2mm; height: 8.2mm; border-radius: 50%; background: var(--lima); color: var(--bosque); }
.btn__dot svg { width: 3.4mm; height: 3.4mm; }
.btn--light { background: #fff; color: var(--ink); }
.btn--dark { background: var(--ink); color: #fff; }
.btn--accent { background: var(--verde); color: #fff; }
.btn--glass { background: rgba(255, 255, 255, .1); color: #fff; border-color: rgba(255, 255, 255, .32); }
.btn--outline { background: transparent; color: var(--ink); border-color: #cfcfcc; }

.chip { display: inline-flex; align-items: center; gap: 1.8mm; padding: 1.5mm 3.4mm; border-radius: 99px; font-size: 7pt; font-weight: 600; line-height: 1.3; }
.chip--glass { background: rgba(255, 255, 255, .14); color: #fff; border: .2mm solid rgba(255, 255, 255, .3); }
.chip--soft { background: var(--soft); color: var(--ink); }
.chip--verde { background: var(--verde-soft); color: var(--bosque); }
.chip--line { border: .25mm solid var(--line); color: var(--ink-2); }
.chip__dot { width: 1.7mm; height: 1.7mm; border-radius: 50%; background: var(--lima); box-shadow: 0 0 0 .9mm rgba(139, 193, 72, .35); }

.crumbs { display: flex; gap: 2mm; font-size: 7.6pt; color: rgba(255, 255, 255, .68); font-weight: 500; }
.crumbs span:last-child { color: rgba(255, 255, 255, .92); }

/* ------------------------------------------------------------- cabecera y pie (familia de la propuesta PDF) */
.cab { position: absolute; left: var(--m); right: var(--m); top: 10.5mm; display: flex; align-items: center; justify-content: space-between; }
.cab__r { font-size: 6.4pt; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.cab--blanco .cab__r { color: #fff; }
.cab .logo { font-size: 8pt; gap: 1.8mm; }
.cab .logo svg { width: 4.6mm; height: 4.6mm; }

.pie { position: absolute; left: var(--m); right: var(--m); bottom: 9mm; display: flex; align-items: center; gap: 3mm; font-size: 6.4pt; color: var(--muted); }
.pie__barra { width: 6.4mm; height: .7mm; background: var(--verde); border-radius: 1px; }
.pie__n { margin-left: auto; font-weight: 700; color: var(--ink); letter-spacing: .04em; }
.pie__n i { font-style: normal; font-weight: 500; color: var(--muted); }
.pie--blanco { color: rgba(255, 255, 255, .62); }
.pie--blanco .pie__barra { background: var(--lima); }
.pie--blanco .pie__n { color: #fff; }
.pie--blanco .pie__n i { color: rgba(255, 255, 255, .55); }

.regla { height: .25mm; background: var(--line); }
.regla--blanco { background: rgba(255, 255, 255, .16); }

/* ------------------------------------------------------------- listas de especialidades */
.esp { display: grid; gap: 0; }
.esp li { display: grid; grid-template-columns: 9mm 1fr; column-gap: 2mm; padding: 3.6mm 0; border-top: .25mm solid var(--line); }
.esp li:last-child { border-bottom: .25mm solid var(--line); }
.esp .num { padding-top: 1mm; }
.esp h3 { font-size: 11.6pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.esp p { margin-top: 1.2mm; font-size: 8.8pt; color: var(--ink-2); line-height: 1.5; }
.esp .tags { margin-top: 2.2mm; display: flex; flex-wrap: wrap; gap: 1.4mm; }
.esp--blanco li { border-color: rgba(255, 255, 255, .16) !important; }
.esp--blanco p { color: rgba(255, 255, 255, .7); }

.checks { display: grid; gap: 2.4mm; }
.checks li { display: flex; gap: 2.6mm; align-items: flex-start; font-size: 9.2pt; font-weight: 500; }
.checks li::before { content: ''; flex: none; margin-top: 1.4mm; width: 2mm; height: 2mm; border-radius: .6mm; background: var(--lima); }

.nota { display: flex; gap: 2.6mm; align-items: flex-start; font-size: 7.6pt; line-height: 1.5; color: var(--muted); }
.nota::before { content: 'i'; flex: none; display: grid; place-items: center; width: 4mm; height: 4mm; border-radius: 50%; border: .25mm solid currentColor; font-size: 6pt; font-weight: 800; line-height: 1; }

.focus { border-radius: var(--r); background: var(--verde-soft); padding: 6mm 6.4mm; }
.focus__k { font-size: 6.6pt; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--verde); }
.focus p { margin-top: 2mm; font-size: 12.4pt; line-height: 1.32; font-weight: 600; letter-spacing: -.02em; color: var(--bosque); }

/* ------------------------------------------------------------- QR y contacto */
.qr { background: #fff; border-radius: var(--r-s); padding: 3mm; width: 33mm; height: 33mm; }
.qr svg { width: 100%; height: 100%; display: block; }
.qr--falta { display: grid; place-items: center; text-align: center; border: .3mm dashed #b8b8b8; background: rgba(255,255,255,.06); color: rgba(255,255,255,.75); font-size: 6.4pt; line-height: 1.35; font-weight: 600; padding: 3mm; }
.pendiente { display: inline-block; padding: .4mm 2mm; border-radius: 1.2mm; border: .25mm dashed #e9a23b; color: #f0b562; font-size: .82em; font-weight: 700; letter-spacing: .04em; }
.page:not(.page--ink) .pendiente { color: #a45d00; border-color: #d48a1c; }

/* =====================================================================
   COMPOSICIONES
   ===================================================================== */

/* ---------- 01 · Portada */
.cover__grad { background: linear-gradient(180deg, rgba(14,14,15,.62) 0%, rgba(14,14,15,.08) 26%, rgba(14,14,15,0) 42%, rgba(14,14,15,.5) 62%, rgba(14,14,15,.94) 100%); }
.cover__top { position: absolute; left: var(--m); right: var(--m); top: 15mm; display: flex; justify-content: space-between; align-items: center; }
.cover__body { position: absolute; left: var(--m); right: var(--m); bottom: 24mm; color: #fff; }
.cover__body .h-xxl { font-size: 60pt; margin-top: 6mm; }
.cover__sub { margin-top: 7mm; font-size: 15pt; font-weight: 600; letter-spacing: -.02em; color: #fff; }
.cover__amb { margin-top: 9mm; padding-top: 5mm; border-top: .25mm solid rgba(255, 255, 255, .22); display: flex; gap: 0; font-size: 7.6pt; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: rgba(255, 255, 255, .78); }
.cover__amb span + span::before { content: '·'; margin: 0 3.2mm; color: var(--lima); }

/* ---------- 02 · Presentación */
.pres__foto { position: absolute; top: calc(-1 * var(--b)); left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); height: calc(120mm + var(--b)); }
.pres__foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.68), rgba(14,14,15,0) 28%); }
.pres__cab { z-index: 2; }
.pres__head { position: absolute; left: var(--m); right: var(--m); top: 132mm; }
.pres__head .h-xl { margin-top: 4.5mm; font-size: 34pt; max-width: 170mm; }
.pres__head .lead { margin-top: 5mm; max-width: 150mm; }
.pres__cols { position: absolute; left: var(--m); right: var(--m); top: 206mm; display: grid; grid-template-columns: 1.15fr 1fr; gap: 10mm; }
.pres__cols .txt + .txt { margin-top: 2.4mm; }
.pres__quote { margin-top: 5mm; padding-left: 4mm; border-left: .9mm solid var(--lima); font-size: 10.6pt; font-weight: 600; letter-spacing: -.015em; line-height: 1.35; }
.pres__cli { display: flex; flex-wrap: wrap; gap: 1.8mm; margin-top: 3.4mm; }
.pres__cli .chip { font-size: 7.6pt; padding: 1.9mm 3.6mm; }
.pres__nota { margin-top: 5mm; }

/* ---------- 03 · Índice de soluciones */
.idx__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; display: grid; grid-template-columns: 1.35fr 1fr; gap: 10mm; align-items: end; }
.idx__head .h-l { margin-top: 4mm; font-size: 27pt; }
.idx__grid { position: absolute; left: var(--m); right: var(--m); top: 88mm; height: 158mm; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); gap: 3.4mm; }
.tile { position: relative; border-radius: var(--r); overflow: hidden; color: #fff; }
.tile .foto { position: absolute; inset: 0; }
.tile::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.1) 20%, rgba(14,14,15,.9) 100%); }
.tile__in { position: absolute; z-index: 2; left: 4.6mm; right: 4.6mm; bottom: 4.2mm; }
.tile__n { position: absolute; z-index: 2; left: 4.6mm; top: 4.2mm; }
.tile__p { position: absolute; z-index: 2; right: 4.2mm; top: 4mm; }
.tile h3 { font-size: 13pt; font-weight: 700; letter-spacing: -.025em; line-height: 1.1; }
.tile p { margin-top: 1.2mm; font-size: 7.4pt; line-height: 1.42; color: rgba(255, 255, 255, .8); }
.idx__coord { position: absolute; left: var(--m); right: var(--m); top: 250mm; height: 22mm; border-radius: var(--r); background: var(--ink); color: #fff; display: flex; align-items: center; gap: 6mm; padding: 0 6mm; }
.idx__coord h3 { font-size: 12pt; font-weight: 700; letter-spacing: -.02em; }
.idx__coord p { font-size: 8pt; color: rgba(255, 255, 255, .7); line-height: 1.45; }
.idx__coord .tile__p { position: static; margin-left: auto; }

/* ---------- Portada de servicio (como .page-hero de las fichas) */
.sc__grad { background: linear-gradient(180deg, rgba(14,14,15,.55) 0%, rgba(14,14,15,0) 22%, rgba(14,14,15,0) 50%, rgba(14,14,15,.35) 100%); }
.sc__top { position: absolute; left: var(--m); right: var(--m); top: 15mm; display: flex; justify-content: space-between; align-items: center; }
.sc__card {
  position: absolute; left: 12mm; right: 12mm; bottom: 12mm;
  background: var(--ink); color: #fff; border-radius: 7mm;
  padding: 13mm 13mm 12mm; display: grid; gap: 5.4mm; justify-items: start;
}
.sc__card .h-xl { font-size: 44pt; max-width: 165mm; }
.sc__card .lead { max-width: 150mm; font-size: 11.4pt; }
.sc__big { position: absolute; right: 13mm; top: 11mm; font-size: 46pt; font-weight: 800; letter-spacing: -.05em; line-height: 1; color: rgba(255, 255, 255, .1); }
.sc__specs { display: flex; flex-wrap: wrap; gap: 1.6mm; margin-top: -1mm; }
.sc__specs .chip { background: rgba(255, 255, 255, .08); color: rgba(255,255,255,.88); border: .2mm solid rgba(255,255,255,.16); }

/* ---------- Interior A · mantenimiento: titular + lista + dos fotos */
.ia__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; }
.ia__head .h-l { margin-top: 4mm; max-width: 165mm; }
.ia__cols { position: absolute; left: var(--m); right: var(--m); top: 70mm; display: grid; grid-template-columns: 62mm 1fr; gap: 10mm; }
.ia__fotos { position: absolute; left: var(--m); right: var(--m); top: 209mm; height: 63mm; display: grid; grid-template-columns: 1.55fr 1fr; gap: 3.4mm; }

/* ---------- Interior B · electricidad: foto grande arriba + checks */
.ib__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); top: calc(-1 * var(--b)); height: calc(116mm + var(--b)); }
.ib__foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.68), rgba(14,14,15,0) 26%); }
.ib__body { position: absolute; left: var(--m); right: var(--m); top: 127mm; display: grid; grid-template-columns: 1fr 64mm; gap: 10mm; }
.ib__body .h-l { margin-top: 4mm; font-size: 26pt; }
.ib__side { display: grid; gap: 3.4mm; align-content: start; }
.ib__side .foto { height: 50mm; }

/* ---------- Interior C · climatización: foto vertical + rejilla 2×3 */
.ic__foto { position: absolute; left: calc(-1 * var(--b)); top: calc(-1 * var(--b)); bottom: calc(-1 * var(--b)); width: calc(70mm + var(--b)); }
.ic__main { position: absolute; left: 82mm; right: var(--m); top: 26mm; }
.ic__main .h-l { margin-top: 4mm; font-size: 25pt; }
.ic__grid { margin-top: 8mm; display: grid; grid-template-columns: 1fr 1fr; column-gap: 6mm; }
.ic__grid li { padding: 4mm 0 4.4mm; border-top: .25mm solid var(--line); }
.ic__grid h3 { margin-top: 1.2mm; font-size: 10.6pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.ic__grid p { margin-top: 1.2mm; font-size: 8.2pt; color: var(--ink-2); line-height: 1.48; }
.ic__mini { margin-top: 2mm; height: 46mm; }

/* ---------- Interior D · adecuación: texto arriba, foto a sangre inferior */
.id__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.id__head .h-l { margin-top: 4mm; font-size: 26pt; }
.id__grid { position: absolute; left: var(--m); right: var(--m); top: 98mm; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4.4mm; }
.id__grid li { border-top: .9mm solid var(--ink); padding-top: 3.4mm; }
.id__grid h3 { margin-top: 2mm; font-size: 10.4pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.id__grid p { margin-top: 1.6mm; font-size: 7.9pt; line-height: 1.5; color: var(--ink-2); }
.id__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); bottom: calc(-1 * var(--b)); height: calc(138mm + var(--b)); }

/* ---------- Interior E · telecom: página oscura tipográfica */
.ie__head { position: absolute; left: var(--m); right: var(--m); top: 28mm; }
.ie__head .h-xl { margin-top: 5mm; font-size: 42pt; max-width: 170mm; }
.ie__head .lead { margin-top: 6mm; max-width: 140mm; }
.ie__grid { position: absolute; left: var(--m); right: var(--m); top: 128mm; display: grid; grid-template-columns: 1fr 1fr; gap: 0 10mm; }
.ie__grid li { padding: 6mm 0 6.4mm; border-top: .25mm solid rgba(255, 255, 255, .16); }
.ie__grid .k { font-size: 26pt; font-weight: 800; letter-spacing: -.05em; color: var(--lima); line-height: 1; }
.ie__grid h3 { margin-top: 3mm; font-size: 13pt; font-weight: 700; letter-spacing: -.02em; }
.ie__grid p { margin-top: 1.6mm; font-size: 8.8pt; line-height: 1.5; color: rgba(255, 255, 255, .7); }
.ie__banda { position: absolute; left: var(--m); right: var(--m); bottom: 22mm; height: 30mm; }

/* ---------- Interior F · accesos: rejilla 2×2 + foto lateral */
.if__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; }
.if__head .h-l { margin-top: 4mm; font-size: 27pt; max-width: 150mm; }
.if__head .lead { margin-top: 4mm; max-width: 150mm; font-size: 10.6pt; }
.if__grid { position: absolute; left: var(--m); width: 98mm; top: 104mm; display: grid; gap: 0; }
.if__foto { position: absolute; right: calc(-1 * var(--b)); top: 104mm; bottom: calc(-1 * var(--b)); width: calc(84mm + var(--b)); border-top-left-radius: var(--r); }

/* ---------- Coordinados */
.co__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); top: calc(-1 * var(--b)); height: calc(150mm + var(--b)); }
.co__foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.65) 0%, rgba(14,14,15,0) 22%, rgba(14,14,15,.15) 38%, rgba(14,14,15,.88) 100%); }
.co__over { position: absolute; left: var(--m); right: var(--m); top: 88mm; color: #fff; }
.co__over .h-xl { margin-top: 4mm; font-size: 40pt; }
.co__body { position: absolute; left: var(--m); right: var(--m); top: 160mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.co__flujo { margin-top: 5mm; border-radius: var(--r); background: var(--soft); padding: 5.4mm; }
.co__flujo .f { margin-top: 3.4mm; display: flex; flex-wrap: wrap; align-items: center; gap: 1.4mm; }
.co__flujo .f .chip { background: #fff; border: .25mm solid var(--line); font-size: 7.4pt; padding: 1.6mm 3mm; }
.co__flujo .f .fl { color: var(--verde); font-weight: 800; font-size: 8pt; }
.co__vals li { display: grid; grid-template-columns: 9mm 1fr; padding: 4.4mm 0; border-top: .25mm solid var(--line); }
.co__vals li:last-child { border-bottom: .25mm solid var(--line); }
.co__vals h3 { font-size: 11.4pt; font-weight: 700; letter-spacing: -.02em; }
.co__vals p { margin-top: 1mm; font-size: 8.6pt; color: var(--ink-2); line-height: 1.5; }

/* ---------- Sectores */
.se__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; display: flex; justify-content: space-between; align-items: end; gap: 10mm; }
.se__head .h-xl { margin-top: 4mm; font-size: 38pt; }
.se__head .txt { max-width: 66mm; }
.se__grid { position: absolute; left: var(--m); right: var(--m); top: 74mm; bottom: 22mm; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; gap: 3.4mm; }
.se__t { position: relative; border-radius: var(--r); overflow: hidden; color: #fff; }
.se__t .foto { position: absolute; inset: 0; }
.se__t--foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,0) 25%, rgba(14,14,15,.9) 100%); }
.se__t--lima { background: var(--lima); color: var(--bosque); }
.se__t--ink { background: var(--ink); }
.se__t--soft { background: var(--verde-soft); color: var(--bosque); }
.se__in { position: absolute; z-index: 2; left: 5mm; right: 5mm; bottom: 4.6mm; }
.se__in h3 { font-size: 14pt; font-weight: 700; letter-spacing: -.025em; line-height: 1.1; }
.se__in p { margin-top: 1.4mm; font-size: 7.8pt; line-height: 1.45; opacity: .85; }
.se__ico { position: absolute; z-index: 2; left: 5mm; top: 4.6mm; width: 9mm; height: 9mm; border-radius: 2.6mm; display: grid; place-items: center; background: rgba(255, 255, 255, .16); }
.se__t--lima .se__ico { background: rgba(5, 62, 35, .1); }
.se__ico svg { width: 4.8mm; height: 4.8mm; }

/* ---------- Mantenimiento recurrente (como .maint de la web, bloque oscuro) */
.mr__foto { position: absolute; left: var(--m); right: var(--m); top: 26mm; height: 98mm; }
.mr__chip { position: absolute; left: 5mm; top: 5mm; z-index: 2; }
.mr__head { position: absolute; left: var(--m); right: var(--m); top: 136mm; display: grid; grid-template-columns: 1.2fr 1fr; gap: 10mm; align-items: end; }
.mr__head .h-xl { margin-top: 4mm; font-size: 36pt; }
.mr__list { position: absolute; left: var(--m); right: var(--m); top: 196mm; }
.mr__list ol { margin-top: 4mm; display: grid; grid-template-columns: 1fr 1fr; gap: 0 10mm; }
.mr__list li { display: grid; grid-template-columns: 9mm 1fr; padding: 4.2mm 0; border-top: .25mm solid rgba(255, 255, 255, .16); }
.mr__list h3 { font-size: 10.8pt; font-weight: 700; letter-spacing: -.02em; }
.mr__list p { margin-top: 1mm; font-size: 8.3pt; color: rgba(255, 255, 255, .68); line-height: 1.48; }
.mr__cta { position: absolute; left: var(--m); right: var(--m); bottom: 22mm; display: flex; align-items: center; justify-content: space-between; gap: 6mm; }

/* ---------- Proyectos (solo si hay proyectos reales en datos.json) */
.pj__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; }
.pj__grid { position: absolute; left: var(--m); right: var(--m); top: 62mm; bottom: 22mm; display: grid; gap: 6mm; }
.pj__item { display: grid; grid-template-rows: 1fr auto; gap: 3.4mm; }
.pj__item .foto { min-height: 0; }

/* ---------- Cómo trabajamos */
.pr__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; }
.pr__head .h-xl { margin-top: 4mm; font-size: 36pt; max-width: 170mm; }
.pr__steps { position: absolute; left: var(--m); right: var(--m); top: 82mm; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6mm; }
.pr__steps li { border-top: .9mm solid var(--ink); padding-top: 4mm; }
.pr__steps .k { font-size: 30pt; font-weight: 800; letter-spacing: -.05em; color: var(--verde); line-height: 1; }
.pr__steps h3 { margin-top: 4mm; font-size: 11.4pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.pr__steps p { margin-top: 1.8mm; font-size: 8.4pt; line-height: 1.52; color: var(--ink-2); }
.pr__foto { position: absolute; left: var(--m); right: var(--m); top: 146mm; height: 96mm; }
.pr__card { position: absolute; z-index: 2; right: 5mm; bottom: 5mm; width: 74mm; background: #fff; border-radius: 4.5mm; padding: 5.4mm; }
.pr__card .h-s { margin-bottom: 3mm; }
.pr__card .checks li { font-size: 8.4pt; }
.pr__comp { position: absolute; left: var(--m); right: var(--m); top: 248mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.pr__comp h3 { font-size: 10pt; font-weight: 700; letter-spacing: -.015em; }
.pr__comp p { margin-top: .8mm; font-size: 8.2pt; color: var(--ink-2); line-height: 1.48; }

/* ---------- Contraportada */
.bk__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); top: calc(-1 * var(--b)); height: calc(150mm + var(--b)); }
.bk__foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.5) 0%, rgba(14,14,15,0) 25%, rgba(14,14,15,.2) 60%, var(--ink) 100%); }
.bk__body { position: absolute; left: var(--m); right: var(--m); top: 118mm; }
.bk__body .h-xxl { font-size: 50pt; max-width: 175mm; }
.bk__body .lead { margin-top: 6mm; max-width: 140mm; }
.bk__vent { margin-top: 5mm; display: flex; flex-wrap: wrap; gap: 1.8mm; }
.bk__cta { margin-top: 7mm; }
.bk__contacto { position: absolute; left: var(--m); right: var(--m); top: 222mm; display: grid; grid-template-columns: 1fr 1fr 33mm; gap: 8mm; padding-top: 6mm; border-top: .25mm solid rgba(255, 255, 255, .16); }
.bk__dato { display: grid; gap: .6mm; margin-bottom: 4mm; }
.bk__dato .k { font-size: 6.4pt; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: rgba(255, 255, 255, .5); }
.bk__dato .v { font-size: 10.6pt; font-weight: 600; letter-spacing: -.01em; color: #fff; }
.bk__qr { display: grid; gap: 2mm; justify-items: start; }
.bk__qr small { font-size: 6.4pt; color: rgba(255, 255, 255, .6); line-height: 1.35; }
.bk__fin { position: absolute; left: var(--m); right: var(--m); bottom: 10mm; display: flex; justify-content: space-between; align-items: center; font-size: 6.2pt; color: rgba(255, 255, 255, .5); }

/* ---------- logotipo subido desde el editor */
.logo__img { display: block; height: 7mm; width: auto; max-width: 48mm; object-fit: contain; }
.logo--l .logo__img { height: 10mm; max-width: 64mm; }
.cab .logo__img { height: 5.2mm; max-width: 38mm; }

/* =====================================================================
   PARTICULARES · composiciones añadidas (misma retícula y tokens)
   ===================================================================== */

/* ---------- Área de una sola página (Mantenimiento del hogar) */
.au__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); top: calc(-1 * var(--b)); height: calc(162mm + var(--b)); }
.au__foto::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(14,14,15,.6) 0%, rgba(14,14,15,0) 22%, rgba(14,14,15,.45) 48%, rgba(14,14,15,.92) 100%); }
.au__over { position: absolute; left: var(--m); right: var(--m); top: 92mm; color: #fff; display: grid; gap: 4.4mm; justify-items: start; }
.au__over .h-xl { font-size: 44pt; }
.au__over .lead { max-width: 150mm; }
.au__body { position: absolute; left: var(--m); right: var(--m); top: 174mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.au__body .h-l { margin-top: 4mm; font-size: 23pt; }

/* ---------- Soluciones combinadas · página A */
.ne__head { position: absolute; left: var(--m); right: var(--m); top: 26mm; }
.ne__head .h-xl { margin-top: 4mm; font-size: 36pt; max-width: 175mm; }
.ne__foto { position: absolute; left: calc(-1 * var(--b)); right: calc(-1 * var(--b)); top: 80mm; height: 128mm; }
.ne__card { position: absolute; z-index: 2; left: var(--m); bottom: 8mm; width: 112mm; background: #fff; border-radius: 5mm; padding: 6mm 6.4mm; display: grid; gap: 2mm; }
.ne__card .h-m { margin-top: .6mm; }
.ne__flujo { margin-top: 1.4mm; padding: 0; background: none; }
.ne__flujo .f { margin-top: 1mm; }
.ne__body { position: absolute; left: var(--m); right: var(--m); top: 218mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.ne__body .co__vals li { padding: 3.2mm 0; }

/* ---------- Soluciones combinadas · página B */
.ne__casos { position: absolute; left: var(--m); right: var(--m); top: 26mm; display: grid; gap: 8mm; }
.ne__caso { display: grid; grid-template-columns: 1.15fr 1fr; gap: 8mm; height: 96mm; }
.ne__caso:nth-child(2) { grid-template-columns: 1fr 1.15fr; }
.ne__caso:nth-child(2) .foto { order: 2; }
.ne__txt { display: grid; align-content: center; gap: 2.4mm; }
.ne__txt .h-l { font-size: 25pt; }
.ne__banda { position: absolute; left: var(--m); right: var(--m); bottom: 20mm; height: 34mm; border-radius: var(--r); background: var(--ink); color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 6mm; padding: 0 7mm; }
.ne__banda p { margin-top: 2mm; font-size: 15pt; font-weight: 600; letter-spacing: -.025em; line-height: 1.15; max-width: 105mm; }

/* ---------- Cómo trabajamos · cinco pasos */
.pl__steps { position: absolute; left: var(--m); width: 96mm; top: 80mm; }
.pl__steps li { display: grid; grid-template-columns: 15mm 1fr; padding: 4.2mm 0; border-top: .25mm solid var(--line); }
.pl__steps li:last-child { border-bottom: .25mm solid var(--line); }
.pl__steps .k { font-size: 17pt; font-weight: 800; letter-spacing: -.05em; color: var(--verde); line-height: 1; }
.pl__steps h3 { font-size: 11.2pt; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.pl__steps p { margin-top: 1.2mm; font-size: 8.4pt; line-height: 1.5; color: var(--ink-2); }
.pl__foto { position: absolute; left: 120mm; right: calc(-1 * var(--b)); top: 80mm; height: 160mm; }
.pl__foto .foto--r { border-radius: var(--r) 0 0 var(--r); }
.pl__foto .pr__card { left: 5mm; right: 5mm; width: auto; }
.pl__pie { position: absolute; left: var(--m); right: var(--m); top: 248mm; display: grid; grid-template-columns: 1fr 1fr; gap: 10mm; }
.pl__pie h3 { font-size: 10pt; font-weight: 700; letter-spacing: -.015em; }
.pl__pie p { margin-top: .8mm; font-size: 8.2pt; color: var(--ink-2); line-height: 1.48; }
.pl__pie .pres__cli { margin-top: 2mm; }

/* Interior F con pocas especialidades: el bloque sube junto al titular */
.if--corto .if__grid, .if--corto .if__foto { top: 80mm; }

.co__flujo .f .fl { display: inline-grid; place-items: center; }
.co__flujo .f .fl svg { width: 2.6mm; height: 2.6mm; }