:root{
  --bg:#ffffff; --surface:#ffffff; --ink:#181513; --ink-soft:#4d453d;
  --muted:#83786a; --border:#e7e1d4; --accent:#e13a1f; --accent-ink:#fff8ee;
  --accent-2:#181513; --tag-bg:#f5f1e7; --radius:6px; --maxw:960px;
  --font-serif: "Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --font-sans: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --font-mono: ui-monospace,Menlo,Consolas,monospace;
}
/* Modo claro fijo a propósito: fondo blanco siempre, sin depender del modo
   del sistema del visitante — más predecible y más minimalista. */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--ink); font-family:var(--font-sans);
  line-height:1.6; font-size:17px;
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}
h1,h2,h3{font-family:var(--font-serif); line-height:1; font-weight:700; color:var(--ink); letter-spacing:-.01em}
h1{font-size:clamp(2.4rem,6vw,4.2rem); line-height:.98; margin:0 0 .3em; letter-spacing:-.02em}
h2{font-size:clamp(1.35rem,3vw,1.8rem); margin:0 0 .55em}
h3{font-size:1.15rem; margin:0 0 .3em; font-weight:700}
p{margin:0 0 1em}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}
.skip-link{position:absolute; left:-999px; top:0; background:var(--accent); color:var(--accent-ink); padding:.6em 1em; z-index:100}
.skip-link:focus{left:0}

.site-header{border-bottom:1px solid var(--border); padding:16px 0; position:sticky; top:0; background:var(--bg); z-index:10}
.site-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap}
.brand{font-family:var(--font-serif); font-weight:700; font-size:1.05rem; color:var(--ink)}
.brand:hover{text-decoration:none}
.site-header nav{display:flex; gap:16px; flex-wrap:wrap; font-size:.74rem; text-transform:uppercase; letter-spacing:.07em; font-weight:600}
.site-header nav a{color:var(--muted)}
.site-header nav a:hover{text-decoration:none; color:var(--ink)}
.site-header nav a.active{color:var(--accent)}

.hero{padding:72px 0 44px; border-bottom:1px solid var(--border)}
.eyebrow{display:inline-block; text-transform:uppercase; letter-spacing:.08em; font-size:.7rem;
  background:var(--accent); color:var(--accent-ink); font-weight:700; margin:0 0 1.1em;
  padding:.38em .7em; border-radius:3px}
.breadcrumb{font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); font-weight:600; margin:0 0 1em}
.breadcrumb a{color:var(--muted); text-decoration:underline}
.breadcrumb a:hover{color:var(--accent)}

.hero-tagline{position:relative; font-family:var(--font-serif); font-style:italic; font-weight:600;
  font-size:clamp(1.25rem,2.6vw,1.7rem); line-height:1.35; color:var(--ink-soft); max-width:640px;
  padding-left:.9em; border-left:3px solid var(--accent)}
.narrative-arc{display:block; width:150px; height:auto; margin:1.3em 0 1.5em; color:var(--accent)}
.narrative-arc path{fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round}
.narrative-arc circle{fill:currentColor}

.trajectory{padding:38px 0 8px}

.hero-summary{max-width:680px; color:var(--ink-soft)}
.hero-actions{display:flex; gap:12px; flex-wrap:wrap; margin-top:1.4em}
.btn{display:inline-block; padding:.7em 1.2em; border-radius:4px; border:1px solid var(--border); color:var(--ink); font-weight:700; font-size:.92rem}
.btn:hover{text-decoration:none; border-color:var(--accent); color:var(--accent)}
.btn-primary{background:var(--accent); color:var(--accent-ink); border-color:var(--accent)}
.btn-primary:hover{opacity:.88; color:var(--accent-ink)}

.stats-band{background:var(--accent); color:var(--accent-ink)}
.stats-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:20px; padding:26px 24px}
.stat{display:flex; flex-direction:column}
.stat-value{font-family:var(--font-serif); font-size:2.1rem; font-weight:700; color:var(--accent-ink)}
.stat-label{font-size:.82rem; color:var(--accent-ink); opacity:.82}

main{counter-reset:section}
.section{padding:46px 0; counter-increment:section}
.section-lede{color:var(--ink-soft); max-width:680px}
.section-head-row{display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:10px}
.page-head{padding-bottom:10px}
.page-head h1{margin-bottom:.25em}
.jump-links{font-size:.85rem; color:var(--muted)}

.section > h2, .section-head-row > h2{position:relative; padding-left:1.5em}
.section > h2::before, .section-head-row > h2::before{
  content:counter(section,decimal-leading-zero); position:absolute; left:0; top:.08em;
  font-family:var(--font-mono); font-size:.62rem; font-weight:700; color:var(--accent); letter-spacing:0;
}

.timeline-wrap{overflow-x:auto; margin:1.6em 0 .4em; padding-bottom:4px}
.timeline-chart{display:block; height:100px; width:auto; min-width:100%; color:var(--accent)}
.tl-bar{fill:currentColor; opacity:.88}
.tl-year{font-family:var(--font-mono); font-size:7.5px; fill:var(--muted)}
.tl-count{font-family:var(--font-mono); font-size:7.5px; fill:var(--ink-soft); font-weight:700}

