.staticMain{
  width:min(940px,calc(100% - 48px));
  max-width:none;
  margin:0 auto;
  padding:72px 0 32px
}
.staticCard{
  padding:clamp(40px,5vw,64px);
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(27,32,38,.96),rgba(20,24,29,.98));
  box-shadow:0 24px 72px rgba(0,0,0,.2)
}
.staticHero{
  max-width:900px;
  margin:0 auto 50px;
  text-align:left
}
.staticHero .eyebrow{margin-bottom:12px}
.staticHero h1{
  margin:0 0 18px;
  color:var(--text);
  font-size:clamp(48px,6vw,68px);
  line-height:1.01;
  letter-spacing:-.05em
}
.staticHero .lede{
  margin:0;
  max-width:820px;
  font-size:17px;
  line-height:1.7
}
.staticCard .content section{scroll-margin-top:32px}
.staticCard .content section+section{padding-top:6px}
.guideLayout{
  position:relative;
  max-width:820px;
  margin:0 auto
}
.guideToc{
  position:absolute;
  right:calc(100% + 38px);
  top:0;
  width:210px;
  min-width:0;
  scroll-margin-top:28px
}
.guideTocInner{
  position:sticky;
  top:28px;
  padding:17px 16px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(21,25,30,.76);
  backdrop-filter:blur(10px)
}
.guideToc strong{
  display:block;
  margin-bottom:10px;
  color:#dbe1e8;
  font-size:12px;
  letter-spacing:.09em;
  text-transform:uppercase
}
.guideToc nav{display:flex;flex-direction:column;gap:2px}
.guideToc a{
  display:block;
  padding:7px 8px;
  border-radius:7px;
  color:#96a2af;
  font-size:12px;
  line-height:1.4
}
.guideToc a:hover{background:rgba(255,255,255,.04);color:#fff}
.guideLayout .content{min-width:0}
.guideLayout .content section{scroll-margin-top:28px}
.guideJump{
  position:fixed;
  left:50%;
  bottom:24px;
  z-index:30;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:0 15px;
  border:1px solid rgba(82,90,100,.9);
  border-radius:999px;
  background:rgba(21,25,30,.94);
  box-shadow:0 10px 30px rgba(0,0,0,.34);
  backdrop-filter:blur(12px);
  color:#dbe1e8;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.01em;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,8px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s,border-color .15s ease,background .15s ease,box-shadow .15s ease
}
.guideJump.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translate(-50%,0)
}
.guideJump.is-visible:hover{
  transform:translate(-50%,-2px);
  border-color:#647180;
  background:rgba(29,34,40,.97);
  box-shadow:0 14px 34px rgba(0,0,0,.38);
  color:#fff
}
.guideJump span{color:var(--accent);font-size:14px}
.guideHubSection{margin:0 0 62px}
.guideHubHeading{max-width:720px;margin-bottom:24px}
.guideHubHeading>span{
  display:block;
  margin-bottom:7px;
  color:#0289FC;
  font-size:12px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase
}
.guideHubHeading h2{margin-bottom:10px}
.guideHubHeading p{color:var(--muted)!important;font-size:15px!important}
.guideHubGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px
}
.guideHubCard{
  position:relative;
  display:flex;
  min-height:210px;
  flex-direction:column;
  padding:25px;
  border:1px solid var(--border);
  border-radius:15px;
  background:rgba(21,25,30,.78);
  color:var(--text);
  transition:transform .16s ease,border-color .16s ease,background .16s ease
}
.guideHubCard:hover{
  transform:translateY(-2px);
  border-color:var(--border-strong);
  background:var(--surface-2);
  color:#fff
}
.guideHubFeatured{
  grid-column:span 2;
  min-height:200px;
  background:linear-gradient(135deg,rgba(2,137,252,.12),rgba(21,25,30,.86));
  border-color:rgba(2,137,252,.38)
}
.guideHubKicker{
  margin-bottom:11px;
  color:#0289FC;
  font-size:12px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase
}
.guideHubCard strong{
  font-size:20px;
  line-height:1.3;
  letter-spacing:-.02em
}
.guideHubCard p{
  margin:10px 0 20px!important;
  color:var(--muted)!important;
  font-size:14.5px!important;
  line-height:1.6
}
.guideHubCard em{
  margin-top:auto;
  color:#b9d9f9;
  font-size:13px;
  font-style:normal;
  font-weight:700
}
.guideHubHelp{
  padding:26px;
  border:1px solid var(--border);
  border-radius:14px;
  background:rgba(21,25,30,.55)
}
.guideHubHelp h2{font-size:23px}
.guideHubHelp p:last-child{margin-bottom:0}
.guideHubPage .staticHero{max-width:none}
.guideHubPage .staticHero .lede{max-width:900px}

@media(max-width:1240px){
  .guideToc{
    position:relative;
    right:auto;
    top:auto;
    width:auto;
    margin:0 0 38px
  }
  .guideTocInner{position:static}
  .guideToc nav{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:4px 14px
  }
  .guideToc a{padding:7px}
}

@media(max-width:880px){
  .staticMain{padding-top:52px}
}

@media(max-width:640px){
  .staticMain{width:calc(100% - 24px);padding:38px 0 20px}
  .staticCard{padding:28px 20px;border-radius:16px}
  .staticHero{margin-bottom:36px}
  .staticHero h1{font-size:40px}
  .staticHero .lede{font-size:15.5px}
  .guideToc nav{grid-template-columns:1fr}
  .guideToc{margin-bottom:30px}
  .guideJump{bottom:14px;min-height:40px;padding:0 14px}
  .guideHubGrid{grid-template-columns:1fr}
  .guideHubFeatured{grid-column:auto;min-height:0}
  .guideHubCard{min-height:0}
  .guideHubSection{margin-bottom:46px}
}

@media(prefers-reduced-motion:reduce){
  .guideJump{transition:none}
}