:root{
  --seo-text:#17233f;
  --seo-muted:rgba(23,35,63,.76);
  --seo-card:rgba(255,255,255,.82);
  --seo-border:rgba(39,58,101,.14);
  --seo-accent:#6557e8;
}

/* Separate light theme for SEO article pages. */
.seo-light-page{
  background:
    radial-gradient(circle at 12% 8%, rgba(98,197,255,.22), transparent 34rem),
    radial-gradient(circle at 88% 4%, rgba(129,103,255,.18), transparent 34rem),
    #f5f8ff;
  color:var(--seo-text);
}

.seo-light-page .site-bg{
  opacity:.55;
}

.seo-light-page .navbar{
  background:rgba(247,250,255,.88);
  border-bottom:1px solid rgba(39,58,101,.10);
  box-shadow:0 8px 30px rgba(35,53,91,.07);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.seo-light-page .logo strong,
.seo-light-page .logo small,
.seo-light-page .nav-links a{
  color:#17233f;
}

.seo-light-page .burger span{
  background:#17233f;
}

.article-page{
  padding:132px 0 88px;
  position:relative;
  z-index:2;
}

.article-shell{
  max-width:1040px;
  margin:0 auto;
}

.breadcrumbs{
  display:flex;
  gap:9px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:24px;
  font-size:14px;
  color:var(--seo-muted);
}

.breadcrumbs a{
  color:var(--seo-muted);
  text-decoration:none;
}

.breadcrumbs a:hover{
  color:#111a30;
}

.article-hero{
  padding:38px;
  border:1px solid var(--seo-border);
  border-radius:30px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.94),rgba(235,240,255,.88));
  box-shadow:0 22px 70px rgba(38,55,94,.14);
}

.article-kicker{
  display:inline-flex;
  padding:8px 13px;
  border-radius:999px;
  background:rgba(101,87,232,.12);
  color:#5849d5;
  font-size:13px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.article-hero h1{
  color:#17233f !important;
  font-size:clamp(38px,6vw,68px);
  line-height:1.04;
  margin:18px 0;
}

.article-lead{
  font-size:clamp(18px,2.4vw,22px);
  line-height:1.65;
  color:var(--seo-muted) !important;
  max-width:880px;
}

.article-meta{
  margin-top:22px;
  color:rgba(23,35,63,.58) !important;
  font-size:14px;
}

.article-disclaimer{
  margin-top:22px;
  padding:16px 18px;
  border-left:3px solid var(--seo-accent);
  background:rgba(101,87,232,.075);
  border-radius:0 14px 14px 0;
  color:var(--seo-muted) !important;
  line-height:1.55;
}

.article-disclaimer a{
  color:#5142cb;
  font-weight:700;
}

.article-content{
  display:grid;
  grid-template-columns:minmax(0,1fr) 280px;
  gap:30px;
  margin-top:30px;
}

.article-main{
  display:grid;
  gap:22px;
}

.article-card,
.toc-card,
.related-card{
  padding:28px;
  border:1px solid var(--seo-border);
  border-radius:24px;
  background:var(--seo-card);
  box-shadow:0 14px 38px rgba(38,55,94,.08);
}

.article-card h2,
.article-card h3,
.toc-card h2,
.related-card h2,
.article-faq summary{
  color:#17233f !important;
}

.article-card h2{
  font-size:clamp(26px,3.5vw,38px);
  margin:0 0 13px;
}

.article-card h3{
  font-size:22px;
  margin:24px 0 10px;
}

.article-card p,
.article-card li,
.article-faq p{
  color:var(--seo-muted) !important;
  line-height:1.78;
}

.article-card ul,
.article-card ol{
  padding-left:22px;
  display:grid;
  gap:9px;
}

.article-card a{
  color:#5142cb;
}

.article-card code{
  color:#302591;
  padding:2px 7px;
  border-radius:7px;
  background:rgba(101,87,232,.10);
}

.article-aside{
  display:grid;
  align-content:start;
  gap:18px;
  position:sticky;
  top:112px;
  height:max-content;
}

.toc-card h2,
.related-card h2{
  font-size:18px;
  margin:0 0 13px;
}

.toc-card nav,
.related-card nav{
  display:grid;
  gap:10px;
}

.toc-card a,
.related-card a{
  color:var(--seo-muted);
  text-decoration:none;
  line-height:1.45;
}

.toc-card a:hover,
.related-card a:hover{
  color:#5142cb;
}

.fact-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}

