.connect-hero{
  padding-block:var(--nm-s10) var(--nm-s12);
  background:var(--nm-page);
  color:var(--nm-text)
}

.connect-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(22rem,.98fr);
  gap:var(--nm-s6);
  align-items:center
}

.connect-hero__grid>*{
  min-width:0
}

.connect-hero__copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--nm-s1)
}

.connect-hero__copy h1{
  max-width:min(36rem,100%);
  min-width:0;
  overflow-wrap:anywhere
}

.connect-hero__lead{
  max-width:42rem;
  color:var(--nm-muted);
  font-size:var(--nm-fs-3)
}

.connect-hero__actions{
  justify-content:flex-start;
  margin-top:var(--nm-s2)
}

.connect-hero__facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  width:100%;
  margin:var(--nm-s4) 0 0;
  padding-top:var(--nm-s3);
  border-top:1px solid var(--nm-line)
}

.connect-hero__facts div{
  min-width:0;
  padding-right:var(--nm-s2)
}

.connect-hero__facts div+div{
  padding-left:var(--nm-s2);
  border-left:1px solid var(--nm-line)
}

.connect-hero__facts dt{
  color:var(--nm-muted)
}

.connect-hero__facts dd{
  margin-top:var(--nm-s1);
  color:var(--nm-text);
  overflow-wrap:anywhere
}

.connect-hero__facts strong{
  display:block;
  color:var(--nm-ink);
  font-family:var(--nm-mono);
  font-size:var(--nm-fs-3);
  font-variant-numeric:tabular-nums
}

.connection-manifest{
  overflow:hidden;
  border-radius:var(--nm-r-lg);
  background:var(--nm-surface);
  color:var(--nm-text);
  box-shadow:var(--nm-shadow)
}

.connection-manifest__head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:var(--nm-s2);
  padding:var(--nm-s2) var(--nm-s3);
  background:var(--nm-dark);
  color:var(--nm-dark-muted)
}

.connection-manifest__head .c-status{
  color:var(--nm-dark-text)
}

.connection-manifest__head>span:last-child{
  font-size:var(--nm-fs-0);
  overflow-wrap:anywhere
}

.connection-manifest__body{
  padding:var(--nm-s4);
  background:var(--nm-surface);
  color:var(--nm-text)
}

.connection-manifest__body h2{
  color:var(--nm-ink);
  font-size:var(--nm-fs-5)
}

.connection-manifest__steps{
  display:grid;
  gap:var(--nm-s3);
  list-style:none;
  margin:var(--nm-s4) 0 0;
  padding:0
}

.connection-manifest__steps li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:var(--nm-s2);
  align-items:start;
  min-width:0
}

.connection-manifest__number{
  display:inline-flex;
  width:2.4rem;
  height:2.4rem;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--nm-accent-paper);
  color:var(--nm-primary-deep);
  font-family:var(--nm-mono);
  font-size:var(--nm-fs-0);
  font-weight:750;
  font-variant-numeric:tabular-nums
}

.connection-manifest__steps div{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1)
}

.connection-manifest__steps h3{
  color:var(--nm-ink);
  font-size:var(--nm-fs-3)
}

.connection-manifest__steps p{
  color:var(--nm-muted);
  font-size:var(--nm-fs-1)
}

.connection-manifest__foot{
  display:flex;
  justify-content:space-between;
  gap:var(--nm-s2);
  padding:var(--nm-s2) var(--nm-s3);
  background:var(--nm-accent-paper);
  color:var(--nm-primary-deep);
  font-size:var(--nm-fs-0)
}

.connection-manifest__foot strong{
  text-align:right;
  overflow-wrap:anywhere
}

.connect-heading{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--nm-s1)
}

.connect-heading .kicker,
.connect-heading .c-badge{
  width:fit-content;
  max-width:100%;
  align-self:flex-start
}

.preflight-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));
  gap:var(--nm-s3);
  align-items:start;
  margin-top:var(--nm-s5)
}

