/* Blog post styles — Dtrivia / eChecklista */
:root{
  --bp-orange:#ff6b00;
  --bp-orange-soft:rgba(255,107,0,.12);
  --bp-border:rgba(255,255,255,.1);
  --bp-card:rgba(255,255,255,.04);
  --bp-muted:rgba(240,240,240,.62);
  --bp-text:rgba(240,240,240,.88);
  --bp-radius:14px;
}
.post-hero{max-width:1280px;margin:0 auto;padding:0 1.5rem 2.5rem;text-align:left}
.post-hero .post-cat-badge{display:inline-flex;align-items:center;gap:.5rem;padding:.35rem .8rem;border:1px solid rgba(255,107,0,.4);color:var(--bp-orange);border-radius:0;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;background:var(--bp-orange-soft);margin-top:200px}
.post-hero h1{font-family:'Barlow Condensed',sans-serif;font-size:clamp(2.4rem,5vw,3.8rem);line-height:1.05;font-weight:800;text-transform:uppercase;margin:1.2rem 0 1rem;color:var(--foreground)}
.post-hero .post-lead{font-size:1.15rem;line-height:1.7;color:var(--bp-muted);max-width:52rem;margin:0 0 1.5rem}
.post-hero .post-meta{display:flex;flex-wrap:wrap;gap:1.2rem;font-size:.82rem;color:var(--bp-muted);align-items:center}
.post-hero .post-meta span{display:inline-flex;align-items:center;gap:.4rem}
.post-hero .post-meta b{color:var(--bp-text)}
.post-hero img{width:100%;max-height:420px;object-fit:cover;border-radius:var(--bp-radius);margin-top:1.5rem;border:1px solid var(--bp-border)}

.post-layout{max-width:1280px;margin:0 auto;padding:1rem 1.5rem 4rem;display:grid;grid-template-columns:minmax(0,1fr) 18rem;gap:2.5rem;align-items:start}
.post-layout .post-main{min-width:0}
.post-toc{position:sticky;top:96px;align-self:start;background:var(--bp-card);border:1px solid var(--bp-border);border-radius:var(--bp-radius);padding:1.2rem 1.3rem;max-height:calc(100vh - 120px);overflow:auto}
.post-toc h4{font-family:'Barlow Condensed',sans-serif;font-size:.95rem;text-transform:uppercase;letter-spacing:.12em;color:var(--bp-orange);margin:0 0 .8rem;font-weight:800}
.post-toc ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.45rem}
.post-toc a{font-size:.82rem;color:var(--bp-muted);text-decoration:none;line-height:1.35;transition:color .2s}
.post-toc a:hover{color:var(--bp-orange)}
@media (max-width:1024px){.post-layout{grid-template-columns:1fr}.post-toc{display:none}}

.post-back{display:inline-flex;align-items:center;gap:.4rem;color:var(--bp-muted);font-size:.85rem;margin-bottom:1.5rem;text-decoration:none;transition:color .2s}
.post-back:hover{color:var(--bp-orange)}

.post-content{font-size:1.02rem;line-height:1.8;color:var(--bp-text);max-width:44rem}
.post-content h2{font-family:'Barlow Condensed',sans-serif;font-size:1.7rem;font-weight:800;text-transform:uppercase;margin:2.6rem 0 1rem;color:var(--foreground);scroll-margin-top:96px}
.post-content h3{font-family:'Barlow Condensed',sans-serif;font-size:1.25rem;font-weight:700;margin:2rem 0 .7rem;color:var(--foreground)}
.post-content p{margin:0 0 1.15rem}
.post-content ul,.post-content ol{margin:0 0 1.2rem 1.3rem}
.post-content li{margin-bottom:.5rem}
.post-content a{color:var(--bp-orange);text-decoration:underline;text-underline-offset:2px}
.post-content a:hover{opacity:.85}
.post-content code{background:rgba(255,255,255,.08);padding:.12rem .4rem;border-radius:6px;font-size:.92em;font-family:ui-monospace,monospace}
.post-content blockquote{border-left:3px solid var(--bp-orange);padding:.4rem 0 .4rem 1.1rem;margin:1.3rem 0;color:var(--bp-muted);font-style:italic;background:var(--bp-orange-soft);border-radius:0 8px 8px 0}

