.guide-hero{
  position:relative;
  padding-top:clamp(64px,8vw,108px);
  padding-bottom:clamp(52px,7vw,88px);
  border-bottom:1px solid var(--color-border);
  background:var(--color-panel);
}
.guide-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:radial-gradient(var(--color-grid) 1px,transparent 1.4px);
  background-size:20px 20px;
  opacity:.48;
  pointer-events:none;
}
.guide-hero-inner{
  position:relative;
  text-align:center;
}
.guide-hero .eyebrow{
  margin-top:22px;
}
.guide-hero h1{
  max-width:760px;
  margin:18px auto 0;
  font-size:clamp(52px,5vw,68px);
}
.guide-lead{
  max-width:760px;
  margin:24px auto 0;
  color:var(--color-muted);
  font-size:18px;
}
.guide-relations{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  max-width:820px;
  margin:30px auto 0;
  text-align:left;
}
.guide-relations p{
  min-width:0;
  padding:16px 18px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:var(--color-bg);
  box-shadow:var(--shadow-chip);
  color:var(--color-muted);
  font-size:14px;
}
.guide-relations strong{
  color:var(--color-text);
}
.guide-relations a{
  color:var(--color-accent-dark);
  font-weight:750;
  text-decoration:underline;
  text-underline-offset:3px;
}
.guide-article{
  padding-top:56px;
  padding-bottom:var(--section-space);
}
.guide-layout{
  display:grid;
  grid-template-columns:250px minmax(0,1fr);
  gap:54px;
  align-items:start;
}
.guide-aside{
  min-width:0;
}
.guide-aside-card{
  position:sticky;
  top:92px;
  padding:24px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-lg);
  background:var(--color-panel-strong);
}
.guide-aside-card>p:not(.eyebrow){
  margin-top:12px;
  color:var(--color-muted);
  font-size:14px;
}
.guide-aside-card dl{
  display:grid;
  gap:14px;
  margin:24px 0 0;
}
.guide-aside-card dl div{
  padding-top:14px;
  border-top:1px solid var(--color-border);
}
.guide-aside-card dt{
  color:var(--color-muted);
  font-size:12px;
}
.guide-aside-card dd{
  margin:4px 0 0;
  color:var(--color-text);
  font-family:var(--font-mono);
  font-size:13px;
  font-weight:800;
}
.guide-content{
  min-width:0;
  max-width:850px;
}
.guide-section{
  padding-top:24px;
  padding-bottom:72px;
  border-bottom:1px solid var(--color-border);
}
.guide-section:first-child{
  padding-top:0;
}
.guide-section:last-of-type{
  border-bottom:0;
}
.section-mark{
  color:var(--color-accent-dark);
  font-family:var(--font-mono);
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}
.guide-section h2{
  margin-top:10px;
  font-size:clamp(32px,3.5vw,46px);
}
.guide-section h3{
  margin-top:36px;
  font-size:24px;
}
.guide-section p{
  color:var(--color-muted);
}
.guide-section h2+p,
.guide-section h3+p{
  margin-top:16px;
}
.guide-section p+p{
  margin-top:16px;
}
.guide-section .table-scroll{
  margin-top:26px;
  margin-bottom:28px;
}
.guide-section .callout{
  margin-top:28px;
  margin-bottom:28px;
  color:var(--color-text);
}
.guide-section pre{
  margin-top:22px;
  margin-bottom:22px;
}
.decision-list{
  display:grid;
  gap:12px;
  margin-top:24px;
  margin-bottom:26px;
  padding:0;
  list-style:none;
}
.decision-list li{
  position:relative;
  padding:15px 18px 15px 46px;
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  background:var(--color-panel);
  color:var(--color-muted);
}
.decision-list li::before{
  content:"✓";
  position:absolute;
  left:18px;
  top:15px;
  color:var(--color-success);
  font-weight:800;
}
.decision-list strong{
  color:var(--color-text);
}
.guide-content .promo-block{
  margin-top:64px;
}
@media (max-width:1000px){
  .guide-layout{
    grid-template-columns:minmax(0,1fr);
  }
  .guide-aside{
    display:none;
  }
  .guide-content{
    max-width:var(--reading-width);
    margin-inline:auto;
  }
}
@media (max-width:768px){
  .guide-hero{
    padding-top:48px;
    padding-bottom:52px;
  }
  .guide-hero h1{
    font-size:clamp(32px,9.5vw,40px);
  }
  .guide-lead{
    font-size:16px;
  }
  .guide-relations{
    grid-template-columns:1fr;
  }
  .guide-article{
    padding-top:34px;
  }
  .guide-content{
    width:100%;
    max-width:100%;
  }
  .guide-section{
    padding-bottom:56px;
  }
  .guide-section h3{
    margin-top:30px;
    font-size:22px;
  }
}
@media (max-width:640px){
  .guide-hero .badge{
    max-width:100%;
  }
  .guide-relations p{
    padding:14px;
  }
  .guide-section h2{
    font-size:clamp(28px,8vw,36px);
  }
  .decision-list li{
    padding-left:42px;
  }
}