/* carlosjofre.com — páginas de contenido (guías, conceptos, casos, datos, herramientas).
   Complementa site.css y usa sus tokens; la cargan solo las páginas que genera build_contenido.py. */

.hero--art{padding-bottom:clamp(1.6rem,1rem + 2vw,2.8rem)}
.hero--art h1{max-width:22ch;font-size:clamp(2.1rem,1.4rem + 3vw,3.5rem)}
.hero--art .lead{max-width:68ch}
.art-meta{margin:1.3rem 0 0;font-size:.86rem;color:var(--ink-3)}
.art-meta a{color:var(--ink-2)}

.art{padding-top:clamp(1rem,.6rem + 1.5vw,2rem)}
.prose{max-width:860px}
.prose>h2{font-size:clamp(1.5rem,1.2rem + 1.1vw,2.05rem);margin:2.4em 0 .6em;line-height:1.15}
.prose>h2:first-child{margin-top:0}
.prose>h3{margin:1.9em 0 .5em}
.prose>p,.prose>ul,.prose>ol{max-width:72ch;color:var(--ink-2)}
.prose>ul,.prose>ol{margin:0 0 1.2em}
.prose>ol{padding-left:1.4rem}
.prose li{margin-bottom:.5rem}
.prose strong{color:var(--ink)}
.prose .table-wrap{margin:1.4rem 0 1.8rem}
.prose table{min-width:480px}
.prose .callout{margin:1.6rem 0;max-width:none}
.prose .callout h3{margin:0 0 .5rem}
.prose .callout p+p,.prose .callout ul{margin-top:.7rem}
.prose .callout ul{margin-bottom:0;color:var(--ink-2)}

/* «En breve»: los puntos que responde la página */
.claves{margin:0 0 2rem;border-left-color:var(--ok)}
.claves .eyebrow{margin-bottom:.8rem;color:var(--ok-ink)}
.claves .check-list{margin:0;max-width:none}
.claves .check-list li{color:var(--ink-2)}
.claves .check-list li+li{margin-top:.45rem}

/* Índice de la página */
.toc{margin:0 0 2.2rem;padding:1.1rem 1.4rem;border:1px solid var(--line);border-radius:var(--r);background:var(--paper-2)}
.toc .eyebrow{margin-bottom:.6rem}
.toc ol{margin:0;padding-left:1.2rem;columns:2;column-gap:2.4rem;max-width:none;font-size:.94rem}
.toc li{break-inside:avoid;margin-bottom:.3rem}
.toc a{color:var(--ink-2);text-decoration-color:var(--line-2)}
.toc-linea{font-size:.94rem;line-height:2;max-width:none}
@media (max-width:640px){.toc ol{columns:1}}

/* Fuentes */
.fuentes{padding-block:clamp(2.4rem,1.6rem + 3vw,4rem)}
.fuentes h2{font-size:clamp(1.4rem,1.15rem + .9vw,1.8rem)}
.lista-fuentes{list-style:none;padding:0;margin:0;max-width:none;display:grid;gap:.55rem;font-size:.93rem;color:var(--ink-2)}
.lista-fuentes li{margin:0;padding-left:1.1rem;position:relative}
.lista-fuentes li::before{content:"";position:absolute;left:0;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--sun)}

.cierre{padding-top:clamp(2rem,1.4rem + 2.4vw,3.6rem)}
.soft .prose .section-head{margin-bottom:1rem}
.soft .prose .section-head h2{font-size:clamp(1.5rem,1.2rem + 1.1vw,2.05rem)}
.prose .faq{max-width:none}
.prose .faq p{color:var(--ink-2);max-width:72ch}
.prose .mas{margin:1rem 0 0}

