.page-shell-hero{
  background:var(--hx-primary-soft);
  border-bottom:1px solid var(--hx-line)
}

.guide-hero__content{
  max-width:var(--hx-container-narrow);
  padding-block:var(--hx-space-5)
}

.guide-hero__content .hx-eyebrow{
  margin-top:var(--hx-space-4)
}

.guide-hero__content h1{
  margin-bottom:var(--hx-space-3)
}

.guide-hero__lead{
  max-width:44rem;
  margin-bottom:var(--hx-space-3);
  color:var(--hx-text);
  font-size:var(--hx-text-lg)
}

.guide-hero__actions{
  margin-bottom:var(--hx-space-2)
}

.guide-hero__boundary{
  max-width:43rem;
  margin-bottom:0;
  font-size:var(--hx-text-sm)
}

.guide-index{
  padding-top:var(--hx-space-5)
}

.guide-index__grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  overflow:hidden;
  border:1px solid var(--hx-line);
  border-radius:var(--hx-radius-md);
  background:var(--hx-surface)
}

.guide-index__grid a{
  min-width:0;
  padding:var(--hx-space-2);
  border-right:1px solid var(--hx-line);
  color:var(--hx-text);
  font-size:var(--hx-text-sm);
  font-weight:700;
  text-align:center;
  transition:background .2s,color .2s
}

.guide-index__grid a:last-child{
  border-right:0
}

.guide-index__grid a:hover{
  background:var(--hx-primary-soft);
  color:var(--hx-primary-hover)
}

.preflight-grid .c-card{
  display:flex;
  min-height:100%;
  flex-direction:column
}

.guide-icon{
  width:2rem;
  height:2rem;
  margin-bottom:var(--hx-space-2);
  color:var(--hx-primary)
}

.preflight-grid h3{
  margin-bottom:var(--hx-space-1)
}

.preflight-grid p{
  flex:1;
  margin-bottom:var(--hx-space-2)
}

.guide-card__meta{
  display:block;
  color:var(--hx-muted);
  font-size:var(--hx-text-xs);
  font-weight:700;
  overflow-wrap:anywhere
}

.preflight-notice{
  margin-top:var(--hx-space-3)
}

.preflight-notice p{
  margin:.2rem 0 0
}

.notice-icon{
  width:1.5rem;
  height:1.5rem;
  flex:0 0 auto;
  color:var(--hx-primary)
}

.connection-steps{
  max-width:54rem;
  margin:0 auto;
  padding:0;
  list-style:none
}

.connection-step{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--hx-space-3);
  padding-bottom:var(--hx-space-4)
}

.connection-step:last-child{
  padding-bottom:0
}

.connection-step:not(:last-child):after{
  position:absolute;
  top:3rem;
  bottom:.5rem;
  left:1.45rem;
  width:1px;
  background:var(--hx-line-strong);
  content:""
}

.connection-step__number{
  position:relative;
  z-index:1;
  display:grid;
  width:3rem;
  height:3rem;
  place-items:center;
  border:1px solid var(--hx-primary);
  border-radius:50%;
  background:var(--hx-surface);
  color:var(--hx-primary-hover);
  font-size:var(--hx-text-xs);
  font-weight:750
}

.connection-step h3{
  margin-bottom:var(--hx-space-1)
}

.connection-step p{
  margin-bottom:var(--hx-space-1)
}

.connection-step__check{
  display:flex;
  flex-wrap:wrap;
  gap:.35rem;
  color:var(--hx-muted);
  font-size:var(--hx-text-sm)
}

.connection-step__check strong{
  color:var(--hx-ink)
}

.ssh-layout{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:var(--hx-space-5);
  align-items:start
}

.ssh-copy{
  min-width:0;
  position:sticky;
  top:calc(var(--hx-header-height) + var(--hx-space-3))
}

.ssh-copy h2{
  margin-bottom:var(--hx-space-3)
}

.ssh-copy>p{
  margin-bottom:var(--hx-space-3)
}

