.region-hero{
  padding:var(--header-height) 0 var(--space-10);
  color:var(--color-ink);
  background:var(--color-warm)
}

.region-hero__inner{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:var(--space-8);
  align-items:start
}

.region-hero__copy{
  min-width:0
}

.region-hero__message{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
  margin-top:var(--space-7)
}

.region-hero__message .c-badge{
  width:fit-content;
  max-width:100%;
  align-self:flex-start
}

.region-hero__message h1{
  max-width:12ch;
  margin:0
}

.region-hero__message p{
  max-width:42rem;
  margin:0;
  color:var(--color-ink-soft)
}

.region-hero__actions{
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:8px;
  margin-top:var(--space-6)
}

.region-hero__stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin:var(--space-7) 0 0;
  padding:var(--space-5) 0 0;
  border-top:1px solid var(--color-line)
}

.region-hero__stats div{
  min-width:0;
  padding-right:var(--space-4)
}

.region-hero__stats dt{
  color:var(--color-muted);
  font-size:var(--text-xs)
}

.region-hero__stats dd{
  margin:8px 0 0;
  color:var(--color-ink);
  font-size:var(--text-sm);
  font-weight:650
}

.region-hero__stats dd span{
  color:var(--color-primary);
  font:500 var(--text-xl)/1 var(--font-mono);
  font-variant-numeric:tabular-nums
}

.region-blueprint{
  min-width:0;
  margin:0;
  overflow:hidden;
  border-radius:var(--radius-panel);
  color:var(--color-white);
  background:var(--color-dark);
  box-shadow:var(--shadow-float)
}

.region-blueprint figcaption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  padding:var(--space-4) var(--space-5);
  color:var(--color-white);
  background:var(--color-dark);
  border-bottom:1px solid var(--color-ink-soft)
}

.region-blueprint figcaption span{
  color:var(--color-accent);
  font:600 var(--text-xs)/1 var(--font-mono);
  letter-spacing:.08em
}

.region-blueprint figcaption strong{
  color:var(--color-white);
  font-size:var(--text-sm)
}

.region-blueprint__map{
  position:relative;
  min-height:420px;
  overflow:hidden;
  color:var(--color-accent);
  background:#041018
}

.region-blueprint__map img{
  width:100%;
  height:420px;
  object-fit:cover;
  object-position:center 45%
}

.region-blueprint__map svg{
  display:none
}

.region-blueprint__label{
  position:absolute;
  display:inline-flex;
  align-items:center;
  gap:6px;
  max-width:42%;
  padding:5px 8px;
  border-radius:var(--radius-control);
  color:var(--color-ink);
  background:var(--color-white);
  box-shadow:var(--shadow-soft);
  font-size:var(--text-xs);
  font-weight:650;
  line-height:1.3
}

.region-blueprint__label span{
  flex:0 0 auto;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--color-success)
}

.region-blueprint__label--sg{
  left:50%;
  top:67%
}

.region-blueprint__label--jp{
  left:58%;
  top:27%
}

.region-blueprint__label--kr{
  left:61%;
  top:42%
}

.region-blueprint__label--hk{
  left:47%;
  top:53%
}

.region-blueprint__label--use{
  left:13%;
  top:43%
}

.region-blueprint__label--usw{
  left:5%;
  top:66%
}

.region-blueprint__legend{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  padding:var(--space-4) var(--space-5);
  color:var(--color-faint);
  background:var(--color-dark);
  font-size:var(--text-xs)
}

.region-blueprint__legend span{
  display:inline-flex;
  align-items:center;
  gap:8px
}

.region-blueprint__legend i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--color-success)
}

.region-kicker{
  display:block;
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  color:var(--color-primary);
  font:700 var(--text-xs)/1.3 var(--font-mono);
  letter-spacing:.08em
}

.region-strip{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--space-3);
  margin-top:var(--space-7);
  align-items:start
}

.region-strip article{
  min-width:0;
  padding:var(--space-5);
  border-radius:var(--radius-card);
  color:var(--color-ink);
  background:var(--color-surface)
}

.region-strip__code{
  display:block;
  color:var(--color-primary);
  font:700 var(--text-xs)/1 var(--font-mono);
  letter-spacing:.08em
}

