:root {
  --bg: #06101d;
  --bg-deep: #020912;
  --surface: #0c1b2b;
  --surface-2: #10283a;
  --ink: #f2fbff;
  --muted: #9eb6c6;
  --accent: #61f4cf;
  --accent-dim: #2aa98c;
  --sun: #ffd16b;
  --line: #224156;
  --paper: #edf9f6;
  --paper-ink: #092119;
  --paper-muted: #486a61;
  --focus: #ffd16b;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 96px; overflow-x: hidden; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }
.shell { width: min(1180px, calc(100% - 64px)); margin-inline: auto; }
.skip-link {
  position: fixed;
  left: 16px;
  top: -80px;
  z-index: 100;
  background: var(--focus);
  color: var(--bg);
  font-weight: 800;
  padding: 10px 16px;
  border-radius: 8px;
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 4px; }

.site-header {
  height: 82px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #ffffff18;
  position: relative;
  z-index: 20;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: .94rem;
  font-weight: 700;
  letter-spacing: .075em;
}
.brand small { color: var(--muted); font-size: .7em; font-weight: 600; }
.brand-mark { width: 42px; height: 42px; color: var(--accent); flex: 0 0 auto; }
.logo-sun { fill: var(--sun); }
.logo-star { fill: #fff; }
.site-nav { display: flex; align-items: center; gap: 25px; color: #c3d7e2; font-size: .83rem; font-weight: 600; }
.site-nav a:hover { color: var(--accent); }
.nav-state { border: 1px solid #36566a; border-radius: 999px; padding: 8px 13px; color: var(--sun) !important; }
.menu-toggle { display: none; background: none; border: 0; color: var(--ink); padding: 10px; }

.section { padding: 112px 0; }
.status, .eyebrow {
  font-family: var(--mono);
  text-transform: uppercase;
  letter-spacing: .11em;
  font-size: .73rem;
  font-weight: 700;
}
.status { color: var(--sun); margin: 0 0 25px; }
.status span {
  display: inline-block;
  width: 7px;
  height: 7px;
  background: var(--sun);
  border-radius: 50%;
  box-shadow: 0 0 15px var(--sun);
  margin-right: 7px;
}
.eyebrow { color: var(--accent); margin: 0 0 17px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2 { letter-spacing: -.052em; line-height: 1.02; }
h1 { font-size: clamp(3.3rem, 6vw, 5.55rem); font-weight: 520; margin: 0; max-width: 760px; }
h1 em { color: var(--accent); font-style: normal; text-shadow: 0 0 38px #61f4cf29; }

.hero {
  min-height: 718px;
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  align-items: center;
  gap: 52px;
  padding-block: 70px;
  background:
    radial-gradient(circle at 78% 38%, #61f4cf1f 0, transparent 28%),
    radial-gradient(circle at 8% 76%, #ffd16b11 0, transparent 28%);
}
.hero-lede { font-size: 1.14rem; color: var(--muted); max-width: 630px; margin: 28px 0; }
.actions { display: flex; gap: 13px; flex-wrap: wrap; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  border: 1px solid #36566a;
  border-radius: 999px;
  padding: 12px 19px;
  font-size: .9rem;
  font-weight: 700;
  transition: transform .2s, background .2s, border-color .2s;
}
.button:hover { transform: translateY(-2px); border-color: var(--accent); }
.button-primary { background: var(--accent); border-color: var(--accent); color: var(--bg); box-shadow: 0 0 30px #61f4cf29; }
.button-secondary { background: #0b1b29; }
.microcopy { font-size: .76rem; color: #829cab; margin: 23px 0 0; max-width: 640px; }

.hero-visual { min-width: 0; display: grid; place-items: center; }
.capacity-card {
  width: min(560px, 100%);
  background:
    radial-gradient(circle at 82% 18%, #61f4cf2e, transparent 26%),
    linear-gradient(145deg, #0c2032 0%, #081521 54%, #0c2130 100%);
  border: 1px solid #31566c;
  border-radius: 28px;
  padding: 26px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 28px 90px #0008, 0 0 90px #3cf1d320;
}
.capacity-card::before {
  content: '';
  position: absolute;
  inset: -40% -20% auto auto;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, #61f4cf25, transparent 68%);
  pointer-events: none;
}
.capacity-card::after {
  content: '';
  position: absolute;
  inset: auto -20% -45% auto;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, #ffd16b18, transparent 70%);
  pointer-events: none;
}
.capacity-topline, .range-topline { display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 1; }
.index-pill {
  background: #61f4cf16;
  border: 1px solid #61f4cf66;
  color: var(--accent);
  border-radius: 999px;
  padding: 5px 9px;
  font-family: var(--mono);
  font-size: .66rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.country-code { font-family: var(--mono); font-size: .77rem; color: var(--muted); }
.capacity-orbit {
  position: relative;
  width: min(335px, 72%);
  aspect-ratio: 1;
  margin: 16px auto 2px;
  color: var(--accent);
  display: grid;
  place-items: center;
}
.capacity-orbit svg {
  width: 100%;
  height: 100%;
  opacity: .82;
  filter: drop-shadow(0 0 7px #61f4cf);
}
.pulse { position: absolute; width: 11px; height: 11px; background: var(--sun); border-radius: 50%; box-shadow: 0 0 0 9px #ffd16b1c, 0 0 22px var(--sun); }
.pulse-one { left: 25%; top: 37%; }
.pulse-two { right: 20%; top: 27%; }
.pulse-three { right: 28%; bottom: 23%; }
.hero-range {
  position: absolute;
  left: 15%;
  right: 15%;
  bottom: 17%;
  height: 7px;
  background: #183446;
  border-radius: 99px;
  overflow: hidden;
  box-shadow: 0 0 0 1px #ffffff14;
}
.hero-range span, .range-track span {
  height: 100%;
  display: block;
  background: linear-gradient(90deg, var(--accent-dim), var(--accent), var(--sun));
  border-radius: 99px;
  box-shadow: 0 0 15px var(--accent);
  transition: width .25s ease;
}
.capacity-country, .selected-country { display: flex; align-items: center; gap: 15px; position: relative; z-index: 1; }
.capacity-country { margin: 8px 0 18px; }
.capacity-country-primary {
  margin: 28px 0 18px;
  padding-bottom: 19px;
  border-bottom: 1px solid var(--line);
}
.selected-country { margin: 33px 0 25px; }
.selected-flag { width: 58px; height: 39px; filter: drop-shadow(0 8px 10px #0008); }
.range-kicker { font-family: var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); font-size: .64rem; margin: 0; }
.capacity-country h2, .selected-country h3 { font-size: 1.55rem; letter-spacing: -.03em; margin: 2px 0 0; }
.hero-number {
  position: relative;
  z-index: 1;
  border-block: 1px solid var(--line);
  padding: 16px 0 18px;
}
.hero-number p, .range-display p { color: var(--muted); font-size: .78rem; margin: 0; }
.hero-number strong, .range-display strong {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--accent);
  font-size: clamp(3.6rem, 7vw, 5.8rem);
  font-weight: 520;
  letter-spacing: -.08em;
  line-height: 1;
}
.hero-number strong > span:nth-child(2), .range-display strong > span:nth-child(2) { color: #4d7182; font-size: .55em; }
.hero-number > span, .range-display > span {
  display: block;
  color: #829cab;
  font-family: var(--mono);
  font-size: .66rem;
  margin-top: 9px;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.hero-range-track {
  position: relative;
  z-index: 1;
  margin: 16px 0 18px;
}
.potential-list {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 9px;
}
.potential-list div {
  border: 1px solid #284d63;
  background: #071521c7;
  border-radius: 14px;
  padding: 12px 13px;
}
.potential-list span,
.potential-list strong,
.potential-list small { display: block; }
.potential-list span {
  color: #83a2b2;
  font-family: var(--mono);
  font-size: .62rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.potential-list strong {
  color: #fff;
  font-size: .9rem;
  margin-top: 3px;
}
.potential-list small {
  color: #8fa7b5;
  font-size: .72rem;
  line-height: 1.45;
  margin-top: 3px;
}
.capacity-stats {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 15px;
}
.capacity-stats div {
  border: 1px solid #284d63;
  background: #071521b5;
  border-radius: 14px;
  padding: 13px 12px;
}
.capacity-stats strong { display: block; color: #fff; font-size: 1.55rem; line-height: 1; letter-spacing: -.04em; }
.capacity-stats span { display: block; color: #88a5b5; font-size: .69rem; margin-top: 6px; text-transform: uppercase; letter-spacing: .06em; }
.market-strip {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 7px;
  margin-top: 15px;
}
.market-chip {
  min-width: 0;
  border: 1px solid #294f66;
  background: #071521;
  color: #bfd5df;
  border-radius: 12px;
  padding: 8px 5px;
  display: grid;
  justify-items: center;
  gap: 5px;
  font-family: var(--mono);
  font-size: .66rem;
  font-weight: 800;
}
.market-chip:hover, .market-chip.is-selected { border-color: var(--accent); color: #fff; background: #123c42; }
.market-chip .flag { width: 25px; height: 17px; }
.capacity-card.is-dashboard {
  min-height: 600px;
  padding: 28px;
  display: grid;
  align-content: start;
  gap: 18px;
  background:
    linear-gradient(180deg, #ffffff0f, transparent 34%),
    radial-gradient(circle at 72% 20%, #61f4cf30, transparent 30%),
    radial-gradient(circle at 22% 82%, #ffd16b1d, transparent 36%),
    linear-gradient(145deg, #0c2032 0%, #06111e 62%, #0e2735 100%);
}
.dashboard-grid-light {
  position: absolute;
  inset: 0;
  opacity: .35;
  pointer-events: none;
  background-image:
    linear-gradient(#ffffff0b 1px, transparent 1px),
    linear-gradient(90deg, #ffffff0b 1px, transparent 1px);
  background-size: 36px 36px;
  mask-image: radial-gradient(circle at 55% 30%, #000 0 42%, transparent 78%);
}
.dash-header,
.market-spotlight,
.market-bars,
.signal-row,
.capacity-card.is-dashboard .capacity-note {
  position: relative;
  z-index: 1;
}
.dash-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 18px;
}
.dashboard-label {
  display: block;
  color: var(--accent);
  font-family: var(--mono);
  font-size: .66rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.dash-header strong {
  display: block;
  font-size: 1.25rem;
  letter-spacing: -.035em;
}
.signal-chip {
  border: 1px solid #61f4cf66;
  color: #d8fff6;
  background: #61f4cf16;
  border-radius: 999px;
  padding: 7px 10px;
  font-family: var(--mono);
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
}
.market-spotlight {
  display: grid;
  grid-template-columns: minmax(220px, .95fr) minmax(190px, .7fr);
  gap: 20px;
  align-items: center;
  min-height: 260px;
}
.country-orb {
  position: relative;
  aspect-ratio: 1;
  min-height: 250px;
  display: grid;
  place-items: center;
}
.orb-ring {
  position: absolute;
  border: 1px solid #61f4cf5c;
  border-radius: 999px;
  box-shadow: inset 0 0 30px #61f4cf0f, 0 0 35px #61f4cf16;
}
.ring-one { width: 86%; height: 86%; }
.ring-two { width: 66%; height: 66%; border-color: #ffd16b44; transform: rotate(22deg); }
.ring-three { width: 96%; height: 42%; transform: rotate(-18deg); border-color: #ffffff25; }
.orbit-dot {
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--sun);
  box-shadow: 0 0 0 9px #ffd16b16, 0 0 23px var(--sun);
}
.dot-one { left: 18%; top: 42%; }
.dot-two { right: 16%; top: 29%; background: var(--accent); box-shadow: 0 0 0 9px #61f4cf15, 0 0 23px var(--accent); }
.dot-three { right: 25%; bottom: 16%; }
.country-core {
  width: 138px;
  height: 138px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 50% 35%, #ffffff18, transparent 40%),
    linear-gradient(145deg, #123a4a, #071623);
  border: 1px solid #65f5d18c;
  box-shadow: 0 0 60px #61f4cf26, inset 0 0 35px #61f4cf12;
}
.country-core .selected-flag { width: 52px; height: 35px; }
.country-core strong {
  font-family: var(--mono);
  font-size: 1.6rem;
  line-height: 1;
}
.country-core small {
  color: #9eb6c6;
  font-size: .77rem;
  font-weight: 700;
}
.score-card {
  border: 1px solid #31566c;
  border-radius: 22px;
  padding: 18px;
  background: #061421c9;
  box-shadow: inset 0 1px 0 #ffffff0c;
}
.score-card > span,
.score-card small {
  display: block;
  color: #8fa7b5;
  font-family: var(--mono);
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.score-card strong {
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: var(--accent);
  font-size: clamp(3.4rem, 6.2vw, 5.15rem);
  line-height: .95;
  font-weight: 520;
  letter-spacing: -.08em;
  margin: 13px 0 9px;
}
.score-card strong i {
  color: #4d7182;
  font-size: .55em;
  font-style: normal;
}
.hero-range-inline {
  height: 7px;
  border-radius: 999px;
  background: #183446;
  overflow: hidden;
  margin-top: 18px;
  box-shadow: 0 0 0 1px #ffffff14;
}
.hero-range-inline span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--accent-dim), var(--accent), var(--sun));
  border-radius: inherit;
  box-shadow: 0 0 15px var(--accent);
  transition: width .25s ease;
}
.market-bars {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 9px;
}
.market-bar-chip {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 10px;
  align-items: center;
  justify-items: stretch;
  text-align: left;
  padding: 11px 12px;
  border-radius: 14px;
  background: #071521d1;
}
.market-bar-chip span {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: #d6e7ee;
  font-family: var(--sans);
  font-size: .78rem;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.market-bar-chip .flag { width: 24px; height: 16px; }
.market-bar-chip strong {
  color: #fff;
  font-family: var(--mono);
  font-size: .8rem;
}
.market-bar-chip em {
  grid-column: 1 / -1;
  height: 4px;
  border-radius: 999px;
  background: #183446;
  overflow: hidden;
}
.market-bar-chip em b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--accent-dim), var(--accent), var(--sun));
}
.signal-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.signal-row div {
  border-top: 1px solid #2c5367;
  padding-top: 12px;
}
.signal-row span,
.signal-row strong { display: block; }
.signal-row span {
  color: #7892a2;
  font-family: var(--mono);
  font-size: .6rem;
  text-transform: uppercase;
  letter-spacing: .07em;
}
.signal-row strong {
  color: #fff;
  font-size: .78rem;
  margin-top: 3px;
}
.capacity-note { position: relative; z-index: 1; color: #bfd5df; font-size: .82rem; margin: 16px 0 0; }
.capacity-disclaimer {
  position: relative;
  z-index: 1;
  color: #8fa7b5;
  font-size: .72rem;
  margin: 8px 0 0;
}

.section-intro { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: end; margin-bottom: 52px; }
.section-intro h2 { font-size: clamp(2.7rem, 5vw, 4.75rem); font-weight: 540; margin: 0; }
.section-intro > p { color: var(--muted); font-size: 1.02rem; margin: 0; }
.explorer-section { background: linear-gradient(140deg, #0a1a29, #102d3b 58%, #0a1826); }
.index-banner { display: flex; gap: 16px; align-items: center; background: #ffd16b0d; border: 1px solid #ffd16b58; border-radius: 11px; padding: 13px 16px; color: #d7e5eb; font-size: .86rem; margin-bottom: 25px; }
.index-banner strong { background: var(--sun); color: var(--bg); border-radius: 999px; padding: 4px 9px; text-transform: uppercase; font-family: var(--mono); font-size: .67rem; letter-spacing: .08em; white-space: nowrap; }
.explorer-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 24px; }
.country-panel, .range-card { background: #071521b5; border: 1px solid var(--line); border-radius: 20px; padding: 28px; }
.country-panel label { font-size: .84rem; font-weight: 700; display: block; margin-bottom: 9px; }
.search-wrap { position: relative; }
.search-wrap svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); width: 18px; fill: none; stroke: var(--muted); stroke-width: 1.7; }
.search-wrap input { width: 100%; background: #102638; border: 1px solid #355269; color: var(--ink); border-radius: 10px; padding: 12px 14px 12px 43px; }
.search-wrap input::placeholder { color: #8098a8; }
.search-wrap input:focus { border-color: var(--focus); }
.field-help { color: #829cab; font-size: .72rem; margin: 9px 0 18px; }
.country-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 7px; max-height: 344px; overflow: auto; }
.country-option { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 11px; border: 1px solid transparent; border-radius: 10px; padding: 9px 11px; color: #c5d9e4; cursor: pointer; }
.country-option:hover, .country-option.is-active { background: #102b3d; border-color: #3b667a; }
.country-option[aria-selected="true"] { background: #123c42; border-color: var(--accent); color: #fff; }
.country-option:focus-visible { outline: 3px solid var(--focus); outline-offset: -3px; }
.country-flag { width: 25px; height: 17px; }
.flag { display: inline-block; position: relative; overflow: hidden; border-radius: 2px; box-shadow: 0 0 0 1px #ffffff35; background: #fff; flex: 0 0 auto; }
.flag-de { background: linear-gradient(#171717 0 33.33%, #d9272e 33.33% 66.66%, #f5cc34 66.66%); }
.flag-fr { background: linear-gradient(90deg, #1e4d9e 0 33.33%, #fff 33.33% 66.66%, #e43b43 66.66%); }
.flag-jp { background: radial-gradient(circle at center, #c91f37 0 29%, transparent 30%), #fff; }
.flag-ge { background: linear-gradient(#d52632 0 0) 16% 24%/16% 5% no-repeat, linear-gradient(#d52632 0 0) 21.5% 18%/5% 16% no-repeat, linear-gradient(#d52632 0 0) 84% 24%/16% 5% no-repeat, linear-gradient(#d52632 0 0) 78.5% 18%/5% 16% no-repeat, linear-gradient(#d52632 0 0) 16% 76%/16% 5% no-repeat, linear-gradient(#d52632 0 0) 21.5% 82%/5% 16% no-repeat, linear-gradient(#d52632 0 0) 84% 76%/16% 5% no-repeat, linear-gradient(#d52632 0 0) 78.5% 82%/5% 16% no-repeat, linear-gradient(90deg, transparent 41%, #d52632 41% 59%, transparent 59%), linear-gradient(transparent 37%, #d52632 37% 63%, transparent 63%), #fff; }
.flag-us { background: repeating-linear-gradient(#b22234 0 7.7%, #fff 7.7% 15.4%); }
.flag-us::after { content: ''; position: absolute; left: 0; top: 0; width: 43%; height: 54%; background: #3c3b6e; }
.flag-br { background: #229e45; }
.flag-br::before { content: ''; position: absolute; width: 57%; height: 57%; left: 21.5%; top: 21.5%; background: #f7d33c; transform: rotate(45deg); }
.flag-br::after { content: ''; position: absolute; width: 34%; height: 34%; left: 33%; top: 33%; background: #2659a5; border-radius: 50%; }
.country-option strong { font-size: .88rem; }
.country-option small { font-family: var(--mono); color: #819baa; font-size: .65rem; }
.range-card { background: radial-gradient(circle at 85% 5%, #61f4cf1f, transparent 30%), #091a29; }
.range-display { border-block: 1px solid var(--line); padding: 24px 0; }
.range-track { height: 6px; background: #183446; border-radius: 99px; margin: 22px 0 25px; overflow: hidden; }
.method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.method-grid div { border-left: 1px solid var(--line); padding-left: 11px; }
.method-grid span, .method-grid strong { display: block; }
.method-grid span { color: #7892a2; font-size: .65rem; }
.method-grid strong { font-size: .76rem; margin-top: 3px; }
.country-note { color: #9eb6c6; font-size: .8rem; margin: 19px 0 0; }
.disclosure { background: #030d16; border-left: 3px solid var(--sun); border-radius: 5px; padding: 15px 17px; margin-top: 20px; }
.disclosure strong { font-size: .82rem; color: #fff; }
.disclosure p { font-size: .74rem; color: #8fa7b5; margin: 5px 0 0; }

.how-section { background: var(--bg); }
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.steps li { border-top: 1px solid #61f4cf6b; padding: 22px 8px 0 0; }
.steps li > span { color: var(--sun); font-family: var(--mono); font-size: .7rem; }
.steps h3 { font-size: 1.18rem; margin: 27px 0 9px; }
.steps p { color: var(--muted); font-size: .9rem; margin: 0; }
.audience-section { background: var(--paper); color: var(--paper-ink); }
.publisher-section { padding-top: 0; }
.split-layout { display: grid; grid-template-columns: .34fr 1fr; gap: 70px; }
.side-label { border-top: 1px solid #91aaa2; padding-top: 15px; font-family: var(--mono); text-transform: uppercase; letter-spacing: .08em; font-size: .7rem; }
.side-label span { color: #6c8c81; }
.side-label p { font-weight: 800; margin: 11px 0 0; }
.audience-copy { max-width: 750px; }
.audience-copy .eyebrow { color: #247763; }
.audience-copy h2 { font-size: clamp(2.7rem, 5vw, 4.7rem); font-weight: 540; margin-bottom: 25px; }
.audience-copy > p:not(.eyebrow) { color: var(--paper-muted); font-size: 1.05rem; }
.feature-list { list-style: none; margin: 32px 0 0; padding: 0; }
.feature-list li { border-bottom: 1px solid #c5d8d1; padding: 13px 0 13px 29px; position: relative; }
.feature-list li::before { content: '↗'; position: absolute; left: 0; color: #247763; font-weight: 800; }
.trust-section { background: #081522; }
.trust-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.trust-grid article { background: #0b1d2c; border: 1px solid var(--line); border-radius: 16px; padding: 25px; }
.card-icon { width: 42px; height: 42px; display: grid; place-items: center; border: 1px solid #61f4cf88; border-radius: 50%; color: var(--accent); font-size: 1.25rem; }
.trust-grid h3 { font-size: 1.05rem; margin: 25px 0 9px; }
.trust-grid p { color: var(--muted); font-size: .85rem; margin: 0; }
.interest-section { background: var(--accent); color: var(--paper-ink); padding: 82px 0; }
.interest-inner { display: grid; grid-template-columns: 1.1fr .9fr; gap: 80px; align-items: center; }
.interest-section .eyebrow { color: #185b4c; }
.interest-section h2 { font-size: clamp(2.5rem, 4.5vw, 4.25rem); font-weight: 540; margin-bottom: 18px; }
.interest-section p { color: #235d51; margin-bottom: 0; }
.interest-card { display: flex; gap: 15px; background: #06101d; color: var(--ink); border-radius: 14px; padding: 23px; }
.interest-card p { color: #8fa7b5; font-size: .82rem; margin: 5px 0 0; }
.status-light { width: 11px; height: 11px; border: 2px solid var(--sun); border-radius: 50%; margin-top: 7px; flex: 0 0 auto; }
.site-footer { min-height: 140px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; border-top: 1px solid #ffffff14; }
.site-footer > p { margin: 0; color: var(--muted); font-size: .8rem; }
.footer-state { grid-column: 1 / -1; font-family: var(--mono); font-size: .65rem !important; text-transform: uppercase; letter-spacing: .07em; margin-top: -36px !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 900px) {
  .site-nav { gap: 13px; }
  .site-nav a { font-size: .74rem; }
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 68px; }
  .hero-copy { max-width: 760px; }
  .hero-visual { padding: 20px 0; }
  .capacity-card { width: min(640px, 100%); }
  .market-spotlight { grid-template-columns: minmax(220px, .85fr) minmax(190px, .75fr); }
  .explorer-grid { grid-template-columns: 1fr; }
  .country-list { grid-template-columns: repeat(2, 1fr); max-height: none; }
  .section-intro { gap: 35px; }
  .method-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 720px) {
  .shell { width: min(100% - 40px, 1180px); }
  html { scroll-padding-top: 76px; }
  .site-header { height: 70px; }
  .brand-mark { width: 36px; height: 36px; }
  .menu-toggle { display: flex; flex-direction: column; gap: 5px; }
  .menu-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; background: var(--ink); }
  .site-nav { display: none; position: absolute; top: 69px; left: -20px; right: -20px; background: #06101df5; border-bottom: 1px solid var(--line); padding: 20px; flex-direction: column; align-items: stretch; gap: 15px; }
  .site-nav.is-open { display: flex; }
  .site-nav a { font-size: .86rem; }
  .nav-state { text-align: center; }
  .hero { padding-block: 54px 70px; background: radial-gradient(circle at 50% 70%, #163a544d 0, transparent 33%); }
  h1 { font-size: clamp(2.7rem, 12vw, 4rem); }
  .hero-lede { font-size: 1rem; }
  .capacity-card { padding: 20px; border-radius: 22px; }
  .capacity-card.is-dashboard { min-height: auto; }
  .dash-header { align-items: stretch; flex-direction: column; }
  .signal-chip { width: fit-content; }
  .market-spotlight { grid-template-columns: 1fr; min-height: auto; }
  .country-orb { min-height: 228px; }
  .market-bars { grid-template-columns: 1fr; }
  .signal-row { grid-template-columns: 1fr; }
  .capacity-orbit { width: min(300px, 80%); }
  .hero-number strong, .range-display strong { font-size: clamp(3.5rem, 18vw, 5rem); }
  .capacity-stats { grid-template-columns: 1fr; }
  .market-strip { grid-template-columns: repeat(3, 1fr); }
  .section { padding: 78px 0; }
  .section-intro { grid-template-columns: 1fr; gap: 20px; align-items: start; margin-bottom: 36px; }
  .section-intro h2 { font-size: clamp(2.45rem, 11vw, 3.6rem); }
  .explorer-intro { margin-bottom: 30px; }
  .index-banner { align-items: flex-start; flex-direction: column; gap: 8px; }
  .country-panel, .range-card { padding: 20px; }
  .country-list { grid-template-columns: 1fr; }
  .method-grid { grid-template-columns: 1fr; }
  .method-grid div { border-left: 0; border-top: 1px solid var(--line); padding: 8px 0 0; }
  .steps, .trust-grid { grid-template-columns: 1fr; }
  .steps { gap: 34px; }
  .split-layout { grid-template-columns: 1fr; gap: 32px; }
  .publisher-section { padding-top: 0; }
  .audience-copy h2 { font-size: clamp(2.45rem, 11vw, 3.7rem); }
  .interest-inner { grid-template-columns: 1fr; gap: 33px; }
  .site-footer { display: block; padding-block: 30px; }
  .site-footer > p { margin-top: 18px; }
  .footer-state { margin-top: 18px !important; }
}

@media (max-width: 410px) {
  .shell { width: calc(100% - 32px); }
  .brand { font-size: .8rem; }
  .hero { padding-top: 45px; }
  .hero .button { width: 100%; }
  .country-panel, .range-card { border-radius: 15px; padding: 17px; }
  .selected-flag { width: 49px; height: 33px; }
  .hero-number strong, .range-display strong { gap: 8px; }
  .disclosure { padding: 13px; }
  .interest-card { padding: 18px; }
}