.preflight-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-surface);
  color:var(--nm-text);
  box-shadow:var(--nm-shadow-soft)
}

.preflight-card__index{
  color:var(--nm-primary);
  font-size:var(--nm-fs-0);
  font-weight:750
}

.preflight-card h3{
  color:var(--nm-ink)
}

.preflight-card p{
  color:var(--nm-muted)
}

.preflight-card strong{
  margin-top:var(--nm-s2);
  color:var(--nm-primary-deep);
  font-size:var(--nm-fs-1)
}

.connect-notice{
  margin-top:var(--nm-s4)
}

.connect-notice h3{
  margin-bottom:var(--nm-s1)
}

.ssh-layout{
  display:grid;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:var(--nm-s4);
  align-items:start;
  margin-top:var(--nm-s5)
}

.ssh-layout>*{
  min-width:0
}

.ssh-sequence{
  display:flex;
  flex-direction:column;
  gap:var(--nm-s2)
}

.ssh-step{
  display:grid;
  grid-template-columns:minmax(4.5rem,auto) minmax(0,1fr);
  gap:var(--nm-s2);
  min-width:0;
  padding:var(--nm-s3);
  border-radius:var(--nm-r-md);
  background:var(--nm-soft);
  color:var(--nm-text)
}

.ssh-step__label{
  color:var(--nm-primary);
  font-size:var(--nm-fs-0);
  font-weight:750
}

.ssh-step div{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1)
}

.ssh-step h3{
  color:var(--nm-ink);
  font-size:var(--nm-fs-3)
}

.ssh-step p{
  color:var(--nm-muted);
  font-size:var(--nm-fs-1)
}

.ssh-command-sheet{
  display:flex;
  min-width:0;
  overflow:hidden;
  flex-direction:column;
  border-radius:var(--nm-r-lg);
  background:var(--nm-dark);
  color:var(--nm-dark-text);
  box-shadow:var(--nm-shadow)
}

.ssh-command-sheet__head,
.ssh-command-sheet__foot{
  display:flex;
  justify-content:space-between;
  gap:var(--nm-s2);
  padding:var(--nm-s2) var(--nm-s3);
  background:var(--nm-dark-surface);
  color:var(--nm-dark-muted);
  font-size:var(--nm-fs-0)
}

.ssh-command-sheet__head span,
.ssh-command-sheet__foot span,
.ssh-command-sheet__foot strong{
  min-width:0;
  overflow-wrap:anywhere
}

.ssh-command-sheet__foot strong{
  color:var(--nm-dark-text);
  text-align:right
}

.ssh-command-sheet__content{
  display:flex;
  flex:1;
  flex-direction:column;
  gap:var(--nm-s3);
  padding:var(--nm-s3);
  background:var(--nm-dark);
  color:var(--nm-dark-text)
}

.command-block{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1)
}

.command-block>span{
  color:var(--nm-dark-muted);
  font-size:var(--nm-fs-0);
  font-weight:700
}

.command-block pre{
  min-width:max-content;
  color:var(--nm-dark-text)
}

.desktop-flow{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,19rem),1fr));
  gap:var(--nm-s3);
  align-items:start;
  list-style:none;
  margin:var(--nm-s5) 0 0;
  padding:0
}

.desktop-flow li{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-surface);
  color:var(--nm-text);
  box-shadow:var(--nm-shadow-soft)
}

.desktop-flow__number{
  display:inline-flex;
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  padding:.45em .8em;
  border-radius:999px;
  background:var(--nm-accent-paper);
  color:var(--nm-primary-deep);
  font-family:var(--nm-mono);
  font-size:var(--nm-fs-0);
  font-weight:750
}

.desktop-flow li>div{
  display:flex;
  flex-direction:column;
  gap:var(--nm-s1)
}

.desktop-flow h3{
  color:var(--nm-ink)
}

.desktop-flow p{
  color:var(--nm-muted)
}

.desktop-flow strong{
  margin-top:var(--nm-s2);
  color:var(--nm-primary-deep);
  font-size:var(--nm-fs-1)
}

