/*
 * proyectos.cl — Sistema de diseño SaaS institucional
 * Tokens: color semántico, tipografía, escala 4px, radios, sombras y movimiento.
 * Todo componente consume estas variables; no se editan outputs en dist/.
 */
:root {
  color-scheme: light;
  font-size: 106.25%;
  --color-bg: #f3f6fa;
  --color-surface: #ffffff;
  --color-surface-2: #eaf0f7;
  --color-surface-3: #dce6f1;
  --color-text: #10213a;
  --color-text-2: #344a63;
  --color-muted: #5b6f86;
  --color-line: #d5e0eb;
  --color-brand: #0b5bd3;
  --color-brand-hover: #0848a7;
  --color-brand-soft: #e6f0ff;
  --color-on-brand: #ffffff;
  --color-accent: #087f7a;
  --color-accent-soft: #ddf7f3;
  --color-coral: #c83f4f;
  --color-coral-soft: #ffeaec;
  --color-violet: #6747c7;
  --color-violet-soft: #eee9ff;
  --estado-abierta: #116d44;
  --estado-abierta-bg: #e3f4eb;
  --estado-pronto: #805000;
  --estado-pronto-bg: #fff0cc;
  --estado-cerrada: #526274;
  --estado-cerrada-bg: #e8edf2;
  --color-focus: #1d72ef;
  --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --text-12: .75rem;
  --text-14: .875rem;
  --text-16: 1rem;
  --text-20: 1.25rem;
  --text-24: 1.5rem;
  --text-32: 2rem;
  --text-40: 2.5rem;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --radius-1: .5rem;
  --radius-2: .9rem;
  --radius-3: 1.25rem;
  --shadow-1: 0 1px 2px rgb(16 33 58 / .05), 0 4px 12px rgb(16 33 58 / .05);
  --shadow-2: 0 16px 40px rgb(16 33 58 / .11);
  --shadow-brand: 0 18px 38px rgb(11 91 211 / .2);
  --wrap: 75rem;
  --motion-fast: 140ms;
  --motion-base: 180ms;
}

:root[data-text-size="large"] { font-size: 118.75%; }
:root[data-text-size="xlarge"] { font-size: 131.25%; }

:root[data-theme="dark"] {
  color-scheme: dark;
  --color-bg: #08111f;
  --color-surface: #111e30;
  --color-surface-2: #17283e;
  --color-surface-3: #223751;
  --color-text: #f4f7fb;
  --color-text-2: #d2dfec;
  --color-muted: #a3b4c6;
  --color-line: #2d425c;
  --color-brand: #79adff;
  --color-brand-hover: #a9c9ff;
  --color-brand-soft: #18345e;
  --color-on-brand: #07111f;
  --color-accent: #63ddd1;
  --color-accent-soft: #143d3d;
  --color-coral: #ff9ca7;
  --color-coral-soft: #48252c;
  --color-violet: #bca8ff;
  --color-violet-soft: #302957;
  --estado-abierta: #7edcaf;
  --estado-abierta-bg: #123c2e;
  --estado-pronto: #ffd184;
  --estado-pronto-bg: #4a310b;
  --estado-cerrada: #c1ccd8;
  --estado-cerrada-bg: #29394b;
  --color-focus: #8ab8ff;
  --shadow-1: 0 1px 2px rgb(0 0 0 / .35), 0 6px 16px rgb(0 0 0 / .2);
  --shadow-2: 0 18px 44px rgb(0 0 0 / .32);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --color-bg: #08111f; --color-surface: #111e30; --color-surface-2: #17283e; --color-surface-3: #223751;
    --color-text: #f4f7fb; --color-text-2: #d2dfec; --color-muted: #a3b4c6; --color-line: #2d425c;
    --color-brand: #79adff; --color-brand-hover: #a9c9ff; --color-brand-soft: #18345e; --color-on-brand: #07111f;
    --color-accent: #63ddd1; --color-accent-soft: #143d3d; --color-coral: #ff9ca7; --color-coral-soft: #48252c;
    --color-violet: #bca8ff; --color-violet-soft: #302957;
    --estado-abierta: #7edcaf; --estado-abierta-bg: #123c2e; --estado-pronto: #ffd184; --estado-pronto-bg: #4a310b;
    --estado-cerrada: #c1ccd8; --estado-cerrada-bg: #29394b; --color-focus: #8ab8ff;
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: radial-gradient(circle at 10% 2%, color-mix(in srgb, var(--color-brand-soft) 72%, transparent) 0, transparent 22rem), var(--color-bg); color: var(--color-text); font: 400 var(--text-16)/1.6 var(--font-sans); overflow-wrap: anywhere; }
button, input, select { font: inherit; }
button, select { cursor: pointer; }
a { color: var(--color-brand); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--color-brand-hover); }
img, svg { max-width: 100%; }
h1, h2, h3 { margin-top: 0; color: var(--color-text); line-height: 1.16; letter-spacing: -.025em; }
h1 { font-size: clamp(2rem, 5vw, var(--text-40)); }
h2 { font-size: clamp(1.4rem, 3vw, var(--text-24)); }
h3 { font-size: var(--text-20); }
p { margin-top: 0; }
[hidden] { display: none !important; }
:focus-visible { outline: .1875rem solid var(--color-focus); outline-offset: .1875rem; }
.i { width: 1.1em; height: 1.1em; flex: none; vertical-align: -.18em; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: var(--space-3); left: var(--space-3); transform: translateY(-200%); padding: var(--space-3) var(--space-4); border-radius: var(--radius-1); background: var(--color-brand); color: var(--color-on-brand); font-weight: 750; }
.skip-link:focus { transform: translateY(0); }

/* Header */
.top { position: sticky; z-index: 20; top: 0; background: color-mix(in srgb, var(--color-surface) 90%, transparent); border-bottom: 1px solid color-mix(in srgb, var(--color-line) 75%, transparent); box-shadow: 0 1px 0 rgb(8 17 31 / .03); backdrop-filter: blur(18px); }
.top-in { width: min(100%, var(--wrap)); min-height: 4rem; margin: 0 auto; padding: var(--space-2) var(--space-6); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--space-6); }
.brand-lockup { display: flex; align-items: center; gap: var(--space-3); white-space: nowrap; }
.marca { display: inline-flex; align-items: center; gap: .55rem; color: var(--color-text); font-size: 20px; font-weight: 880; letter-spacing: -.045em; text-decoration: none; white-space: nowrap; }
.marca-mark { width: 2.25rem; height: 2.25rem; flex: none; filter: drop-shadow(0 .4rem .55rem rgb(11 91 211 / .18)); }
.marca-word { color: var(--color-text); }
.marca-word span { color: var(--color-brand); }
.marca-tag { padding-left: var(--space-3); border-left: 1px solid var(--color-line); color: var(--color-muted); font-size: .68rem; font-weight: 760; letter-spacing: .035em; text-transform: uppercase; }
.top nav { display: flex; justify-content: flex-end; gap: var(--space-6); }
.top nav a { min-height: 2.5rem; flex: none; display: inline-flex; align-items: center; padding: 0 .35rem; border-radius: var(--radius-1); color: var(--color-text-2); font-size: var(--text-14); font-weight: 700; text-decoration: none; white-space: nowrap; }
.top nav a:hover { background: var(--color-brand-soft); color: var(--color-brand); }
.access-tools { display: flex; align-items: center; gap: var(--space-2); }
.text-size-controls { display: flex; gap: var(--space-1); }
.text-size-controls button, .theme-toggle { width: 44px; height: 44px; flex: none; display: grid; place-items: center; padding: 0; border: 1px solid var(--color-line); background: var(--color-surface-2); color: var(--color-text); font-size: 1rem; font-weight: 780; transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast), transform var(--motion-fast); }
.text-size-controls button { border-radius: var(--radius-1); }
.theme-toggle { border-radius: 999px; }
.text-size-controls button:hover:not(:disabled),
.theme-toggle:hover { border-color: var(--color-brand); background: var(--color-brand-soft); transform: translateY(-1px); }
.text-size-controls button:disabled { cursor: not-allowed; color: var(--color-muted); opacity: .58; }
.theme-icon { width: 1.2rem; height: 1.2rem; }
:root[data-theme="light"] .theme-icon--sun, :root[data-theme="dark"] .theme-icon--moon { display: none; }