.fact{
  padding:18px;
  border:1px solid var(--seo-border);
  border-radius:18px;
  background:rgba(241,244,255,.78);
}

.fact strong{
  display:block;
  margin-bottom:6px;
  color:#17233f !important;
}

.fact span{
  color:var(--seo-muted) !important;
  line-height:1.5;
}

.article-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:20px;
}

.article-faq{
  display:grid;
  gap:12px;
}

.article-faq details{
  padding:18px 20px;
  border:1px solid var(--seo-border);
  border-radius:18px;
  background:rgba(245,247,255,.92);
}

.article-faq summary{
  cursor:pointer;
  font-weight:800;
}

.article-faq p{
  margin:12px 0 0;
}

/* Cards on the home page. These rules are neutral and readable on a light section. */
.cluster-section{
  padding:80px 0;
}

.cluster-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}

.cluster-card{
  display:block;
  padding:25px;
  border:1px solid rgba(39,58,101,.13);
  border-radius:24px;
  background:rgba(255,255,255,.78);
  box-shadow:0 14px 34px rgba(38,55,94,.08);
  text-decoration:none;
  transition:.22s;
}

.cluster-card:hover{
  transform:translateY(-3px);
  border-color:rgba(101,87,232,.48);
}

.cluster-card small{
  color:#6557e8;
  font-weight:800;
  letter-spacing:.06em;
}

.cluster-card h3{
  color:#17233f !important;
  margin:10px 0;
}

.cluster-card p{
  color:rgba(23,35,63,.72) !important;
  line-height:1.6;
}

.seo-light-page .footer{
  color:#edf0ff;
}

@media(max-width:900px){
  .article-content{grid-template-columns:1fr}
  .article-aside{position:static}
  .cluster-grid{grid-template-columns:1fr}
  .fact-grid{grid-template-columns:1fr}
}

@media(max-width:620px){
  .article-page{padding-top:108px}
  .article-hero,.article-card{padding:22px}
}


/* Footer contrast fix for light SEO pages */
.seo-light-page .footer{
  color:#eef3ff !important;
}

.seo-light-page .footer .footer-glass{
  background:#102440 !important;
  border-color:rgba(255,255,255,.10) !important;
}

.seo-light-page .footer .footer-brand h3{
  color:#ffffff !important;
}

.seo-light-page .footer .footer-brand p,
.seo-light-page .footer .footer-bottom p{
  color:rgba(238,243,255,.78) !important;
}

.seo-light-page .footer .footer-links a{
  color:rgba(238,243,255,.84) !important;
}

.seo-light-page .footer .footer-links a:hover{
  color:#ffffff !important;
}

.seo-light-page .footer .btn-primary{
  color:#ffffff !important;
}

.seo-light-page .footer .footer-bottom{
  border-top-color:rgba(255,255,255,.12) !important;
}


/* be58d3f52 — shared public header and consistent article buttons. */
.seo-light-page .site-header + .article-page{
  padding-top:56px;
}
.article-card .btn.btn-primary,
.article-card a.btn.btn-primary{
  color:#101820!important;
}
.article-card .btn.btn-ghost,
.article-card a.btn.btn-ghost{
  color:#0b6d9e!important;
}
.article-card .btn{
  text-decoration:none!important;
}
@media(max-width:640px){
  .seo-light-page .site-header + .article-page{padding-top:34px}
}

