.region-hero{
  position:relative;
  overflow:hidden;
  padding:var(--space-6) 0 var(--space-4);
  background:var(--color-surface);
  color:var(--color-ink)
}

.region-hero__grid{
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  align-items:center;
  gap:var(--space-5)
}

.region-hero__copy,
.region-hero__visual{
  min-width:0
}

.region-hero__copy{
  display:grid;
  gap:var(--space-2);
  align-content:center
}

.region-hero__copy .page-kicker{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  margin:0
}

.region-hero__copy h1{
  max-width:11.5em;
  margin:0;
  color:var(--color-ink)
}

.region-hero__copy h1 span{
  display:block;
  color:var(--color-primary)
}

.region-hero__lead{
  max-width:42rem;
  margin:0;
  color:var(--color-muted);
  font-size:var(--text-lg)
}

.region-hero__proof{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-1);
  margin:var(--space-1) 0
}

.region-hero__proof div{
  min-width:0;
  padding:var(--space-2);
  background:var(--color-paper);
  color:var(--color-ink);
  border-radius:var(--radius-md)
}

.region-hero__proof span,
.region-hero__proof strong{
  display:block
}

.region-hero__proof span{
  margin-bottom:.5rem;
  color:var(--color-muted);
  font-size:var(--text-xs)
}

.region-hero__proof strong{
  overflow-wrap:anywhere;
  font-family:var(--font-mono);
  font-size:var(--text-sm);
  font-variant-numeric:tabular-nums
}

.region-hero__availability{
  margin:0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-hero__visual{
  position:relative;
  min-height:36rem;
  display:grid;
  align-items:center;
  isolation:isolate
}

.region-hero__aurora{
  position:absolute;
  inset:4% 0 8%;
  z-index:-1;
  overflow:hidden;
  max-width:100%;
  border-radius:var(--radius-lg)
}

.region-hero__aurora span{
  position:absolute;
  width:38%;
  height:82%;
  border-radius:var(--radius-lg);
  filter:blur(34px);
  opacity:.48;
  transform:rotate(16deg)
}

.region-hero__aurora span:nth-child(1){
  left:4%;
  top:9%;
  background:var(--color-primary-soft)
}

.region-hero__aurora span:nth-child(2){
  left:36%;
  top:0;
  background:var(--color-accent)
}

.region-hero__aurora span:nth-child(3){
  right:3%;
  top:13%;
  background:var(--color-gold)
}

.region-hero__scene{
  width:100%;
  max-height:29rem;
  object-fit:contain
}

.region-nameplate{
  width:min(88%,31rem);
  margin:-2.5rem auto 0;
  overflow:hidden;
  border-radius:var(--radius-md);
  background:var(--color-dark);
  color:var(--color-surface);
  box-shadow:var(--shadow-float)
}

.region-nameplate__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-2);
  background:var(--color-primary);
  color:var(--color-surface)
}

.region-nameplate__head span{
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  letter-spacing:.08em
}

.region-nameplate__head strong{
  overflow-wrap:anywhere
}

.region-nameplate__data{
  display:grid;
  gap:0;
  margin:0;
  padding:var(--space-2)
}

.region-nameplate__data div{
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  gap:var(--space-2);
  padding:.65rem 0;
  border-bottom:1px solid rgba(255,255,255,.28)
}

.region-nameplate__data div:last-child{
  border-bottom:0
}

.region-nameplate__data dt{
  color:#d8d2db;
  font-size:var(--text-xs)
}

.region-nameplate__data dd{
  min-width:0;
  margin:0;
  overflow-wrap:anywhere;
  color:var(--color-surface);
  font-family:var(--font-mono);
  font-size:var(--text-sm);
  text-align:right;
  font-variant-numeric:tabular-nums
}

.region-data-band{
  display:grid;
  grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  margin-top:var(--space-5);
  overflow:hidden;
  border-radius:var(--radius-md);
  background:var(--color-dark);
  color:var(--color-surface)
}

.region-data-band__intro,
.region-data-band__metric{
  min-width:0;
  padding:var(--space-2) var(--space-3)
}

.region-data-band__intro{
  background:var(--color-primary);
  color:var(--color-surface)
}