main { width: min(100%, var(--wrap)); margin: 0 auto; padding: 0 var(--space-6) var(--space-8); }
.hero { padding: var(--space-16) 0 var(--space-8); }
.hero--home { max-width: none; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(19rem, .75fr); align-items: center; gap: clamp(2rem, 6vw, 5.5rem); }
.hero--silo { max-width: 49rem; padding-top: var(--space-8); }
.hero h1 { max-width: 19ch; margin-bottom: var(--space-4); font-size: clamp(2rem, 5vw, var(--text-40)); text-wrap: balance; }
.hero--home h1 { max-width: 18ch; font-size: clamp(2.45rem, 5vw, 4.45rem); line-height: 1.04; letter-spacing: -.055em; }
.hero p:last-child { max-width: 44rem; margin-bottom: 0; color: var(--color-text-2); font-size: clamp(1.05rem, 2vw, 1.2rem); }
.hero-copy { min-width: 0; }
.hero-highlight { color: var(--color-brand); }
.hero-description { max-width: 43rem; margin-bottom: var(--space-5, 1.25rem); color: var(--color-text-2); font-size: clamp(1.06rem, 1.8vw, 1.25rem); line-height: 1.65; }
.hero-trust { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-5); color: var(--color-text-2); font-size: var(--text-14); font-weight: 680; }
.hero-trust span { display: inline-flex; align-items: center; gap: var(--space-2); }
.hero-trust .i { color: var(--color-accent); }
.hero-pulse { min-width: 0; position: relative; overflow: hidden; padding: clamp(1.25rem, 3vw, 2rem); border: 1px solid rgb(255 255 255 / .13); border-radius: var(--radius-3); background: linear-gradient(145deg, #0b397d 0%, #0b5bd3 56%, #087f7a 140%); box-shadow: var(--shadow-brand); color: #fff; isolation: isolate; }
.hero-pulse::after { position: absolute; z-index: -1; right: -4rem; bottom: -5rem; width: 13rem; height: 13rem; border: 2.5rem solid rgb(255 255 255 / .08); border-radius: 50%; content: ""; }
.hero-pulse--agile { background: linear-gradient(145deg, #0d4e62 0%, #087f7a 58%, #0b5bd3 135%); }
.pulse-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-bottom: var(--space-4); border-bottom: 1px solid rgb(255 255 255 / .18); }
.pulse-head > span { font-size: var(--text-12); font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.pulse-head small { display: inline-flex; align-items: center; gap: .4rem; color: rgb(255 255 255 / .78); font-size: .7rem; white-space: nowrap; }
.pulse-head i { width: .45rem; height: .45rem; border-radius: 50%; background: #73f0c2; box-shadow: 0 0 0 .25rem rgb(115 240 194 / .14); }
.pulse-priority { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: var(--space-4); padding: var(--space-6) 0 var(--space-4); }
.pulse-number { font-size: clamp(2.7rem, 6vw, 4.1rem); font-variant-numeric: tabular-nums; font-weight: 880; letter-spacing: -.07em; line-height: .9; }
.pulse-priority strong, .pulse-priority span { display: block; }
.pulse-priority strong { font-size: 1.02rem; }
.pulse-priority div span { margin-top: .2rem; color: rgb(255 255 255 / .76); font-size: var(--text-12); }
.pulse-link { min-height: 2.8rem; display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding: .65rem .85rem; border: 1px solid rgb(255 255 255 / .17); border-radius: var(--radius-1); background: rgb(255 255 255 / .12); color: #fff; font-size: var(--text-14); font-weight: 760; text-decoration: none; }
.pulse-link:hover { background: rgb(255 255 255 / .2); color: #fff; }
.pulse-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-4); }
.pulse-grid div { min-width: 0; padding: var(--space-3); border-radius: var(--radius-1); background: rgb(0 0 0 / .13); }
.pulse-grid strong, .pulse-grid span { display: block; }
.pulse-grid strong { font-size: var(--text-20); font-variant-numeric: tabular-nums; }
.pulse-grid span { margin-top: .1rem; color: rgb(255 255 255 / .72); font-size: .7rem; line-height: 1.35; }
.eyebrow { margin-bottom: var(--space-2); color: var(--color-brand); font-size: var(--text-12); font-weight: 800; letter-spacing: .11em; line-height: 1.3; text-transform: uppercase; }

/* Buscador y filtros */
.market-tool { display: grid; gap: var(--space-8); }
.filter-panel { position: relative; padding: var(--space-6); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 25%, var(--color-surface))); box-shadow: var(--shadow-2); }
.filter-panel-title { display: flex; align-items: end; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); }
.filter-panel-title span, .filter-panel-title strong { display: block; }
.filter-panel-title span { margin-bottom: .1rem; color: var(--color-brand); font-size: var(--text-12); font-weight: 820; letter-spacing: .08em; text-transform: uppercase; }
.filter-panel-title strong { color: var(--color-text); font-size: var(--text-20); line-height: 1.3; }
.filter-panel-title small { max-width: 18rem; color: var(--color-muted); font-size: var(--text-12); text-align: right; }
.search-field { min-height: 3.75rem; display: flex; align-items: center; gap: var(--space-3); padding: 0 var(--space-4); border: 2px solid var(--color-line); border-radius: var(--radius-2); background: var(--color-bg); color: var(--color-muted); transition: border-color var(--motion-fast), box-shadow var(--motion-fast); }
.search-field:focus-within { border-color: var(--color-brand); box-shadow: 0 0 0 .25rem var(--color-brand-soft); }
.search-field .i { width: 1.35rem; height: 1.35rem; }
.search-field input { min-width: 0; width: 100%; height: 3.25rem; border: 0; outline: 0; background: transparent; color: var(--color-text); font-size: 1.08rem; }
.search-field input::placeholder { color: var(--color-muted); opacity: 1; }
.filter-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--space-3); margin-top: var(--space-4); }
.filter-field { min-width: 0; display: grid; gap: var(--space-1); color: var(--color-muted); font-size: var(--text-12); font-weight: 750; letter-spacing: .025em; }
.filter-field select { min-width: 0; width: 100%; min-height: 3.1rem; padding: 0 var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-surface); color: var(--color-text); font-size: var(--text-14); font-weight: 620; }
.filter-field select:hover { border-color: var(--color-brand); }
.filter-footer { min-height: 2.75rem; display: flex; align-items: flex-end; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-3); }
.filter-footer p { margin: 0; color: var(--color-text-2); font-size: var(--text-14); font-weight: 650; }
.button-link { min-height: 2.75rem; padding: 0 var(--space-2); border: 0; background: transparent; color: var(--color-brand); font-size: var(--text-14); font-weight: 720; }
.button-link:hover { color: var(--color-brand-hover); text-decoration: underline; }

/* Cifras */
.market-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.market-stat { min-width: 0; display: flex; align-items: center; gap: var(--space-4); padding: var(--space-5, 1.25rem) var(--space-6); border: 1px solid var(--color-line); border-radius: var(--radius-2); background: var(--color-surface); box-shadow: var(--shadow-1); }
.market-stat > div { min-width: 0; }
.market-stat-icon { width: 3.1rem; height: 3.1rem; flex: none; display: grid !important; place-items: center; border-radius: var(--radius-1); background: var(--color-brand-soft); color: var(--color-brand) !important; }
.market-stat-icon .i { width: 1.45rem; height: 1.45rem; }
.market-stat--today .market-stat-icon { background: var(--color-coral-soft); color: var(--color-coral) !important; }
.market-stat--amount .market-stat-icon { background: var(--color-accent-soft); color: var(--color-accent) !important; }
.market-stat span:not(.market-stat-icon) { display: block; overflow: hidden; color: var(--color-text); font-size: clamp(1.45rem, 4vw, var(--text-32)); font-variant-numeric: tabular-nums; font-weight: 840; letter-spacing: -.045em; text-overflow: ellipsis; white-space: nowrap; }
.market-stat small { display: block; color: var(--color-muted); font-size: var(--text-14); }

