/* Blog · diseño Marketing (12/11/2026). Se carga DESPUÉS de calculadoras.css. */
.b-hero{position:relative;overflow:hidden;padding-block:clamp(36px,6vw,80px) clamp(32px,5vw,64px);isolation:isolate;border-bottom:1px solid var(--line)}
.b-hero::before{content:"";position:absolute;inset:-30% -10% auto -10%;height:140%;z-index:-2;background:radial-gradient(55% 60% at 12% 25%,rgba(0,176,0,.32),transparent 70%),radial-gradient(45% 55% at 92% 70%,rgba(0,132,0,.38),transparent 70%);filter:blur(30px)}
.b-hero::after{content:"";position:absolute;inset:0;z-index:-1;background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:radial-gradient(70% 70% at 40% 40%,#000,transparent);mask-image:radial-gradient(70% 70% at 40% 40%,#000,transparent)}
.b-hero .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,56px);align-items:center}
.b-hero h1{font-size:clamp(38px,5.4vw,68px);line-height:.95;letter-spacing:-.045em;text-transform:none;max-width:18ch;margin:14px 0}
.b-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:14px;color:var(--muted)}
.b-meta span+span::before{content:"·";margin-right:14px;color:var(--dim)}
.b-cover{border:1px solid var(--line);border-radius:22px;background:var(--surface);padding:22px;box-shadow:0 40px 90px rgba(0,0,0,.55);transform:rotate(-1deg)}
.b-cover svg{display:block;width:100%;height:auto}
@media (max-width:900px){.b-hero .wrap{grid-template-columns:1fr}}

.b-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(24px,5vw,64px);padding-block:clamp(32px,5vw,64px)}
.b-toc{position:sticky;top:96px;align-self:start;font-size:14px}
.b-toc b{display:block;font:500 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:12px}
.b-toc a{display:block;padding:8px 0 8px 14px;border-left:2px solid var(--line);color:var(--muted);text-decoration:none;line-height:1.35}
.b-toc a:hover{color:var(--fg);border-left-color:var(--accent-bright)}
@media (max-width:980px){.b-layout{grid-template-columns:1fr}.b-toc{display:none}}

.b-body{max-width:720px;font-size:18px;line-height:1.75}
.b-body p,.b-body li{color:#D9D9D9}
.b-body h2{font:800 clamp(26px,3vw,34px)/1.12 var(--f-display);letter-spacing:-.035em;margin:56px 0 14px;scroll-margin-top:90px}
.b-body h3{font:700 21px/1.25 var(--f-display);margin:26px 0 8px}
.b-body a{color:var(--accent-bright)}
.b-body strong{color:var(--fg)}
.b-body ul,.b-body ol{padding-left:22px}
.b-body li{margin:6px 0}
.b-body code{font:500 14px var(--f-mono);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:3px 8px;word-break:break-all}
.b-tldr{border:1px solid rgba(136,239,27,.4);background:linear-gradient(160deg,#0f2a0f,#0d140d 70%);border-radius:20px;padding:22px 24px;margin:0 0 8px}
.b-tldr b{display:block;font:500 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-bright);margin-bottom:8px}
.b-tldr p{margin:0;color:var(--fg)}
.b-formula{font:600 clamp(17px,2vw,20px)/1.5 var(--f-mono);color:var(--fg);background:var(--surface);border:1px solid var(--line);border-left:4px solid var(--accent-bright);border-radius:14px;padding:18px 20px;margin:20px 0}
.b-table{overflow-x:auto;border:1px solid var(--line);border-radius:16px;margin:20px 0}
.b-table table{width:100%;border-collapse:collapse;font-size:15px}
.b-table th,.b-table td{text-align:left;padding:12px 16px;border-bottom:1px solid var(--line)}
.b-table tr:last-child td{border-bottom:0}
.b-table th{color:var(--muted);font-weight:600;background:#161616}
.b-table td.pos{color:var(--accent-bright);font-family:var(--f-mono)}.b-table td.neg{color:var(--loss);font-family:var(--f-mono)}
.b-fig{border:1px solid var(--line);border-radius:20px;background:var(--surface);padding:22px;margin:26px 0}
.b-fig svg{display:block;width:100%;height:auto}
.b-fig figcaption{font-size:13px;color:var(--dim);margin-top:12px}
.b-steps{counter-reset:s;list-style:none;padding:0!important}
.b-steps li{counter-increment:s;position:relative;padding-left:46px;margin:14px 0}
.b-steps li::before{content:counter(s);position:absolute;left:0;top:2px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(0,176,0,.16);color:var(--accent-bright);font:700 14px var(--f-mono)}
.b-faq{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:6px 26px}
.b-faq details{border-bottom:1px solid var(--line)}.b-faq details:last-child{border-bottom:0}
.b-faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:18px 0;font:700 18px/1.3 var(--f-display)}
.b-faq summary::-webkit-details-marker{display:none}
.b-faq summary::after{content:"+";color:var(--accent);font-size:24px;line-height:1}.b-faq details[open] summary::after{content:"−"}
.b-faq details p{margin:0 0 18px;color:var(--muted);font-size:16px}
.b-cta{background:#88EF1B;color:#131313;border-radius:24px;padding:clamp(24px,4vw,40px);margin:48px 0 20px}
.b-cta h3{font:800 clamp(26px,3vw,34px)/1.05 var(--f-display);letter-spacing:-.04em;margin:0 0 10px;color:#131313}
.b-cta p{color:#131313!important;margin:0 0 18px;font-size:17px}.b-cta a:not(.btn){color:#131313;font-weight:700}
.b-cta .btn{background:#131313;color:#F0F0F0}
.b-cta small{display:block;margin-top:10px;font-size:13px}
.b-legal{font-size:14px;color:var(--dim)!important;font-style:italic}

/* Índice /blog */
.b-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;padding-block:clamp(32px,5vw,64px)}
.b-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:22px;background:var(--surface);overflow:hidden;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s}
.b-card:hover{border-color:var(--accent-bright);transform:translateY(-3px)}
.b-card .thumb{background:#0f150f;border-bottom:1px solid var(--line);padding:20px}
.b-card .thumb svg{display:block;width:100%;height:auto}
.b-card .txt{padding:22px;display:flex;flex-direction:column;gap:10px}
.b-card .tag{font:500 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.b-card h2{font:800 23px/1.15 var(--f-display);letter-spacing:-.03em;margin:0}
.b-card p{color:var(--muted);font-size:15px;margin:0}
.b-card .more{color:var(--accent-bright);font-weight:600;font-size:14px;margin-top:4px}
