/* Informe técnico prediseñado · Clase 6 NM4. Páginas A4 en pantalla e impresión. */
:root{
  --navy:#12314b;--navy-deep:#0b2235;--teal:#197f78;--gold:#dda826;--red:#b6423b;--green:#4f713f;
  --ink:#172536;--muted:#58697a;--line:#cdd8e2;--soft:#f2f6f8;--fill:#fff7d6;--fill-line:#e2c250;
}
.report{display:flex;flex-direction:column;align-items:center;gap:22px;padding:18px 0 40px}
.page{position:relative;width:min(210mm,100%);min-height:297mm;padding:17mm 16mm 20mm;background:#fff;color:var(--ink);
  font:14.5px/1.5 Inter,Arial,sans-serif;box-shadow:0 10px 30px rgba(18,49,75,.14);border-radius:3px;display:flex;flex-direction:column}
.page p{margin:0 0 10px}
.page h3{margin:16px 0 8px;color:var(--navy);font-size:15.5px}
.page-head{display:flex;justify-content:space-between;gap:12px;margin:-6mm 0 14px;padding-bottom:6px;border-bottom:2px solid var(--navy);
  color:var(--muted);font-size:11px;font-weight:700;letter-spacing:.02em}
.page-foot{display:flex;justify-content:space-between;gap:12px;margin-top:auto;padding-top:8px;border-top:1px solid var(--line);color:var(--muted);font-size:11px}
.sec-title{margin:6px 0 12px;padding:6px 10px;border-left:6px solid var(--teal);background:var(--soft);color:var(--navy);font-size:18px;line-height:1.25}
.note{padding:9px 12px;border-left:4px solid var(--gold);background:#fffbef;color:#5b4a17;font-size:13px}
.credit{margin:4px 0 0;color:var(--muted);font-size:11px}
.credit a,.sources a{color:var(--teal)}

/* Portada */
.cover{padding-top:14mm}
.cover-brand{display:flex;justify-content:space-between;gap:12px;margin-bottom:20px}
.cover-brand > div{display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:800;color:var(--navy)}
.cover-brand small{display:block;font-weight:600;color:var(--muted);font-size:10.5px}
.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:8px;background:var(--navy);color:#fff;font-size:13px;letter-spacing:.04em}
.brand-mark.alt{background:var(--teal)}
.cover-code{margin:0 0 6px;color:var(--teal);font-size:12px;font-weight:900;letter-spacing:.06em}
.cover-title{margin:0 0 8px;color:var(--navy);font:700 30px/1.12 "Source Serif 4",Georgia,serif}
.cover-sub{margin:0 0 14px;color:var(--muted);font-size:15px;font-weight:600}
.cover-img{overflow:hidden;height:88mm;margin-bottom:14px;border-radius:4px}
.cover-img img{width:100%;height:100%;object-fit:cover;display:block}
.case-note{margin-top:12px;color:var(--muted);font-size:11.5px;font-style:italic}

/* Tablas */
.grid,.kv{width:100%;border-collapse:collapse;margin:0 0 12px;font-size:13px}
.grid th,.grid td,.kv th,.kv td{padding:6px 8px;border:1px solid var(--line);vertical-align:top;text-align:left}
.grid thead th{background:var(--navy);color:#fff;font-weight:700;font-size:12px}
.grid tbody tr:nth-child(even) td{background:#f8fafb}
.grid.compact td,.grid.compact th{padding:4px 7px;font-size:12px}
.kv th{width:34%;background:var(--soft);color:var(--navy);font-weight:700}
.scroll-x{overflow-x:auto;-webkit-overflow-scrolling:touch}
.catastro{min-width:560px}
.toc{margin:0 0 10px;padding:0;list-style:none}
.toc li{display:flex;justify-content:space-between;gap:10px;padding:4px 0;border-bottom:1px dotted var(--line)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin-bottom:14px}
.kpis div{padding:12px 10px;border-radius:6px;background:var(--navy);color:#fff;text-align:center}
.kpis b{display:block;font-size:24px;line-height:1.1}
.kpis span{font-size:11.5px;opacity:.85}
.objs{margin:0 0 8px;padding-left:22px}.objs li{margin-bottom:8px}

/* Croquis */
.croquis-wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:14px;align-items:start}
.croquis{width:100%;height:auto;border:1px solid var(--line);border-radius:4px}
.croquis .bg{fill:#f4f1e6}.croquis .g{stroke:#c9c2a8;stroke-width:.8}.croquis .gl{fill:#7a7359;font-size:10px;font-family:Inter,Arial,sans-serif}
.croquis .fr{fill:rgba(182,66,59,.13);stroke:rgba(182,66,59,.55);stroke-dasharray:6 4}
.croquis .ax{stroke:var(--red);stroke-width:2.2}
.croquis .rd{fill:none;stroke:#b39b6b;stroke-width:7;stroke-linecap:round;opacity:.75}
.croquis .sub{fill:#dfe6eb;stroke:#6b7c8c}
.croquis .tw{fill:#fff;stroke:var(--navy);stroke-width:2}.croquis .twx{stroke:var(--navy);stroke-width:1.6}
.croquis .oc{fill:var(--gold);stroke:#7c5510;stroke-width:1.4}
.croquis .tree{fill:#4f713f;stroke:#2f4a24}
.croquis .cone{fill:rgba(25,127,120,.28)}.croquis .phc{fill:var(--teal);stroke:#fff;stroke-width:1.6}
.croquis .phn{fill:#fff;font:800 10px Inter,Arial,sans-serif;text-anchor:middle}
.croquis .lb{fill:var(--navy);font:800 12px Inter,Arial,sans-serif}.croquis .lb.sm{font-size:10px}
.croquis .na{fill:var(--navy)}.croquis .sc{fill:var(--navy)}
.legend ul{margin:0 0 10px;padding:0;list-style:none;font-size:12.5px}
.legend li{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.lg{display:inline-block;flex:0 0 22px;height:12px;border-radius:2px}
.lg.ax{height:3px;background:var(--red)}.lg.fr{background:rgba(182,66,59,.18);border:1px dashed rgba(182,66,59,.6)}
.lg.tw{flex-basis:12px;border:2px solid var(--navy);background:#fff}.lg.oc{flex-basis:14px;background:var(--gold)}
.lg.tree{flex-basis:12px;border-radius:50%;background:#4f713f}.lg.ph{flex-basis:12px;border-radius:50%;background:var(--teal)}
.lg.rd{height:6px;background:#b39b6b}

/* Fotos */
.photos{display:grid;gap:14px}
.photo{margin:0;padding:10px;border:1px solid var(--line);border-radius:5px;background:#fff;break-inside:avoid}
.photo-img{position:relative;overflow:hidden;height:62mm;border-radius:3px;background:var(--soft)}
.photo-img img{width:100%;height:100%;object-fit:cover;display:block}
.stamp{position:absolute;left:8px;top:8px;padding:3px 8px;border-radius:4px;background:rgba(11,34,53,.86);color:#fff;font-size:12px;font-weight:800}
.photo-kv{margin:9px 0 8px;font-size:12px}.photo-kv th{width:28%}
.photo figcaption{font-size:13px}
.photo-kv .fill-inline{display:inline-flex;width:auto;vertical-align:middle;margin:2px 0}.photo-kv .fill-inline input{width:112px}

/* Hallazgos */
.hz{margin:0 0 14px;border:1px solid var(--line);border-radius:5px;overflow:hidden;break-inside:avoid}
.hz header{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:9px 11px;background:var(--navy);color:#fff}
.hz-n{padding:2px 8px;border-radius:4px;background:var(--gold);color:var(--navy);font-size:12px;font-weight:900}
.hz-t{flex:1 1 220px;font-weight:800}
.risk{padding:2px 9px;border-radius:999px;background:rgba(255,255,255,.18);font-size:12px;font-weight:800}
.risk.alto{background:#f3c3bf;color:#7d231d}
.hz-kv{margin:0}.hz-kv th{width:22%}
.howto{padding:11px 13px;border-radius:5px;background:var(--soft);font-size:13px}.howto ul{margin:0;padding-left:18px}
.confirm{margin:0 0 8px;padding-left:20px}
.signs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:10px 0 14px;font-size:12.5px;color:var(--muted)}
.sign-line{margin:34px 0 4px!important;padding-top:6px;border-top:1.5px solid var(--ink);color:var(--ink);font-weight:800}
.map iframe{width:100%;height:62mm;border:1px solid var(--line);border-radius:4px}
.sources{margin:0 0 10px;padding-left:18px;font-size:12.5px}.sources li{margin-bottom:5px}

/* Campos por completar */
.fill{margin:8px 0 12px;padding:10px 11px;border:2px dashed var(--fill-line);border-radius:6px;background:var(--fill)}
.fill label{display:block;margin-bottom:6px;color:var(--navy);font-weight:800;font-size:13.5px}
.fill-tag{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:4px;background:var(--gold);color:var(--navy);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.fill textarea,.fill input,.fill select,.fill-inline input,.fill-inline select{width:100%;padding:9px 10px;border:1.5px solid #c9b25a;border-radius:5px;background:#fff;color:var(--ink);font:15px/1.45 Inter,Arial,sans-serif}
.fill textarea{resize:vertical;min-height:84px}
.fill-help{display:block;margin-top:5px;color:#6b5a1c;font-size:12px}
.fill-inline{display:inline-flex;align-items:center;gap:6px;width:100%;padding:3px;border-radius:5px;background:var(--fill);outline:2px dashed var(--fill-line)}
.fill-inline input,.fill-inline select{padding:6px 8px;font-size:14px}
.unit{flex:0 0 auto;color:var(--muted);font-weight:700;font-size:12.5px}
.fill.ok,.fill-inline.ok{border-color:#9cc3a0;outline-color:#9cc3a0;background:#f1f8f1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fill-ro-block .fill-label{display:block;color:var(--muted);font-size:11.5px;font-weight:700}
.fill-value{white-space:pre-wrap}
.missing{color:var(--red);font-weight:700;font-style:italic}
.fill-ro.empty{color:var(--red)}

@media (max-width:760px){
  .page{min-height:0;padding:16px 14px 18px;font-size:14.5px;border-radius:0}
  .page-head{margin:0 0 12px;flex-direction:column;gap:2px}
  .kpis{grid-template-columns:1fr 1fr}
  .croquis-wrap,.signs{grid-template-columns:1fr}
  .cover-brand{flex-direction:column}
  .cover-img{height:200px}.photo-img{height:210px}
  .cover-title{font-size:25px}
  .kv th{width:38%}
}
@media print{
  @page{size:A4;margin:0}
  body{background:#fff!important}
  .report{gap:0;padding:0}
  .page{width:210mm;height:297mm;min-height:0;box-shadow:none;border-radius:0;overflow:hidden;break-after:page;page-break-after:always}
  .page:last-child{break-after:auto;page-break-after:auto}
  .fill{background:#fff;border:1px solid var(--line)}
  .fill-help,.fill-tag{display:none}
  .fill-inline{background:none;outline:none}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