.region-data-band__intro span,
.region-data-band__intro strong,
.region-data-band__metric span,
.region-data-band__metric strong{
  display:block
}

.region-data-band__intro span,
.region-data-band__metric span{
  margin-bottom:.5rem;
  font-size:var(--text-xs)
}

.region-data-band__intro span{
  color:var(--color-primary-soft)
}

.region-data-band__metric span{
  color:#d8d2db
}

.region-data-band__metric strong{
  color:var(--color-surface);
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums
}

.region-section-head{
  max-width:48rem;
  margin-bottom:var(--space-4)
}

.region-section-head .page-kicker{
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  margin-bottom:var(--space-2)
}

.region-section-head h2{
  margin-bottom:var(--space-2)
}

.region-section-head p{
  margin-bottom:0;
  color:var(--color-muted)
}

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

.region-plan{
  display:flex;
  flex-direction:column;
  align-self:start
}

.region-plan__top{
  min-width:0
}

.region-plan__top > div{
  display:grid;
  min-width:0;
  gap:var(--space-1)
}

.region-plan__top h3{
  margin:0
}

.region-plan__id{
  overflow-wrap:anywhere;
  color:var(--color-muted);
  font-family:var(--font-mono);
  font-size:var(--text-xs)
}

.region-plan__cycles{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--space-1);
  margin-top:var(--space-3)
}

.region-plan__cycles div{
  min-width:0;
  padding:var(--space-2);
  border-radius:var(--radius-md);
  background:var(--color-paper);
  color:var(--color-ink)
}

.region-plan__cycles span,
.region-plan__cycles strong{
  display:block
}

.region-plan__cycles span{
  margin-bottom:.5rem;
  color:var(--color-muted);
  font-size:var(--text-xs)
}

.region-plan__cycles strong{
  overflow-wrap:anywhere;
  font-family:var(--font-mono);
  font-size:var(--text-sm);
  font-variant-numeric:tabular-nums
}

.region-plan__action{
  width:100%
}

.region-billing-note{
  margin-top:var(--space-3)
}

.region-network{
  background:var(--color-surface);
  color:var(--color-ink)
}

.region-network__grid{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(20rem,.95fr);
  align-items:stretch;
  gap:var(--space-5)
}

.region-network__copy{
  min-width:0
}

.region-network__copy .page-kicker{
  width:fit-content;
  max-width:100%;
  margin-bottom:var(--space-2)
}

.region-network__copy h2{
  max-width:16em;
  margin-bottom:var(--space-2)
}

.region-network__copy > p{
  color:var(--color-muted)
}

.region-network__checks{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-2);
  margin-top:var(--space-3)
}

.region-network__checks div{
  min-width:0;
  padding:var(--space-2);
  border-radius:var(--radius-md);
  background:var(--color-paper);
  color:var(--color-ink)
}

.region-network__checks strong,
.region-network__checks span{
  display:block
}

.region-network__checks strong{
  margin-bottom:.5rem
}

.region-network__checks span{
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-network__meter{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-lg);
  background:var(--color-primary-soft);
  color:var(--color-ink);
  box-shadow:var(--shadow-card)
}

.region-network__meter-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-2);
  padding:var(--space-2) var(--space-3);
  background:var(--color-primary);
  color:var(--color-surface)
}

.region-network__meter-head span{
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  letter-spacing:.08em
}

.region-network__meter-head strong{
  overflow-wrap:anywhere;
  text-align:right
}

.region-network__reading{
  display:flex;
  align-items:flex-end;
  gap:var(--space-2);
  padding:var(--space-4) var(--space-3) var(--space-2)
}

.region-network__reading strong{
  color:var(--color-primary-dark);
  font-family:var(--font-mono);
  font-size:clamp(2.5rem,7vw,4.25rem);
  line-height:1;
  font-variant-numeric:tabular-nums
}

.region-network__reading span{
  padding-bottom:.45rem;
  color:var(--color-muted)
}

.region-network__scale{
  display:grid;
  grid-template-columns:repeat(8,minmax(0,1fr));
  gap:.35rem;
  padding:0 var(--space-3) var(--space-3)
}

.region-network__scale span{
  height:.55rem;
  border-radius:999px;
  background:var(--color-primary)
}

