:root{
  --article-ink:#151515;
  --article-muted:#596170;
  --article-line:#e6e2dc;
  --article-red:#e11d24;
  --article-orange:#ff542e;
  --article-orange-2:#ff7a1a;
  --article-blue:#2463d4;
  --article-green:#16824b;
}

html,body{max-width:100%;overflow-x:hidden}
body.social-blog{background:#fff;color:var(--article-ink);font-family:Inter,Arial,sans-serif}

.social-topbar{
  position:sticky;top:0;z-index:50;height:74px;padding:0 max(22px,calc((100vw - 1060px)/2));
  background:rgba(255,255,255,.96);border-bottom:1px solid var(--article-line);
  box-shadow:none;backdrop-filter:blur(10px)
}
.social-logo{color:#111;font-size:27px;font-weight:900;text-transform:uppercase}
.social-logo-mark{display:none}
.social-search{display:none}
.social-nav{gap:20px}
.social-nav-link{height:auto;padding:0;background:transparent!important;color:#202020;font-size:12px;text-transform:uppercase}
.social-nav-link:hover,.social-nav-link.active{color:var(--article-red)}
.social-primary{
  min-height:48px;padding:0 20px;border-radius:12px;
  background:linear-gradient(135deg,var(--article-orange),var(--article-orange-2));
  box-shadow:0 14px 30px rgba(255,84,46,.22);text-transform:uppercase
}

.article-layout{display:block;max-width:none;margin:0;padding:0}
.article-post{border:0;border-radius:0;background:#fff;box-shadow:none;overflow:visible}
.article-hero{
  padding:68px max(22px,calc((100vw - 1060px)/2)) 42px;
  border-bottom:1px solid var(--article-line);
  background:linear-gradient(135deg,#fff 0%,#fff7ef 50%,#eef5ff 100%);text-align:center
}
.article-tag{
  margin-bottom:16px;padding:9px 12px;border:1px solid var(--article-line);border-radius:999px;
  background:#fff;color:var(--article-red);font-size:12px;letter-spacing:.08em
}
.article-hero h1{
  max-width:920px;margin:0 auto 18px;color:var(--article-ink);
  font-family:Inter,Arial,sans-serif;font-size:clamp(40px,5.4vw,70px);line-height:.98;
  letter-spacing:0;font-weight:900;text-wrap:balance
}
.article-hero h1 em{color:var(--article-red);font-style:normal}
.article-lead{max-width:760px;margin:0 auto 24px;color:#3f4652;font-size:20px;line-height:1.45;font-weight:750}
.article-byline{justify-content:center;color:var(--article-muted);font-size:14px;font-weight:800}
.article-byline img{width:42px;height:42px;border:3px solid #fff;box-shadow:0 7px 18px rgba(0,0,0,.12)}
.article-feature{width:min(860px,100%);margin:30px auto 0;overflow:hidden;border-radius:24px;background:#f7f3ed;box-shadow:0 22px 56px rgba(0,0,0,.14);text-align:left}
.article-feature img{display:block;width:100%;max-height:620px;object-fit:cover}
.article-feature figcaption{padding:12px 16px;background:#fff;color:#4d5662;font-size:13px;line-height:1.4;font-weight:800}
.post-actions,.social-sidebar,.mobile-tabbar{display:none!important}

.article-content{max-width:780px;margin:0 auto;padding:62px 22px 10px}
.article-content p,.article-content li{color:#303742;font-size:19px;line-height:1.72}
.article-content p{margin:0 0 22px}
.article-content h2{
  margin:44px 0 14px;color:var(--article-ink);font-family:Inter,Arial,sans-serif;
  font-size:clamp(30px,4vw,46px);line-height:1.02;letter-spacing:0;font-weight:900
}
.article-content h3{margin:28px 0 10px;font-size:24px;line-height:1.1}
.article-content a{color:var(--article-blue);font-weight:800}
.article-content ul,.article-content ol{margin:0 0 28px;padding-left:24px}
.article-content li{margin-bottom:12px}
.callout,.testimonial,.science-box{
  margin:28px 0;padding:24px;border:1px solid var(--article-line);border-left:0;border-radius:18px;
  background:#fffaf4;color:var(--article-ink)
}
.callout p,.testimonial p,.science-box p{margin-bottom:0;color:#303742}
.types-grid,.feature-grid,.layers-grid,.related-grid{gap:14px}
.type-card,.feature-card,.layer-card,.related-card{
  border:1px solid var(--article-line);border-radius:18px;background:#fff;
  box-shadow:0 12px 28px rgba(0,0,0,.05)
}
.comparison-table{border-color:var(--article-line);border-radius:16px}
.comparison-table th{background:#f8fafc}

.cta-block{
  max-width:780px;margin:42px auto;padding:30px;border-radius:26px;
  background:linear-gradient(135deg,#101010,#27201c);color:#fff;box-shadow:0 18px 44px rgba(0,0,0,.12)
}
.cta-block h2{margin:0 0 12px;font-family:Inter,Arial,sans-serif;font-size:clamp(30px,4vw,44px);line-height:1.03}
.cta-block p{color:#e9e9e9;font-size:17px;line-height:1.6}
.cta-btn,.cta-btn-green{
  min-height:54px;padding:14px 22px;border-radius:12px;
  background:linear-gradient(135deg,var(--article-orange),var(--article-orange-2));color:#fff;
  box-shadow:0 16px 34px rgba(255,84,46,.22);text-transform:uppercase
}
.cta-sub{display:block;margin-top:12px;color:#ccc;font-size:13px;font-weight:800}
.related{max-width:780px;margin:34px auto 62px;padding:24px;border:1px solid var(--article-line);border-radius:20px;background:#fff}
.related h3{margin-top:0;color:var(--article-muted)}
.social-footer{max-width:none;margin:0;padding:34px max(22px,calc((100vw - 1060px)/2));background:#050505;color:#aaa}
.social-footer a{color:#fff}

@media(max-width:850px){
  .social-topbar{height:64px;padding:0 18px}.social-nav-link{display:none}.social-primary{display:inline-flex;min-height:42px;padding:0 14px;font-size:12px}
  .article-hero{padding:48px 22px 30px}.article-hero h1{font-size:38px;line-height:1.02}.article-lead{font-size:17px}
  .types-grid,.feature-grid,.layers-grid,.related-grid{grid-template-columns:1fr}
}
@media(max-width:520px){
  .social-logo{font-size:22px}.social-primary{font-size:11px}
  .article-hero h1,.article-lead,.article-byline,.article-tag{width:280px;max-width:100%;margin-left:auto;margin-right:auto}
  .article-feature{width:280px;max-width:100%;border-radius:18px}.article-feature img{max-height:420px}.article-feature figcaption{font-size:12px}
  .article-hero h1{font-size:30px;line-height:1.07;overflow-wrap:break-word}.article-lead{font-size:15px;line-height:1.5}
  .article-byline{font-size:12px;white-space:normal}.article-content{max-width:340px;padding-top:44px}
  .article-content p,.article-content li{font-size:17px}.article-content h2{font-size:30px}.article-content h3{font-size:22px}
  .callout,.testimonial,.science-box,.cta-block,.related{padding:20px}
  .cta-block,.related{margin-left:16px;margin-right:16px}.cta-btn,.cta-btn-green{display:flex;width:100%;text-align:center}
  .social-footer{padding:28px 20px}.social-footer-links{display:flex;flex-wrap:wrap;gap:12px}.social-footer a{margin:0}
}