.teaser-row{display:grid; grid-template-columns:1fr 1fr; gap:18px}
@media (max-width:720px){.teaser-row{grid-template-columns:1fr}}
.teaser-card{display:block; background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:0 var(--radius) var(--radius) 0; padding:22px}
.teaser-card:hover{border-left-color:var(--accent); background:var(--tag-bg); text-decoration:none}
.teaser-card p{color:var(--ink-soft); font-size:.92rem}

.topics-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:18px}
.topic-card{display:block; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px; transition:transform .12s ease}
.topic-card:hover{border-color:var(--accent); text-decoration:none; transform:translateY(-2px)}
.topic-card p{color:var(--ink-soft); font-size:.92rem; margin-bottom:.6em}
.topic-count{font-size:.85rem; color:var(--accent); font-weight:700}

.pub-grid{display:grid; gap:14px}
.pub-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:20px 22px}
.pub-kicker{font-family:var(--font-mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); font-weight:600}
.pub-card h3{margin-top:.3em; font-weight:700}
.pub-meta{color:var(--ink-soft); margin-bottom:.2em}
.pub-venue{color:var(--muted); font-size:.92rem; font-style:italic}
.pub-foot{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-top:.8em}
.pub-doi{font-size:.85rem; font-weight:700}
.pub-doi--muted{color:var(--muted); font-weight:400; font-style:italic}
.pub-tags{display:flex; gap:6px; flex-wrap:wrap}
.tag{background:var(--tag-bg); color:var(--ink-soft); padding:.25em .6em; border-radius:3px; font-size:.74rem; font-family:var(--font-mono)}
.tag:hover{text-decoration:none; color:var(--accent)}
.count{color:var(--muted); font-weight:400; font-size:1rem; font-family:var(--font-mono)}

.exp-block{margin-bottom:1.6em}
.exp-block h3{margin-bottom:.3em}
.exp-block .period{color:var(--muted); font-weight:400; font-size:.85rem; font-family:var(--font-mono)}
.exp-block ul{margin:0; padding-left:1.2em}
.exp-block li{margin-bottom:.35em; color:var(--ink-soft)}

.two-col{display:grid; grid-template-columns:1fr 1fr; gap:40px}
@media (max-width:720px){.two-col{grid-template-columns:1fr}}
.plain-list{margin:0; padding-left:1.2em}
.plain-list li{margin-bottom:.5em; color:var(--ink-soft)}

.prose p{color:var(--ink-soft); max-width:70ch}
.prose p:first-of-type{font-family:var(--font-serif); font-size:1.15rem; color:var(--ink)}

.pub-detail-authors{font-size:1.05rem; color:var(--ink-soft)}
.pub-detail-venue{color:var(--muted); font-style:italic}
.citation-box{background:var(--surface); border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:0 var(--radius) var(--radius) 0; padding:18px; white-space:pre-wrap; font-family:var(--font-mono); font-size:.92rem; color:var(--ink-soft)}
.muted{color:var(--muted); font-style:italic}

.site-footer{border-top:1px solid var(--border); padding:32px 0; margin-top:40px; color:var(--muted); font-size:.88rem}
.footer-links a{color:var(--muted)}

@media (max-width:600px){
  body{font-size:16px}
  .hero{padding:48px 0 30px}
  .section > h2, .section-head-row > h2{padding-left:1.3em}
}

/* --- CV imprimible: la página /cv/ se genera con los mismos datos que el
   resto del sitio, así que "descargar el CV" es imprimir esta página — nunca
   hay un PDF aparte que quede desactualizado. --- */
.cv-print-head{display:none}
kbd{font-family:var(--font-mono); background:var(--tag-bg); border:1px solid var(--border); border-radius:3px; padding:.1em .4em; font-size:.85em}
@media print{
  .site-header, .site-footer, .no-print{display:none !important}
  .cv-print-head{display:block !important; border-bottom:2px solid #000; padding-bottom:10px; margin-bottom:10px}
  .cv-print-name{font-family:var(--font-serif); font-size:20pt; font-weight:700; color:#000; margin:0 0 .2em}
  .cv-print-head p{font-size:9.5pt; color:#000; margin:0}
  body{font-size:10.5pt; background:#fff; color:#000}
  .wrap{max-width:100%}
  a{color:#000 !important; text-decoration:none}
  .section{padding:8px 0; break-inside:avoid-page}
  .section > h2::before, .section-head-row > h2::before{display:none}
  h2{font-size:12.5pt; border-bottom:1px solid #999; padding-bottom:3px; margin-top:12px; padding-left:0}
  .cv-cite-list li{font-size:9pt; margin-bottom:5px; break-inside:avoid; color:#000}
  .plain-list{padding-left:16px}
  .plain-list li{color:#000}
  .prose p{color:#000}
  @page{margin:1.6cm}
}