.region-network__scale span:nth-child(n+5){
  background:var(--color-accent)
}

.region-network__legend{
  display:grid;
  gap:0;
  margin:0;
  padding:0 var(--space-3) var(--space-3)
}

.region-network__legend div{
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  gap:var(--space-2);
  padding:var(--space-2) 0;
  border-top:1px solid color-mix(in srgb,var(--color-primary-dark) 28%,var(--color-surface))
}

.region-network__legend dt{
  color:var(--color-primary-dark);
  font-weight:700
}

.region-network__legend dd{
  min-width:0;
  margin:0;
  color:var(--color-muted);
  text-align:right
}

.region-steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:var(--space-3);
  margin:0;
  padding:0;
  list-style:none
}

.region-step{
  display:grid;
  align-content:start;
  min-width:0;
  gap:var(--space-2);
  padding:var(--space-3);
  border-radius:var(--radius-md);
  background:var(--color-surface);
  color:var(--color-ink);
  box-shadow:var(--shadow-card)
}

.region-step__number{
  display:inline-flex;
  width:2.6rem;
  height:2.6rem;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:var(--color-primary);
  color:var(--color-surface);
  font-family:var(--font-mono);
  font-size:var(--text-sm);
  font-weight:800
}

.region-step > div{
  display:grid;
  gap:var(--space-1);
  min-width:0
}

.region-step h3,
.region-step p{
  margin:0
}

.region-step p{
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-step__time{
  color:var(--color-primary);
  font-family:var(--font-mono);
  font-size:var(--text-xs);
  font-weight:700;
  font-variant-numeric:tabular-nums
}

.region-step-note{
  margin-top:var(--space-3)
}

.region-faq .c-faq__body{
  padding-top:var(--space-2);
  border-top:1px solid color-mix(in srgb,var(--color-primary-dark) 28%,var(--color-surface))
}

.region-faq .c-faq__body p{
  margin-bottom:0
}

.region-end-actions{
  display:grid;
  min-width:min(100%,17rem);
  gap:var(--space-1)
}

.region-end-actions .c-btn--ghost{
  border-color:var(--color-subtle);
  color:var(--color-surface)
}

.region-end-actions .c-btn--ghost:hover{
  border-color:var(--color-surface);
  background:var(--color-ink);
  color:var(--color-surface)
}

@media (max-width:900px){
  .region-hero__grid,
  .region-network__grid{
    grid-template-columns:1fr
  }

  .region-hero__visual{
    min-height:0
  }

  .region-hero__scene{
    max-height:25rem
  }

  .region-data-band{
    grid-template-columns:repeat(3,minmax(0,1fr))
  }

  .region-data-band__intro{
    grid-column:1/-1
  }

  .region-plan__cycles,
  .region-steps{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .region-network__checks{
    grid-template-columns:1fr
  }
}

@media (max-width:640px){
  .region-hero{
    padding-top:var(--space-4)
  }

  .region-hero__grid{
    gap:var(--space-4)
  }

  .region-hero__proof,
  .region-data-band,
  .region-plan-grid,
  .region-plan__cycles,
  .region-steps{
    grid-template-columns:1fr
  }

  .region-data-band__intro{
    grid-column:auto
  }

  .region-nameplate{
    width:100%;
    margin-top:calc(var(--space-2) * -1)
  }

  .region-nameplate__head,
  .region-network__meter-head{
    align-items:flex-start;
    flex-direction:column
  }

  .region-nameplate__data div,
  .region-network__legend div{
    grid-template-columns:1fr;
    gap:.5rem
  }

  .region-nameplate__data dd,
  .region-network__legend dd{
    text-align:left
  }

  .region-network__reading{
    align-items:flex-start;
    flex-direction:column
  }

  .region-end-actions{
    width:100%;
    min-width:0
  }

  .region-end-actions .c-btn{
    width:100%
  }
}

@media (max-width:390px){
  .region-hero__proof div,
  .region-data-band__intro,
  .region-data-band__metric,
  .region-step{
    padding:var(--space-2)
  }

  .region-network__meter-head,
  .region-network__reading,
  .region-network__legend{
    padding-inline:var(--space-2)
  }

  .region-network__scale{
    padding-inline:var(--space-2)
  }
}