/* bc802f89d — SEO pages keep their own navigation labels, but use the shared main-header proportions and branding. */
.seo-light-page .navbar{
  position:sticky!important;
  top:0!important;
  left:auto!important;
  right:auto!important;
  z-index:1000!important;
  width:100%!important;
  height:70px!important;
  min-height:70px!important;
  padding:0!important;
  background:#071a36!important;
  color:#fff!important;
  border:0!important;
  border-bottom:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 8px 22px rgba(4,19,39,.12)!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.seo-light-page .navbar .nav-inner{
  width:min(1120px,90%)!important;
  max-width:1120px!important;
  height:70px!important;
  min-height:70px!important;
  margin:0 auto!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:20px!important;
}
.seo-light-page .navbar .logo{
  display:flex!important;
  align-items:center!important;
  gap:11px!important;
  min-width:0!important;
  color:#fff!important;
  text-decoration:none!important;
}
.seo-light-page .navbar .logo img{
  width:44px!important;
  height:44px!important;
  flex:0 0 44px!important;
  border-radius:13px!important;
  border:1px solid rgba(255,255,255,.22)!important;
  object-fit:cover!important;
  box-shadow:none!important;
}
.seo-light-page .navbar .logo>div{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  min-width:0!important;
  line-height:1!important;
}
.seo-light-page .navbar .logo strong{
  display:block!important;
  margin:0!important;
  color:#fff!important;
  font-size:22px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.seo-light-page .navbar .logo strong span{color:#44c5ff!important}
.seo-light-page .navbar .logo small{
  display:block!important;
  margin-top:5px!important;
  color:#dbe8f8!important;
  font-size:11px!important;
  line-height:1.1!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.seo-light-page .navbar .nav-links{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:22px!important;
  margin-left:auto!important;
  white-space:nowrap!important;
}
.seo-light-page .navbar .nav-links a{
  color:#e6f1ff!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:800!important;
  text-decoration:none!important;
  transition:color .2s ease,transform .2s ease!important;
}
.seo-light-page .navbar .nav-links a:hover,
.seo-light-page .navbar .nav-links a[aria-current="page"]{
  color:#44c5ff!important;
  transform:translateY(-1px)!important;
}
.seo-light-page .navbar .nav-cta{
  flex:0 0 auto!important;
  min-height:40px!important;
  height:40px!important;
  padding:0 17px!important;
  border:1px solid #36bff4!important;
  border-radius:12px!important;
  background:#20afe8!important;
  color:#071a36!important;
  box-shadow:none!important;
  font-size:14px!important;
  font-weight:900!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease!important;
}
.seo-light-page .navbar .nav-cta:hover{
  transform:translateY(-1px)!important;
  background:#44c5ff!important;
  box-shadow:0 8px 18px rgba(32,175,232,.24)!important;
}
.seo-light-page .navbar .burger{
  width:40px!important;
  height:40px!important;
  padding:7px!important;
  border:1px solid #28476f!important;
  border-radius:12px!important;
  background:#142f54!important;
}
.seo-light-page .navbar .burger span{background:#fff!important;margin:4px!important}
.seo-light-page .article-page{padding-top:56px!important}

@media(max-width:960px){
  .seo-light-page .navbar .nav-links,
  .seo-light-page .navbar .nav-cta{display:none!important}
  .seo-light-page .navbar .burger{display:block!important;margin-left:auto!important}
  .seo-light-page .navbar .nav-links.mobile-open{
    display:flex!important;
    position:absolute!important;
    top:62px!important;
    left:5%!important;
    right:5%!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    margin:0!important;
    padding:12px!important;
    border:1px solid #28476f!important;
    border-radius:14px!important;
    background:#0d2443!important;
    box-shadow:0 18px 36px rgba(4,19,39,.28)!important;
  }
  .seo-light-page .navbar .nav-links.mobile-open a{
    padding:11px 12px!important;
    border-radius:9px!important;
  }
  .seo-light-page .navbar .nav-links.mobile-open a:hover{background:#142f54!important}
}
@media(max-width:640px){
  .seo-light-page .navbar,
  .seo-light-page .navbar .nav-inner{height:62px!important;min-height:62px!important}
  .seo-light-page .navbar .nav-inner{width:calc(100% - 24px)!important;gap:8px!important}
  .seo-light-page .navbar .logo{gap:8px!important}
  .seo-light-page .navbar .logo img{width:38px!important;height:38px!important;flex-basis:38px!important;border-radius:11px!important}
  .seo-light-page .navbar .logo strong{font-size:18px!important}
  .seo-light-page .navbar .logo small{display:none!important}
  .seo-light-page .navbar .burger{width:36px!important;height:36px!important;border-radius:10px!important}
  .seo-light-page .article-page{padding-top:38px!important}
}


/* b4b025c39 — SEO-page header follows the shared header, with navigation aligned after the logo. */
.seo-light-page .navbar .logo strong{font-weight:600!important}
.seo-light-page .navbar .logo small{font-weight:500!important}
.seo-light-page .navbar .nav-links{
  justify-content:flex-start!important;
  margin-left:24px!important;
  margin-right:auto!important;
}
.seo-light-page .article-actions{justify-content:flex-start!important}