/* Blog de memorybrain.ai: papel, tinta y sello. Una sola pieza grande en color por bloque. */
:root{
  --paper:#f5f0e6;--paper-2:#ece5d6;--ink:#17140f;--ink-dim:#4f4a40;--ink-faint:#6f695c;--line:#d9d0bd;
  --seal:#b23a24;--seal-ink:#fff7ee;--band:#17140f;--band-ink:#f5f0e6;--band-dim:#b9b09d;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#14120e;--paper-2:#1c1913;--ink:#f1ebdd;--ink-dim:#c2baa7;--ink-faint:#9b9381;--line:#332e24;
  --seal:#e8824d;--seal-ink:#1a0d08;--band:#efe8d8;--band-ink:#17140f;--band-dim:#4f4a40;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6}
a{color:inherit;text-decoration-color:var(--seal);text-underline-offset:3px}
a:hover{color:var(--seal)}

.top{display:flex;align-items:center;justify-content:space-between;gap:16px;max-width:1120px;margin:0 auto;padding:18px 16px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--serif);font-weight:600;font-size:1.15rem}
.brand img{width:28px;height:28px;border-radius:7px}
.top nav{display:flex;gap:18px;font-size:.95rem;color:var(--ink-dim)}
.top nav a{text-decoration:none;white-space:nowrap}
@media (max-width:520px){.top nav{gap:12px;font-size:.86rem}.top nav a[href="/openbrain/"]{display:none}}

.kicker{font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 14px}
.dek{font-family:var(--serif);font-style:italic;color:var(--ink-dim)}

/* Artículo */
.post{max-width:1120px;margin:0 auto;padding:32px 16px 0}
.post-head{max-width:52rem;margin:0 auto 48px}
.post-head h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.4rem,7vw,4.6rem);line-height:1.12;letter-spacing:-.015em;margin:0 0 24px}
.post-head .dek{font-size:clamp(1.2rem,2.4vw,1.5rem);line-height:1.45;margin:0;max-width:40rem}
.post-grid{display:grid;grid-template-columns:1fr;gap:28px;max-width:52rem;margin:0 auto}
.margin{border-top:1px solid var(--line);padding-top:18px;font-size:.92rem;color:var(--ink-dim)}
.margin .by{display:flex;gap:12px;align-items:center;margin:0 0 18px}
.margin .by img{width:36px;height:36px;border-radius:9px}
.margin .by strong{color:var(--ink)}
.insight{border-top:1px solid var(--line);padding-top:14px;margin:0 0 18px}
.insight .label{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;color:var(--seal);margin:0 0 4px}
.insight p{margin:0;font-family:var(--serif);font-size:1.05rem;line-height:1.45;color:var(--ink)}
.margin .lang{margin:0}

.prose{font-family:var(--serif);font-size:1.22rem;line-height:1.72;counter-reset:none}
.prose p{margin:0 0 1.15em;max-width:36rem}
.prose>p:first-child::first-letter{float:left;font-size:4.1em;line-height:.82;padding:.06em .1em 0 0;color:var(--seal);font-weight:600}
.prose h2{font-family:var(--serif);font-weight:600;font-size:1.65rem;line-height:1.2;margin:2.2em 0 .7em;max-width:36rem;position:relative}
.prose h2 .num{display:block;font-size:3.4rem;line-height:1;color:var(--seal);font-weight:400;margin-bottom:.15em;font-variant-numeric:lining-nums}
.pull{margin:2.2em 0;padding:0;max-width:40rem}
.pull p{font-family:var(--serif);font-size:clamp(1.6rem,3.6vw,2.2rem);line-height:1.25;color:var(--seal);margin:0;max-width:none}
.pull p::before{content:"“"}
.pull p::after{content:"”"}

@media (min-width:1000px){
  .post-head{margin-left:calc(14rem + 48px);max-width:none}
  .post-grid{grid-template-columns:14rem minmax(0,1fr);gap:48px;max-width:none}
  .margin{align-self:start}
  .prose h2 .num{position:absolute;left:calc(-14rem - 48px);top:-.1em;width:14rem;text-align:right;font-size:4.6rem;margin:0}
  .pull{margin-left:-3rem}
}

.cta{background:var(--band);color:var(--band-ink);border-radius:18px;padding:36px 28px;margin:72px auto 0;max-width:52rem}
@media (min-width:1000px){.cta{margin-left:calc(14rem + 48px);max-width:40rem}}
.cta h2{font-family:var(--serif);font-weight:600;font-size:1.8rem;line-height:1.15;margin:0 0 10px}
.cta p{color:var(--band-dim);margin:0 0 22px;max-width:34rem}
.ctas{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.btn{display:inline-block;background:var(--seal);color:var(--seal-ink);text-decoration:none;font-weight:600;padding:.75rem 1.2rem;border-radius:999px}
.btn:hover{color:var(--seal-ink);filter:brightness(1.06)}
.cta .alt{color:var(--band-ink)}
.back{max-width:52rem;margin:32px auto 0;font-size:.95rem}
@media (min-width:1000px){.back{margin-left:calc(14rem + 48px)}}

/* Índice */
.index{max-width:1120px;margin:0 auto;padding:40px 16px 0}
.index-head{max-width:46rem;margin:0 0 56px}
.index-head h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.4rem,7vw,4.4rem);line-height:1.12;letter-spacing:-.015em;margin:0 0 20px}
.index-head .dek{font-size:1.25rem;margin:0}
.entries{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.entries li{display:grid;grid-template-columns:1fr;gap:6px;padding:32px 0;border-bottom:1px solid var(--line)}
.entries .num{font-family:var(--serif);font-size:3.2rem;line-height:1;color:var(--seal)}
.entries h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,3.6vw,2.3rem);line-height:1.12;margin:0 0 6px}
.entries h2 a{text-decoration:none}
.entries .en-title{font-family:var(--serif);color:var(--ink-faint);margin:0 0 12px}
.entries .dek{font-size:1.12rem;margin:0 0 14px;max-width:40rem}
.entries .links{margin:0;font-size:.95rem}
@media (min-width:760px){
  .entries li{grid-template-columns:9rem minmax(0,1fr);gap:24px}
  .entries .num{font-size:5.2rem;text-align:right;padding-right:8px}
}

.foot{max-width:1120px;margin:72px auto 0;padding:24px 16px 48px;border-top:1px solid var(--line);font-size:.88rem;color:var(--ink-faint);display:flex;flex-wrap:wrap;gap:16px}
.foot a{text-decoration:none}

/* Skills de Open Brain (/openbrain/skills/) */
.stage{display:grid;grid-template-columns:1fr;gap:8px;padding:36px 0;border-top:1px solid var(--line)}
.stage h2{font-family:var(--serif);font-weight:600;font-size:2.4rem;line-height:1.1;color:var(--seal);margin:0}
.stage>.dek{margin:0 0 12px;font-size:1.1rem}
.skills{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr;gap:18px 32px}
.skills a{text-decoration:none}
.skills code{font-size:.95rem;font-weight:600;color:var(--ink)}
.skills a:hover code{color:var(--seal)}
.skills p{margin:4px 0 0;color:var(--ink-dim);font-size:.98rem;max-width:34rem}
.checked{font-size:.88rem;color:var(--ink-faint);margin:24px 0 0}
@media (min-width:760px){
  .stage{grid-template-columns:14rem minmax(0,1fr);gap:24px}
  .stage>.dek{grid-column:1;margin:0}
  .stage h2{grid-row:1}
  .skills{grid-column:2;grid-row:1 / span 2;grid-template-columns:1fr 1fr}
}
