.security-hero{
  padding-block:var(--hero-pad);
  background:#fcfcfd;
  color:#171b24
}

.security-hero-shell{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  align-items:start;
  gap:clamp(var(--space-4),6vw,var(--space-7))
}

.security-hero-copy,
.security-hero-stage{
  min-width:0
}

.security-hero-copy{
  display:flex;
  flex-direction:column;
  align-items:flex-start
}

.security-hero-copy h1{
  max-width:13.5em;
  overflow-wrap:anywhere;
  color:#16203e
}

.security-hero-lead{
  max-width:39rem;
  margin-top:var(--space-3);
  color:#171b24;
  font-size:var(--text-3);
  line-height:var(--lh-loose)
}

.security-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:var(--space-2);
  margin-top:var(--space-3)
}

.security-hero-facts{
  display:grid;
  width:100%;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-2);
  margin:var(--space-4) 0 0;
  padding-top:var(--space-3);
  border-top:1px solid var(--line-soft)
}

.security-hero-facts div,
.security-hero-facts dt,
.security-hero-facts dd{
  min-width:0
}

.security-hero-facts dt{
  color:#171b24;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  font-weight:650;
  text-transform:uppercase
}

.security-hero-facts dd{
  margin-top:var(--space-1);
  overflow-wrap:anywhere;
  color:#202630;
  font-size:var(--text-1);
  line-height:1.45
}

.security-hero-stage{
  text-align:left
}

.hero-art{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  width:100%
}

.security-receipt{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:#171b24;
  color:#f4f6f8;
  box-shadow:var(--shadow-card)
}

.security-receipt-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-3) var(--space-4);
  background:#edf1f7;
  color:#202a3d
}

.security-receipt-head > div{
  min-width:0
}

.security-receipt-label{
  display:block;
  color:#5b6578;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  letter-spacing:.06em
}

.security-receipt-head strong{
  display:block;
  margin-top:var(--space-1);
  overflow-wrap:anywhere;
  color:#182237;
  font-family:var(--font-mono);
  font-size:var(--text-3);
  line-height:1.35
}

.security-receipt-route{
  display:grid;
  gap:0;
  padding:var(--space-2) var(--space-4) 0
}

.security-route-step{
  display:grid;
  grid-template-columns:2.25rem minmax(0,1fr);
  gap:var(--space-2);
  align-items:start;
  padding-block:var(--space-2);
  border-bottom:1px solid var(--line-dark)
}

.security-route-step > span{
  display:inline-flex;
  width:2rem;
  height:2rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#29303c;
  color:#d8dde5;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  line-height:1
}

.security-route-step.is-complete > span{
  background:#2e7630;
  color:#fff
}

.security-route-step div{
  min-width:0
}

.security-route-step strong,
.security-route-step small{
  display:block;
  overflow-wrap:anywhere
}

.security-route-step strong{
  color:#f4f6f8;
  font-size:var(--text-1);
  line-height:1.4
}

.security-route-step small{
  margin-top:.3rem;
  color:#aab1bd
}

.security-receipt-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-1);
  margin:0;
  padding:var(--space-3) var(--space-4)
}

.security-receipt-fields div{
  min-width:0;
  padding:var(--space-2);
  border-radius:var(--radius-sm);
  background:#222936;
  color:#f4f6f8
}

.security-receipt-fields dt,
.security-receipt-fields dd{
  min-width:0;
  overflow-wrap:anywhere
}

.security-receipt-fields dt{
  color:#aab1bd;
  font-family:var(--font-mono);
  font-size:var(--text-0)
}

.security-receipt-fields dd{
  margin-top:.3rem;
  color:#f4f6f8;
  font-family:var(--font-mono);
  font-size:var(--text-1)
}

.security-receipt-foot{
  display:grid;
  gap:var(--space-1);
  padding:var(--space-3) var(--space-4);
  background:#f8ece7;
  color:#3a2924
}

.security-receipt-foot span{
  color:#6d5a54;
  font-size:var(--text-1)
}

.security-receipt-foot strong{
  overflow-wrap:anywhere;
  color:#34251f;
  font-family:var(--font-mono);
  font-size:var(--text-1)
}

.security-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));
  gap:var(--space-4);
  align-items:stretch
}

.security-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-md)
}

.security-card-sand{
  background:#f2f0e8;
  color:#2b3028
}

.security-card-blue{
  background:#edf1f7;
  color:#202a3d
}

