/* Central de Recursos Digitales — Colombia. Estilos (claro + oscuro, accesible). */

:root {
  color-scheme: light dark;
  --font-sans: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;

  --ink:#12241d; --green:#157150; --green-deep:#0d3b2c; --lime:#d7ef5e; --coral:#e6603f;
  --bg:#f7f8f5; --surface:#ffffff; --surface-2:#f0f3ee; --line:#dce3dd; --line-soft:#e8ede8;
  --fg:#17241f; --fg-muted:#5c6b63; --fg-faint:#7c8880;
  --ok:#1c7a4f; --ok-bg:#e6f4ec; --warn:#8a5a08; --warn-bg:#fbf0d6; --bad:#a23324; --bad-bg:#fbe9e5;
  --muted-tone:#5c6b63; --muted-bg:#eceeeb; --focus:#1668c8;
  --radius:13px; --radius-sm:9px;
  --shadow:0 1px 2px rgba(16,40,32,.05),0 10px 26px rgba(16,40,32,.055);
  --shadow-lg:0 16px 40px rgba(16,40,32,.12);
  --bleed:1380px; --pad:clamp(16px,4vw,56px); --header-h:60px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink:#e9f0ea; --green:#5ccb99; --green-deep:#9fe6c4; --lime:#d7ef5e; --coral:#f0795a;
    --bg:#0e1613; --surface:#17221d; --surface-2:#1d2b24; --line:#2c3b33; --line-soft:#243128;
    --fg:#e8efe9; --fg-muted:#a7b6ab; --fg-faint:#82928a;
    --ok:#74d7a2; --ok-bg:#153427; --warn:#e8bd68; --warn-bg:#342811; --bad:#f2937f; --bad-bg:#3a1d18;
    --muted-tone:#a2b3a8; --muted-bg:#212e27; --focus:#7bb4ff;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.32); --shadow-lg:0 22px 50px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"] {
  --ink:#e9f0ea; --green:#5ccb99; --green-deep:#9fe6c4; --lime:#d7ef5e; --coral:#f0795a;
  --bg:#0e1613; --surface:#17221d; --surface-2:#1d2b24; --line:#2c3b33; --line-soft:#243128;
  --fg:#e8efe9; --fg-muted:#a7b6ab; --fg-faint:#82928a;
  --ok:#74d7a2; --ok-bg:#153427; --warn:#e8bd68; --warn-bg:#342811; --bad:#f2937f; --bad-bg:#3a1d18;
  --muted-tone:#a2b3a8; --muted-bg:#212e27; --focus:#7bb4ff;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.32); --shadow-lg:0 22px 50px rgba(0,0,0,.5);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; background:var(--bg); color:var(--fg); font-family:var(--font-sans); font-size:15.5px; line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3 { font-family:var(--font-serif); font-weight:600; letter-spacing:-.02em; line-height:1.1; }
a { color:inherit; }
img { max-width:100%; }
.bleed { max-width:var(--bleed); margin:0 auto; padding-left:var(--pad); padding-right:var(--pad); }

.skip-link { position:absolute; left:12px; top:-60px; z-index:100; background:var(--surface); color:var(--fg); padding:10px 16px; border-radius:var(--radius-sm); box-shadow:var(--shadow); transition:top .16s ease; }
.skip-link:focus { top:12px; }
:focus-visible { outline:3px solid var(--focus); outline-offset:2px; border-radius:6px; }

/* ===== Header + tabs ===== */
.site-header { position:sticky; top:0; z-index:60; background:color-mix(in srgb,var(--surface) 92%,transparent); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.site-header .wrap { max-width:var(--bleed); margin:0 auto; padding:8px var(--pad); display:flex; align-items:center; gap:16px; min-height:var(--header-h); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:-.01em; font-size:15px; text-decoration:none; color:inherit; flex:none; }
.brand .mark { display:grid; place-items:center; width:36px; height:36px; flex:none; border-radius:10px; background:#0d3b2c; color:#d7ef5e; }
.brand .mark svg { width:20px; height:20px; }
.brand span span, .brand > span { display:flex; flex-direction:column; line-height:1.15; }
.brand small { font-weight:500; font-size:11px; color:var(--fg-muted); }

.tabs { display:flex; gap:2px; margin:0 auto 0 8px; overflow-x:auto; scrollbar-width:none; }
.tabs::-webkit-scrollbar { display:none; }
.tab { flex:none; padding:8px 14px; border-radius:999px; text-decoration:none; color:var(--fg-muted); font-weight:650; font-size:13.5px; white-space:nowrap; border:1px solid transparent; }
.tab:hover { color:var(--fg); background:var(--surface-2); }
.tab.active { color:var(--fg); background:var(--surface-2); border-color:var(--line); }
:root[data-theme="dark"] .tab.active, :root:not([data-theme="light"]) .tab.active { color:#0d3b2c; background:var(--lime); border-color:var(--lime); }
.tab-featured::before { content:""; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--coral); margin-right:6px; vertical-align:middle; box-shadow:0 0 0 0 rgba(230,96,63,.5); animation:tabPulse 2.6s ease-in-out infinite; }
@keyframes tabPulse { 0%,100%{ box-shadow:0 0 0 0 rgba(230,96,63,.5); } 55%{ box-shadow:0 0 0 5px rgba(230,96,63,0); } }

.header-actions { margin-left:auto; display:flex; align-items:center; gap:9px; flex:none; }
.btn-emergency { display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:999px; background:var(--coral); color:#fff; text-decoration:none; font-weight:800; font-size:13.5px; border:0; }
.btn-emergency:hover { filter:brightness(1.05); }
.btn-emergency .dot { width:7px; height:7px; border-radius:50%; background:#fff; animation:pulse 1.8s ease-in-out infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.35} }
.theme-toggle { display:grid; place-items:center; width:36px; height:36px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--fg); cursor:pointer; }
.theme-toggle:hover { background:var(--surface-2); }
.theme-toggle svg { width:18px; height:18px; }

/* ===== Vistas ===== */
.view[hidden] { display:none; }
.view { padding-bottom:clamp(40px,6vw,72px); }
.view-head { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; padding-top:22px; margin-bottom:6px; }
.view-title { font-size:clamp(24px,3vw,34px); margin:0; }
.section-sub { margin:0 0 16px; color:var(--fg-muted); font-size:14px; }
.block { margin-top:26px; }
.block-head { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.block h2, .method-block h2 { font-size:clamp(19px,2.2vw,24px); margin:0 0 12px; }
.block-head h2 { margin:0; }
.muted-foot { font-size:12px; color:var(--fg-faint); margin:8px 0 0; }

/* ===== Hero (banner oscuro fijo) ===== */
.hero { color:#eef5ef; background:radial-gradient(120% 90% at 88% -10%,rgba(215,239,94,.20),transparent 55%),linear-gradient(150deg,#0d3b2c,#12241d 120%); border-bottom:1px solid rgba(255,255,255,.06); }
.hero .bleed { padding-top:clamp(34px,5vw,62px); padding-bottom:clamp(30px,4vw,52px); }
.eyebrow { font-size:11.5px; font-weight:800; letter-spacing:.18em; color:var(--lime); text-transform:uppercase; }
.hero h1 { color:#fff; font-size:clamp(30px,5vw,56px); margin:12px 0 12px; max-width:18ch; }
.hero h1 em { color:var(--lime); font-style:normal; }
.hero p.lead { margin:0; font-size:clamp(15px,1.5vw,18px); color:#cfe0d6; }
.doors { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; margin-top:28px; max-width:760px; }
.door { display:flex; flex-direction:column; gap:6px; padding:20px 22px; border-radius:12px; text-decoration:none; color:#fff; transition:transform .2s cubic-bezier(0.2, 0, 0, 1), box-shadow .2s cubic-bezier(0.2, 0, 0, 1); min-height:120px; box-shadow:0 4px 12px rgba(0,0,0,.15); }
.door.need { background: linear-gradient(135deg, #d34c38, #b8321e); border: 1px solid #ff7560; }
.door.give { background: linear-gradient(135deg, #157352, #0d4a34); border: 1px solid #239c71; }
.door:hover { transform:translateY(-4px); box-shadow:0 12px 24px rgba(0,0,0,.3); }
.door-k { font-family:var(--font-serif); font-size:22px; font-weight:700; line-height:1.1; }
.door.need .door-k { color:#fff; }
.door.give .door-k { color:#d7ef5e; }
.door-d { font-size:13.5px; opacity:0.9; margin-top:4px; line-height:1.45; }
.door-d { font-size:12.5px; color:#cfe0d6; }
.hero-grid { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:40px; align-items:center; }
.hero-facts { align-self:center; }
.hf-card { background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.18); border-radius:var(--radius); padding:20px; }
.hf-mag { font-family:var(--font-serif); font-size:46px; font-weight:600; color:#fff; line-height:1; }
.hf-mag span { font-size:16px; color:var(--lime); }
.hf-card dl { margin:16px 0; display:flex; flex-direction:column; gap:10px; }
.hf-card dt { font-size:10px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:rgba(215,239,94,.85); }
.hf-card dd { margin:2px 0 0; font-size:13.5px; color:#dfeee4; line-height:1.3; }
.hf-link { color:var(--lime); text-decoration:none; font-weight:700; font-size:13.5px; }
.hf-link:hover { text-decoration:underline; }
@media (max-width:860px) { .hero-grid { grid-template-columns:1fr; gap:20px; align-items:start; } }

/* ===== Aviso ===== */
.notice { display:flex; gap:11px; align-items:flex-start; margin:18px 0 0; padding:13px 16px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); color:var(--fg-muted); font-size:13.5px; }
.notice .ico { flex:none; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; background:var(--warn-bg); color:var(--warn); font-weight:800; }
.notice b { color:var(--fg); }

/* ===== Tarjetas de navegación (Inicio) ===== */
.nav-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.nav-card { display:flex; flex-direction:column; gap:5px; padding:18px 20px; border-radius:var(--radius); border:1px solid var(--line); background:var(--surface); text-decoration:none; color:inherit; transition:transform .16s ease, border-color .16s ease; }
.nav-card:hover { transform:translateY(-2px); border-color:var(--green); }
.nav-card b { font-family:var(--font-serif); font-size:18px; font-weight:600; }
.nav-card span { font-size:12.5px; color:var(--fg-muted); }

/* ===== Recursos: recorridos, intents, filtros ===== */
.mode-switch { display:inline-flex; padding:4px; gap:4px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); flex-wrap:wrap; }
.mode-switch button { appearance:none; border:0; cursor:pointer; padding:8px 16px; border-radius:999px; background:transparent; color:var(--fg-muted); font-weight:700; font-size:13px; font-family:inherit; }
.mode-switch button[aria-pressed="true"] { background:var(--ink); color:var(--bg); }
:root[data-theme="dark"] .mode-switch button[aria-pressed="true"], :root:not([data-theme="light"]) .mode-switch button[aria-pressed="true"] { background:var(--lime); color:#0d3b2c; }
.intents { display:flex; flex-wrap:wrap; gap:8px; }
.intent { display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:999px; cursor:pointer; border:1px solid var(--line); background:var(--surface); color:var(--fg); font-family:inherit; font-size:13px; font-weight:600; transition:transform .16s ease, border-color .16s ease; }
.intent:hover { transform:translateY(-1px); border-color:var(--green); }
.intent .emoji { font-size:14px; line-height:1; }
.intent[aria-pressed="true"] { background:var(--lime); border-color:var(--lime); color:#0d3b2c; }
.filters { display:flex; flex-wrap:wrap; gap:11px 13px; align-items:end; margin-top:18px; padding:14px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface-2); }
.field { display:flex; flex-direction:column; gap:5px; }
.field label { font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--fg-faint); }
.field select, .field-search input { font-family:inherit; font-size:14px; color:var(--fg); background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:8px 11px; min-height:38px; }
.field select { min-width:148px; cursor:pointer; }
.field-search { flex:1 1 240px; min-width:190px; }
.field-search input { width:100%; }
.field-search input::placeholder { color:var(--fg-faint); }
.filters .reset { margin-left:auto; align-self:end; min-height:38px; padding:8px 14px; cursor:pointer; background:transparent; border:1px solid var(--line); border-radius:var(--radius-sm); color:var(--fg-muted); font-family:inherit; font-weight:600; font-size:13px; }
.filters .reset:hover { color:var(--fg); border-color:var(--green); }

.results-bar { display:flex; align-items:baseline; justify-content:space-between; gap:10px 16px; margin:18px 0 16px; flex-wrap:wrap; }
.results-count { font-size:13.5px; color:var(--fg-muted); margin:0; }
.results-count b { color:var(--fg); }
.results-bar-right { display:flex; align-items:center; gap:12px; }
.legend-note { font-size:12px; color:var(--fg-faint); margin:0; }
.live-state { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:700; letter-spacing:.02em; padding:3px 9px; border-radius:999px; }
.live-state::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.live-state.on { color:var(--ok); background:var(--ok-bg); }
.live-state.off { color:var(--warn); background:var(--warn-bg); }

.grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:13px; }

/* ===== Tarjeta de recurso ===== */
.card { display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:15px; box-shadow:var(--shadow); transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.card:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--green) 45%,var(--line)); box-shadow:var(--shadow-lg); }
.badges { display:flex; flex-wrap:wrap; gap:5px; margin-bottom:11px; }
.badge { display:inline-flex; align-items:center; gap:5px; font-size:10px; font-weight:700; letter-spacing:.03em; text-transform:uppercase; padding:3px 8px; border-radius:999px; border:1px solid transparent; }
.badge .tdot { width:5px; height:5px; border-radius:50%; background:currentColor; }
.badge.type { background:var(--surface-2); color:var(--fg-muted); border-color:var(--line); }
.badge.tone-ok { background:var(--ok-bg); color:var(--ok); }
.badge.tone-warn { background:var(--warn-bg); color:var(--warn); }
.badge.tone-bad { background:var(--bad-bg); color:var(--bad); }
.badge.tone-muted { background:var(--muted-bg); color:var(--muted-tone); }
.card h3 { font-size:17.5px; margin:0 0 3px; }
.card .action { margin:0 0 8px; font-size:12.5px; font-weight:700; color:var(--green); }
.card .desc { margin:0 0 11px; font-size:13px; color:var(--fg-muted); line-height:1.45; }
.meta { display:grid; gap:5px; margin:0 0 10px; padding:9px 0; border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); font-size:11.5px; color:var(--fg-muted); }
.meta div { display:flex; gap:6px; }
.meta dt { flex:none; font-weight:600; color:var(--fg-faint); min-width:84px; }
.meta dd { margin:0; color:var(--fg); }
.card .alert { display:flex; gap:7px; margin:0 0 11px; padding:8px 10px; border-radius:var(--radius-sm); font-size:12px; line-height:1.4; }
.card .alert.warn { background:var(--warn-bg); color:var(--warn); }
.card .alert.sensitive { background:var(--surface-2); color:var(--fg-muted); border:1px dashed var(--line); }
.card .alert .ai { flex:none; }
.card-actions { margin-top:auto; display:flex; gap:7px; }
.card-actions .open { flex:1; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:10px 12px; border-radius:var(--radius-sm); text-decoration:none; background:var(--ink); color:var(--bg); font-weight:700; font-size:13px; border:1px solid var(--ink); }
:root[data-theme="dark"] .card-actions .open, :root:not([data-theme="light"]) .card-actions .open { background:var(--lime); border-color:var(--lime); color:#0d3b2c; }
.card-actions .open:hover { filter:brightness(1.06); }
.card-actions .report { display:inline-flex; align-items:center; justify-content:center; padding:10px 12px; border-radius:var(--radius-sm); text-decoration:none; background:transparent; color:var(--fg-muted); font-weight:600; font-size:12.5px; border:1px solid var(--line); }
.card-actions .report:hover { color:var(--fg); border-color:var(--green); }
.empty { grid-column:1/-1; text-align:center; padding:48px 20px; border:1px dashed var(--line); border-radius:var(--radius); color:var(--fg-muted); }
.empty h3 { font-size:19px; color:var(--fg); margin:0 0 6px; }
.empty button { margin-top:12px; padding:9px 15px; border-radius:var(--radius-sm); border:1px solid var(--line); background:var(--surface); color:var(--fg); font-weight:600; cursor:pointer; }

/* ===== Situación ===== */
.situation-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:11px; }
.sit-card { display:block; text-decoration:none; color:inherit; padding:13px 14px; border-radius:var(--radius); background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--sev,var(--fg-faint)); transition:transform .14s ease, box-shadow .14s ease; }
.sit-card:hover { transform:translateY(-1px); box-shadow:var(--shadow); }
.sit-card.sev-critical { --sev:var(--bad); }
.sit-card.sev-warning { --sev:var(--warn); }
.sit-card.sev-info { --sev:var(--ok); }
.sit-region { font-size:10px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--sev); }
.sit-title { font-size:14px; font-weight:700; margin:2px 0 0; line-height:1.25; }
.sit-metric { font-family:var(--font-serif); font-size:20px; font-weight:600; margin:4px 0 3px; color:var(--fg); }
.sit-summary { font-size:12.5px; color:var(--fg-muted); line-height:1.4; margin:0; }
.sit-foot { display:flex; justify-content:space-between; gap:8px; margin-top:8px; font-size:10.5px; color:var(--fg-faint); }

/* ===== Mapa ===== */
.map-shell { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(300px,1fr); gap:18px; align-items:stretch; margin-top:14px; }
.map { height:min(74vh,640px); min-height:380px; width:100%; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--radius); z-index:1; }
.map-legend { overflow-y:auto; max-height:min(74vh,640px); padding:16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.map-legend h3 { font-size:15px; margin:0 0 12px; }
.legend-key { display:flex; flex-wrap:wrap; gap:10px 14px; margin:12px 0; font-size:12px; color:var(--fg-muted); }
.legend-key span { display:inline-flex; align-items:center; gap:6px; }
.legend-key i { width:11px; height:11px; border-radius:50%; display:inline-block; }
.dot-ep { background:#e6603f; } .dot-city { background:#2f7de1; } .dot-fire { background:#e0a11a; } .dot-prio-crit { background:#a23324; } .dot-prio-alta { background:#d46b33; }
.legend-list { display:flex; flex-direction:column; gap:8px; margin:8px 0; }
.leg-item { display:block; text-decoration:none; color:inherit; padding:10px 11px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface); }
.leg-item:hover { border-color:var(--green); }
.leg-item .lt { font-weight:700; font-size:13px; }
.leg-item .ld { font-size:11.5px; color:var(--fg-muted); margin-top:2px; line-height:1.35; }
.leaflet-popup-content { font-family:var(--font-sans); font-size:13px; }
.leaflet-popup-content b { font-family:var(--font-serif); }

/* ===== Municipios ===== */
.muni-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:13px; }
.muni-card { display:flex; flex-direction:column; padding:16px; border-radius:var(--radius); border:1px solid var(--line); background:var(--surface); box-shadow:var(--shadow); }
.muni-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.muni-name { font-family:var(--font-serif); font-size:19px; font-weight:600; margin:0; }
.muni-dep { font-size:12px; color:var(--fg-faint); }
.muni-prio { align-self:flex-start; margin:8px 0; font-size:10.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:3px 9px; border-radius:999px; }
.muni-prio.p-epicentro { background:var(--bad-bg); color:var(--bad); }
.muni-prio.p-critica { background:var(--bad-bg); color:var(--bad); }
.muni-prio.p-muy-alta { background:var(--warn-bg); color:var(--warn); }
.muni-prio.p-alta { background:var(--warn-bg); color:var(--warn); }
.muni-prio.p-emergencia-paralela { background:var(--warn-bg); color:var(--warn); }
.muni-prio.p-media { background:var(--surface-2); color:var(--fg-muted); border:1px solid var(--line); }
.muni-note { font-size:13px; color:var(--fg-muted); line-height:1.45; margin:0 0 12px; }
.muni-card .open { margin-top:auto; display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:9px 12px; border-radius:var(--radius-sm); text-decoration:none; background:transparent; border:1px solid var(--line); color:var(--fg); font-weight:650; font-size:12.5px; }
.muni-card .open:hover { border-color:var(--green); }

/* ===== Leer más (inline) y conectores ===== */
.more { margin:0 0 10px; }
.more > summary { display:inline-flex; align-items:center; gap:5px; cursor:pointer; list-style:none; font-size:12.5px; font-weight:700; color:var(--green); padding:3px 0; }
.more > summary::-webkit-details-marker { display:none; }
.more > summary::after { content:"▾"; font-size:10px; }
.more[open] > summary::after { content:"▴"; }
.more[open] > summary { margin-bottom:7px; }
.more-body p { font-size:13px; color:var(--fg-muted); line-height:1.5; margin:0 0 8px; }
.more-body p:last-child { margin-bottom:0; }
.hero-more { margin:16px 0 0; font-size:14px; color:#cfe0d6; }
.hero-more a { color:var(--lime); text-decoration:none; font-weight:700; }
.hero-more a:hover { text-decoration:underline; }
.block-cta { display:inline-flex; align-items:center; gap:6px; margin-top:12px; padding:9px 16px; border-radius:999px; text-decoration:none; background:var(--surface-2); border:1px solid var(--line); color:var(--fg); font-weight:700; font-size:13px; }
.block-cta:hover { border-color:var(--green); color:var(--green); }

/* ===== Entender qué pasó ===== */
.resumen-card { background:var(--surface); border:1px solid var(--line); border-top:4px solid var(--coral); border-radius:var(--radius); padding:20px; box-shadow:var(--shadow); }
.rc-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:14px; margin:0 0 12px; }
.rc-stat dt { font-size:10.5px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--fg-faint); }
.rc-stat dd { margin:2px 0 0; font-family:var(--font-serif); font-size:19px; font-weight:600; color:var(--fg); }
.rc-nota { margin:0 0 10px; font-size:14px; color:var(--fg-muted); line-height:1.5; }
.rc-src { font-size:12.5px; color:var(--green); text-decoration:none; font-weight:650; }
.rc-src:hover { text-decoration:underline; }

.explica { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:13px; }
.explica-card { padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.ex-ic { font-size:24px; margin-bottom:8px; }
.explica-card h3 { font-size:16.5px; margin:0 0 7px; }
.explica-card p { font-size:13.5px; color:var(--fg-muted); line-height:1.5; margin:0 0 10px; }
.explica-link { font-size:12.5px; font-weight:700; color:var(--green); text-decoration:none; }
.explica-link:hover { text-decoration:underline; }

.historia { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; }
.hist-card { display:flex; gap:12px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.hist-year { font-family:var(--font-serif); font-size:26px; font-weight:600; color:var(--green); line-height:1; flex:none; }
.hist-body b { font-size:13.5px; }
.hist-mag { font-size:11.5px; color:var(--fg-faint); font-weight:700; }
.hist-body p { margin:5px 0 0; font-size:12.5px; color:var(--fg-muted); line-height:1.4; }

.crono { display:flex; flex-direction:column; }
.crono-item { display:grid; grid-template-columns:118px 1fr; gap:18px; }
.crono-when { text-align:right; padding:2px 18px 18px 0; border-right:2px solid var(--line); }
.crono-dia { display:block; font-family:var(--font-serif); font-size:16px; font-weight:600; color:var(--fg); }
.crono-fecha { display:block; font-size:12px; color:var(--fg-faint); margin-top:2px; }
.crono-card { position:relative; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); padding:17px 18px; box-shadow:var(--shadow); margin-bottom:20px; }
.crono-card::before { content:""; position:absolute; left:-28px; top:15px; width:11px; height:11px; border-radius:50%; background:var(--coral); box-shadow:0 0 0 3px var(--bg); }
.crono-card h3 { font-size:16px; margin:0 0 9px; }
.crono-card ul { margin:0; padding-left:18px; display:flex; flex-direction:column; gap:6px; }
.crono-card li { font-size:13.5px; color:var(--fg-muted); line-height:1.45; }
.crono-src { font-size:11.5px; color:var(--fg-faint); margin:11px 0 0; }
.crono-src a { color:var(--green); text-decoration:none; margin-right:10px; }
.crono-src a:hover { text-decoration:underline; }

/* ===== Orientaciones (acordeón) ===== */
.fase-q { font-size:14px; font-weight:700; color:var(--fg-faint); text-transform:uppercase; letter-spacing:.04em; margin:22px 0 10px; }
.fase-picker { margin:0 0 10px; }
.fase-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:12px; margin-bottom:10px; }
.fase-card { display:flex; align-items:flex-start; gap:13px; text-align:left; padding:16px 18px 16px 20px; border-radius:var(--radius); border:1px solid var(--line); background:var(--surface); cursor:pointer; font-family:inherit; box-shadow:var(--shadow); position:relative; overflow:hidden; transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease; }
.fase-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--fase-accent, var(--green)); }
.fase-card.fc-ayuda { --fase-accent:var(--coral); }
.fase-card.fc-aportar { --fase-accent:var(--green); }
.fase-card:hover { transform:translateY(-2px); border-color:color-mix(in srgb, var(--fase-accent) 55%, var(--line)); box-shadow:var(--shadow-lg); }
.fase-card.active { border-color:var(--fase-accent); box-shadow:0 0 0 2px color-mix(in srgb, var(--fase-accent) 32%, transparent), var(--shadow); }
.fc-ic { font-size:26px; line-height:1; flex:none; }
.fc-body { display:flex; flex-direction:column; gap:3px; }
.fc-title { font-family:var(--font-serif); font-size:18px; font-weight:600; color:var(--fg); }
.fc-sub { font-size:12.5px; color:var(--fg-muted); line-height:1.4; }
.fase-all { background:none; border:0; color:var(--green); font-family:inherit; font-weight:700; font-size:13.5px; cursor:pointer; padding:2px 0; }
.fase-all:hover, .fase-all.active { text-decoration:underline; }

/* CTAs de proponer / directorio */
.cta-strong { display:inline-flex; align-items:center; gap:7px; cursor:pointer; font-family:inherit; font-weight:800; font-size:14px; padding:12px 22px; border-radius:999px; border:0; background:var(--green); color:#fff; white-space:nowrap; }
:root[data-theme="dark"] .cta-strong, :root:not([data-theme="light"]) .cta-strong { background:var(--lime); color:#0d3b2c; }
.cta-strong:hover { filter:brightness(1.06); transform:translateY(-1px); }
.cta-soft { display:inline-flex; align-items:center; text-decoration:none; color:var(--green); font-weight:700; font-size:14px; padding:11px 18px; border:1px solid var(--line); border-radius:999px; }
.cta-soft:hover { border-color:var(--green); }
.actuar-ctas { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:center; margin:26px 0 10px; }
.propose-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px; margin:20px 0 6px; padding:16px 20px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface-2); }
.propose-bar b { display:block; font-size:15px; margin-bottom:3px; }
.propose-bar span { font-size:13.5px; color:var(--fg-muted); }
.btn-ghost { padding:8px 14px; border-radius:999px; border:1px solid var(--line); background:var(--surface); color:var(--fg); font-family:inherit; font-weight:650; font-size:13px; cursor:pointer; }
.btn-ghost:hover { border-color:var(--green); }
.orientaciones { display:flex; flex-direction:column; gap:10px; }
.ori { border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); overflow:hidden; transition:box-shadow .15s ease, border-color .15s ease; }
.ori:hover { border-color:color-mix(in srgb, var(--green) 40%, var(--line)); }
.ori[open] { border-color:color-mix(in srgb, var(--green) 45%, var(--line)); box-shadow:inset 3px 0 0 var(--green), var(--shadow); }
.ori > summary { display:flex; gap:12px; align-items:flex-start; padding:15px 16px; cursor:pointer; list-style:none; }
.ori > summary::-webkit-details-marker { display:none; }
.ori > summary::after { content:"+"; margin-left:auto; font-size:20px; color:var(--fg-faint); line-height:1; }
.ori[open] > summary::after { content:"–"; }
.ori-ic { font-size:22px; line-height:1.1; flex:none; }
.ori-sum { display:flex; flex-direction:column; gap:2px; }
.ori-t { font-family:var(--font-serif); font-size:18px; font-weight:600; }
.ori-q { font-size:13px; color:var(--fg-muted); line-height:1.4; }
.ori-body { padding:0 16px 16px 50px; }
.ori-pasos { margin:0 0 14px; padding-left:18px; display:flex; flex-direction:column; gap:7px; }
.ori-pasos li { font-size:14px; line-height:1.5; }
.ori-row h4, .ori-dif h4 { font-size:11px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; color:var(--fg-faint); margin:0 0 7px; }
.ori-chips { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
.ori-chip { font-size:12.5px; padding:6px 11px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); }
.ori-chip b { color:var(--fg); }
.ori-warn { display:flex; gap:8px; margin:0 0 10px; padding:10px 12px; border-radius:var(--radius-sm); background:var(--warn-bg); color:var(--warn); font-size:13px; line-height:1.45; }
.ori-line { font-size:13px; margin:0 0 12px; color:var(--fg); }
.ori-dif { border-top:1px dashed var(--line); padding-top:12px; margin-top:4px; }
.ori-dif p { margin:0 0 7px; font-size:13px; color:var(--fg-muted); line-height:1.45; }
.ori-dif b { color:var(--fg); }
.ori-src { font-size:11.5px; color:var(--fg-faint); margin:12px 0 0; }
.ori-src a { color:var(--green); text-decoration:none; margin-right:10px; }
.ori-src a:hover { text-decoration:underline; }

/* Preparación */
.prep-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:13px; }
.prep-card { padding:16px 18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.prep-card h3 { font-size:16px; margin:0 0 10px; }
.prep-card ul, .prep-card ol { margin:0; padding-left:18px; display:flex; flex-direction:column; gap:6px; }
.prep-card li { font-size:13px; color:var(--fg-muted); line-height:1.4; }
.prep-links { display:flex; flex-direction:column; gap:8px; }
.prep-link { display:flex; flex-direction:column; gap:1px; text-decoration:none; padding:9px 11px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface-2); }
.prep-link:hover { border-color:var(--green); }
.prep-link b { font-size:13.5px; color:var(--green); }
.prep-link span { font-size:11.5px; color:var(--fg-muted); }

/* Líneas útiles */
.lineas-table { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:8px; }
.linea { display:grid; grid-template-columns:auto 1fr; column-gap:12px; align-items:baseline; padding:11px 13px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface); }
.linea-num { font-family:var(--font-serif); font-size:18px; font-weight:600; color:var(--fg); grid-row:span 2; align-self:center; }
.linea-num a { color:var(--green); text-decoration:none; }
.linea-lb { font-size:13.5px; font-weight:700; }
.linea-nt { font-size:11.5px; color:var(--fg-muted); }

/* Impresión: solo la vista de orientaciones, limpia */
@media print {
  .site-header, .site-footer, .btn-ghost, .method-block { display:none !important; }
  .view[hidden] { display:none !important; }
  .view { padding:0 !important; }
  body { background:#fff; color:#000; font-size:12pt; }
  .ori, .prep-card, .linea { border-color:#bbb; box-shadow:none; break-inside:avoid; }
  .ori > summary::after { display:none; }
  .ori-body { display:block !important; }
  a { color:#000; text-decoration:underline; }
}

/* ===== Footer ===== */
.site-footer { background:#0a1512; color:#cdd8d1; }
.site-footer .bleed { display:flex; flex-wrap:wrap; gap:22px; justify-content:space-between; padding-top:30px; padding-bottom:30px; }
.site-footer b { color:#fff; font-family:var(--font-serif); font-size:17px; }
.site-footer p { margin:6px 0 0; font-size:12.5px; line-height:1.5; }
.site-footer .cols { display:flex; gap:36px; flex-wrap:wrap; }
.site-footer .cols a, .cta-link { color:var(--lime); text-decoration:none; }
.site-footer .cols a:hover { text-decoration:underline; }

/* ===== Responsive ===== */
@media (max-width:820px) {
  .map-shell { grid-template-columns:1fr; }
  .map { height:52vh; min-height:300px; }
  .map-legend { max-height:none; }
  .hero-grid { gap:24px; }
  .doors { gap:10px; }
  .nav-cards { gap:10px; }
}
@media (max-width:640px) {
  .brand small { display:none; }
  .site-header .wrap { gap:10px; }
  .card { padding:14px; }
  .site-footer .bleed { flex-direction:column; gap:14px; }
  .crono-item { grid-template-columns:1fr; gap:4px; }
  .crono-when { text-align:left; border-right:0; padding:0 0 6px; }
  .crono-card::before { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}

.muni-controls { display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 16px; }
.muni-controls input, .muni-controls select { font-family:inherit; font-size:14px; padding:9px 12px; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--surface); color:var(--fg); }
.muni-controls input { flex:1 1 260px; min-width:180px; }
.muni-controls select { cursor:pointer; }
.muni-count { font-size:13px; color:var(--fg-muted); font-weight:600; }
.map-list { display: flex; flex-direction: column; gap: 4px; max-height: 400px; overflow-y: auto; }

/* Modal de Impresin */
.print-modal { border: none; border-radius: 8px; padding: 0; box-shadow: 0 4px 20px rgba(0,0,0,0.15); max-width: 500px; width: 90%; background: var(--surface); color: var(--fg); }
.print-modal::backdrop { background: rgba(0,0,0,0.5); }
.pm-content { padding: 24px; }
.pm-content h2 { margin-top: 0; font-size: 1.25rem; }
.pm-content p { color: var(--fg-muted); font-size: 0.9rem; margin-bottom: 1rem; }
.pm-content form { display: flex; flex-direction: column; gap: 12px; }
.pm-content label { display: flex; align-items: center; gap: 8px; font-weight: 500; cursor: pointer; }
.pm-actions { margin-top: 16px; display: flex; justify-content: flex-end; gap: 12px; }
@media print { .no-print, .no-print * { display: none !important; } }

@media (min-width: 768px) { .bottom-blocks { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; } .bottom-blocks .block { margin-bottom: 0; } }

@media (min-width: 768px) { .doors { max-width: 100%; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); } }

.propose-modal { padding: 24px; max-width: 500px; width: 90%; background: var(--bg); color: var(--fg); border-radius: 12px; border: 1px solid var(--line); box-shadow: var(--shadow-lg); } .propose-modal::backdrop { background: rgba(0,0,0,0.5); backdrop-filter: blur(4px); } .form-group { margin-bottom: 12px; } .form-group label { font-weight: 600; font-size: 14px; display: block; margin-bottom: 4px; } .pm-actions { display: flex; gap: 12px; justify-content: flex-end; margin-top: 24px; }

/* Municipios Redesign */
.muni-dept-group { margin-bottom: 32px; }
.dept-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 16px; padding-bottom: 8px; border-bottom: 2px solid var(--line); color: var(--fg); display: flex; align-items: center; gap: 8px; }
.dept-count { font-size: 0.9rem; color: var(--fg-muted); font-weight: normal; }
.muni-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; margin-bottom: 16px; }
.muni-card { background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 16px; display: flex; flex-direction: column; gap: 8px; }
.muni-top { display: flex; justify-content: space-between; align-items: flex-start; }
.muni-name { font-weight: 600; font-size: 1.05rem; margin: 0; color: var(--fg); }
.muni-prio { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 0.75rem; font-weight: 700; text-transform: uppercase; background: var(--line); color: var(--fg); width: max-content; }
.muni-prio.p-crtica { background: #fee2e2; color: #991b1b; }
.muni-prio.p-muy-alta { background: #ffedd5; color: #9a3412; }
.muni-prio.p-alta { background: #fef3c7; color: #92400e; }
.muni-prio.p-media { background: #e0f2fe; color: #075985; }
.muni-prio.p-baja { background: #f3f4f6; color: #374151; }
.muni-prio.p-otra { background: #fce7f3; color: #9d174d; border: 1px solid #f9a8d4; }
/* dark mode overrides for prio */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .muni-prio.p-crtica { background: #7f1d1d; color: #fecaca; }
  html:not([data-theme="light"]) .muni-prio.p-muy-alta { background: #7c2d12; color: #fed7aa; }
  html:not([data-theme="light"]) .muni-prio.p-alta { background: #78350f; color: #fde68a; }
  html:not([data-theme="light"]) .muni-prio.p-media { background: #0c4a6e; color: #bae6fd; }
  html:not([data-theme="light"]) .muni-prio.p-baja { background: #374151; color: #d1d5db; }
  html:not([data-theme="light"]) .muni-prio.p-otra { background: #831843; color: #fbcfe8; border: 1px solid #be185d; }
}
html[data-theme="dark"] .muni-prio.p-crtica { background: #7f1d1d; color: #fecaca; }
html[data-theme="dark"] .muni-prio.p-muy-alta { background: #7c2d12; color: #fed7aa; }
html[data-theme="dark"] .muni-prio.p-alta { background: #78350f; color: #fde68a; }
html[data-theme="dark"] .muni-prio.p-media { background: #0c4a6e; color: #bae6fd; }
html[data-theme="dark"] .muni-prio.p-baja { background: #374151; color: #d1d5db; }
html[data-theme="dark"] .muni-prio.p-otra { background: #831843; color: #fbcfe8; border: 1px solid #be185d; }

.muni-note { font-size: 0.9rem; color: var(--fg-muted); margin: 0; line-height: 1.4; }
.muni-list-compact { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
.muni-compact-item { background: var(--bg); border: 1px solid var(--line); border-radius: 6px; padding: 8px 12px; display: flex; justify-content: space-between; align-items: center; }
.muni-compact-item .muni-name { font-size: 0.9rem; font-weight: 500; }
.muni-prio.compact { padding: 2px 6px; font-size: 0.65rem; }