/* Secciones y tarjetas */
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); }
.section-heading > div { min-width: 0; }
.section-heading h2, .section-heading p { margin-bottom: 0; }
.section-description { max-width: 45rem; margin-top: var(--space-2) !important; color: var(--color-muted); font-size: var(--text-14); line-height: 1.55; }
.section-heading--compact { margin-bottom: var(--space-3); }
.section-count { min-width: 2.4rem; min-height: 2rem; display: inline-grid; place-items: center; padding: 0 var(--space-3); border-radius: 999px; background: var(--color-surface-2); color: var(--color-text-2); font-size: var(--text-14); font-variant-numeric: tabular-nums; font-weight: 750; }
.urgent-section, .results-section, .silos, .silo-links { scroll-margin-top: 5.5rem; }
.urgent-section { position: relative; overflow: hidden; padding: var(--space-6); border: 1px solid color-mix(in srgb, var(--color-coral) 30%, var(--color-line)); border-radius: var(--radius-3); background: linear-gradient(135deg, color-mix(in srgb, var(--color-coral-soft) 82%, var(--color-surface)), color-mix(in srgb, var(--estado-pronto-bg) 58%, var(--color-surface))); }
.urgent-section::before { position: absolute; inset: 0 auto 0 0; width: .3rem; background: linear-gradient(var(--color-coral), var(--estado-pronto)); content: ""; }
.urgent-section .eyebrow { color: var(--color-coral); }
.urgent-section .section-count { background: var(--color-coral); color: #fff; }
.urgent-section.is-empty { padding-bottom: var(--space-5, 1.25rem); }
.urgent-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.results-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.results-grid[aria-busy="true"] { opacity: .55; }
.card { min-width: 0; min-height: 19rem; position: relative; display: flex; flex-direction: column; padding: var(--space-5, 1.25rem); overflow: hidden; border: 1px solid var(--color-line); border-top: .22rem solid var(--color-brand); border-radius: var(--radius-2); background: linear-gradient(155deg, var(--color-surface) 62%, color-mix(in srgb, var(--color-brand-soft) 24%, var(--color-surface))); color: inherit; box-shadow: var(--shadow-1); text-decoration: none; transition: border-color var(--motion-fast), box-shadow var(--motion-base), transform var(--motion-fast); }
.card--abierta { border-top-color: var(--color-accent); }
.card--pronto { border-top-color: var(--color-coral); }
.card--cerrada { border-top-color: var(--estado-cerrada); opacity: .78; }
.card:hover { border-color: var(--color-brand); color: inherit; box-shadow: var(--shadow-2); transform: translateY(-2px); }
.card:focus-visible { outline-offset: .25rem; }
.card--urgent { min-height: 17rem; background: linear-gradient(150deg, var(--color-surface) 55%, color-mix(in srgb, var(--color-coral-soft) 52%, var(--color-surface))); }
.card-top { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin-bottom: var(--space-4); }
.codigo { color: var(--color-muted); font-size: var(--text-12); font-variant-numeric: tabular-nums; font-weight: 760; letter-spacing: .045em; text-transform: uppercase; }
.chip-estado { max-width: 100%; min-height: 2rem; display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .65rem; border-radius: 999px; font-size: var(--text-12); font-variant-numeric: tabular-nums; font-weight: 780; line-height: 1.2; white-space: nowrap; }
.chip-estado.abierta { background: var(--estado-abierta-bg); color: var(--estado-abierta); }
.chip-estado.pronto { background: var(--estado-pronto-bg); color: var(--estado-pronto); }
.chip-estado.cerrada { background: var(--estado-cerrada-bg); color: var(--estado-cerrada); }
.card h3 { display: -webkit-box; margin-bottom: var(--space-2); overflow: hidden; color: var(--color-text); font-size: 1.08rem; font-weight: 780; line-height: 1.36; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.card .org { flex: 1; margin-bottom: var(--space-4); color: var(--color-text-2); font-size: var(--text-14); }
.card-meta { display: grid; gap: var(--space-2); padding-top: var(--space-3); border-top: 1px solid var(--color-line); color: var(--color-muted); font-size: var(--text-14); }
.card-meta > span { min-width: 0; display: flex; align-items: flex-start; gap: var(--space-2); }
.card-meta .i { margin-top: .2em; }
.card-meta .monto { color: var(--color-text-2); font-variant-numeric: tabular-nums; font-weight: 680; }
.card-link { min-height: 2.75rem; display: flex; align-items: center; justify-content: space-between; gap: var(--space-2); margin: var(--space-3) -.3rem -.3rem; padding: 0 .3rem; border-radius: .4rem; color: var(--color-brand); font-size: var(--text-14); font-weight: 780; }
.card:hover .card-link { background: var(--color-brand-soft); }
.load-more-wrap { display: flex; justify-content: center; margin-top: var(--space-6); }
.button { min-height: 3rem; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); padding: .7rem var(--space-5, 1.25rem); border: 1px solid transparent; border-radius: .7rem; font-weight: 780; line-height: 1.3; text-align: center; text-decoration: none; transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast), transform var(--motion-fast), box-shadow var(--motion-fast); }
.button:hover { text-decoration: none; transform: translateY(-1px); }
.button--primary { background: linear-gradient(135deg, var(--color-brand), #2679ed); box-shadow: 0 8px 20px rgb(11 91 211 / .2); color: var(--color-on-brand); }
.button--primary:hover { background: var(--color-brand-hover); color: var(--color-on-brand); }
.button--secondary { border-color: var(--color-line); background: var(--color-surface); color: var(--color-brand); }
.button--secondary:hover { border-color: var(--color-brand); background: var(--color-brand-soft); color: var(--color-brand-hover); }
.button--compact { min-height: 2.5rem; padding: .5rem var(--space-3); font-size: var(--text-14); }
.empty-state { padding: var(--space-12) var(--space-6); border: 1px dashed var(--color-line); border-radius: var(--radius-2); background: var(--color-surface); text-align: center; }
.empty-state h3 { margin-bottom: var(--space-2); }
.empty-state p { max-width: 34rem; margin: 0 auto var(--space-4); color: var(--color-text-2); }
.empty-icon { width: 3rem; height: 3rem; display: grid; place-items: center; margin: 0 auto var(--space-3); border-radius: 999px; background: var(--color-surface-2); color: var(--color-muted); }
.empty-icon .i { width: 1.4rem; height: 1.4rem; }
.empty-inline, .empty-copy { margin: 0; color: var(--color-text-2); }

/* Navegación por silos */
.silos, .silo-links { margin-top: var(--space-16); padding: clamp(1.25rem, 4vw, 2.5rem); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-violet-soft) 26%, var(--color-surface))); box-shadow: var(--shadow-1); }
.silos h3 { margin: var(--space-6) 0 var(--space-3); color: var(--color-text-2); font-size: var(--text-16); }
.nav-chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.nav-chip { min-height: 2.75rem; display: inline-flex; align-items: center; gap: var(--space-2); padding: .5rem var(--space-3); border: 1px solid var(--color-line); border-radius: 999px; background: color-mix(in srgb, var(--color-surface) 88%, transparent); color: var(--color-text-2); font-size: var(--text-14); font-weight: 680; text-decoration: none; transition: background-color var(--motion-fast), border-color var(--motion-fast), color var(--motion-fast), transform var(--motion-fast); }
.nav-chip:hover { border-color: var(--color-brand); background: var(--color-brand-soft); color: var(--color-brand-hover); }
.nav-chip:hover { transform: translateY(-1px); }
.nav-chip span { min-width: 1.75rem; padding: .05rem .4rem; border-radius: 999px; background: var(--color-surface-2); color: var(--color-muted); font-size: var(--text-12); font-variant-numeric: tabular-nums; text-align: center; }