.region-strip h3{
  margin:8px 0 0;
  font-size:var(--text-base)
}

.region-strip p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-principles{
  margin-top:var(--space-7);
  align-items:start
}

.region-principle{
  min-width:0;
  padding:var(--space-6);
  border-radius:var(--radius-card);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-principle__index{
  display:flex;
  align-items:center;
  justify-content:center;
  width:30px;
  height:30px;
  border-radius:50%;
  color:var(--color-white);
  background:var(--color-primary);
  font:700 var(--text-xs)/1 var(--font-mono)
}

.region-principle h3{
  margin:var(--space-4) 0 0
}

.region-principle p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-principles__note{
  margin-top:var(--space-5)
}

.region-matrix caption,
.region-latency caption{
  padding:var(--space-3) var(--space-4);
  color:var(--color-muted);
  background:var(--color-white);
  font-size:var(--text-xs);
  text-align:left
}

.region-matrix{
  min-width:980px
}

.region-matrix tbody th{
  min-width:210px;
  color:var(--color-ink);
  background:var(--color-white)
}

.region-matrix tbody th strong,
.region-matrix tbody th small{
  display:block
}

.region-matrix tbody th small{
  margin-top:8px;
  color:var(--color-muted);
  font:var(--text-xs)/1.4 var(--font-mono)
}

.region-status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--color-ink);
  font-size:var(--text-xs);
  font-weight:700;
  white-space:nowrap
}

.region-status i{
  flex:0 0 auto;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--color-success)
}

.region-matrix__actions{
  display:flex;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:8px;
  margin-top:var(--space-5)
}

.region-heading--dark h2{
  color:var(--color-white)
}

.region-heading--dark p{
  color:var(--color-faint)
}

.region-heading--dark .region-kicker{
  color:var(--color-accent)
}

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

.region-test-meta div{
  min-width:0;
  padding:var(--space-5);
  border-radius:var(--radius-card);
  color:var(--color-white);
  background:var(--color-ink-soft)
}

.region-test-meta dt{
  color:var(--color-faint);
  font-size:var(--text-xs)
}

.region-test-meta dd{
  margin:8px 0 0;
  color:var(--color-white);
  font-size:var(--text-sm);
  font-weight:650
}

.region-latency-scroll{
  border-color:var(--color-ink-soft);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-latency{
  min-width:1080px;
  color:var(--color-ink);
  background:var(--color-white)
}

.region-latency th,
.region-latency td{
  color:var(--color-ink)
}

.region-latency thead th{
  color:var(--color-muted);
  background:var(--color-warm)
}

.region-latency tbody th{
  color:var(--color-ink);
  background:var(--color-white);
  font-weight:650
}

.region-latency td{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  white-space:nowrap
}

.region-latency .is-best{
  color:var(--color-ink);
  background:var(--color-accent-soft);
  font-weight:700
}

.region-method-grid{
  margin-top:var(--space-5);
  align-items:start
}

.region-method{
  min-width:0;
  padding:var(--space-6);
  border-radius:var(--radius-card);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-method__step{
  color:var(--color-primary);
  font:700 var(--text-sm)/1 var(--font-mono)
}

.region-method h3{
  margin:var(--space-4) 0 0;
  color:var(--color-ink)
}

.region-method p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-detail-grid{
  margin-top:var(--space-7);
  align-items:start
}

.region-detail{
  min-width:0;
  padding:var(--space-6);
  border-radius:var(--radius-card);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-detail__head{
  display:flex;
  align-items:center;
  gap:var(--space-4)
}

.region-detail__head>div{
  min-width:0
}

.region-detail__code{
  display:flex;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  color:var(--color-white);
  background:var(--color-primary);
  font:700 var(--text-xs)/1 var(--font-mono)
}

.region-detail__head h3{
  margin:0
}

.region-detail__head p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-xs)
}

.region-detail>p{
  margin:var(--space-5) 0 0;
  color:var(--color-muted)
}

.region-detail ul{
  margin:var(--space-4) 0 0;
  padding-left:var(--space-5);
  color:var(--color-ink-soft);
  font-size:var(--text-sm)
}

.region-detail li+li{
  margin-top:8px
}

.region-us-grid{
  margin-top:var(--space-7);
  align-items:start
}

.region-us-card{
  min-width:0;
  padding:var(--space-7);
  border-radius:var(--radius-panel);
  color:var(--color-ink);
  background:var(--color-surface)
}

.region-us-card--west{
  color:var(--color-white);
  background:var(--color-dark)
}

.region-us-card__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4)
}