/* Stat grid */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.9rem;margin:1.6rem 0}
.stat-card{background:linear-gradient(135deg,rgba(255,107,0,.12),rgba(255,107,0,.02));border:1px solid rgba(255,107,0,.3);border-radius:var(--bp-radius);padding:1.2rem 1rem;text-align:center}
.stat-card .stat-value{font-family:'Barlow Condensed',sans-serif;font-size:2.1rem;font-weight:800;color:var(--bp-orange);line-height:1}
.stat-card .stat-label{font-size:.78rem;color:var(--bp-muted);margin-top:.4rem;letter-spacing:.02em}

/* Callouts */
.callout{border-radius:var(--bp-radius);padding:1.1rem 1.3rem;margin:1.6rem 0;border:1px solid var(--bp-border);background:var(--bp-card);display:flex;gap:.9rem;align-items:flex-start}
.callout .callout-icon{font-size:1.3rem;line-height:1.2;flex-shrink:0}
.callout .callout-title{font-weight:700;margin-bottom:.3rem;color:var(--foreground);font-family:'Barlow Condensed',sans-serif;font-size:1.05rem;text-transform:uppercase;letter-spacing:.04em}
.callout p{margin:0;font-size:.95rem;color:var(--bp-muted);line-height:1.65}
.callout-tip{border-color:rgba(59,130,246,.35);background:rgba(59,130,246,.08)}
.callout-warn{border-color:rgba(245,158,11,.35);background:rgba(245,158,11,.08)}
.callout-stat{border-color:rgba(255,107,0,.35);background:rgba(255,107,0,.08)}
.callout-check{border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08)}

/* Chart cards */
.chart-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin:1.6rem 0}
.chart-card{background:var(--bp-card);border:1px solid var(--bp-border);border-radius:var(--bp-radius);padding:1.3rem;text-align:center}
.chart-card h4{font-family:'Barlow Condensed',sans-serif;font-size:1rem;text-transform:uppercase;letter-spacing:.06em;margin:0 0 .9rem;color:var(--foreground);font-weight:800}
.chart-card svg{max-width:180px;margin:0 auto;display:block}
.chart-legend{list-style:none;margin:.9rem 0 0;padding:0;display:flex;flex-direction:column;gap:.4rem;text-align:left}
.chart-legend li{display:flex;align-items:center;gap:.5rem;font-size:.82rem;color:var(--bp-muted)}
.chart-legend .dot{width:11px;height:11px;border-radius:3px;flex-shrink:0}
.chart-legend b{color:var(--bp-text);margin-left:auto}