/* Breadcrumbs */
.breadcrumb { width: fit-content; max-width: 100%; margin-top: var(--space-6); margin-bottom: var(--space-4); padding: .4rem .55rem; border: 1px solid color-mix(in srgb, var(--color-brand) 16%, var(--color-line)); border-radius: 999px; background: color-mix(in srgb, var(--color-surface) 92%, var(--color-brand-soft)); color: var(--color-muted); font-size: var(--text-14); box-shadow: var(--shadow-1); }
.breadcrumb ol { display: flex; align-items: center; flex-wrap: wrap; gap: .15rem; margin: 0; padding: 0; list-style: none; }
.breadcrumb li { min-width: 0; display: inline-flex; align-items: center; color: var(--color-text-2); font-weight: 650; line-height: 1.25; }
.breadcrumb li:not(:last-child)::after { margin-inline: .15rem; content: "›"; color: color-mix(in srgb, var(--color-muted) 58%, var(--color-line)); font-size: 1.15em; font-weight: 750; }
.breadcrumb a, .breadcrumb [aria-current="page"] { min-height: 2rem; display: inline-flex; align-items: center; padding: .2rem .55rem; border-radius: 999px; }
.breadcrumb a { color: var(--color-text-2); text-decoration: none; transition: background-color var(--motion-fast), color var(--motion-fast); }
.breadcrumb a:hover { background: var(--color-brand-soft); color: var(--color-brand-hover); }
.breadcrumb li:first-child a::before { width: .48rem; height: .48rem; margin-right: var(--space-2); border-radius: .15rem; background: linear-gradient(135deg, var(--color-brand), var(--color-accent)); content: ""; box-shadow: 0 0 0 .18rem color-mix(in srgb, var(--color-brand-soft) 74%, transparent); }
.breadcrumb [aria-current="page"] { max-width: min(28rem, 45vw); overflow: hidden; background: var(--color-brand-soft); color: var(--color-brand-hover); font-weight: 780; text-overflow: ellipsis; white-space: nowrap; }