.security-card-sage{
  background:#edf3ef;
  color:#21332a
}

.security-card h3{
  margin-top:var(--space-2);
  color:inherit;
  font-size:var(--text-4)
}

.security-card p{
  margin-top:var(--space-1);
  color:inherit;
  opacity:.8
}

.security-card-sand .c-icon-well{
  background:#ffffff;
  color:#1f6737
}

.security-card-blue .c-icon-well{
  background:#ffffff;
  color:#1f6737
}

.security-card-sage .c-icon-well{
  background:#ffffff;
  color:#1f6737
}

.security-card-foot{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-1);
  margin-top:auto;
  padding-top:var(--space-3);
  padding-bottom:var(--space-1)
}

.security-tag{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  padding:.4em .9em;
  border-radius:999px;
  background:#ffffff;
  color:#29313a;
  font-size:var(--text-0);
  font-weight:650;
  line-height:1
}

.security-boundary-note{
  display:flex;
  align-items:flex-start;
  gap:var(--space-2);
  margin-top:var(--space-4);
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:#171b24;
  color:#f4f6f8
}

.security-boundary-note svg{
  width:1.25rem;
  height:1.25rem;
  flex:none;
  margin-top:.15rem
}

.security-boundary-note div{
  min-width:0
}

.security-boundary-note strong{
  color:#f4f6f8
}

.security-boundary-note p{
  margin-top:var(--space-1);
  color:#b9c0ca
}

.security-access-band{
  background:#edf1f7;
  color:#202a3d
}

.security-access-band h2,
.security-access-band h3{
  color:#182237
}

.security-access-band .c-section-head p{
  color:#596478
}

.security-access-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(16rem,.65fr);
  gap:var(--space-4);
  align-items:start
}

.security-access-list{
  min-width:0
}

.security-access-item{
  display:grid;
  grid-template-columns:2.5rem minmax(0,1fr) auto;
  gap:var(--space-3);
  align-items:start;
  padding-block:var(--space-3);
  border-bottom:1px solid color-mix(in srgb,#202a3d 14%,transparent)
}

.security-access-item:first-child{
  border-top:1px solid color-mix(in srgb,#202a3d 14%,transparent)
}

.security-step-number{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#1f6737;
  color:#ffffff;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  line-height:1
}

.security-access-item > div{
  min-width:0
}

.security-access-item h3{
  font-size:var(--text-4)
}

.security-access-item p{
  margin-top:var(--space-1);
  color:#596478
}

.security-output{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  padding:.4em .9em;
  border-radius:999px;
  background:#ffffff;
  color:#273247;
  font-size:var(--text-0);
  font-weight:650;
  line-height:1
}

.security-check-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-md);
  background:#ffffff;
  color:#171b24
}

.security-check-card h3{
  margin-top:var(--space-2);
  color:#16203e
}

.security-check-card ul{
  display:grid;
  gap:var(--space-2);
  margin:var(--space-3) 0 0;
  padding-left:1.2rem;
  color:#555d69
}

.security-card-action{
  width:100%;
  margin-top:var(--space-3)
}

.security-vnc-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));
  gap:var(--space-4);
  align-items:stretch
}

.security-vnc-card{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-md);
  background:#f8ece7;
  color:#3a2924
}

.security-vnc-mark{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:var(--radius-sm);
  background:#ffffff;
  color:#1f6737;
  font-family:var(--font-mono);
  font-weight:700;
  line-height:1
}

.security-vnc-card h3{
  margin-top:var(--space-2);
  color:#34251f
}

.security-vnc-card ul{
  display:grid;
  gap:var(--space-2);
  margin:var(--space-2) 0 0;
  padding-left:1.2rem;
  color:#66534d
}

.security-vnc-note{
  display:grid;
  grid-template-columns:minmax(10rem,.3fr) minmax(0,1fr);
  gap:var(--space-3);
  align-items:start;
  margin-top:var(--space-4);
  padding:var(--space-3) var(--space-4);
  border-radius:var(--radius-md);
  background:#f1ecf5;
  color:#30273a
}

.security-vnc-note strong{
  color:#30273a
}

.security-vnc-note p{
  color:#655b6d
}

.security-secret-band{
  background:#171b24;
  color:#f4f6f8
}

.security-secret-band h2,
.security-secret-band h3{
  color:#f4f6f8
}

.security-secret-band .c-section-head p{
  color:#aab1bd
}