.ssh-copy .c-notice p{
  margin:.2rem 0 0
}

.ssh-checklist{
  min-width:0;
  border-top:1px solid var(--hx-line-strong)
}

.ssh-item{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--hx-space-2);
  padding:var(--hx-space-3) 0;
  border-bottom:1px solid var(--hx-line-strong)
}

.ssh-item__index{
  color:var(--hx-primary-hover);
  font-size:var(--hx-text-sm);
  font-weight:750
}

.ssh-item h3{
  margin-bottom:var(--hx-space-1)
}

.ssh-item p{
  margin-bottom:0
}

.ssh-command-grid{
  margin-top:var(--hx-space-5)
}

.command-card{
  min-width:0;
  padding:var(--hx-space-3);
  border:1px solid var(--hx-line);
  border-radius:var(--hx-radius-md);
  background:var(--hx-gray)
}

.command-card h3{
  margin-bottom:var(--hx-space-2)
}

.command-card pre{
  margin-bottom:var(--hx-space-2)
}

.command-card p{
  margin-bottom:0
}

.terminal-section{
  background:var(--hx-dark)
}

.terminal-heading h2{
  color:var(--hx-surface)
}

.terminal-heading p{
  color:var(--hx-accent)
}

.terminal-heading .hx-eyebrow{
  color:var(--hx-accent)
}

.terminal-window{
  max-width:62rem;
  margin-inline:auto;
  overflow:hidden;
  border:1px solid var(--hx-muted);
  border-radius:var(--hx-radius-lg);
  background:var(--hx-ink);
  box-shadow:var(--hx-shadow)
}

.terminal-window__bar{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:var(--hx-space-2);
  padding:.8rem var(--hx-space-2);
  border-bottom:1px solid var(--hx-muted);
  background:var(--hx-text)
}

.terminal-window__controls{
  display:flex;
  gap:.45rem
}

.terminal-dot{
  width:.72rem;
  height:.72rem;
  border-radius:50%
}

.terminal-dot--danger{
  background:var(--hx-danger)
}

.terminal-dot--warning{
  background:var(--hx-warning)
}

.terminal-dot--success{
  background:var(--hx-success)
}

.terminal-window__title{
  min-width:0;
  overflow:hidden;
  color:var(--hx-gray);
  font-size:var(--hx-text-xs);
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap
}

.terminal-window__secure{
  display:flex;
  align-items:center;
  gap:.35rem;
  color:var(--hx-success-soft);
  font-size:var(--hx-text-xs);
  font-weight:700
}

.terminal-window__secure svg{
  width:1rem;
  height:1rem
}

.terminal-window__body{
  max-width:100%;
  overflow-x:auto;
  padding:var(--hx-space-3);
  color:var(--hx-gray);
  font-size:var(--hx-text-sm);
  line-height:1.75
}

.terminal-line{
  display:flex;
  min-width:max-content;
  gap:.7rem
}

.terminal-prompt{
  color:var(--hx-primary)
}

.terminal-output{
  min-width:max-content;
  padding-left:1.5rem;
  color:var(--hx-accent)
}

.terminal-success{
  min-width:max-content;
  padding-left:1.5rem;
  color:var(--hx-success);
  font-weight:750
}

.terminal-progress{
  width:100%;
  min-width:22rem;
  height:.35rem;
  margin:.5rem 0;
  overflow:hidden;
  border-radius:var(--hx-radius-pill);
  background:var(--hx-muted)
}

.terminal-progress span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:var(--hx-primary)
}

.terminal-notes{
  max-width:62rem;
  margin:var(--hx-space-3) auto 0
}

.terminal-note{
  min-width:0;
  padding:var(--hx-space-3);
  border:1px solid var(--hx-muted);
  border-radius:var(--hx-radius-md);
  background:var(--hx-text)
}

.terminal-note h3{
  margin-bottom:var(--hx-space-1);
  color:var(--hx-surface)
}

.terminal-note p{
  margin-bottom:0;
  color:var(--hx-accent)
}

