/* Con Cuentas Claras — Blog. Misma marca que la landing. */
:root{
  --bg:#F7F5F0;--white:#FFF;--surface2:#EFE7DA;--deep:#1C2B45;--deep2:#22304c;
  --accent:#C9A84C;--accent-h:#B8973E;--accent-ink:#6E5A3C;--rose:#D4A5A0;--rose-tint:#F3E7E4;
  --ink:#1A1F2B;--muted:#5E6472;--border:#E3DCD3;--wa:#25D366;
  --display:'Playfair Display',Georgia,serif;--edit:'Cormorant Garamond',Georgia,serif;--sans:'Jost',system-ui,sans-serif;
  --wrap:1060px;--read:720px;
  --s1:8px;--s2:16px;--s3:24px;--s4:32px;--s5:48px;--s6:64px;
  --r-sm:10px;--r:14px;--r-lg:20px;--r-full:999px;
  --sh-1:0 2px 8px rgba(28,43,69,.10);--sh-2:0 18px 40px -26px rgba(28,43,69,.38);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:400;color:var(--ink);background:var(--bg);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--s3)}
.eyebrow{font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-ink)}
h1,h2,h3,h4{font-family:var(--display);font-weight:800;letter-spacing:-.015em;line-height:1.1;color:var(--ink)}
a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:6px}
/* topbar (igual a la landing) */
.topbar{position:sticky;top:0;z-index:40;background:rgba(28,43,69,.96);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,.08)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;height:58px;gap:16px}
.wm{font-family:var(--display);font-weight:800;font-size:22px;color:#fff}.wm b{color:var(--accent)}
.topnav{display:flex;align-items:center;gap:20px}
.topnav a.lnk{font-size:14px;font-weight:500;color:rgba(255,255,255,.82)}
.topnav a.lnk:hover{color:#fff}
.btn{display:inline-flex;align-items:center;gap:9px;background:var(--accent);color:var(--deep);font-family:var(--sans);font-weight:600;font-size:16px;border-radius:var(--r-full);padding:13px 22px;border:0;cursor:pointer;transition:background .2s,transform .15s,box-shadow .2s;min-height:48px}
.btn:hover{background:var(--accent-h);transform:translateY(-2px);box-shadow:0 14px 26px -12px rgba(201,168,76,.7)}
.btn svg{width:18px;height:18px;flex:0 0 auto}
.topbar .btn{padding:10px 16px;min-height:42px;font-size:14px}
@media(max-width:620px){.topnav a.lnk{display:none}}
/* breadcrumb */
.crumbs{font-size:13px;color:var(--muted);padding:18px 0 0}
.crumbs a{color:var(--accent-ink);font-weight:500}
.crumbs a:hover{text-decoration:underline}
.crumbs span{opacity:.5;margin:0 7px}
/* ===== índice del blog ===== */
.blog-hero{background:var(--deep);color:#fff;padding:var(--s6) 0 var(--s5)}
.blog-hero .eyebrow{color:var(--accent)}
.blog-hero h1{color:#fff;font-size:clamp(30px,5.2vw,44px);margin:12px 0 10px;max-width:16ch}
.blog-hero p{color:rgba(255,255,255,.88);font-family:var(--edit);font-style:italic;font-size:21px;max-width:42ch}
.grid-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding:var(--s5) 0 var(--s6)}
.pcard{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--border);border-radius:var(--r);overflow:hidden;transition:transform .25s,box-shadow .25s}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--sh-2)}
.pcard .ph{aspect-ratio:16/10;overflow:hidden;background:var(--surface2)}
.pcard .ph img{width:100%;height:100%;object-fit:cover}
.pcard .pb{padding:var(--s3);display:flex;flex-direction:column;flex:1}
.pcard .tag{font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink)}
.pcard h2{font-size:20px;line-height:1.16;margin:8px 0 8px}
.pcard p{color:var(--muted);font-size:14.5px;flex:1}
.pcard .meta{display:flex;align-items:center;gap:9px;margin-top:14px;font-size:13px;color:var(--muted)}
.pcard .meta img{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.pcard .meta b{color:var(--ink);font-weight:600}
@media(max-width:860px){.grid-posts{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.grid-posts{grid-template-columns:1fr}}
/* ===== artículo ===== */
.article{padding-bottom:var(--s6)}
.ahead{max-width:var(--read);margin:0 auto;padding:var(--s3) 0 var(--s2)}
.ahead .tag{font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink)}
.ahead h1{font-size:clamp(28px,4.8vw,40px);line-height:1.1;margin:12px 0 14px}
.ahead .sub{font-family:var(--edit);font-style:italic;font-weight:600;font-size:21px;color:var(--muted);line-height:1.4}
.byline{display:flex;align-items:center;gap:12px;margin:var(--s3) 0 0;padding-top:var(--s3);border-top:1px solid var(--border)}
.byline img{width:46px;height:46px;border-radius:50%;object-fit:cover;border:2px solid var(--white);box-shadow:var(--sh-1);flex:0 0 auto}
.byline .nm{font-weight:600;color:var(--ink);font-size:15px}
.byline .dt{font-size:13px;color:var(--muted)}
.hero-fig{max-width:var(--wrap);margin:var(--s3) auto var(--s4)}
.hero-fig img{width:100%;aspect-ratio:16/8;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.hero-fig figcaption{font-size:12px;color:var(--muted);text-align:center;margin-top:8px}
/* prosa */
.prose{max-width:var(--read);margin:0 auto}
.prose p{color:#2b3040;margin:0 0 var(--s3);font-size:17.5px}
.prose h2{font-size:26px;margin:var(--s5) 0 12px;line-height:1.15}
.prose h2::after{content:"";display:block;width:34px;height:2px;background:var(--accent);margin-top:10px;border-radius:2px}
.prose h3{font-size:19px;font-weight:700;margin:var(--s4) 0 8px;font-family:var(--display)}
.prose ul,.prose ol{margin:0 0 var(--s3) 0;padding-left:22px;color:#2b3040}
.prose li{margin:0 0 8px;font-size:17px}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--accent-ink);font-weight:500;text-decoration:underline;text-decoration-color:rgba(201,168,76,.5);text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--accent)}
.callout{background:var(--rose-tint);border-left:3px solid var(--accent);border-radius:var(--r-sm);padding:16px 18px;margin:0 0 var(--s3)}
.callout b{color:var(--ink);font-weight:600;display:block;margin-bottom:3px}
.callout p{font-size:15.5px;margin:0;color:#4a4034}
.keyfig{background:var(--deep);color:#fff;border-radius:var(--r);padding:18px 20px;margin:0 0 var(--s3);display:flex;gap:16px;align-items:center}
.keyfig .num{font-family:var(--display);font-weight:800;font-size:30px;color:var(--accent);line-height:1;flex:0 0 auto}
.keyfig .tx{font-size:14.5px;color:rgba(255,255,255,.9)}
/* fuentes */
.fuentes{max-width:var(--read);margin:var(--s4) auto 0;background:var(--surface2);border:1px solid var(--border);border-radius:var(--r);padding:var(--s3) var(--s4)}
.fuentes .lbl{font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.fuentes .lbl svg{width:16px;height:16px}
.fuentes ul{list-style:none;padding:0;margin:0}
.fuentes li{font-size:13.5px;margin-bottom:7px;color:var(--muted);line-height:1.4;padding-left:16px;position:relative}
.fuentes li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.fuentes a{color:var(--accent-ink);text-decoration:underline;word-break:break-word}
/* nota legal */
.legalnote{max-width:var(--read);margin:var(--s3) auto 0;font-size:12.5px;color:var(--muted);line-height:1.5;border-top:1px solid var(--border);padding-top:14px}
/* tarjeta autora */
.author-card{max-width:var(--read);margin:var(--s5) auto 0;display:flex;gap:16px;align-items:flex-start;background:var(--white);border:1px solid var(--border);border-radius:var(--r-lg);padding:var(--s3) var(--s4);box-shadow:var(--sh-1)}
.author-card img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:0 0 auto;border:2px solid var(--white);box-shadow:var(--sh-1)}
.author-card .nm{font-family:var(--display);font-weight:800;font-size:18px;color:var(--ink)}
.author-card .rl{font-size:13px;color:var(--accent-ink);font-weight:600;margin:2px 0 7px}
.author-card p{font-size:14px;color:var(--muted);margin:0}
/* CTA */
.cta-box{max-width:var(--read);margin:var(--s5) auto 0;background:var(--deep);color:#fff;border-radius:var(--r-lg);padding:var(--s4);text-align:center}
.cta-box h3{color:#fff;font-size:23px;margin-bottom:8px}
.cta-box p{color:rgba(255,255,255,.85);font-size:15px;max-width:40ch;margin:0 auto 18px}
.cta-box .btn{min-height:52px;padding:15px 26px}
/* relacionados */
.related{max-width:var(--wrap);margin:var(--s6) auto 0}
.related .lbl{text-align:center;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:var(--s3)}
.related .rg{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.related .pcard h2{font-size:18px}
@media(max-width:620px){.related .rg{grid-template-columns:1fr}}
/* footer (igual a la landing) */
footer{background:#16233a;color:rgba(255,255,255,.6);font-size:13px;padding:22px 0;margin-top:var(--s6)}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center}
footer .wm{font-size:16px}
footer .sl{font-family:var(--edit);font-style:italic;color:rgba(255,255,255,.75)}
footer .meta-disc{font-size:11.5px;color:rgba(255,255,255,.72);margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08);line-height:1.45}
/* WhatsApp FAB */
.wa-fab{position:fixed;right:16px;bottom:16px;z-index:60;width:60px;height:60px;border-radius:50%;background:var(--wa);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 26px -8px rgba(0,0,0,.5)}
.wa-fab svg{width:33px;height:33px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}