/* Compare table */
.compare-table-wrap{overflow-x:auto;margin:1.6rem 0;border:1px solid var(--bp-border);border-radius:var(--bp-radius)}
.compare-table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:520px}
.compare-table th,.compare-table td{padding:.8rem 1rem;text-align:left;border-bottom:1px solid var(--bp-border)}
.compare-table thead th{background:rgba(255,107,0,.1);font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;letter-spacing:.05em;font-weight:800;color:var(--foreground);font-size:.85rem}
.compare-table tbody tr:hover{background:rgba(255,255,255,.03)}
.compare-table .yes{color:#4ade80;font-weight:700}
.compare-table .no{color:#f87171;font-weight:700}
.compare-table .mid{color:#fbbf24;font-weight:700}

/* Step list */
.step-list{counter-reset:step;list-style:none;margin:1.6rem 0;padding:0;display:flex;flex-direction:column;gap:.9rem}
.step-list li{position:relative;padding:1rem 1.1rem 1rem 3.4rem;background:var(--bp-card);border:1px solid var(--bp-border);border-radius:var(--bp-radius)}
.step-list li::before{counter-increment:step;content:counter(step);position:absolute;left:1rem;top:1rem;width:2rem;height:2rem;background:var(--bp-orange);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-family:'Barlow Condensed',sans-serif;font-size:1rem}
.step-list li b{color:var(--foreground)}

/* Pills / tags */
.pill-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0}
.pill{padding:.3rem .8rem;border:1px solid rgba(255,107,0,.3);background:rgba(255,107,0,.07);color:var(--bp-text);border-radius:999px;font-size:.78rem;font-weight:600}

/* FAQ */
.faq-list{display:flex;flex-direction:column;gap:.7rem;margin-top:1.5rem}
.faq-list details{border:1px solid var(--bp-border);border-radius:var(--bp-radius);background:var(--bp-card);padding:0 1.2rem;overflow:hidden}
.faq-list summary{cursor:pointer;list-style:none;padding:1rem 0;font-weight:600;color:var(--foreground);display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:'+';color:var(--bp-orange);font-weight:800;font-size:1.2rem}
.faq-list details[open] summary::after{content:'\2013'}
.faq-list p{margin:0 0 1rem;color:var(--bp-muted);line-height:1.7;font-size:.95rem}

/* Related */
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;margin-top:1.5rem}
.related-card{display:block;padding:1.2rem;border:1px solid var(--bp-border);border-radius:var(--bp-radius);background:var(--bp-card);text-decoration:none;transition:transform .25s,border-color .25s}
.related-card:hover{transform:translateY(-3px);border-color:rgba(255,107,0,.4)}
.related-card h4{font-family:'Barlow Condensed',sans-serif;font-size:1.05rem;font-weight:700;margin:0 0 .4rem;color:var(--foreground);line-height:1.25}
.related-card p{font-size:.8rem;color:var(--bp-muted);margin:0;line-height:1.5}
.related-card .related-cat{font-size:.7rem;color:var(--bp-orange);text-transform:uppercase;letter-spacing:.08em;font-weight:700;margin-bottom:.5rem;display:block}

/* CTA */
.post-cta{margin-top:2.5rem;padding:2rem;border-radius:var(--bp-radius);background:linear-gradient(135deg,rgba(255,107,0,.14),rgba(255,107,0,.03));border:1px solid rgba(255,107,0,.3)}
.post-cta h3{font-family:'Barlow Condensed',sans-serif;text-transform:uppercase;font-size:1.5rem;font-weight:800;margin:0 0 .8rem;color:var(--foreground)}
.post-cta p{color:var(--bp-muted);margin:0 0 1.2rem;max-width:42rem}
.post-cta-grid{display:flex;flex-wrap:wrap;gap:.6rem}
.post-cta-grid a{display:inline-flex;align-items:center;gap:.4rem;padding:.6rem 1.1rem;border-radius:10px;font-size:.85rem;font-weight:700;text-decoration:none;transition:transform .25s,box-shadow .25s}
.post-cta-grid a.primary{background:var(--bp-orange);color:#fff}
.post-cta-grid a.primary:hover{transform:translateY(-2px);box-shadow:0 10px 24px -8px rgba(255,107,0,.55)}
.post-cta-grid a.ghost{border:1px solid var(--bp-border);color:var(--bp-text);background:rgba(255,255,255,.03)}
.post-cta-grid a.ghost:hover{border-color:rgba(255,107,0,.4);transform:translateY(-2px)}

/* Source list */
.source-list{font-size:.85rem;color:var(--bp-muted);margin-top:1.5rem;padding:1.1rem 1.3rem;border:1px dashed var(--bp-border);border-radius:var(--bp-radius)}
.source-list b{color:var(--bp-text);display:block;margin-bottom:.4rem}
.source-list ul{margin:0;padding-left:1.1rem}
.source-list li{margin-bottom:.3rem}
.source-list a{color:var(--bp-orange)}

.section-title{font-family:'Barlow Condensed',sans-serif;font-size:1.9rem;font-weight:800;text-transform:uppercase;margin:2.8rem 0 1rem;color:var(--foreground);scroll-margin-top:96px}

/* Horizontal bar list */
.bar-list{display:flex;flex-direction:column;gap:.7rem;margin:1.4rem 0}
.bar-row{display:grid;grid-template-columns:8rem 1fr 3.5rem;align-items:center;gap:.8rem}
.bar-label{font-size:.85rem;color:var(--bp-text)}
.bar-track{height:14px;border-radius:8px;background:rgba(255,255,255,.06);overflow:hidden}
.bar-fill{height:100%;border-radius:8px;transition:width .6s ease}
.bar-val{text-align:right;font-weight:700;font-family:'Barlow Condensed',sans-serif;color:var(--bp-text);font-size:.95rem}
@media (max-width:560px){.bar-row{grid-template-columns:6rem 1fr 2.8rem}.bar-label{font-size:.78rem}}


/* Custom scrollbar — Dtrivia */
::-webkit-scrollbar{width:12px;height:12px}
::-webkit-scrollbar-track{background:#07091a}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#ff6b00,#cc5500);border-radius:6px;border:2px solid #07091a}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#ff8533,#ff6b00)}
::-webkit-scrollbar-corner{background:#07091a}
*{scrollbar-width:thin;scrollbar-color:#ff6b00 #07091a}
html{scrollbar-width:thin;scrollbar-color:#ff6b00 #07091a}