.latency-method{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  margin-bottom:var(--hx-space-3);
  overflow:hidden;
  border:1px solid var(--hx-line);
  border-radius:var(--hx-radius-md);
  background:var(--hx-gray)
}

.latency-method div{
  min-width:0;
  padding:var(--hx-space-2);
  border-right:1px solid var(--hx-line)
}

.latency-method div:last-child{
  border-right:0
}

.latency-method span,
.latency-method strong{
  display:block
}

.latency-method span{
  margin-bottom:.3rem;
  color:var(--hx-muted);
  font-size:var(--hx-text-xs);
  font-weight:700
}

.latency-method strong{
  color:var(--hx-ink);
  font-size:var(--hx-text-sm);
  overflow-wrap:anywhere
}

.latency-table{
  min-width:68rem
}

.latency-table caption{
  padding:var(--hx-space-2);
  color:var(--hx-text);
  font-weight:700;
  text-align:left
}

.latency-table tbody th{
  padding:1rem 1.1rem;
  border-bottom:1px solid var(--hx-line);
  color:var(--hx-ink);
  font-size:var(--hx-text-sm);
  text-align:left;
  white-space:nowrap
}

.latency-table tbody tr:last-child th{
  border-bottom:0
}

.latency-table td{
  white-space:nowrap
}

.latency-guidance{
  margin-top:var(--hx-space-3)
}

.latency-guidance .c-card{
  min-height:100%
}

.latency-range{
  display:inline-block;
  margin-bottom:var(--hx-space-2);
  color:var(--hx-primary-hover);
  font-size:var(--hx-text-lg);
  font-weight:750
}

.latency-guidance h3{
  margin-bottom:var(--hx-space-1)
}

.latency-guidance p{
  margin-bottom:0
}

.latency-footnote{
  max-width:58rem;
  margin:var(--hx-space-3) auto 0;
  font-size:var(--hx-text-sm);
  text-align:center
}

.optimization-card{
  min-width:0;
  padding:var(--hx-space-3);
  border:1px solid var(--hx-accent);
  border-radius:var(--hx-radius-md);
  background:var(--hx-surface)
}

.optimization-card__head{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--hx-space-2);
  align-items:center;
  margin-bottom:var(--hx-space-2)
}

.optimization-card__number{
  display:grid;
  width:2.6rem;
  height:2.6rem;
  place-items:center;
  border-radius:50%;
  background:var(--hx-primary);
  color:var(--hx-surface);
  font-size:var(--hx-text-xs);
  font-weight:750
}

.optimization-card h3{
  margin-bottom:0
}

.optimization-card p{
  margin-bottom:var(--hx-space-2)
}

.optimization-card ul{
  margin:0;
  padding-left:1.2rem;
  color:var(--hx-text)
}

.optimization-card li+li{
  margin-top:var(--hx-space-1)
}

.troubleshooting-faq .c-faq__content{
  padding-top:var(--hx-space-2);
  border-top:1px solid var(--hx-line)
}

.troubleshooting-faq ol{
  margin:0;
  padding-left:1.3rem
}

.troubleshooting-faq li+li{
  margin-top:var(--hx-space-1)
}

.support-packet{
  margin-top:var(--hx-space-4);
  padding:var(--hx-space-3);
  border:1px solid var(--hx-line-strong);
  border-radius:var(--hx-radius-lg);
  background:var(--hx-gray)
}

.support-packet h3{
  margin-bottom:var(--hx-space-2)
}

.support-packet__grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--hx-space-1);
  margin-bottom:var(--hx-space-3)
}

.support-packet__grid span{
  min-width:0;
  padding:.65rem .8rem;
  border:1px solid var(--hx-line);
  border-radius:var(--hx-radius-sm);
  background:var(--hx-surface);
  color:var(--hx-text);
  font-size:var(--hx-text-sm);
  text-align:center
}

.support-packet p{
  overflow-wrap:anywhere
}

.support-packet a:not(.c-btn){
  color:var(--hx-primary-hover);
  text-decoration:underline;
  text-underline-offset:.2rem
}

