:root{
  --ink:#0b0d12;
  --panel:#151a24;
  --panel2:#1b2230;
  --text:#f4f6f8;
  --muted:#aeb5c2;
  --line:rgba(255,255,255,.10);
  --violet:#7458ff;
  --lime:#d8ff69;
  --mint:#6ee7d8;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:#0b1017;
  color:var(--text);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
.blogNav{
  max-width:var(--max);
  margin:auto;
  min-height:82px;
  padding:16px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}
.blogBrand{display:flex;align-items:center;gap:11px;font-weight:900;letter-spacing:-.03em}
.blogMark{
  width:38px;height:38px;border-radius:13px;
  background:radial-gradient(circle at 60% 35%,rgba(216,255,105,.22),transparent 28%),#171a22;
  border:1px solid rgba(255,255,255,.12);
  display:grid;place-items:center;
}
.blogMark:after{
  content:"";width:17px;height:17px;border-radius:50%;
  border:3px solid var(--lime);border-right-color:var(--violet);
}
.blogBrand small{display:block;font-size:8px;letter-spacing:.15em;text-transform:uppercase;color:#808795;margin-top:1px}
.blogNavLinks{display:flex;align-items:center;gap:22px;color:#c3c8d1;font-size:14px}
.blogNavLinks a:hover{color:#fff}
.blogNavCta{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 17px;border-radius:999px;background:var(--lime);color:#0b0d12;
  font-size:13px;font-weight:850;
}
.blogHero{
  border-top:1px solid rgba(255,255,255,.06);
  background:radial-gradient(circle at 77% 15%,rgba(116,88,255,.22),transparent 28%),#0b1017;
}
.blogHeroInner{max-width:var(--max);margin:auto;padding:64px 24px 58px}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:.15em;font-weight:900;color:#9b8cff}
.blogHero h1,.articleHero h1{
  margin:12px 0 20px;
  max-width:900px;
  font-size:clamp(46px,6vw,76px);
  line-height:.98;
  letter-spacing:-.055em;
}
.blogHero p,.articleDeck{
  max-width:720px;
  font-size:18px;
  line-height:1.7;
  color:var(--muted);
}
.blogMetaLine{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.blogMetaLine span{border:1px solid var(--line);border-radius:999px;padding:8px 11px;font-size:11px;color:#c7ccd5;background:rgba(255,255,255,.03)}
.blogMain{max-width:var(--max);margin:auto;padding:64px 24px 100px}
.blogGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.blogCard{
  min-height:330px;
  display:flex;flex-direction:column;
  background:linear-gradient(160deg,#171d28,#121720);
  border:1px solid var(--line);
  border-radius:26px;padding:28px;
  transition:.25s;
}
.blogCard:hover{transform:translateY(-4px);border-color:rgba(216,255,105,.30);box-shadow:0 25px 70px rgba(0,0,0,.25)}
.blogCard .topic{font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--lime);font-weight:900}
.blogCard h2{font-size:30px;line-height:1.1;letter-spacing:-.04em;margin:18px 0 14px}
.blogCard p{font-size:15px;line-height:1.7;color:var(--muted);margin:0}
.blogCard .read{margin-top:auto;padding-top:28px;font-size:13px;font-weight:850}
.blogNote{
  margin-top:32px;padding:22px 24px;border-radius:20px;
  background:#121823;border:1px solid var(--line);color:#aeb5c2;font-size:14px;line-height:1.7;
}
.blogNote a{color:#fff;text-decoration:underline;text-decoration-color:rgba(255,255,255,.25);text-underline-offset:3px}
.blogFooter{
  max-width:var(--max);margin:auto;padding:34px 24px 50px;
  border-top:1px solid var(--line);color:#7f8794;font-size:12px;
  display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;
}
.blogFooter a{color:#c3c9d2;font-weight:750}
.articleHero{
  max-width:var(--max);margin:auto;padding:72px 24px 44px;
  border-top:1px solid rgba(255,255,255,.06);
}
.articleHero h1{font-size:clamp(42px,5.4vw,68px)}
.articleInfo{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;color:#8f97a5;font-size:12px}
.articleInfo a{color:#c7ccd5;text-decoration:underline;text-decoration-color:rgba(199,204,213,.32);text-underline-offset:3px}
.articleLayout{
  max-width:var(--max);margin:auto;padding:24px 24px 100px;
  display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:46px;align-items:start;
}
.article{
  max-width:760px;
  font-size:17px;
  line-height:1.78;
  color:#d7dbe2;
}
.article h2{
  color:#fff;font-size:32px;line-height:1.12;letter-spacing:-.035em;
  margin:48px 0 16px;
}
.article h3{color:#fff;font-size:22px;line-height:1.25;margin:32px 0 12px}
.article p{margin:0 0 20px}
.article ul,.article ol{padding-left:24px;margin:0 0 24px}
.article li{margin:9px 0}
.article a{color:var(--lime);text-decoration:underline;text-decoration-color:rgba(216,255,105,.35);text-underline-offset:3px}
.article strong{color:#fff}
.quickAnswer,.sourceNote,.articleCta{
  padding:22px 24px;border-radius:20px;border:1px solid var(--line);
  background:#151b26;margin:26px 0;
}
.quickAnswer b,.sourceNote b{display:block;color:var(--lime);font-size:11px;text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}
.articleCta{
  background:linear-gradient(135deg,rgba(116,88,255,.22),rgba(216,255,105,.07)),#151b26;
}
.articleCta h3{margin-top:0}
.articleCta a{
  display:inline-flex;margin-top:4px;padding:11px 15px;border-radius:999px;
  background:var(--lime);color:#0b0d12;text-decoration:none;font-size:13px;font-weight:850;
}
.article table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.article th,.article td{padding:12px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.article th{color:#fff;background:#131923}
.article td{color:#c7ccd5}
.articleAside{position:sticky;top:24px}
.toc,.related{
  border:1px solid var(--line);background:#121822;border-radius:20px;padding:20px;
}
.related{margin-top:14px}
.toc b,.related b{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:#9b8cff;margin-bottom:12px}
.toc a,.related a{display:block;padding:8px 0;color:#c4cad3;font-size:13px;line-height:1.4;border-top:1px solid rgba(255,255,255,.05)}
.toc a:first-of-type,.related a:first-of-type{border-top:0}
.toc a:hover,.related a:hover{color:#fff}
.breadcrumb{max-width:var(--max);margin:auto;padding:18px 24px 0;color:#828b98;font-size:12px}
.breadcrumb a{color:#b9c0ca}
@media(max-width:900px){
  .blogGrid{grid-template-columns:1fr}
  .articleLayout{grid-template-columns:1fr;gap:28px}
  .articleAside{position:static;order:-1}
  .toc{display:none}
}
@media(max-width:700px){
  .blogNav{min-height:70px}
  .blogNavLinks{display:none}
  .blogHeroInner{padding:46px 18px 42px}
  .blogHero h1,.articleHero h1{font-size:43px}
  .blogHero p,.articleDeck{font-size:16px}
  .blogMain{padding:48px 18px 72px}
  .blogCard{min-height:0;padding:23px}
  .blogCard h2{font-size:26px}
  .articleHero{padding:54px 18px 30px}
  .articleLayout{padding:16px 18px 72px}
  .article{font-size:16px}
  .article h2{font-size:29px}
  .article table{font-size:12px;display:block;overflow-x:auto}
  .blogFooter{padding:28px 18px 40px}
}

/* OppMatcher brand symbol: use the original logo instead of the old CSS approximation. */
.blogMark{background:transparent;border:0;overflow:hidden}
.blogMark:after{display:none}
.blogMark img{width:100%;height:100%;object-fit:contain;display:block}