/* Ficha */
.detail-page { display: grid; gap: var(--space-8); }
.detail-hero { position: relative; overflow: hidden; padding: var(--space-8); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(145deg, var(--color-surface) 62%, color-mix(in srgb, var(--color-brand-soft) 55%, var(--color-surface))); box-shadow: var(--shadow-2); }
.detail-hero::before { position: absolute; inset: 0 0 auto; height: .32rem; background: linear-gradient(90deg, var(--color-brand), var(--color-accent)); content: ""; }
.detail-status { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-4); }
.detail-hero h1 { max-width: 30ch; margin-bottom: var(--space-4); font-size: clamp(1.75rem, 4vw, 2.4rem); }
.detail-description { max-width: 58rem; color: var(--color-text-2); font-size: 1.06rem; }
.detail-highlights { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); margin: var(--space-6) 0; }
.detail-highlights > div { min-width: 0; padding: var(--space-4); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-surface); }
.detail-highlights > div:nth-child(1) { border-color: color-mix(in srgb, var(--color-accent) 28%, var(--color-line)); background: color-mix(in srgb, var(--color-accent-soft) 52%, var(--color-surface)); }
.detail-highlights > div:nth-child(2) { border-color: color-mix(in srgb, var(--color-brand) 25%, var(--color-line)); background: color-mix(in srgb, var(--color-brand-soft) 52%, var(--color-surface)); }
.detail-highlights > div:nth-child(3) { border-color: color-mix(in srgb, var(--color-coral) 25%, var(--color-line)); background: color-mix(in srgb, var(--color-coral-soft) 52%, var(--color-surface)); }
.detail-highlights span { display: block; margin-bottom: var(--space-1); color: var(--color-muted); font-size: var(--text-12); font-weight: 700; text-transform: uppercase; }
.detail-highlights strong { display: block; color: var(--color-text); font-size: var(--text-16); font-variant-numeric: tabular-nums; line-height: 1.4; }
.official-action { display: flex; align-items: center; gap: var(--space-4); }
.official-buttons { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.official-action p { max-width: 32rem; margin: 0; color: var(--color-muted); font-size: var(--text-14); }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(16rem, 21rem); align-items: start; gap: var(--space-6); }
.detail-main { min-width: 0; display: grid; gap: var(--space-6); }
.detail-section, .metadata-card { min-width: 0; padding: var(--space-6); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: var(--color-surface); box-shadow: var(--shadow-1); }
.detail-section > h2 { margin-bottom: var(--space-4); }
.section-intro { max-width: 48rem; margin: var(--space-2) 0 0; color: var(--color-text-2); font-size: var(--text-14); }
.process-explainer { border-left: .32rem solid var(--color-brand); background: linear-gradient(120deg, color-mix(in srgb, var(--color-brand-soft) 58%, var(--color-surface)), var(--color-surface)); }
.process-explainer h2 { max-width: 34ch; }
.process-explainer > p:not(.eyebrow) { color: var(--color-text-2); }
.type-code { display: inline-flex; min-height: 2rem; align-items: center; margin-right: var(--space-2); padding: .2rem .55rem; border-radius: var(--radius-1); background: var(--color-brand-soft); color: var(--color-brand); font-size: var(--text-16); font-variant-numeric: tabular-nums; vertical-align: middle; }
.source-note, .local-note { margin: var(--space-4) 0 0; color: var(--color-muted); font-size: var(--text-12); }
.timeline { position: relative; display: grid; gap: 0; margin: var(--space-6) 0 0; padding: 0; list-style: none; }
.timeline::before { position: absolute; top: 1rem; bottom: 1rem; left: .5rem; width: 2px; background: var(--color-line); content: ""; }
.timeline li { position: relative; display: grid; grid-template-columns: 1rem minmax(0, 1fr); gap: var(--space-4); padding-bottom: var(--space-6); }
.timeline li:last-child { padding-bottom: 0; }
.timeline-dot { position: relative; z-index: 1; width: 1rem; height: 1rem; margin-top: .25rem; border: .2rem solid var(--color-surface); border-radius: 999px; background: var(--color-line); box-shadow: 0 0 0 1px var(--color-line); }
.timeline .is-complete .timeline-dot { background: var(--estado-abierta); box-shadow: 0 0 0 1px var(--estado-abierta); }
.timeline .is-current .timeline-dot { background: var(--estado-pronto); box-shadow: 0 0 0 1px var(--estado-pronto); }
.timeline .is-upcoming .timeline-dot { background: var(--color-surface); box-shadow: 0 0 0 2px var(--color-line); }
.timeline strong, .timeline time, .timeline li div > span { display: block; }
.timeline time { margin-top: .1rem; color: var(--color-text); font-variant-numeric: tabular-nums; font-weight: 650; }
.timeline li div > span { max-width: 52rem; margin-top: .25rem; color: var(--color-muted); font-size: var(--text-12); }
.checklist-progress { min-width: 4rem; padding: .25rem .55rem; border-radius: 999px; background: var(--color-surface-2); color: var(--color-text-2); font-size: var(--text-12); font-variant-numeric: tabular-nums; font-weight: 750; text-align: center; }
.checklist-card.is-complete .checklist-progress { background: var(--color-brand-soft); color: var(--color-brand); }
.progress-track { height: .5rem; margin: var(--space-5) 0; overflow: hidden; border-radius: 999px; background: var(--color-surface-3); }
.progress-track span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--color-brand); transition: width var(--motion-fast); }
.checklist { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.checklist li { border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-bg); }
.checklist label { min-height: 4.25rem; display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); align-items: start; gap: var(--space-3); padding: var(--space-3); cursor: pointer; }
.checklist input { width: 1.35rem; height: 1.35rem; margin: .1rem 0 0; accent-color: var(--color-brand); }
.checklist strong, .checklist small { display: block; }
.checklist strong { color: var(--color-text); line-height: 1.45; }
.checklist small { margin-top: .2rem; color: var(--color-muted); line-height: 1.5; }
.checklist li:has(input:checked) { border-color: var(--color-brand); background: var(--color-brand-soft); }
.checklist li:has(input:checked) strong { text-decoration: line-through; text-decoration-thickness: 1px; }
.checklist-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); margin-top: var(--space-5); }
.table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; border: 1px solid var(--color-line); border-radius: var(--radius-1); scrollbar-gutter: stable; }
.items-table { width: 100%; min-width: 48rem; border-collapse: collapse; }
.items-table th, .items-table td { padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: top; }
.items-table th { background: var(--color-surface-2); color: var(--color-text-2); font-size: var(--text-12); letter-spacing: .035em; text-transform: uppercase; }
.items-table td { color: var(--color-text-2); font-size: var(--text-14); }
.items-table td:first-child { color: var(--color-text); font-weight: 650; }
.item-unit { display: block; margin-top: .25rem; color: var(--color-muted); font-size: var(--text-12); font-weight: 500; }
.items-table tr:last-child td { border-bottom: 0; }
.items-table .numeric { font-variant-numeric: tabular-nums; white-space: nowrap; }
.metadata-card { position: sticky; top: 5.5rem; border-top: .3rem solid var(--color-violet); background: linear-gradient(155deg, var(--color-surface), color-mix(in srgb, var(--color-violet-soft) 32%, var(--color-surface))); }
.metadata-card h2 { margin-bottom: var(--space-4); font-size: var(--text-20); }
.metadata-card dl { margin: 0; }
.meta-row { display: grid; gap: var(--space-1); padding: var(--space-3) 0; border-bottom: 1px solid var(--color-line); }
.meta-row dt { color: var(--color-muted); font-size: var(--text-12); font-weight: 720; text-transform: uppercase; }
.meta-row dd { margin: 0; color: var(--color-text); font-size: var(--text-14); font-variant-numeric: tabular-nums; font-weight: 620; }
.metadata-note { margin: var(--space-4) 0 0; color: var(--color-muted); font-size: var(--text-12); }
.results-grid--related { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.related .card { min-height: 18rem; }

/* Hub de herramientas */
.tools-page { display: grid; gap: var(--space-12); }
.tools-hero, .calculator-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr); align-items: center; gap: var(--space-8); margin-top: var(--space-6); padding: clamp(1.5rem, 5vw, 3rem); overflow: hidden; border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(135deg, color-mix(in srgb, var(--color-brand-soft) 60%, var(--color-surface)), var(--color-surface) 55%, color-mix(in srgb, var(--color-accent-soft) 42%, var(--color-surface))); box-shadow: var(--shadow-2); }
.tools-hero::after, .calculator-hero::after { position: absolute; right: -4rem; bottom: -6rem; width: 16rem; height: 16rem; border: 2rem solid color-mix(in srgb, var(--color-brand) 8%, transparent); border-radius: 50%; content: ""; pointer-events: none; }
.tools-hero > *, .calculator-hero > * { position: relative; z-index: 1; }
.tools-hero h1, .calculator-hero h1 { max-width: 19ch; margin-bottom: var(--space-4); font-size: clamp(2.25rem, 5vw, 3.8rem); line-height: 1.04; letter-spacing: -.05em; }
.tools-hero > div > p:last-of-type, .calculator-hero > div > p { max-width: 50rem; margin-bottom: 0; color: var(--color-text-2); font-size: 1.08rem; }
.tools-promise { display: grid; gap: var(--space-2); }
.tools-promise span { min-height: 3.2rem; display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: color-mix(in srgb, var(--color-surface) 84%, transparent); color: var(--color-text-2); font-size: var(--text-14); font-weight: 680; }
.tools-promise strong { min-width: 4rem; color: var(--color-brand); font-size: var(--text-20); font-variant-numeric: tabular-nums; }
.tools-path { display: grid; gap: var(--space-5); }
.tools-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.tool-card { position: relative; min-height: 21rem; display: flex; align-items: flex-start; flex-direction: column; padding: var(--space-8); overflow: hidden; border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 26%, var(--color-surface))); box-shadow: var(--shadow-1); color: var(--color-text); text-decoration: none; transition: border-color var(--motion-fast), box-shadow var(--motion-fast), transform var(--motion-fast); }
.tool-card:hover { border-color: var(--color-brand); box-shadow: var(--shadow-2); color: var(--color-text); text-decoration: none; transform: translateY(-3px); }
.tool-card--calculator { background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-accent-soft) 42%, var(--color-surface))); }
.tool-step { margin-bottom: var(--space-5); padding: .35rem .65rem; border-radius: 999px; background: var(--color-brand-soft); color: var(--color-brand); font-size: var(--text-12); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.tool-card--calculator .tool-step { background: var(--color-accent-soft); color: var(--color-accent); }
.tool-icon { width: 3.25rem; height: 3.25rem; display: grid; place-items: center; margin-bottom: var(--space-4); border-radius: 1rem; background: var(--color-brand); color: var(--color-on-brand); box-shadow: 0 .65rem 1.5rem color-mix(in srgb, var(--color-brand) 24%, transparent); }
.tool-card--calculator .tool-icon, .calculator-hero-note .tool-icon { background: var(--color-accent); }
.tool-icon svg { width: 1.65rem; height: 1.65rem; }
.tool-card h3 { margin-bottom: var(--space-3); font-size: var(--text-24); }
.tool-card p { margin-bottom: var(--space-6); color: var(--color-text-2); }
.tool-card-link { margin-top: auto; color: var(--color-brand); font-weight: 760; }
.tools-method { display: grid; grid-template-columns: minmax(15rem, .7fr) minmax(0, 1.3fr); gap: var(--space-8); padding: clamp(1.5rem, 4vw, 2.5rem); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: var(--color-surface); box-shadow: var(--shadow-1); }
.tools-method h2 { max-width: 18ch; }
.tools-method-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.tools-method-grid article { padding: var(--space-4); border-left: .25rem solid var(--color-brand); border-radius: var(--radius-1); background: var(--color-bg); }
.tools-method-grid article:nth-child(2) { border-left-color: var(--color-accent); }
.tools-method-grid article:nth-child(3) { border-left-color: var(--color-violet); }
.tools-method-grid strong { color: var(--color-text); }
.tools-method-grid p { margin: var(--space-2) 0 0; color: var(--color-text-2); font-size: var(--text-14); }

/* Calculadora de precio y margen */
.calculator-page { display: grid; gap: var(--space-8); }
.calculator-hero { align-items: end; }
.calculator-trust { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-5); }
.calculator-trust span { padding: .45rem .7rem; border: 1px solid color-mix(in srgb, var(--color-accent) 25%, var(--color-line)); border-radius: 999px; background: var(--color-accent-soft); color: var(--color-text-2); font-size: var(--text-12); font-weight: 720; }
.calculator-hero-note { padding: var(--space-5); border: 1px solid var(--color-line); border-radius: var(--radius-2); background: color-mix(in srgb, var(--color-surface) 88%, transparent); }
.calculator-hero-note .tool-icon { margin-bottom: var(--space-4); }
.calculator-hero-note > strong { display: block; margin-bottom: var(--space-2); font-size: var(--text-18); }
.calculator-hero-note p { margin: 0; color: var(--color-text-2); font-size: var(--text-14); }
.calculator-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(20rem, 25rem); align-items: start; gap: var(--space-6); }
.calculator-form { min-width: 0; display: grid; gap: var(--space-4); }
.calculator-section { padding: var(--space-6); border: 1px solid var(--color-line); border-radius: var(--radius-2); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 12%, var(--color-surface))); box-shadow: var(--shadow-1); }
.calculator-section-head { display: flex; align-items: flex-start; gap: var(--space-3); margin-bottom: var(--space-5); }
.calculator-section-head > span { width: 2.4rem; height: 2.4rem; flex: 0 0 auto; display: grid; place-items: center; border-radius: .75rem; background: var(--color-brand-soft); color: var(--color-brand); font-size: var(--text-12); font-weight: 850; }
.calculator-section-head h2 { margin: 0 0 var(--space-1); font-size: var(--text-20); }
.calculator-section-head p { margin: 0; color: var(--color-muted); font-size: var(--text-14); }
.calculator-fields { display: grid; gap: var(--space-4); }
.calculator-fields--two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.calculator-fields--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.calculator-field { min-width: 0; display: grid; align-content: start; gap: var(--space-2); color: var(--color-text); font-size: var(--text-14); font-weight: 720; }
.calculator-field small { min-height: 2.6em; color: var(--color-muted); font-size: var(--text-12); font-weight: 500; line-height: 1.35; }
.input-shell { min-width: 0; min-height: 3.25rem; display: flex; align-items: center; overflow: hidden; border: 1px solid var(--color-line); border-radius: .75rem; background: var(--color-bg); transition: border-color var(--motion-fast), box-shadow var(--motion-fast); }
.input-shell:focus-within { border-color: var(--color-brand); box-shadow: 0 0 0 3px var(--color-focus); }
.input-shell b { flex: 0 0 auto; padding-inline: var(--space-3); color: var(--color-muted); font-size: var(--text-14); }
.input-shell input, .input-shell select { width: 100%; min-width: 0; min-height: 3.15rem; padding: .65rem var(--space-3); border: 0; outline: 0; background: transparent; color: var(--color-text); font: inherit; font-variant-numeric: tabular-nums; }
.input-shell b + input { padding-left: 0; }
.input-shell select { cursor: pointer; }
.calculator-actions, .calculator-result-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.calculator-error { padding: var(--space-4); border: 1px solid var(--color-coral); border-left-width: .35rem; border-radius: var(--radius-1); background: var(--color-coral-soft); color: var(--color-text); font-size: var(--text-14); font-weight: 650; }
.calculator-results { position: sticky; top: 5.5rem; padding: var(--space-6); border: 1px solid var(--color-line); border-top: .35rem solid var(--color-accent); border-radius: var(--radius-3); background: linear-gradient(150deg, var(--color-surface), color-mix(in srgb, var(--color-accent-soft) 42%, var(--color-surface))); box-shadow: var(--shadow-2); }
.calculator-results h2 { margin-bottom: var(--space-2); }
.calculator-result-intro { margin-bottom: var(--space-5); color: var(--color-text-2); font-size: var(--text-14); }
.result-primary { padding: var(--space-5); border-radius: var(--radius-2); background: linear-gradient(135deg, var(--color-accent), color-mix(in srgb, var(--color-accent) 72%, var(--color-brand))); color: #fff; }
.result-primary > span, .result-primary small { display: block; color: rgb(255 255 255 / .82); font-size: var(--text-12); font-weight: 650; }
.result-primary output { display: block; margin-block: var(--space-1); color: #fff; font-size: clamp(1.9rem, 4vw, 2.55rem); font-weight: 850; letter-spacing: -.045em; line-height: 1.1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.result-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-3); }
.result-pair > div { padding: var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: color-mix(in srgb, var(--color-surface) 86%, transparent); }
.result-pair span { display: block; color: var(--color-muted); font-size: var(--text-12); }
.result-pair output { display: block; margin-top: var(--space-1); color: var(--color-text); font-size: var(--text-18); font-weight: 800; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.result-breakdown { margin: var(--space-5) 0; }
.result-breakdown > div { display: flex; justify-content: space-between; gap: var(--space-3); padding-block: .6rem; border-bottom: 1px solid var(--color-line); }
.result-breakdown dt { color: var(--color-muted); font-size: var(--text-12); }
.result-breakdown dd { margin: 0; color: var(--color-text); font-size: var(--text-14); font-weight: 720; text-align: right; font-variant-numeric: tabular-nums; }
.calculator-results .local-note { margin: var(--space-5) 0 0; padding-top: var(--space-4); border-top: 1px solid var(--color-line); color: var(--color-muted); font-size: var(--text-12); }
.calculator-page[data-calculator-state="error"] .calculator-results { border-top-color: var(--color-coral); }
.calculator-content { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(18rem, .65fr); gap: var(--space-6); margin-top: var(--space-4); }
.calculator-content-main, .calculator-sources { padding: var(--space-8); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: var(--color-surface); box-shadow: var(--shadow-1); }
.calculator-content h2 { margin-bottom: var(--space-4); }
.calculator-content h3 { margin: var(--space-6) 0 var(--space-2); font-size: var(--text-20); }
.calculator-content p, .calculator-content li { color: var(--color-text-2); }
.calculator-content ul { display: grid; gap: var(--space-2); padding-left: 1.25rem; }
.calculator-formula { margin-top: var(--space-6); padding: var(--space-5); border-left: .35rem solid var(--color-violet); border-radius: var(--radius-1); background: var(--color-violet-soft); }
.calculator-formula strong, .calculator-formula code { display: block; }
.calculator-formula code { margin-block: var(--space-2); overflow-wrap: anywhere; color: var(--color-text); font-size: var(--text-16); font-weight: 720; }
.calculator-formula p { margin: 0; font-size: var(--text-14); }
.calculator-sources { align-self: start; background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 25%, var(--color-surface))); }
.calculator-sources h2 { font-size: var(--text-24); }
.calculator-sources ul { margin-block: var(--space-4); }
.calculator-sources .button { width: 100%; margin-top: var(--space-3); }

/* Matriz bid / no-bid */
.decision-page { display: grid; gap: var(--space-6); }
.decision-hero { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(15rem, .65fr); align-items: end; gap: var(--space-8); margin-top: var(--space-6); padding: clamp(1.5rem, 5vw, 3rem); overflow: hidden; border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(135deg, color-mix(in srgb, var(--color-brand-soft) 58%, var(--color-surface)), var(--color-surface) 58%, color-mix(in srgb, var(--color-violet-soft) 48%, var(--color-surface))); box-shadow: var(--shadow-2); }
.decision-hero h1 { max-width: 18ch; margin-bottom: var(--space-4); font-size: clamp(2.2rem, 5vw, 3.75rem); line-height: 1.06; letter-spacing: -.05em; }
.decision-hero > div:first-child > p:last-child { max-width: 52rem; margin: 0; color: var(--color-text-2); font-size: 1.08rem; }
.decision-proof { display: grid; gap: var(--space-2); }
.decision-proof span { min-height: 3.2rem; display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: color-mix(in srgb, var(--color-surface) 82%, transparent); color: var(--color-text-2); font-size: var(--text-14); font-weight: 650; }
.decision-proof strong { min-width: 3rem; color: var(--color-brand); font-size: var(--text-20); font-variant-numeric: tabular-nums; }
.decision-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(18rem, 24rem); align-items: start; gap: var(--space-6); }
.decision-form { display: grid; gap: var(--space-4); }
.decision-form fieldset { min-width: 0; margin: 0; padding: var(--space-5); border: 1px solid var(--color-line); border-radius: var(--radius-2); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 12%, var(--color-surface))); box-shadow: var(--shadow-1); }
.decision-form fieldset[data-hard="true"] { border-left: .3rem solid var(--color-coral); }
.decision-form legend { width: 100%; max-width: none; float: left; margin: 0 0 var(--space-2); padding: 0; color: var(--color-text); font-size: var(--text-18); font-weight: 780; line-height: 1.45; }
.decision-form fieldset > p { clear: both; margin: 0 0 var(--space-4); color: var(--color-muted); font-size: var(--text-14); }
.decision-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.decision-options label { min-height: 3rem; position: relative; display: grid; place-items: center; cursor: pointer; }
.decision-options input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.decision-options span { width: 100%; min-height: 3rem; display: grid; place-items: center; padding: .5rem; border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-bg); color: var(--color-text-2); font-size: var(--text-14); font-weight: 700; text-align: center; transition: border-color var(--motion-fast), background-color var(--motion-fast), color var(--motion-fast); }
.decision-options input:focus-visible + span { outline: 3px solid var(--color-focus); outline-offset: 2px; }
.decision-options label:nth-child(1) input:checked + span { border-color: var(--color-accent); background: var(--color-accent-soft); color: var(--color-accent); }
.decision-options label:nth-child(2) input:checked + span { border-color: var(--estado-pronto); background: var(--estado-pronto-bg); color: var(--estado-pronto); }
.decision-options label:nth-child(3) input:checked + span { border-color: var(--color-coral); background: var(--color-coral-soft); color: var(--color-coral); }
.decision-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.decision-result { position: sticky; top: 5.5rem; padding: var(--space-6); border: 1px solid var(--color-line); border-top: .35rem solid var(--color-brand); border-radius: var(--radius-3); background: linear-gradient(150deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 32%, var(--color-surface))); box-shadow: var(--shadow-2); }
.decision-result h2 { margin-bottom: var(--space-3); }
.decision-result > p:not(.eyebrow, .local-note) { color: var(--color-text-2); }
.decision-meter { height: .65rem; margin: var(--space-5) 0 var(--space-2); overflow: hidden; border-radius: 999px; background: var(--color-surface-3); }
.decision-meter span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--color-brand); transition: width var(--motion-fast); }
.decision-score { display: block; color: var(--color-brand); font-size: var(--text-32); font-variant-numeric: tabular-nums; }
.decision-result [data-decision-next] { margin-top: var(--space-5); padding-top: var(--space-5); border-top: 1px solid var(--color-line); }
.decision-result [data-decision-next] h3 { margin-bottom: var(--space-2); font-size: var(--text-16); }
.decision-result [data-decision-next] p, .decision-result [data-decision-next] li { color: var(--color-text-2); font-size: var(--text-14); }
.decision-result [data-decision-next] ul { display: grid; gap: var(--space-2); margin: 0; padding-left: 1.25rem; }
.decision-page[data-decision-state="bloqueada"] .decision-result, .decision-page[data-decision-state="debil"] .decision-result { border-top-color: var(--color-coral); background: linear-gradient(150deg, var(--color-surface), color-mix(in srgb, var(--color-coral-soft) 42%, var(--color-surface))); }
.decision-page[data-decision-state="fuerte"] .decision-result { border-top-color: var(--color-accent); background: linear-gradient(150deg, var(--color-surface), color-mix(in srgb, var(--color-accent-soft) 42%, var(--color-surface))); }