.final-cta-section{
  padding-top:0
}

.guide-page-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--hx-space-4);
  align-items:center;
  padding:var(--hx-space-4);
  border:1px solid var(--hx-accent);
  border-radius:var(--hx-radius-lg);
  background:var(--hx-primary-soft)
}

.guide-page-cta h2{
  margin-bottom:var(--hx-space-2)
}

.guide-page-cta p{
  max-width:48rem;
  margin-bottom:var(--hx-space-1);
  color:var(--hx-text)
}

.guide-page-cta__note{
  font-size:var(--hx-text-sm)
}

.guide-page-cta__actions{
  display:grid;
  min-width:max-content;
  gap:var(--hx-space-2)
}

@media(max-width:1060px){
  .guide-index__grid{
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .guide-index__grid a{
    border-bottom:1px solid var(--hx-line)
  }

  .guide-index__grid a:nth-child(3){
    border-right:0
  }

  .guide-index__grid a:nth-child(n+4){
    border-bottom:0
  }

  .latency-method{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .latency-method div:nth-child(2){
    border-right:0
  }

  .latency-method div:nth-child(-n+2){
    border-bottom:1px solid var(--hx-line)
  }

  .support-packet__grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:900px){
  .ssh-layout{
    grid-template-columns:1fr;
    gap:var(--hx-space-4)
  }

  .ssh-copy{
    position:static
  }

  .guide-page-cta{
    grid-template-columns:1fr
  }

  .guide-page-cta__actions{
    min-width:0;
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:640px){
  .guide-hero__content{
    padding-block:var(--hx-space-4)
  }

  .guide-hero__lead{
    font-size:var(--hx-text-md)
  }

  .guide-hero__actions .c-btn{
    width:100%
  }

  .guide-index{
    padding-top:var(--hx-space-4)
  }

  .guide-index__grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .guide-index__grid a:nth-child(3){
    border-right:1px solid var(--hx-line)
  }

  .guide-index__grid a:nth-child(2n){
    border-right:0
  }

  .guide-index__grid a:nth-child(4){
    border-bottom:1px solid var(--hx-line)
  }

  .guide-index__grid a:nth-child(n+5){
    border-bottom:0
  }

  .connection-step{
    gap:var(--hx-space-2)
  }

  .connection-step__number{
    width:2.6rem;
    height:2.6rem
  }

  .connection-step:not(:last-child):after{
    top:2.6rem;
    left:1.27rem
  }

  .terminal-window__bar{
    grid-template-columns:auto minmax(0,1fr)
  }

  .terminal-window__secure{
    display:none
  }

  .terminal-window__body{
    padding:var(--hx-space-2)
  }

  .latency-method{
    grid-template-columns:1fr
  }

  .latency-method div{
    border-right:0;
    border-bottom:1px solid var(--hx-line)
  }

  .latency-method div:nth-child(2){
    border-bottom:1px solid var(--hx-line)
  }

  .latency-method div:last-child{
    border-bottom:0
  }

  .support-packet__grid{
    grid-template-columns:1fr
  }

  .guide-page-cta{
    padding:var(--hx-space-3)
  }

  .guide-page-cta__actions{
    grid-template-columns:1fr
  }

  .guide-page-cta__actions .c-btn{
    width:100%
  }
}

@media(max-width:390px){
  .guide-index__grid{
    grid-template-columns:1fr
  }

  .guide-index__grid a,
  .guide-index__grid a:nth-child(3),
  .guide-index__grid a:nth-child(2n){
    border-right:0
  }

  .guide-index__grid a:nth-child(n){
    border-bottom:1px solid var(--hx-line)
  }

  .guide-index__grid a:last-child{
    border-bottom:0
  }

  .connection-step{
    grid-template-columns:1fr
  }

  .connection-step:not(:last-child):after{
    display:none
  }

  .ssh-item{
    grid-template-columns:1fr
  }

  .terminal-window__title{
    text-align:right
  }

  .c-notice{
    align-items:flex-start
  }
}