/* Estilos de la sección Notas (comparte tokens de tuukul.css) */
*{box-sizing:border-box}
body{margin:0;background:var(--brand-bg);color:var(--brand-text);font:400 18px/1.7 var(--brand-font);-webkit-font-smoothing:antialiased}
a{color:var(--brand-primary)}
nav{background:#0F1A26;color:#fff}
nav .in{max-width:1040px;margin:0 auto;padding:0 24px;height:64px;display:flex;justify-content:space-between;align-items:center}
nav a{color:#fff;text-decoration:none;font-size:14px;margin-left:20px;opacity:.8}nav a:hover{opacity:1}nav b{font-weight:600;letter-spacing:-.02em;margin:0;opacity:1}
.head{background:#0F1A26;color:#fff;padding:56px 0 64px}
.wrap{max-width:720px;margin:0 auto;padding:0 24px}
.head .label{font:500 12px var(--brand-font-mono);letter-spacing:.08em;text-transform:uppercase;color:#74C3F0}
.head h1{font-size:clamp(34px,6vw,56px);line-height:1.05;letter-spacing:-.03em;font-weight:600;margin:14px 0 16px}
.head p{font-size:20px;line-height:1.5;color:#B9C6D3;margin:0}
.meta{margin-top:18px;font:500 13px var(--brand-font-mono);color:#8FA0B2}
article.post{padding:48px 0 24px}
article.post h2{font-size:28px;letter-spacing:-.02em;line-height:1.2;margin:2em 0 .5em;font-weight:600}
article.post h3{font-size:21px;letter-spacing:-.01em;margin:1.6em 0 .4em;font-weight:600}
article.post p{margin:0 0 1.1em}
article.post ul,article.post ol{padding-left:1.3em;margin:0 0 1.2em}li{margin:.3em 0}
article.post blockquote{margin:1.6em 0;padding:0 0 0 20px;border-left:3px solid var(--brand-accent);font-size:22px;line-height:1.4;font-weight:500;letter-spacing:-.01em}
article.post code{font:500 .88em var(--brand-font-mono);background:var(--brand-soft);padding:1px 6px;border-radius:4px}
article.post img{max-width:100%;height:auto;border-radius:12px}
.cta{margin:40px 0 0;padding:28px;border:1px solid var(--brand-line);border-radius:16px;background:var(--brand-surface)}
.cta h2{margin:0 0 6px!important;font-size:22px!important}
.cta p{margin:0 0 16px;color:var(--brand-text-muted);font-size:16px}
.btn{display:inline-block;font:600 15px var(--brand-font);padding:11px 18px;border-radius:8px;text-decoration:none;background:#74C3F0;color:#0F1A26;margin:0 8px 8px 0}
.btn.ghost{background:transparent;color:var(--brand-text);border:1px solid var(--brand-line)}
.back{display:inline-block;margin:28px 0 0;font-size:15px}
.list{padding:40px 0 24px}
.item{display:block;text-decoration:none;color:inherit;background:var(--brand-surface);border:1px solid var(--brand-line);border-radius:16px;padding:22px 24px;margin:0 0 14px;transition:transform .18s cubic-bezier(.2,.7,.2,1),border-color .18s}
.item:hover{transform:translateY(-3px);border-color:var(--brand-primary)}
.item .d{font:500 12px var(--brand-font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--brand-text-muted)}
.item h2{font-size:24px;letter-spacing:-.02em;line-height:1.2;margin:6px 0 6px;font-weight:600}
.item p{margin:0;color:var(--brand-text-muted);font-size:16px;line-height:1.55}
.tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px}.tag{font:500 12px var(--brand-font-mono);border:1px solid var(--brand-line);border-radius:999px;padding:2px 10px;color:var(--brand-text-muted)}
.empty{padding:40px 0;color:var(--brand-text-muted)}
footer{padding:40px 0;font-size:14px;color:var(--brand-text-muted)}
@media(max-width:600px){body{font-size:17px}.head{padding:40px 0 48px}}