/* Compra Ágil */
.agile-hero { padding-bottom: var(--space-6); }
.hero-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.data-status { width: min(100%, var(--wrap)); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-5); margin: 0 auto var(--space-6); padding: var(--space-4) var(--space-5); border: 1px solid color-mix(in srgb, var(--color-accent) 22%, var(--color-line)); border-left: .35rem solid var(--color-accent); border-radius: var(--radius-2); background: linear-gradient(90deg, var(--color-accent-soft), color-mix(in srgb, var(--color-brand-soft) 45%, var(--color-surface))); color: var(--color-text-2); font-size: var(--text-14); }
.data-status strong { color: var(--color-text); }
.process-badge { display: inline-flex; min-height: 2rem; align-items: center; padding: .3rem .7rem; border: 1px solid var(--color-line); border-radius: 999px; background: var(--color-brand-soft); color: var(--color-brand); font-size: var(--text-12); font-weight: 750; }
.data-pending { padding: var(--space-3) var(--space-4); border-left: .25rem solid var(--estado-pronto); background: var(--color-surface-2); }
.document-list { display: grid; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.document-list li { display: grid; gap: .2rem; padding: var(--space-3) var(--space-4); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-bg); }
.document-list span { overflow-wrap: anywhere; color: var(--color-text); font-weight: 680; }
.document-list small { color: var(--color-muted); font-size: var(--text-12); }
.document-warning { margin-top: var(--space-5); padding: var(--space-4); border: 1px solid var(--estado-pronto); border-radius: var(--radius-1); background: color-mix(in srgb, var(--estado-pronto) 8%, var(--color-surface)); }
.document-warning p { margin: var(--space-2) 0; color: var(--color-text-2); font-size: var(--text-14); }
.document-warning a { font-weight: 720; }
.guide-page .legal-header h1 { max-width: 28ch; }
.guide-cta { margin: var(--space-5) 0 var(--space-8); }
[data-listing][data-catalog-state="loading"] [data-results] { opacity: .72; }

