:root{--navy:#07182b;--blue:#1768f5;--ink:#10233a;--muted:#667586;--line:#dfe6ef;--soft:#f5f8fc;--font:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif}
*{box-sizing:border-box}
body{margin:0;color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased;background:#fff}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
h1,h2,h3{line-height:1.19;letter-spacing:-.04em;margin-top:0}
.container{width:min(1200px,calc(100% - 96px));margin-inline:auto}
.container-narrow{width:min(760px,calc(100% - 48px));margin-inline:auto}

/* Header (mirrors the homepage) */
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.97);backdrop-filter:blur(15px);box-shadow:0 1px 0 rgba(12,34,60,.07)}
.nav-wrap{height:80px;display:flex;align-items:center;gap:30px}
.brand img{width:188px;height:auto}
.nav-links{display:flex;gap:30px;margin-left:auto;align-items:center}
.nav-links a{font:700 12px var(--font);color:#354b60;white-space:nowrap}
.nav-links a:hover,.nav-links a[aria-current]{color:var(--blue)}
.btn{min-height:46px;display:inline-flex;align-items:center;gap:14px;padding:13px 18px;border-radius:7px;font:700 13px/1.3 var(--font);white-space:nowrap;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:var(--blue);color:#fff}
.btn-electric{background:#2278ff;color:#fff;box-shadow:0 12px 28px rgba(16,90,210,.25)}

/* Blog index */
.blog-hero{background:var(--navy);color:#fff;padding:90px 0 80px;background-image:radial-gradient(ellipse at 80% 20%,rgba(18,101,220,.3),transparent 50%)}
.eyebrow{font:700 11px/1.3 var(--font);letter-spacing:.18em;color:#98c7ff;margin-bottom:22px;display:flex;align-items:center;gap:10px}
.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:#51c8ff;box-shadow:0 0 0 5px rgba(81,200,255,.12)}
.blog-hero h1{font-size:clamp(38px,4.6vw,64px);font-weight:700;letter-spacing:-.06em;margin-bottom:20px}
.blog-hero h1 span{color:#51bfff}
.blog-hero p{color:#bdc9d8;max-width:620px;font-size:17px;margin:0}
.blog-list{padding:70px 0 100px}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.post-card a{display:flex;flex-direction:column;height:100%;border:1px solid var(--line);border-radius:12px;padding:28px;background:#fff;transition:transform .2s,box-shadow .2s}
.post-card a:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(12,34,60,.08)}
.post-card h2{font-size:21px;margin:14px 0 10px}
.post-card p{color:var(--muted);font-size:14.5px;flex:1}
.read-more{display:inline-flex;align-items:center;gap:8px;font:700 13px var(--font);color:var(--blue)}
.post-meta{display:flex;flex-wrap:wrap;gap:14px;align-items:center;font:600 12px var(--font);color:var(--muted)}
.kind{font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px;padding:4px 9px;border-radius:999px;background:#e9f1ff;color:#1d5fd6}
.kind-evergreen{background:#e8f7f0;color:#167a52}
.pager{display:flex;justify-content:space-between;align-items:center;margin-top:50px;font:700 13px var(--font)}
.pager a{color:var(--blue)}
.empty{color:var(--muted);text-align:center;padding:60px 0}
.related h2{font-size:30px;margin-bottom:28px}

/* Post */
.post{padding:60px 0 40px}
.back{display:inline-block;font:700 13px var(--font);color:var(--blue);margin-bottom:28px}
.post h1{font-size:clamp(32px,4vw,50px);font-weight:700;margin:18px 0 18px}
.lede{font-size:19px;color:#354b60;font-weight:500;border-bottom:1px solid var(--line);padding-bottom:28px;margin-bottom:34px}
.prose{font-size:17.5px;line-height:1.8}
.prose h2{font-size:28px;margin:46px 0 16px}
.prose h3{font-size:21px;margin:32px 0 12px}
.prose p,.prose ul,.prose ol{margin:0 0 22px}
.prose li{margin-bottom:8px}
.prose a,.sources a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.prose em{font-style:italic}
.prose blockquote{margin:30px 0;padding:6px 0 6px 24px;border-left:3px solid var(--blue);color:#2b4058;font-size:18.5px}
.sources{margin-top:50px;padding:28px;background:var(--soft);border-radius:12px;font-size:14.5px}
.sources h2{font-size:18px;margin-bottom:12px}
.sources ol{margin:0;padding-left:20px}
.sources li{margin-bottom:8px}
.ai-note{font-size:13px;color:var(--muted);margin-top:22px}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.tags span{font:600 12px var(--font);border:1px solid var(--line);border-radius:999px;padding:5px 12px;color:#354b60}
.post-cta{margin-top:56px;background:var(--navy);color:#fff;border-radius:16px;padding:40px}
.post-cta h2{font-size:28px;margin-bottom:12px}
.post-cta p{color:#bdc9d8;margin-bottom:24px}

.site-footer{border-top:1px solid var(--line);padding:30px 0;font-size:13px;color:var(--muted)}
.site-footer .container{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.site-footer a:hover{color:var(--blue)}

@media(max-width:900px){
  .container{width:calc(100% - 32px)}
  .container-narrow{width:calc(100% - 32px)}
  .post-grid{grid-template-columns:1fr}
  .nav-links{display:none}
  .nav-wrap{justify-content:space-between}
  .brand img{width:150px}
  .blog-hero{padding:60px 0}
  .post-cta{padding:28px}
}

/* Agent-added blocks: summary, key facts, FAQ */
.tldr{background:var(--soft);border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:10px;padding:22px 26px;margin:0 0 36px;font-size:16px}
.tldr p{margin:0 0 14px}
.tldr ul{margin:0;padding-left:20px}
.tldr li{margin-bottom:6px}
.tldr-label{font:700 11px var(--font)!important;letter-spacing:.14em;text-transform:uppercase;color:#236ef2;margin-bottom:8px!important}
.key-facts{margin-top:44px}
.key-facts h2,.post-faq h2{font-size:24px;margin-bottom:16px}
.key-facts ul{padding-left:20px;margin:0}
.key-facts li{margin-bottom:10px}
.key-facts a{color:var(--blue);font-weight:600;font-size:13px;margin-left:4px}
.post-faq{margin-top:44px}
.post-faq details{border-bottom:1px solid var(--line);padding:16px 0}
.post-faq summary{font-weight:700;cursor:pointer;list-style:none}
.post-faq summary::-webkit-details-marker{display:none}
.post-faq summary::after{content:"+";float:right;color:var(--blue);font-weight:700}
.post-faq details[open] summary::after{content:"–"}
.post-faq details p{margin:10px 0 0;color:#354b60}
.faq-source{display:inline-block;margin-left:6px;font-size:13px;font-weight:600;color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.topic-link{font-weight:700;color:var(--blue)}