.sync-table-wrap{
  margin-top:var(--nm-s5);
  border-radius:var(--nm-r-md);
  box-shadow:var(--nm-shadow-soft)
}

.sync-table{
  min-width:58rem
}

.sync-table caption{
  padding:var(--nm-s2);
  background:var(--nm-soft);
  color:var(--nm-muted);
  font-size:var(--nm-fs-1);
  text-align:left
}

.sync-table td,
.sync-table th{
  overflow-wrap:anywhere
}

.sync-command-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--nm-s3);
  align-items:start;
  margin-top:var(--nm-s4)
}

.sync-command-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-soft);
  color:var(--nm-text)
}

.sync-command-card h3{
  color:var(--nm-ink)
}

.sync-command-card p{
  color:var(--nm-muted)
}

.sync-command-card .c-code-scroll{
  margin-top:var(--nm-s2);
  padding:var(--nm-s2);
  border-radius:var(--nm-r-sm);
  background:var(--nm-dark);
  color:var(--nm-dark-text)
}

.sync-command-card pre{
  min-width:max-content;
  color:var(--nm-dark-text)
}

.automation-section{
  background:var(--nm-dark);
  color:var(--nm-dark-text)
}

.automation-intro{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:var(--nm-s5);
  align-items:end
}

.automation-intro h2{
  color:var(--nm-dark-text)
}

.automation-intro p{
  color:var(--nm-dark-muted)
}

.automation-board{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));
  gap:var(--nm-s3);
  align-items:start;
  margin-top:var(--nm-s5)
}

.automation-board article{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-dark-surface);
  color:var(--nm-dark-text)
}

.automation-board__code{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  color:var(--nm-dark-muted);
  font-size:var(--nm-fs-0);
  font-weight:750
}

.automation-board h3{
  color:var(--nm-dark-text)
}

.automation-board p,
.automation-board li{
  color:var(--nm-dark-muted)
}

.automation-board ul{
  margin:var(--nm-s2) 0 0;
  padding-left:var(--nm-s3)
}

.automation-board li+li{
  margin-top:var(--nm-s1)
}

.automation-check{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--nm-s3);
  align-items:center;
  margin-top:var(--nm-s4);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-accent-paper);
  color:var(--nm-text)
}

.automation-check div{
  display:flex;
  flex-direction:column;
  gap:var(--nm-s1)
}

.automation-check h3{
  color:var(--nm-ink)
}

.automation-check p{
  color:var(--nm-muted)
}

.diagnostic-path{
  display:grid;
  gap:var(--nm-s2);
  list-style:none;
  margin:var(--nm-s5) 0 0;
  padding:0
}

.diagnostic-path li{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) minmax(10rem,.35fr);
  gap:var(--nm-s2);
  align-items:center;
  min-width:0;
  padding:var(--nm-s3);
  border-radius:var(--nm-r-md);
  background:var(--nm-surface);
  color:var(--nm-text);
  box-shadow:var(--nm-shadow-soft)
}

.diagnostic-path__marker{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:var(--nm-primary);
  color:var(--nm-surface);
  font-family:var(--nm-mono);
  font-size:var(--nm-fs-1);
  font-weight:750
}

.diagnostic-path li>div{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1)
}

.diagnostic-path h3{
  color:var(--nm-ink);
  font-size:var(--nm-fs-3)
}

.diagnostic-path p{
  color:var(--nm-muted);
  font-size:var(--nm-fs-1)
}

.diagnostic-path__result{
  min-width:0;
  color:var(--nm-primary-deep);
  font-size:var(--nm-fs-1);
  font-weight:700;
  overflow-wrap:anywhere
}

.diagnostic-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:var(--nm-s3);
  align-items:center;
  margin-top:var(--nm-s4);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-accent-paper);
  color:var(--nm-text)
}

.diagnostic-actions>div:first-child{
  display:flex;
  flex-direction:column;
  gap:var(--nm-s1)
}

.diagnostic-actions h3{
  color:var(--nm-ink)
}

.diagnostic-actions p{
  color:var(--nm-muted)
}

