html{scrollbar-gutter:stable}
:root{--teal:#0d9488;--teal-dark:#0f766e;--text:#1f2937;--muted:#6b7280;--bg:#f9fafb;--card:#fff;--border:#e5e7eb}
*{box-sizing:border-box}
body{margin:0;font:17px/1.7 system-ui,'Segoe UI',Roboto,sans-serif;color:var(--text);background:#fff}
@view-transition{navigation:auto}
.app{width:1126px;max-width:100%;margin:0 auto;border-inline:1px solid var(--border);min-height:100svh;display:flex;flex-direction:column;background:var(--bg)}
.wrap{max-width:860px;margin:0 auto;padding:0 20px}
.site-header{view-transition-name:site-nav;background:var(--teal);position:sticky;top:0;z-index:10;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.hwrap{width:100%;padding:0 32px;height:64px;display:flex;align-items:center;gap:24px}
.brand{display:flex;align-items:center}
.brand img{border-radius:50%;border:2px solid rgba(255,255,255,.3);background:#fff;object-fit:cover}
.tabs{display:flex;background:rgba(15,118,110,.5);padding:4px;border-radius:8px}
.tabs a{padding:6px 16px;border-radius:6px;font-size:14px;font-weight:700;color:#f0fdfa;text-decoration:none;white-space:nowrap}
.tabs a:hover{color:#fff}
.tabs a.active{background:#fff;color:#0f766e;box-shadow:0 1px 2px rgba(0,0,0,.1)}
main.content{background:var(--card);width:calc(100% - 40px);max-width:860px;margin:32px auto;padding:32px 28px;border:1px solid var(--border);border-radius:16px}
h1{font-size:2rem;line-height:1.2;margin:0 0 .6em;color:#111827}
h2{font-size:1.35rem;margin:1.8em 0 .5em;color:var(--teal-dark)}
h3{font-size:1.1rem;margin:1.2em 0 .3em}
p,li{margin:.6em 0}
ul{padding-left:1.3em}
a{color:var(--teal-dark)}
.muted{color:var(--muted);font-size:.9rem}
.site-footer{margin-top:auto;border-top:1px solid var(--border);background:#fff;padding:28px 0;text-align:center;color:var(--muted);font-size:.9rem}
.site-footer nav a{margin:0 10px;color:var(--muted);text-decoration:none;font-weight:600}
.site-footer nav a:hover{color:var(--teal-dark)}
@media (max-width:600px){main.content{padding:22px 16px;margin:16px 10px;border-radius:12px}.site-header nav a{margin-left:12px;font-size:.85rem}}

/* Artículos */
.crumbs{margin:0 0 .4em;font-size:.9rem;color:var(--muted)}
.crumbs a{color:var(--teal-dark);text-decoration:none;font-weight:600}
.lead{font-size:1.1rem;color:var(--muted)}
figure{margin:1.4em 0}
figure img,.hero img{display:block;max-width:100%;height:auto;margin:0 auto;border-radius:12px;border:1px solid var(--border)}
.hero img{max-height:720px;width:auto}
ol{padding-left:1.4em}
.related{margin-top:2.2em;border-top:1px solid var(--border);padding-top:.5em}
.post-list{list-style:none;padding:0;margin:1.5em 0 0}
.post-card{display:flex;gap:20px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--border)}
.post-card img{border-radius:10px;border:1px solid var(--border);object-fit:cover;flex:none;width:240px;height:auto;aspect-ratio:1200/630}
.post-card h2{margin:0 0 .2em;font-size:1.25rem}
.post-card h2 a{text-decoration:none}
@media (max-width:600px){.post-card{flex-direction:column}.post-card img{width:100%}.hwrap{padding:0 12px;gap:10px}.tabs a{padding:6px 9px;font-size:13px}}