.region-us-card__code{
  color:var(--color-primary);
  font:700 var(--text-sm)/1 var(--font-mono);
  letter-spacing:.08em
}

.region-us-card--west .region-us-card__code{
  color:var(--color-accent)
}

.region-us-card--west .region-status{
  color:var(--color-white)
}

.region-us-card h3{
  margin:var(--space-6) 0 0;
  color:var(--color-ink)
}

.region-us-card--west h3{
  color:var(--color-white)
}

.region-us-card>p{
  margin:8px 0 0;
  color:var(--color-muted)
}

.region-us-card--west>p{
  color:var(--color-faint)
}

.region-us-card dl{
  display:grid;
  gap:var(--space-3);
  margin:var(--space-6) 0 0
}

.region-us-card dl div{
  display:grid;
  grid-template-columns:max-content minmax(0,1fr);
  gap:var(--space-5);
  padding-top:var(--space-3);
  border-top:1px solid var(--color-line)
}

.region-us-card--west dl div{
  border-color:var(--color-ink-soft)
}

.region-us-card dt{
  color:var(--color-muted);
  font-size:var(--text-xs)
}

.region-us-card dd{
  margin:0;
  color:var(--color-ink);
  font-size:var(--text-sm);
  font-weight:650;
  text-align:right
}

.region-us-card--west dt{
  color:var(--color-faint)
}

.region-us-card--west dd{
  color:var(--color-white)
}

.region-template{
  margin-top:var(--space-7)
}

.region-template__sheet{
  min-width:0;
  overflow:hidden;
  border-radius:var(--radius-panel);
  color:var(--color-ink);
  background:var(--color-white);
  box-shadow:var(--shadow-soft)
}

.region-template__title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-5);
  padding:var(--space-5) var(--space-6);
  color:var(--color-white);
  background:var(--color-dark)
}

.region-template__title>div{
  min-width:0
}

.region-template__title span:not(.region-status){
  color:var(--color-accent);
  font:700 var(--text-xs)/1 var(--font-mono);
  letter-spacing:.08em
}

.region-template__title h3{
  margin:8px 0 0;
  color:var(--color-white)
}

.region-template__title .region-status{
  color:var(--color-white)
}

