/* ============================================================
   notas.css — HOJA DE ESTILOS ÚNICA de las notas md-to-html
   arieldistefano.com/md-to-html/ · creada 2026-08-26
   Los generadores (html-from-md.py / sop-publish) solo generan
   HTML — los estilos viven ACÁ (modificar sin regenerar notas)
   ============================================================ */
:root {
  --ink: #0B1F33;
  --ink-soft: #4A6480;
  --paper: #F5F9FC;
  --accent: #35D6E4;
  --accent-blue: #2563EB;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Inter,sans-serif;font-size:16px;line-height:1.75;color:#0B1F33;background:#F5F9FC;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.section{width:100%;padding:40px 0}
.section-inner{max-width:680px;margin:0 auto;padding:0 20px}
.section .accent-bar{height:4px;width:100%;margin-bottom:32px}
.hero{min-height:70vh;display:flex;align-items:center;padding:60px 0}
.hero .section-inner{max-width:720px}
.section-label{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;letter-spacing:3px;text-transform:uppercase;margin-bottom:20px;opacity:.5}
.hero-title{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(32px,8vw,64px);line-height:1.08;margin-bottom:20px}
.hero-subtitle{font-size:clamp(16px,3vw,22px);line-height:1.55;opacity:.75;margin-bottom:28px;font-weight:300}
.hero-meta{font-size:13px;opacity:.45;display:flex;gap:8px;flex-wrap:wrap}
/* el autor visible en TODAS las notas (vía CSS — sin regenerar) 2026-08-26 */
.hero-meta::before{content:"Por Ariel Di Stefano · ";font-family:'Plus Jakarta Sans',sans-serif;font-weight:600}
.section-h2{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:clamp(22px,4vw,34px);line-height:1.15;margin-bottom:20px}
.body-text p{margin-bottom:1.25em;font-size:inherit;line-height:1.75}
.body-text p:last-child{margin-bottom:0}
.body-text strong{font-weight:600}
.body-text em{font-style:italic}
.body-text ul,.body-text ol{margin:0 0 1.25em 20px}
.body-text li{margin-bottom:6px;line-height:1.7}
.body-text code.inline-code{font-family:JetBrains Mono,monospace;font-size:.875em;background:rgba(0,0,0,.06);padding:2px 6px;border-radius:3px}
.body-text table{width:100%;border-collapse:collapse;margin:24px 0;font-size:15px}
.body-text th,.body-text td{padding:10px 12px;text-align:left;border:1px solid rgba(0,0,0,.08)}
.body-text th{font-weight:600;background:rgba(0,0,0,.03)}
blockquote{font-family:Inter,serif;font-size:1.05em;font-style:italic;border-left:3px solid;padding:16px 20px;margin:28px 0;line-height:1.65;border-radius:0 4px 4px 0}
pre{font-family:JetBrains Mono,monospace;font-size:14px;line-height:1.5;padding:20px;border-radius:6px;overflow-x:auto;margin:24px 0;background:#0B1F33;color:#EAF6FF}
.finish-note{margin-top:40px;font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;opacity:.4}

/* ── la firma de Ariel — imagen en vez del texto "-- Ariel Di Stefano" (2026-08-26) ── */
.finish-note{background:url('firma.png') no-repeat left center;min-height:88px;color:transparent;text-indent:-9999px}

.footer{background:#0B1F33;color:#EAF6FF;width:100%;padding:64px 0 40px}
.footer-inner{max-width:680px;margin:0 auto;padding:0 20px}
.footer-name{font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;font-size:22px;margin-bottom:8px}
.footer-desc{font-size:15px;line-height:1.6;opacity:.7;margin-bottom:16px}
.footer-links{font-size:14px;opacity:.6;margin-bottom:32px}
.footer-links a{color:#F0EDE6;text-decoration:underline;text-underline-offset:2px}
.footer-links a:hover{opacity:.8}
.footer-sep{margin:0 8px;opacity:.4}
.share-section{margin-bottom:32px;padding:28px 0 36px;border-top:1px solid rgba(240,237,230,.15);background:var(--ink)}
.share-label{font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;margin-bottom:16px;opacity:.7}
.share-buttons{display:flex;flex-wrap:wrap;gap:10px}
.share-btn{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;border:1px solid rgba(240,237,230,.2);background:rgba(240,237,230,.06);color:#F0EDE6;font-size:13px;font-family:Inter,sans-serif;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s}
.share-btn:hover{background:rgba(240,237,230,.12);border-color:rgba(240,237,230,.35)}
.share-btn svg{flex-shrink:0}
.share-copy{font-family:Inter,sans-serif}
.share-btn span{white-space:nowrap}
.footer-bottom{font-size:12px;opacity:.35;padding-top:28px;border-top:1px solid rgba(240,237,230,.1)}

@media(min-width:640px){
.section{padding:64px 0}
.hero{min-height:70vh;padding:80px 0}
.section-inner{padding:0 32px}
.footer{padding:80px 0 48px}
.footer-inner{padding:0 32px}
.share-buttons{gap:12px}
.share-btn{padding:10px 18px;font-size:14px}
}
@media(min-width:1024px){
.section{padding:80px 0}
.hero{min-height:80vh;padding:100px 0}
}
@media print{
body{background:#fff!important;color:#000!important}
.section{background:#fff!important;color:#000!important;break-inside:avoid;padding:40px 0!important}
.hero{min-height:auto}
.footer{background:#fff!important;color:#000!important}
.footer-links a{color:#000!important}
.share-section{display:none}
}