/* Índices y tarjetas */
.cards.indice{margin-top:.6rem}
.cards .card h3 a{color:var(--ink);text-decoration:none}
.cards .card h3 a:hover{color:var(--sun-ink)}
.cards .card .cluster{margin:0 0 .7rem}
.cards .card p{font-size:.95rem;color:var(--ink-2)}
.prose .cards{margin:1.4rem 0 1.8rem}

/* Fichas de proyectos CORFO y eventos */
.proyecto{display:flex;flex-direction:column}
dl.mini{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.7rem 1.2rem;margin:.9rem 0 .8rem;padding:.9rem 0 0;border-top:1px solid var(--line)}
dl.mini dt{font:600 .68rem/1.3 var(--sans);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3)}
dl.mini dd{margin:.15rem 0 0;font-weight:600;font-size:.95rem;color:var(--ink);font-variant-numeric:tabular-nums}
.enlaces{font-size:.86rem;margin:auto 0 0;padding-top:.5rem}
.nota-datos{font-size:.88rem;max-width:72ch}
.eventos{display:grid;gap:0;margin:1.2rem 0 1.8rem}
.evento{padding:1.5rem 0;border-top:1px solid var(--line)}
.evento:last-child{border-bottom:1px solid var(--line)}
.evento .eyebrow{margin-bottom:.5rem}
.evento h3{margin:0 0 .45rem}
.evento p{max-width:72ch;color:var(--ink-2);margin-bottom:.5rem}

/* Tablas de datos y tarifario */
table.datos th[scope=row]{font-weight:640;white-space:nowrap}
table.datos td.num,table.datos th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.datos small{color:var(--ink-3)}
table.tarifario th[scope=row]{vertical-align:top;font-weight:600;min-width:11rem;background:color-mix(in srgb,var(--paper-2) 55%,transparent)}
table.tarifario th[scope=row] a{color:var(--ink)}
table.tarifario td.price{white-space:nowrap;font-weight:640;color:var(--ink)}
table.tarifario td.price small{display:block;font-weight:400;color:var(--ink-3)}
.descargas{display:flex;gap:.6rem;flex-wrap:wrap;margin:0 0 1.6rem}

/* Herramientas (cotizador y calculadora) */
.herramienta{border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);box-shadow:var(--shadow-2);
  padding:clamp(1.3rem,1rem + 1.6vw,2.2rem);margin:1.2rem 0 2rem;display:grid;gap:1.1rem}
.herramienta .field{display:grid;gap:.4rem;margin:0}
.herramienta label{font-weight:600;font-size:.92rem;color:var(--ink)}
.herramienta input,.herramienta select{font:inherit;padding:.75rem .9rem;border:1px solid var(--line-2);border-radius:12px;background:var(--paper);
  color:var(--ink);width:100%;min-height:48px}
.herramienta input:focus-visible,.herramienta select:focus-visible{outline:2px solid var(--sun);outline-offset:2px}
.herramienta .field-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1rem}
.herramienta .hint{font-size:.84rem;color:var(--ink-3);margin:0;max-width:none}
.herramienta .btn{justify-self:start}
.herramienta .resultado{border-top:1px solid var(--line);padding-top:1.1rem}
.herramienta .resultado ul{list-style:none;padding:0;margin:0;max-width:none;display:grid;gap:.5rem}
.herramienta .resultado li{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:.7rem .9rem;border:1px solid var(--line);
  border-radius:12px;margin:0;color:var(--ink-2)}
.herramienta .resultado li.aplica{border-color:var(--sun);background:color-mix(in srgb,var(--sun-3) 28%,transparent);color:var(--ink)}
.herramienta .resultado li strong{white-space:nowrap;text-align:right}
.herramienta .resultado li small{display:block;font-weight:400;color:var(--ink-3)}
.pr-num{font-family:var(--serif);font-size:clamp(2.6rem,2rem + 3vw,4rem);line-height:1;margin:0 0 .8rem;letter-spacing:-.03em;color:var(--ink);max-width:none}
.pr-num small{display:block;font:600 .74rem/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-top:.5rem}