.region-template__body{
  padding:var(--space-6);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-template__intro{
  display:grid;
  gap:8px
}

.region-template__intro p{
  margin:0;
  color:var(--color-muted)
}

.region-template__plans{
  display:grid;
  gap:var(--space-3);
  margin-top:var(--space-5)
}

.region-template__plans article{
  min-width:0;
  padding:var(--space-4);
  border-radius:var(--radius-control);
  color:var(--color-ink);
  background:var(--color-surface)
}

.region-template__plans article>span,
.region-template__plans article>strong{
  display:block
}

.region-template__plans article>span{
  color:var(--color-primary);
  font-size:var(--text-sm);
  font-weight:700
}

.region-template__plans article>strong{
  margin-top:8px;
  color:var(--color-ink);
  font:600 var(--text-xs)/1.4 var(--font-mono)
}

.region-template__plans p{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  margin:var(--space-4) 0 0
}

.region-template__plans b{
  min-width:0;
  color:var(--color-ink);
  font:600 var(--text-xs)/1.4 var(--font-mono);
  white-space:nowrap
}

.region-template{
  align-items:stretch
}

.region-template .c-paired__side{
  grid-auto-rows:auto;
  align-content:space-between
}

.region-template__side{
  color:var(--color-ink);
  background:var(--color-white)
}

.region-template__number{
  display:block;
  color:var(--color-primary);
  font:700 var(--text-sm)/1 var(--font-mono)
}

.region-template__side h3{
  margin:var(--space-4) 0 0
}

.region-template__side p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

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

.region-template__steps article{
  min-width:0;
  padding:var(--space-5);
  border-radius:var(--radius-card);
  color:var(--color-ink);
  background:var(--color-white)
}

.region-template__steps span{
  color:var(--color-primary);
  font-size:var(--text-xs);
  font-weight:700
}

.region-template__steps h3{
  margin:var(--space-4) 0 0
}

.region-template__steps p{
  margin:8px 0 0;
  color:var(--color-muted);
  font-size:var(--text-sm)
}

.region-template__note{
  margin-top:var(--space-5)
}

.region-cta__kicker{
  display:block;
  width:fit-content;
  max-width:100%;
  align-self:flex-start;
  color:var(--color-accent);
  font:700 var(--text-xs)/1.3 var(--font-mono);
  letter-spacing:.08em
}

.region-cta h2{
  max-width:18ch;
  margin:8px 0 0;
  color:var(--color-white)
}

.region-cta p{
  max-width:44rem;
  margin:8px 0 0;
  color:var(--color-faint)
}

.region-cta .c-cta__actions{
  flex:0 0 auto;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start
}

.region-cta .c-btn{
  width:100%
}

.region-cta__secondary{
  color:var(--color-white);
  background:transparent;
  border-color:var(--color-ink-soft)
}

.region-cta__secondary:hover{
  color:var(--color-white);
  background:var(--color-ink-soft);
  border-color:var(--color-muted)
}

@media(min-width:1440px){
  .region-hero{
    padding-top:var(--space-10)
  }

  .region-blueprint__map{
    min-height:440px
  }
}

@media(max-width:1100px){
  .region-hero__inner{
    grid-template-columns:1fr
  }

  .region-hero__message h1{
    max-width:18ch
  }

  .region-blueprint{
    max-width:760px
  }

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

@media(max-width:900px){
  .region-test-meta{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

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

@media(max-width:768px){
  .region-hero{
    padding:var(--space-7) 0 var(--space-9)
  }

  .region-hero__inner{
    gap:var(--space-7)
  }

  .region-hero__message{
    margin-top:var(--space-6)
  }

  .region-blueprint__map{
    min-height:360px
  }

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

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

  .region-us-card{
    padding:var(--space-6)
  }
}

@media(max-width:520px){
  .region-hero__actions{
    display:grid;
    grid-template-columns:1fr
  }

  .region-hero__actions .c-btn{
    width:100%;
    white-space:normal
  }

  .region-hero__stats{
    grid-template-columns:1fr;
    gap:var(--space-4)
  }

  .region-hero__stats div{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:var(--space-4);
    padding-right:0
  }

  .region-hero__stats dd{
    margin:0
  }

  .region-blueprint figcaption,
  .region-blueprint__legend{
    align-items:flex-start;
    flex-direction:column
  }

  .region-blueprint__map{
    min-height:310px
  }

  .region-blueprint__label{
    font-size:var(--text-xs)
  }

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

  .region-test-meta{
    grid-template-columns:1fr
  }

  .region-detail__head{
    align-items:flex-start
  }

  .region-us-card dl div{
    grid-template-columns:1fr;
    gap:8px
  }

  .region-us-card dd{
    text-align:left
  }

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

  .region-template__body{
    padding:var(--space-5)
  }

  .region-template__plans p{
    grid-template-columns:1fr
  }
}

@media(max-width:390px){
  .region-blueprint__map{
    min-height:270px
  }

  .region-blueprint__label{
    max-width:48%;
    padding:4px 6px
  }

  .region-blueprint__label--sg{
    left:47%;
    top:64%
  }

  .region-blueprint__label--jp{
    left:53%;
    top:24%
  }

  .region-blueprint__label--kr{
    left:57%;
    top:40%
  }

  .region-blueprint__label--hk{
    left:45%;
    top:51%
  }

  .region-blueprint__label--use{
    left:9%;
    top:41%
  }

  .region-blueprint__label--usw{
    left:4%;
    top:65%
  }

  .region-matrix__actions{
    display:grid;
    grid-template-columns:1fr
  }

  .region-matrix__actions .c-btn{
    width:100%;
    white-space:normal
  }
}