/* Footer */
.pie { margin-top: var(--space-16); border-top: .25rem solid #0b5bd3; background: #071523; }
.pie-in { width: min(100%, var(--wrap)); margin: 0 auto; padding: var(--space-12) var(--space-6) var(--space-8); color: #bdcada; font-size: var(--text-14); }
.footer-grid { display: grid; grid-template-columns: minmax(0, 2fr) repeat(2, minmax(10rem, 1fr)); gap: var(--space-8); }
.footer-about { max-width: 38rem; }
.marca--footer { display: inline-flex; margin-bottom: var(--space-3); }
.pie-in p { margin-bottom: var(--space-2); }
.pie .marca, .pie .marca-word { color: #f4f7fb; }
.pie .marca-mark { filter: none; }
.pie-in .mini { margin-bottom: 0; color: #8fa3b9; }
.pie-in nav { display: flex; align-items: flex-start; flex-direction: column; gap: var(--space-2); }
.pie-in nav strong { margin-bottom: var(--space-1); color: #f4f7fb; font-size: var(--text-14); }
.pie-in nav a { min-height: 2.25rem; display: inline-flex; align-items: center; color: #bdcada; text-decoration: none; }
.pie-in nav a:hover { color: #8ab8ff; text-decoration: underline; }
.footer-bottom { margin: var(--space-6) 0 0; padding-top: var(--space-4); border-top: 1px solid #25384b; color: #8fa3b9; font-size: var(--text-12); }

/* Páginas institucionales y legales */
.legal-page { max-width: 54rem; margin: var(--space-6) auto 0; }
.legal-header { position: relative; overflow: hidden; margin-bottom: var(--space-6); padding: var(--space-8); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: linear-gradient(145deg, var(--color-surface), color-mix(in srgb, var(--color-brand-soft) 52%, var(--color-surface))); box-shadow: var(--shadow-2); }
.legal-header::after { position: absolute; right: -2.5rem; bottom: -4rem; width: 10rem; height: 10rem; border: 1.5rem solid color-mix(in srgb, var(--color-brand) 10%, transparent); border-radius: 50%; content: ""; }
.legal-header h1 { max-width: 22ch; margin-bottom: var(--space-3); }
.legal-header > p:last-child { margin: 0; color: var(--color-muted); font-size: var(--text-14); }
.editorial-meta { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: .45rem 1rem; color: var(--color-muted); font-size: var(--text-14); }
.editorial-meta span { display: inline-flex; align-items: center; }
.editorial-meta span + span::before { margin-right: 1rem; color: var(--color-line-strong); content: "•"; }
.editorial-meta a { color: var(--color-brand); font-weight: 700; }
.legal-content { padding: var(--space-8); border: 1px solid var(--color-line); border-radius: var(--radius-3); background: var(--color-surface); box-shadow: var(--shadow-1); }
.legal-content h2 { margin: var(--space-8) 0 var(--space-3); font-size: var(--text-24); }
.legal-content h2:first-child { margin-top: 0; }
.legal-content p, .legal-content li { color: var(--color-text-2); }
.legal-content p { margin-bottom: var(--space-4); }
.legal-content ul { display: grid; gap: var(--space-2); padding-left: 1.35rem; }
.legal-content a { font-weight: 650; }
.legal-lead { color: var(--color-text) !important; font-size: 1.12rem; line-height: 1.75; }
.legal-table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--color-line); border-radius: var(--radius-1); }
.legal-table { width: 100%; min-width: 42rem; border-collapse: collapse; }
.legal-table th, .legal-table td { padding: var(--space-3); border-bottom: 1px solid var(--color-line); text-align: left; vertical-align: top; }
.legal-table th { background: var(--color-surface-2); color: var(--color-text); font-size: var(--text-12); text-transform: uppercase; }
.legal-table td { color: var(--color-text-2); font-size: var(--text-14); }
.legal-table tr:last-child td { border-bottom: 0; }
.legal-table code { color: var(--color-text); font-size: .9em; }
.faq-section { margin-top: var(--space-10); padding-top: var(--space-8); border-top: 1px solid var(--color-line); }
.faq-section h2 { margin-top: 0; }
.faq-list { display: grid; gap: var(--space-3); }
.faq-list details { overflow: hidden; border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-bg); }
.faq-list summary { position: relative; padding: var(--space-4) 3rem var(--space-4) var(--space-4); color: var(--color-text); font-weight: 760; cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { position: absolute; top: 50%; right: var(--space-4); transform: translateY(-50%); color: var(--color-brand); content: "+"; font-size: 1.4rem; line-height: 1; }
.faq-list details[open] summary { border-bottom: 1px solid var(--color-line); background: var(--color-brand-soft); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { margin: 0; padding: var(--space-4); }
.contact-card { margin-bottom: var(--space-8); padding: var(--space-6); border: 1px solid var(--color-line); border-radius: var(--radius-1); background: var(--color-bg); }
.contact-card h2 { margin-top: 0; }
.error-page { max-width: 42rem; margin: var(--space-16) auto; padding: var(--space-8); border: 1px solid var(--color-line); border-radius: var(--radius-2); background: var(--color-surface); box-shadow: var(--shadow-1); text-align: center; }
.error-page h1 { margin-bottom: var(--space-3); }
.error-page > p:not(.eyebrow) { margin-bottom: var(--space-6); color: var(--color-text-2); }

/* Estado de carga reutilizable */
.skeleton { min-height: 8rem; border-radius: var(--radius-1); background: linear-gradient(90deg, var(--color-surface-2) 25%, var(--color-surface-3) 50%, var(--color-surface-2) 75%); background-size: 200% 100%; animation: skeleton 1.2s ease-in-out infinite; }
@keyframes skeleton { to { background-position-x: -200%; } }

@media (max-width: 64rem) {
  .top-in { gap: var(--space-3); }
  .marca-tag { display: none; }
  .top nav { gap: var(--space-3); }
  .hero--home { grid-template-columns: minmax(0, 1.1fr) minmax(18rem, .9fr); gap: var(--space-8); }
  .hero--home h1 { font-size: clamp(2.45rem, 5.8vw, 3.55rem); }
  .filter-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .results-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .detail-layout { grid-template-columns: minmax(0, 1fr) 18rem; }
  .decision-hero { grid-template-columns: 1fr; }
  .decision-proof { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .decision-proof span { align-items: flex-start; flex-direction: column; gap: .1rem; }
  .tools-hero, .calculator-hero { grid-template-columns: 1fr; }
  .tools-promise { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tools-promise span { align-items: flex-start; flex-direction: column; gap: .1rem; }
  .calculator-fields--three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 48rem) {
  .top-in { grid-template-columns: 1fr auto; gap: 0 6px; padding-inline: 12px; }
  .top nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; gap: var(--space-5, 1.25rem); overflow-x: auto; scrollbar-width: none; }
  .top nav::-webkit-scrollbar { display: none; }
  .access-tools { grid-column: 2; grid-row: 1; }
  main { padding-inline: var(--space-4); }
  .hero { padding-block: var(--space-12) var(--space-6); }
  .hero--home { grid-template-columns: 1fr; gap: var(--space-6); }
  .hero--home h1 { max-width: 19ch; font-size: clamp(2.35rem, 10vw, 3.45rem); }
  .hero-pulse { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--space-4); }
  .pulse-head, .pulse-grid { grid-column: 1 / -1; }
  .pulse-priority { padding-bottom: var(--space-3); }
  .pulse-link { align-self: center; }
  .filter-panel { padding: var(--space-4); }
  .filter-panel-title { align-items: flex-start; flex-direction: column; gap: var(--space-2); }
  .filter-panel-title small { text-align: left; }
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .urgent-grid { grid-template-columns: 1fr; }
  .detail-hero { padding: var(--space-6); }
  .detail-highlights { grid-template-columns: 1fr; }
  .official-action { align-items: flex-start; flex-direction: column; }
  .official-buttons { width: 100%; flex-direction: column; }
  .official-buttons .button { width: 100%; }
  .detail-layout { grid-template-columns: 1fr; }
  .metadata-card { position: static; }
  .decision-layout { grid-template-columns: 1fr; }
  .decision-result { position: static; grid-row: 1; }
  .tools-grid, .tools-method, .calculator-layout, .calculator-content { grid-template-columns: 1fr; }
  .tools-method-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .calculator-results { position: static; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-about { grid-column: 1 / -1; }
}

@media (max-width: 36rem) {
  .breadcrumb { width: 100%; border-radius: var(--radius-2); }
  .breadcrumb ol { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .breadcrumb ol::-webkit-scrollbar { display: none; }
  .breadcrumb li { flex: 0 0 auto; }
  .breadcrumb [aria-current="page"] { max-width: 12rem; }
  .filter-grid, .results-grid, .results-grid--related { grid-template-columns: 1fr; }
  .filter-footer { align-items: flex-start; flex-direction: column; gap: var(--space-1); }
  .market-stats { grid-template-columns: 1fr; }
  .market-stat { padding: var(--space-3) var(--space-4); }
  .market-stat span:not(.market-stat-icon) { font-size: var(--text-24); }
  .market-stat-icon { width: 2.75rem; height: 2.75rem; }
  .section-heading { align-items: flex-start; }
  .urgent-section, .detail-section, .metadata-card { padding: var(--space-4); }
  .detail-status, .card-top { align-items: flex-start; flex-direction: column; }
  .chip-estado { white-space: normal; }
  .button--primary { width: 100%; }
  .decision-options { grid-template-columns: 1fr; }
  .decision-proof { grid-template-columns: 1fr; }
  .decision-proof span { align-items: center; flex-direction: row; gap: var(--space-3); }
  .tools-promise, .tools-method-grid, .calculator-fields--two, .calculator-fields--three { grid-template-columns: 1fr; }
  .tools-promise span { align-items: center; flex-direction: row; gap: var(--space-3); }
  .tool-card, .calculator-section, .calculator-content-main, .calculator-sources { padding: var(--space-5); }
  .calculator-actions, .calculator-result-actions { align-items: stretch; flex-direction: column; }
  .calculator-actions .button, .calculator-actions .button-link, .calculator-result-actions .button { width: 100%; }
  .result-pair { grid-template-columns: 1fr; }
  .data-status { align-items: flex-start; flex-direction: column; padding: var(--space-4); }
  .hero-actions .button, .guide-cta .button { width: 100%; }
  .footer-grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .footer-about { grid-column: auto; }
  .legal-header, .legal-content, .error-page { padding: var(--space-5, 1.25rem); }
  .editorial-meta { display: grid; gap: var(--space-2); }
  .editorial-meta span + span::before { display: none; }
}

@media (max-width: 22rem) {
  main, .pie-in { padding-inline: var(--space-3); }
  .top-in { gap: 0 4px; padding-inline: 8px; }
  .marca { gap: 6px; font-size: 18px; }
  .marca-mark { width: 32px; height: 32px; }
  .access-tools, .text-size-controls { gap: 4px; }
  .text-size-controls button, .theme-toggle { width: 40px; height: 40px; }
  .top nav { min-width: 0; max-width: 100%; gap: var(--space-3); }
  .top nav a { font-size: var(--text-12); }
  .filter-panel, .detail-hero { padding: var(--space-3); }
  .tools-hero, .calculator-hero { padding: var(--space-5); }
  .tools-hero h1, .calculator-hero h1 { font-size: 2.1rem; }
  .calculator-results { padding: var(--space-4); }
  .result-primary { padding: var(--space-4); }
  .search-field { padding-inline: var(--space-3); }
  .hero--home h1 { font-size: 2.15rem; }
  .hero-pulse { display: block; padding: var(--space-4); }
  .pulse-head { align-items: flex-start; flex-direction: column; }
  .pulse-link { margin-bottom: var(--space-4); }
  .pulse-grid { grid-template-columns: 1fr; }
  .access-tools { gap: var(--space-1); }
  .text-size-controls { gap: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media print {
  .top, .pie, .breadcrumb, .official-action, .related, .metadata-card, .button, .button-link { display: none !important; }
  body, main { background: #fff !important; color: #111 !important; }
  main { width: 100%; padding: 0; }
  .detail-hero, .detail-section { break-inside: avoid; border: 1px solid #bbb; box-shadow: none; }
  .detail-layout { display: block; }
  .detail-main { display: block; }
  .detail-section { margin-top: 1rem; }
  .checklist li { break-inside: avoid; }
  .decision-layout { display: block; }
  .decision-result { position: static; margin-bottom: 1rem; border: 1px solid #bbb; box-shadow: none; }
  .decision-form fieldset { break-inside: avoid; box-shadow: none; }
  .calculator-hero-note, .calculator-content, .calculator-actions, .calculator-result-actions, .calculator-sources .button { display: none !important; }
  .calculator-layout { display: block; }
  .calculator-form { display: block; }
  .calculator-section { break-inside: avoid; margin-bottom: 1rem; box-shadow: none; }
  .calculator-results { position: static; break-inside: avoid; border: 1px solid #bbb; box-shadow: none; }
}