.closeout-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));
  gap:var(--nm-s3);
  align-items:start;
  margin-top:var(--nm-s5)
}

.closeout-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-soft);
  color:var(--nm-text)
}

.closeout-card svg{
  width:1.75rem;
  height:1.75rem;
  margin-bottom:var(--nm-s1);
  color:var(--nm-primary)
}

.closeout-card h3{
  color:var(--nm-ink)
}

.closeout-card p{
  color:var(--nm-muted)
}

.closeout-card strong{
  margin-top:var(--nm-s2);
  color:var(--nm-primary-deep);
  font-size:var(--nm-fs-1)
}

.closeout-record{
  display:grid;
  grid-template-columns:minmax(14rem,.4fr) minmax(0,1fr);
  gap:var(--nm-s4);
  align-items:center;
  margin-top:var(--nm-s4);
  padding:var(--nm-s3);
  border-radius:var(--nm-r-lg);
  background:var(--nm-accent-paper);
  color:var(--nm-text)
}

.closeout-record>div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--nm-s1)
}

.closeout-record h3{
  color:var(--nm-ink)
}

.closeout-record p{
  color:var(--nm-muted)
}

.connect-closing__copy{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--nm-s1)
}

.connect-closing__actions{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:stretch;
  gap:var(--nm-s1)
}

.connect-closing__actions .c-btn{
  width:100%
}

.c-closing .c-btn--primary{
  background:var(--nm-surface);
  border-color:var(--nm-surface);
  color:var(--nm-primary-deep)
}

.c-closing .c-btn--primary:hover{
  background:var(--nm-soft);
  border-color:var(--nm-soft)
}

.c-closing .c-btn--ghost{
  color:var(--nm-dark-text);
  border-color:var(--nm-dark-muted)
}

@media(max-width:64rem){
  .connect-hero__grid,
  .ssh-layout{
    grid-template-columns:1fr
  }

  .connection-manifest{
    max-width:48rem
  }

  .automation-intro{
    grid-template-columns:1fr;
    align-items:start
  }

  .diagnostic-path li{
    grid-template-columns:auto minmax(0,1fr)
  }

  .diagnostic-path__result{
    grid-column:2
  }
}

@media(max-width:48rem){
  .sync-command-grid,
  .automation-check,
  .diagnostic-actions,
  .closeout-record{
    grid-template-columns:1fr
  }

  .automation-check .c-btn{
    width:100%
  }

  .diagnostic-actions .c-actions{
    width:100%
  }

  .diagnostic-actions .c-btn{
    flex:1 1 12rem
  }
}

@media(max-width:42rem){
  .connect-hero{
    padding-block:var(--nm-s8)
  }

  .connect-hero__grid{
    gap:var(--nm-s4)
  }

  .connect-hero__copy h1{
    max-width:none
  }

  .connect-hero__actions{
    width:100%
  }

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

  .connect-hero__facts{
    grid-template-columns:1fr
  }

  .connect-hero__facts div{
    padding:var(--nm-s2) 0
  }

  .connect-hero__facts div+div{
    padding-left:0;
    border-top:1px solid var(--nm-line);
    border-left:0
  }

  .connection-manifest__head,
  .connection-manifest__foot{
    align-items:flex-start;
    flex-direction:column
  }

  .connection-manifest__foot strong{
    text-align:left
  }

  .connection-manifest__body{
    padding:var(--nm-s3)
  }

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

  .ssh-command-sheet__head,
  .ssh-command-sheet__foot{
    align-items:flex-start;
    flex-direction:column
  }

  .ssh-command-sheet__foot strong{
    text-align:left
  }

  .diagnostic-path li{
    grid-template-columns:1fr;
    align-items:start
  }

  .diagnostic-path__result{
    grid-column:1
  }

  .connect-closing__actions{
    width:100%
  }
}

@media(max-width:24.375rem){
  .connection-manifest__steps li{
    grid-template-columns:1fr
  }

  .diagnostic-actions .c-btn{
    width:100%
  }
}