.security-secret-band .c-kicker{
  background:#f8ece7;
  color:#3a2924
}

.security-secret-layout{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);
  gap:var(--space-4);
  align-items:start
}

.security-secret-board{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-md);
  background:#edf1f7;
  color:#202a3d
}

.security-secret-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-3) var(--space-4);
  background:#f2f0e8;
  color:#2b3028
}

.security-secret-head strong{
  color:#252b25
}

.security-secret-head span{
  color:#5d625b;
  font-family:var(--font-mono);
  font-size:var(--text-0)
}

.security-secret-row{
  display:grid;
  grid-template-columns:minmax(7rem,.7fr) minmax(0,1fr) minmax(0,1fr);
  gap:var(--space-2);
  align-items:start;
  padding:var(--space-3) var(--space-4);
  border-bottom:1px solid color-mix(in srgb,#202a3d 13%,transparent)
}

.security-secret-row:last-child{
  border-bottom:0
}

.security-secret-row span,
.security-secret-row strong,
.security-secret-row em{
  min-width:0;
  overflow-wrap:anywhere
}

.security-secret-row span{
  color:#5e687a;
  font-family:var(--font-mono);
  font-size:var(--text-0)
}

.security-secret-row strong{
  color:#202a3d;
  font-size:var(--text-1)
}

.security-secret-row em{
  color:#596478;
  font-size:var(--text-1);
  font-style:normal
}

.security-secret-rules{
  display:grid;
  gap:var(--space-3)
}

.security-rule-card{
  padding:var(--space-4);
  border-radius:var(--radius-md);
  background:#252c38;
  color:#f4f6f8
}

.security-rule-card h3{
  color:#f4f6f8;
  font-size:var(--text-4)
}

.security-rule-card p{
  margin-top:var(--space-1);
  color:#b5bdc8
}

.security-update-steps{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));
  gap:var(--space-4);
  align-items:stretch;
  margin:0;
  padding:0;
  list-style:none
}

.security-update-step{
  display:flex;
  min-width:0;
  height:100%;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-md);
  background:#edf3ef;
  color:#21332a
}

.security-update-number{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#1f6737;
  color:#ffffff;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  line-height:1
}

.security-update-step > div{
  min-width:0;
  margin-top:var(--space-2)
}

.security-update-step h3{
  color:#21332a;
  font-size:var(--text-4)
}

.security-update-step p{
  margin-top:var(--space-1);
  color:#526359
}

.security-exit-section{
  background:#f2f0e8;
  color:#2b3028
}

.security-exit-panel{
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:#171b24;
  color:#f4f6f8
}

.security-exit-copy{
  padding:var(--space-5);
  background:#171b24;
  color:#f4f6f8
}

.security-exit-copy .c-kicker{
  background:#f8ece7;
  color:#3a2924
}

.security-exit-copy h2{
  max-width:19em;
  color:#f4f6f8
}

.security-exit-copy p{
  max-width:48rem;
  margin-top:var(--space-2);
  color:#aab1bd;
  font-size:var(--text-3)
}

.security-exit-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-start;
  gap:var(--space-2);
  margin-top:var(--space-3)
}

.security-exit-panel .c-btn-ghost{
  color:#f4f6f8;
  border-color:color-mix(in srgb,#f4f6f8 38%,transparent)
}

.security-exit-checks{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  background:#edf1f7;
  color:#202a3d
}

.security-exit-checks div{
  min-width:0;
  padding:var(--space-4);
  border-right:1px solid color-mix(in srgb,#202a3d 12%,transparent)
}

.security-exit-checks div:last-child{
  border-right:0
}

.security-exit-checks span{
  display:block;
  color:#1f6737;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  font-weight:700
}

.security-exit-checks strong{
  display:block;
  margin-top:var(--space-1);
  color:#182237;
  font-size:var(--text-3)
}

.security-exit-checks p{
  margin-top:var(--space-1);
  color:#5a6476;
  font-size:var(--text-1)
}

.security-exit-boundary{
  display:grid;
  grid-template-columns:minmax(8rem,.25fr) minmax(0,1fr);
  gap:var(--space-3);
  padding:var(--space-3) var(--space-5);
  background:#f8ece7;
  color:#3a2924
}

.security-exit-boundary strong{
  color:#34251f
}

.security-exit-boundary p{
  color:#66534d
}

.security-report-layout{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr);
  gap:var(--space-4);
  align-items:start
}

.security-report-list{
  min-width:0
}

.security-report-row{
  display:grid;
  grid-template-columns:2.5rem minmax(7.5rem,11rem) minmax(0,1fr);
  gap:var(--space-3);
  align-items:start;
  padding:var(--space-3);
  border-bottom:1px solid var(--line-soft)
}

.security-report-row:first-child{
  border-top:1px solid var(--line-soft)
}

.security-report-index{
  display:inline-flex;
  width:2.5rem;
  height:2.5rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#1f6737;
  color:#ffffff;
  font-family:var(--font-mono);
  font-size:var(--text-0);
  line-height:1
}

.security-report-row strong{
  color:#202630
}

.security-report-row p{
  color:#5f6570
}

.security-report-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  padding:var(--space-4);
  border-radius:var(--radius-md);
  background:#f1ecf5;
  color:#30273a
}

.security-report-card h3{
  margin-top:var(--space-2);
  color:#30273a
}

.security-report-card ul{
  display:grid;
  gap:var(--space-2);
  margin:var(--space-3) 0 0;
  padding-left:1.2rem;
  color:#625869
}

.security-report-actions{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:var(--space-2);
  margin-top:var(--space-3)
}

.security-report-contact{
  margin-top:var(--space-3);
  overflow-wrap:anywhere;
  color:#625869;
  font-size:var(--text-1)
}

.security-report-contact a:not(.c-btn){
  color:#174f2b;
  font-weight:650;
  text-decoration:underline;
  text-underline-offset:.2em
}

.security-closing-section{
  padding-top:var(--space-6);
  padding-bottom:var(--space-6)
}

.security-closing-actions{
  display:flex;
  min-width:14rem;
  flex-direction:column;
  align-items:stretch;
  gap:var(--space-2)
}

.security-closing-actions .c-btn-ghost{
  color:#f4f6f8;
  border-color:color-mix(in srgb,#f4f6f8 38%,transparent)
}

@media(max-width:64rem){
  .security-hero-shell,
  .security-access-layout,
  .security-secret-layout,
  .security-report-layout{
    grid-template-columns:minmax(0,1fr)
  }

  .security-hero-stage{
    width:100%
  }

  .security-exit-checks{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .security-exit-checks div{
    border-right:0;
    border-bottom:1px solid color-mix(in srgb,#202a3d 12%,transparent)
  }

  .security-exit-checks div:last-child{
    grid-column:1/-1;
    border-bottom:0
  }
}

@media(max-width:48rem){
  .security-hero-facts,
  .security-receipt-fields{
    grid-template-columns:minmax(0,1fr)
  }

  .security-access-item{
    grid-template-columns:2.25rem minmax(0,1fr)
  }

  .security-access-item > :nth-child(3){
    grid-column:2
  }

  .security-secret-row{
    grid-template-columns:minmax(0,1fr)
  }

  .security-vnc-note,
  .security-exit-boundary{
    grid-template-columns:minmax(0,1fr)
  }

  .security-report-row{
    grid-template-columns:2.25rem minmax(0,1fr)
  }

  .security-report-row > :nth-child(3){
    grid-column:2
  }

  .security-exit-checks{
    grid-template-columns:minmax(0,1fr)
  }

  .security-exit-checks div:last-child{
    grid-column:auto
  }

  .security-exit-copy,
  .security-exit-checks div,
  .security-exit-boundary{
    padding-inline:var(--space-3)
  }

  .security-receipt-head,
  .security-receipt-route,
  .security-receipt-fields,
  .security-receipt-foot{
    padding-inline:var(--space-3)
  }

  .security-secret-head,
  .security-secret-row{
    padding-inline:var(--space-3)
  }

  .security-closing-actions{
    min-width:0
  }
}

@media(max-width:42rem){
  .security-hero-stage,
  .hero-art{
    width:min(calc(100% - var(--gutter)*2),100%);
    height:auto;
    margin-inline:auto;
    overflow:visible;
    transform:none
  }

  .hero-art{
    grid-template-columns:minmax(0,1fr)
  }

  .hero-art > *{
    grid-column:1;
    width:auto
  }
}

@media(max-width:30rem){
  .security-actions,
  .security-exit-actions{
    width:100%
  }

  .security-actions .c-btn,
  .security-exit-actions .c-btn,
  .security-report-actions .c-btn,
  .security-closing-actions .c-btn{
    width:100%;
    white-space:normal
  }

  .security-receipt-head{
    flex-direction:column
  }
}
