:root {
  --red: #c81024;
  --red-dark: #a90c1c;
  --red-soft: #fff0f2;
  --navy: #073e83;
  --navy-dark: #052d60;
  --blue-soft: #eef6ff;
  --ink: #12284a;
  --body-copy: #405672;
  --muted: #61708a;
  --line: #dde4ee;
  --paper: #ffffff;
  --canvas: #f7f9fc;
  --green: #168052;
  --shadow: 0 20px 60px rgba(16, 44, 89, 0.14);
  --radius-lg: 32px;
  --radius-md: 20px;
  --radius-sm: 12px;
  --content-width: 1120px;
  --section-space: 92px;
  --section-space-mobile: 62px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: var(--navy) var(--canvas); }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", "YuGothic", "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-variant-numeric: tabular-nums lining-nums;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { text-wrap: balance; }
h3[tabindex="-1"]:focus { outline: 3px solid rgba(7,62,131,.28); outline-offset: 5px; }
p { text-wrap: pretty; line-break: strict; }
.mobile-only { display: none; }

img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
input, textarea { caret-color: var(--red); }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { color: #fff; background: var(--navy); }

.skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 100;
  transform: translateY(-150%);
  background: var(--navy);
  color: #fff;
  padding: 8px 14px;
  border-radius: 8px;
}
.skip-link:focus { transform: translateY(0); }

.shell { width: min(var(--content-width), calc(100% - 40px)); margin-inline: auto; }
.section { padding: var(--section-space) 0; scroll-margin-top: 92px; }
main > .section {
  content-visibility: visible;
  contain-intrinsic-size: none;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(7,62,131,.1);
  backdrop-filter: blur(16px);
}
.header-inner { height: 76px; display: flex; align-items: center; gap: 36px; }
.brand { display: flex; align-items: center; width: 210px; height: 64px; flex: 0 0 auto; overflow: hidden; }
.brand img { width: 100%; height: auto; max-height: 64px; object-fit: contain; object-position: left center; }
.desktop-nav { margin-left: auto; display: flex; align-items: center; gap: 26px; }
.desktop-nav a { display: inline-flex; min-height: 44px; align-items: center; color: var(--ink); text-decoration: none; font-size: .92rem; font-weight: 700; }
.desktop-nav a:hover { color: var(--red); }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 52px;
  padding: 12px 24px;
  border: 0;
  border-radius: 999px;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
  white-space: normal;
  text-decoration: none;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button:active { transform: translateY(0); }
.button:disabled, .button[aria-disabled="true"] { cursor: not-allowed; opacity: .52; transform: none; box-shadow: none; }
:where(a[href], button, summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 3px solid #fff;
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--navy);
}
:where(input, select, textarea):focus-visible {
  outline: 3px solid rgba(7,62,131,.35);
  outline-offset: 3px;
}
.button-primary { color: #fff; background: linear-gradient(135deg, var(--red), var(--red-dark)); box-shadow: 0 12px 30px rgba(16,44,89,.22); }
.button-secondary { color: var(--navy); background: var(--blue-soft); box-shadow: none; }
.button-small { min-height: 44px; padding: 9px 20px; color: #fff; background: var(--red); font-size: .9rem; }
.button-wide { width: 100%; }

.hero {
  position: relative;
  overflow: hidden;
  min-height: 720px;
  background: #eaf5ff;
}
.hero-city-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hero-city-shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.95) 24%, rgba(255,255,255,.74) 38%, rgba(255,255,255,.08) 59%, transparent 72%);
}
.hero-benefit-pins { position: absolute; z-index: 2; top: 19%; left: 50.5%; width: 260px; height: 245px; pointer-events: none; }
.hero-benefit-pins::before { content: ""; position: absolute; right: 0; bottom: 4px; width: 190px; height: 150px; background: radial-gradient(ellipse at center, rgba(255,255,255,.72) 0%, rgba(255,255,255,.28) 48%, transparent 73%); filter: blur(4px); }
.hero-benefit-pins::after { content: ""; position: absolute; right: 20px; bottom: 42px; width: 140px; height: 0; border-top: 3px dashed rgba(205,16,37,.72); transform: rotate(42deg); transform-origin: right center; }
.hero-benefit-pin { position: absolute; z-index: 1; display: block; overflow: hidden; aspect-ratio: 2 / 3; filter: drop-shadow(0 8px 9px rgba(3,24,54,.28)); }
.hero-benefit-pin img { display: block; width: 300%; max-width: none; height: 100%; }
.hero-benefit-food { left: 60px; bottom: 8px; width: 46px; transform: rotate(-8deg); }.hero-benefit-food img { transform: translateX(0); }
.hero-benefit-drink { top: 92px; left: 112px; width: 50px; transform: rotate(-2deg); }.hero-benefit-drink img { transform: translateX(-33.3333%); }
.hero-benefit-discount { top: 28px; right: 16px; width: 56px; transform: rotate(8deg); }.hero-benefit-discount img { transform: translateX(-66.6667%); }
.hero-benefit-twenty { top: 10px; left: 10px; width: 62px; transform: rotate(-8deg); }.hero-benefit-twenty img { width: 100%; object-fit: contain; }
.hero-grid { position: relative; z-index: 3; display: grid; grid-template-columns: minmax(0, 520px) 1fr; align-items: center; min-height: 720px; padding: 62px 0 70px; }
.hero-copy { max-width: 520px; }
.eyebrow, .section-kicker { margin: 0 0 18px; color: var(--red); font-size: .82rem; font-weight: 900; letter-spacing: .12em; }
.eyebrow { display: flex; align-items: center; gap: 9px; letter-spacing: .05em; }
.eyebrow-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--red); box-shadow: 0 0 0 6px rgba(239,29,50,.12); }
.hero h1 { margin: 0; font-size: clamp(3.1rem, 6vw, 5.7rem); line-height: 1.08; letter-spacing: -.04em; color: var(--navy); }
.hero h1 span { color: var(--red); }
.hero-lead { margin: 24px 0; font-size: clamp(1.05rem, 1.7vw, 1.3rem); font-weight: 700; line-height: 1.7; letter-spacing: .015em; }
.launch-ticket { position: absolute; z-index: 4; top: 48px; right: 0; display: grid; grid-template-columns: 64px minmax(0,1fr); align-items: center; gap: 16px; overflow: hidden; width: min(360px,32vw); padding: 13px 18px 13px 14px; border: 2px solid rgba(239,29,50,.72); border-radius: 18px; background: linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,247,248,.96)); box-shadow: 0 14px 32px rgba(3,24,54,.2); }
.launch-ticket::after { content: ""; position: absolute; top: 12px; right: 14px; width: 52px; height: 52px; border: 2px dashed rgba(239,29,50,.11); border-radius: 50%; }
.launch-ticket-calendar { position: relative; z-index: 1; display: grid; overflow: hidden; width: 64px; height: 64px; border: 2px solid rgba(239,29,50,.26); border-radius: 13px; background: #fff; box-shadow: 0 7px 16px rgba(16,44,89,.1); text-align: center; }
.launch-ticket-calendar b { display: grid; place-items: center; height: 22px; color: #fff; background: var(--red); font-size: .72rem; font-weight: 900; letter-spacing: .12em; }
.launch-ticket-calendar strong { display: grid; place-items: center; color: var(--navy); font-size: 1.55rem; line-height: 1; }
.launch-ticket-copy { position: relative; z-index: 1; display: grid; justify-items: start; line-height: 1; }
.launch-ticket-status { margin-bottom: 5px; padding: 4px 10px; border-radius: 999px; color: #fff; background: var(--red); font-size: .76rem; font-weight: 900; letter-spacing: .08em; }
.launch-ticket-date { color: var(--navy); font-size: clamp(2rem,4.3vw,2.65rem); font-weight: 900; letter-spacing: -.04em; }
.launch-ticket-copy small { margin-top: 7px; color: var(--body-copy); font-size: .82rem; font-weight: 800; line-height: 1.45; }
.campaign-card { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto auto; align-items: center; column-gap: 18px; overflow: hidden; margin: 26px 0 22px; padding: 18px 22px; border: 1px solid rgba(255,255,255,.2); border-radius: 20px; background: linear-gradient(135deg,#052b60 0%,#073e83 58%,#0a55a3 100%); color: #fff; box-shadow: 0 15px 38px rgba(3,24,54,.24); }
.campaign-card::before { content: ""; position: absolute; width: 190px; height: 190px; right: -96px; bottom: -120px; border: 2px dashed rgba(255,255,255,.2); border-radius: 50%; box-shadow: 0 0 0 22px rgba(255,255,255,.035), 0 0 0 44px rgba(255,255,255,.025); }
.campaign-card::after { content: ""; position: absolute; left: 34%; bottom: 17px; width: 120px; height: 0; border-top: 3px dashed rgba(255,255,255,.3); transform: rotate(-7deg); }
.campaign-label { grid-column: 1; grid-row: 1; display: grid; justify-items: start; gap: 6px; margin: 0; font-weight: 800; }
.campaign-label span { display: inline-block; padding: 5px 11px; border-radius: 999px; background: #fff; color: var(--red); font-size: .76rem; font-weight: 900; letter-spacing: .04em; }
.campaign-label small { color: rgba(255,255,255,.82); font-size: .84rem; font-weight: 700; }
.campaign-main { position: relative; z-index: 1; grid-column: 2; grid-row: 1 / span 3; display: grid; grid-template-columns: auto auto; align-items: end; margin: 24px 0 0; color: #fff; }
.campaign-main small { grid-column: 1 / -1; margin: 0 0 2px 4px; color: rgba(255,255,255,.78); font-size: .8rem; font-weight: 800; }
.campaign-main strong { font-size: 3.25rem; line-height: .88; letter-spacing: -.04em; }
.campaign-main span { margin-left: 7px; color: #ffe267; font-size: 1.08rem; font-weight: 900; }
.campaign-free { position: relative; z-index: 1; grid-column: 1; grid-row: 2; margin: 5px 0 0; color: #fff; font-size: 1rem; font-weight: 900; }
.campaign-free strong { margin-left: 5px; color: #ffe267; font-size: 1.9rem; line-height: 1; }
.campaign-sub { position: relative; z-index: 1; grid-column: 1; grid-row: 3; margin: 4px 0 0; color: rgba(255,255,255,.84); font-size: .84rem; font-weight: 700; }
.campaign-stamp { position: absolute; z-index: 2; top: 11px; right: 13px; padding: 3px 8px; border: 1px solid rgba(255,226,103,.7); border-radius: 999px; color: #ffe267; font-size: .75rem; font-weight: 900; letter-spacing: .08em; }
.cta-note { display: grid; gap: 3px; margin: 14px 0 0; color: var(--navy); text-align: center; font-size: .95rem; font-weight: 700; line-height: 1.6; }
.cta-note span { color: var(--body-copy); font-size: .875rem; font-weight: 600; }

.phone-mock { position: relative; overflow: hidden; width: 306px; background: #fff; border: 9px solid var(--navy-dark); border-radius: 42px; box-shadow: var(--shadow); }
.phone-speaker { position: absolute; z-index: 4; top: 9px; left: 50%; transform: translateX(-50%); width: 72px; height: 19px; border-radius: 999px; background: var(--navy-dark); }
.phone-hero { min-height: 594px; transform: rotate(3deg); }
.mock-appbar { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 7px; padding: 38px 15px 10px; color: var(--navy); font-size: .78rem; font-weight: 900; }
.mock-logo-mark { display: grid; place-items: center; width: 23px; height: 23px; border-radius: 50% 50% 50% 10%; background: var(--red); color: #fff; }
.mock-avatar { width: 25px; height: 25px; border-radius: 50%; background: var(--blue-soft); }
.mock-search { margin: 5px 12px 10px; padding: 9px 12px; color: #8a95a8; background: #f2f5f9; border-radius: 10px; font-size: .7rem; }
.mock-map { position: relative; height: 292px; overflow: hidden; background-color: #eaf1f2; background-image: linear-gradient(30deg, transparent 45%, rgba(255,255,255,.9) 46% 54%, transparent 55%), linear-gradient(150deg, transparent 44%, rgba(255,255,255,.9) 45% 54%, transparent 55%); background-size: 90px 90px, 118px 118px; }
.map-road { position: absolute; display: block; height: 8px; border-radius: 999px; background: rgba(255,255,255,.95); transform-origin: left; }
.road-one { width: 260px; left: 0; top: 100px; transform: rotate(21deg); }
.road-two { width: 250px; left: 40px; top: 230px; transform: rotate(-38deg); }
.road-three { width: 200px; left: 110px; top: 30px; transform: rotate(74deg); }
.map-pin { position: absolute; display: grid; place-items: center; width: 30px; height: 36px; padding-bottom: 7px; border-radius: 50% 50% 50% 6px; transform: rotate(-45deg); background: var(--red); color: #fff; box-shadow: 0 6px 13px rgba(16,44,89,.18); font-size: 6px; }
.map-pin::first-letter { transform: rotate(45deg); }
.pin-one { left: 48px; top: 58px; }.pin-two { right: 55px; top: 88px; }.pin-three { left: 110px; bottom: 53px; }.pin-four { right: 28px; bottom: 27px; }
.current-dot { position: absolute; left: 50%; top: 48%; width: 18px; height: 18px; transform: translate(-50%,-50%); border: 4px solid #fff; border-radius: 50%; background: #2880ff; box-shadow: 0 0 0 8px rgba(40,128,255,.16); }
.mock-store-card { display: grid; grid-template-columns: 54px 1fr; align-items: center; gap: 10px; margin: -28px 10px 0; padding: 10px; position: relative; background: #fff; border-radius: 14px; box-shadow: 0 8px 24px rgba(16,44,89,.15); font-size: .68rem; }
.mock-store-card strong, .mock-store-card small { display: block; }
.mock-store-card small { color: var(--muted); margin-top: 3px; }
.mock-store-thumb { display: grid; place-items: center; width: 54px; height: 48px; border-radius: 9px; color: #fff; background: linear-gradient(135deg, var(--red), #ff7380); font-size: 1.5rem; font-weight: 900; }
.mock-tabs { display: grid; grid-template-columns: repeat(3,1fr); align-items: center; margin-top: 14px; padding: 8px 12px 12px; color: #8b96a8; text-align: center; font-size: .9rem; }
.mock-tabs span { display: grid; gap: 1px; }
.mock-tabs small { font-size: .54rem; }.mock-tabs .active { color: var(--red); }
.character { position: absolute; z-index: 3; filter: drop-shadow(0 18px 18px rgba(16,44,89,.18)); }
.character-guide { width: 270px; right: -35px; bottom: -5px; }
.screen-caption { position: absolute; right: 28px; bottom: 4px; z-index: 5; padding: 5px 9px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--muted); font-size: .68rem; }

.quick-facts { position: relative; z-index: 5; margin-top: -34px; }
.fact-grid { position: relative; display: grid; grid-template-columns: repeat(3,1fr); overflow: hidden; border: 1px solid rgba(7,62,131,.12); border-radius: 22px; background: linear-gradient(135deg,#fff 0%,#f4f9ff 48%,#e5f2ff 100%); color: var(--navy); box-shadow: 0 14px 42px rgba(7,62,131,.17); }
.fact-grid::before { content: ""; position: absolute; top: 31px; left: 16%; right: 16%; height: 0; border-top: 3px dashed var(--red-dark); opacity: .45; }
.fact-grid div { position: relative; z-index: 1; display: grid; justify-items: center; align-content: center; padding: 13px 24px 20px; text-align: center; border-right: 2px dashed rgba(7,62,131,.15); }
.fact-grid div:last-child { border-right: 0; }
.fact-grid strong, .fact-grid span { display: block; }.fact-grid strong { margin: 7px 0 1px; color: var(--navy); font-size: 1.2rem; }.fact-grid div > span:last-child { color: var(--body-copy); font-size: .9rem; line-height: 1.55; }
.fact-ticket-number { display: grid !important; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--red-dark); box-shadow: 0 0 0 6px rgba(16,44,89,.07); color: #fff !important; font-size: .75rem !important; font-weight: 900; letter-spacing: .04em; }

.section-copy h2, .section-heading h2, .price-copy h2, .registration-copy h2 { margin: 0 0 22px; font-size: clamp(2.15rem, 4vw, 3.7rem); line-height: 1.25; letter-spacing: -.035em; }
.section-copy > p:not(.section-kicker), .section-heading > p:not(.section-kicker), .price-copy > p { color: var(--body-copy); max-width: 680px; font-size: 1rem; font-weight: 500; line-height: 1.9; }
.intro-section { position: relative; overflow: hidden; background: linear-gradient(180deg,#fff 0%,#f5faff 100%); }
.intro-section::before { content: ""; position: absolute; top: -210px; left: -190px; width: 420px; height: 420px; border: 72px solid rgba(239,29,50,.045); border-radius: 50%; }
.map-experience { position: relative; }
.map-experience-heading { margin-bottom: 40px; }
.map-experience-heading .section-kicker {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-width: 290px;
  min-height: 48px;
  margin: 0 auto 20px;
  padding: 10px 44px;
  color: #fff;
  font-size: 1.125rem;
  font-weight: 900;
  letter-spacing: .1em;
  line-height: 1.2;
  background: linear-gradient(135deg, #dc142a 0%, #d20f25 52%, #bd0b1e 100%);
  clip-path: polygon(7% 0, 93% 0, 100% 50%, 93% 100%, 7% 100%, 0 50%);
  filter: drop-shadow(0 10px 14px rgba(217,8,36,.22));
}
.map-experience-heading > p:last-child { max-width: 760px; font-size: 1rem; line-height: 1.85; }
.map-impact-visual { position: relative; overflow: hidden; max-width: 1160px; margin: 0 auto; border: 6px solid #fff; border-radius: 34px; background: #fff; box-shadow: 0 28px 70px rgba(7,62,131,.18); }
.map-impact-visual::after { content: ""; position: absolute; inset: 0; pointer-events: none; border-radius: 28px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.48); }
.map-impact-visual img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.map-impact-comparison { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; max-width: 1160px; margin: 0 auto 12px; }
.map-impact-label { display: grid; align-content: center; gap: 2px; min-height: 72px; padding: 12px 20px; border-radius: 18px; line-height: 1.35; box-shadow: 0 10px 24px rgba(3,24,54,.12); }
.map-impact-label strong { font-size: 1rem; font-weight: 900; letter-spacing: .015em; overflow-wrap: anywhere; }
.map-impact-label span { font-size: .86rem; font-weight: 800; overflow-wrap: anywhere; }
.map-impact-label-before { border: 1px solid rgba(16,44,89,.16); background: #fff; color: var(--navy); }
.map-impact-label-before span { color: var(--muted); }
.map-impact-label-after { border: 1px solid rgba(239,29,50,.18); background: var(--red); color: #fff; }
.map-impact-label-after span { color: #fff; }

.benefits-section { position: relative; overflow: hidden; min-height: 720px; background: #eff7ff; isolation: isolate; }
.benefits-section::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(245,250,255,.56) 45%, rgba(255,255,255,.84) 100%); }
.benefits-city-map { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .72; }
.benefits-shell { position: relative; }
.centered { margin-inline: auto; text-align: center; }
.section-heading { margin-bottom: 38px; }.section-heading > p { margin-inline: auto; }
.benefits-heading { margin-bottom: 12px; }
.benefits-heading h2 { text-shadow: 0 2px 18px rgba(255,255,255,.95); }
.benefit-route { position: relative; display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; min-height: 365px; margin-top: 22px; padding: 0 10px; }
.benefit-route-path { position: absolute; top: 0; left: 1.5%; width: 97%; height: 220px; overflow: visible; fill: none; }
.route-shadow { stroke: rgba(255,255,255,.96); stroke-width: 13; stroke-linecap: round; }
.route-dashes { stroke: var(--red); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 2 17; }
.benefit-stop { --stop-offset: 0px; position: relative; z-index: 2; display: grid; align-content: start; justify-items: center; gap: 13px; transform: translateY(var(--stop-offset)); }
.benefit-stop-one { --stop-offset: 66px; }
.benefit-stop-two { --stop-offset: 4px; }
.benefit-stop-three { --stop-offset: 64px; }
.benefit-stop-four { --stop-offset: 9px; }
.benefit-stop-pin { position: relative; display: grid; place-items: center; width: 136px; height: 136px; border: 5px solid rgba(255,255,255,.96); border-radius: 50%; background: rgba(255,255,255,.88); box-shadow: 0 16px 38px rgba(16,44,89,.18), 0 0 0 1px rgba(7,62,131,.08); backdrop-filter: blur(7px); }
.benefit-stop-pin::after { content: ""; position: absolute; left: 50%; bottom: -13px; width: 18px; height: 18px; background: #fff; border-right: 1px solid rgba(7,62,131,.08); border-bottom: 1px solid rgba(7,62,131,.08); transform: translateX(-50%) rotate(45deg); }
.benefit-stop-pin img { position: relative; z-index: 1; width: 118px; height: auto; aspect-ratio: 1; object-fit: contain; filter: drop-shadow(0 8px 9px rgba(16,44,89,.12)); }
.benefit-number { position: absolute; z-index: 3; top: -9px; left: -8px; display: grid; place-items: center; width: 39px; height: 39px; border: 3px solid #fff; border-radius: 50%; background: var(--red); color: #fff; font-size: .75rem; font-weight: 900; box-shadow: 0 6px 14px rgba(16,44,89,.18); }
.benefit-stop-card { width: 100%; min-height: 104px; padding: 18px 14px; border: 1px solid rgba(255,255,255,.9); border-radius: 20px; background: rgba(255,255,255,.92); text-align: center; box-shadow: 0 14px 34px rgba(16,44,89,.11); backdrop-filter: blur(12px); }
.benefit-stop-card p { margin: 0 0 2px; color: var(--muted); font-size: .92rem; font-weight: 800; }
.benefit-stop-card strong { display: block; color: var(--red); font-size: 1.45rem; line-height: 1.2; }
.benefit-limit { display: block; margin-top: 4px; color: var(--body-copy); font-size: .86rem; font-weight: 800; line-height: 1.4; }
.benefit-value-banner { position: relative; overflow: hidden; display: grid; justify-items: center; gap: 4px; max-width: 820px; margin: 8px auto 0; padding: 24px 36px 26px; border: 1px solid rgba(239,29,50,.18); border-radius: 26px; background: linear-gradient(135deg,rgba(255,255,255,.98),rgba(255,240,243,.96)); box-shadow: 0 18px 42px rgba(16,44,89,.12); text-align: center; backdrop-filter: blur(10px); }
.benefit-value-banner::before, .benefit-value-banner::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.benefit-value-banner::before { width: 112px; height: 112px; top: -76px; left: -34px; border: 24px solid rgba(239,29,50,.08); }
.benefit-value-banner::after { width: 72px; height: 72px; right: -24px; bottom: -48px; border: 17px solid rgba(7,62,131,.06); }
.benefit-value-banner span, .benefit-value-banner strong { position: relative; z-index: 1; }
.benefit-value-banner span { color: var(--navy); font-size: clamp(1rem,1.8vw,1.28rem); font-weight: 800; }
.benefit-value-banner strong { color: var(--red); font-size: clamp(1.7rem,3vw,2.45rem); line-height: 1.3; letter-spacing: -.025em; }
.section-note { max-width: 70ch; margin: 20px auto 0; color: var(--body-copy); text-align: center; font-size: .9375rem; line-height: 1.75; }

.how-section { position: relative; overflow: hidden; background: linear-gradient(180deg, #fff 0%, #f7fbff 100%); }
.how-section::before, .how-section::after { content: ""; position: absolute; z-index: 0; border-radius: 50%; pointer-events: none; }
.how-section::before { width: 430px; height: 430px; top: 160px; left: -310px; border: 72px solid rgba(7,62,131,.045); }
.how-section::after { width: 360px; height: 360px; right: -260px; bottom: -180px; border: 65px solid rgba(239,29,50,.045); }
.how-shell { position: relative; z-index: 1; }
.how-heading { margin-bottom: 36px; }
.how-heading > p:last-child { max-width: 680px; }
.how-stage { display: grid; grid-template-columns: minmax(0, 1fr) 245px; gap: 48px; align-items: end; max-width: 1040px; margin: 0 auto; }
.how-story { position: relative; list-style: none; display: grid; gap: 24px; margin: 0; padding: 0; }
.how-story::before { content: ""; position: absolute; z-index: 0; top: 45px; bottom: 45px; left: 38px; width: 6px; border-radius: 999px; background: var(--red-dark); box-shadow: 0 0 0 6px #fff; }
.how-story-step { position: relative; z-index: 1; display: grid; grid-template-columns: 80px 160px minmax(0, 1fr); gap: 22px; align-items: center; min-height: 238px; }
.how-step-number { display: grid; place-items: center; width: 76px; height: 76px; border: 6px solid #fff; border-radius: 50%; background: var(--red); color: #fff; font-size: 1rem; font-weight: 900; box-shadow: 0 12px 28px rgba(16,44,89,.17); }
.how-app-art { display: grid; place-items: center; width: 160px; min-height: 230px; }
.how-app-art img { width: 148px; height: auto; aspect-ratio: 640 / 1137; object-fit: contain; filter: drop-shadow(0 17px 22px rgba(16,44,89,.16)); }
.how-step-copy > span { color: var(--red); font-size: .8rem; font-weight: 900; letter-spacing: .16em; }.how-step-copy h3 { margin: 4px 0 7px; font-size: 1.35rem; line-height: 1.4; }.how-step-copy p { margin: 0; color: var(--body-copy); font-size: 1rem; font-weight: 500; line-height: 1.75; }
.how-character { position: relative; align-self: end; min-height: 420px; display: grid; align-items: end; }
.how-character img { position: relative; z-index: 1; width: 245px; height: auto; aspect-ratio: 1; object-fit: contain; filter: drop-shadow(0 22px 23px rgba(16,44,89,.16)); }
.how-character p { position: absolute; z-index: 2; top: 4px; left: -18px; min-width: 150px; margin: 0; padding: 14px 18px; border-radius: 20px 20px 20px 5px; background: #fff; color: var(--navy); text-align: center; font-size: .9rem; font-weight: 800; box-shadow: 0 12px 30px rgba(16,44,89,.12); transform: rotate(-4deg); }.how-character p strong { color: var(--red); font-size: 1.3rem; }

.area-section { position: relative; overflow: hidden; background-color: #081d42; background-image: linear-gradient(180deg,rgba(5,18,42,.92) 0%,rgba(9,31,67,.72) 48%,rgba(5,18,42,.86) 100%),url("./assets/area-three-hubs-v1.webp"); background-position: center; background-size: cover; color: #fff; }
.area-section::before, .area-section::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.area-section::before { width: 520px; height: 520px; top: -355px; left: -150px; border: 90px solid rgba(255,255,255,.045); }
.area-section::after { width: 410px; height: 410px; right: -180px; bottom: -310px; border: 72px solid rgba(239,29,50,.12); }
.area-shell { position: relative; z-index: 2; }.light-heading .section-kicker { color: #ff7d89; }.light-heading > p:not(.section-kicker) { color: rgba(255,255,255,.72); }
.area-heading { margin-bottom: 0; }.area-launch { display: inline-flex; align-items: center; min-height: 34px; margin-top: 16px; padding: 6px 15px; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; background: rgba(255,255,255,.1); color: #fff; font-size: .75rem; font-weight: 900; letter-spacing: .14em; box-shadow: 0 10px 24px rgba(0,0,0,.12); }
.city-route { position: relative; display: grid; grid-template-columns: repeat(3,1fr); gap: clamp(24px,5vw,70px); margin: 52px 0 0; padding: 0; list-style: none; }
.city-route::before { content: ""; position: absolute; z-index: 0; top: 42px; left: 13%; right: 13%; height: 5px; border-radius: 999px; background: rgba(255,255,255,.68); }
.city-stop { position: relative; z-index: 1; display: grid; justify-items: center; }
.city-stop-marker { position: relative; display: grid; place-items: center; width: 88px; height: 88px; border: 7px solid #fff; border-radius: 50% 50% 50% 12%; background: var(--red); box-shadow: 0 14px 28px rgba(0,0,0,.22), 0 0 0 7px rgba(255,255,255,.1); transform: rotate(-45deg); }
.city-stop-marker::after { content: ""; width: 34px; height: 34px; border-radius: 50%; background: #fff; }
.city-stop-marker b { position: absolute; z-index: 1; color: var(--red); font-size: .72rem; line-height: 1; transform: rotate(45deg); }
.city-stop-card { width: 100%; margin-top: 24px; padding: 24px 20px 22px; border: 1px solid rgba(255,255,255,.24); border-radius: 24px; background: rgba(8,29,66,.64); box-shadow: 0 20px 42px rgba(0,0,0,.22); text-align: center; backdrop-filter: blur(12px); }
.city-stop-card small, .city-stop-card em { display: block; font-style: normal; letter-spacing: .04em; }.city-stop-card small { color: #ffb8bf; font-size: .75rem; font-weight: 900; }.city-stop-card strong { display: block; margin: 3px 0 0; font-size: 2rem; line-height: 1.3; }.city-stop-card em { color: rgba(255,255,255,.74); font-size: .75rem; font-weight: 800; }
.area-note { margin: 26px 0 0; color: rgba(255,255,255,.82); text-align: center; font-size: .9375rem; line-height: 1.75; }

.price-section { position: relative; overflow: hidden; background: radial-gradient(circle at 8% 12%,rgba(239,29,50,.09),transparent 29%),radial-gradient(circle at 92% 88%,rgba(39,111,213,.1),transparent 31%),linear-gradient(180deg,#fff 0%,#f7faff 100%); }
.price-section::before { content: ""; position: absolute; width: 360px; height: 360px; top: -255px; right: -120px; border: 68px solid rgba(239,29,50,.055); border-radius: 50%; }
.price-shell { position: relative; z-index: 1; }.price-heading { max-width: 760px; margin-bottom: 36px; }.price-heading h2 span { color: var(--red); }.price-heading h2 .price-free-word { display: inline-block; white-space: nowrap; }.price-heading > p:last-child { max-width: 680px; }
.offer-panel { display: grid; grid-template-columns: 1.05fr .95fr; max-width: 1020px; margin: 0 auto; border-radius: 32px; box-shadow: 0 28px 70px rgba(16,44,89,.15); }
.offer-main { position: relative; overflow: hidden; display: grid; justify-items: center; align-content: center; min-height: 460px; padding: 42px; border-radius: 32px 0 0 32px; background: linear-gradient(180deg,rgba(2,14,36,.08) 0%,rgba(1,10,27,.28) 100%),url("./assets/price-city-map-navy-v1.webp") center/cover no-repeat,#061b3a; color: #fff; text-align: center; }
.offer-main::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at center,rgba(3,25,59,.06) 0%,rgba(2,15,38,.14) 62%,rgba(0,8,24,.28) 100%); }.offer-main > * { position: relative; z-index: 1; }
.offer-deadline { display: inline-flex; align-items: center; min-height: 34px; padding: 6px 15px; border-radius: 999px; background: #fff; color: var(--red-dark); font-size: .78rem; font-weight: 900; }
.offer-start { margin: 25px 0 0; font-weight: 800; }.offer-until { display: grid; justify-items: center; margin: 6px 0 14px; line-height: 1; }.offer-until span { font-size: .9rem; font-weight: 800; }.offer-until strong { margin: 5px 0 3px; font-size: clamp(3.7rem,6.5vw,5.35rem); font-weight: 900; letter-spacing: -.04em; }.offer-until em { font-size: 2.45rem; font-style: normal; font-weight: 900; }
.offer-normal { margin: 0 0 24px; color: rgba(255,255,255,.82); font-weight: 700; }.offer-main .button-primary { max-width: 360px; color: var(--red-dark); background: #fff; box-shadow: 0 14px 30px rgba(92,0,12,.24); }
.offer-details { display: grid; align-content: center; padding: 46px 42px; border: 1px solid rgba(16,44,89,.08); border-left: 0; border-radius: 0 32px 32px 0; background: rgba(255,255,255,.94); }.offer-details-title { margin: 0 0 24px; color: var(--navy); font-size: 1.25rem; font-weight: 900; text-align: center; }
.reassurance-list { display: grid; gap: 13px; margin: 0; padding: 0; list-style: none; }.reassurance-list li { display: grid; grid-template-columns: 46px minmax(0,1fr); gap: 13px; align-items: start; padding: 16px; border-radius: 18px; background: var(--canvas); }.reassurance-list li > span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--green); color: #fff; font-weight: 900; }.reassurance-list strong { display: block; color: var(--navy); font-size: .98rem; }.reassurance-list p { margin: 3px 0 0; color: var(--body-copy); font-size: .9375rem; line-height: 1.7; }
.offer-eligibility { margin: 21px 0 0; color: var(--body-copy); font-size: .9375rem; line-height: 1.7; text-align: center; }

.faq-section { background: var(--canvas); }.faq-shell { max-width: 900px; }.faq-list { display: grid; gap: 12px; }.faq-list details { background: #fff; border: 1px solid var(--line); border-radius: 16px; }.faq-list summary { display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 12px; padding: 20px 22px; cursor: pointer; font-weight: 800; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary::after { content: "+"; color: var(--red); font-size: 1.4rem; }.faq-list details[open] summary::after { content: "−"; }.faq-list summary span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: #fff; background: var(--red); }.faq-list details p { margin: 0; padding: 0 22px 22px 72px; color: var(--body-copy); font-weight: 500; }

.registration-section { position: relative; overflow: hidden; background: linear-gradient(155deg, #fff1f3 0, #fff 70%); }.registration-section::before { content: ""; position: absolute; width: 460px; height: 460px; left: -280px; bottom: -270px; border: 90px solid rgba(239,29,50,.07); border-radius: 50%; }.registration-grid { position: relative; display: grid; grid-template-columns: .92fr 1.08fr; gap: 48px; align-items: start; }.registration-copy { display: grid; align-content: center; min-height: 720px; padding: 34px; border: 1px solid rgba(239,29,50,.12); border-radius: var(--radius-lg); background: rgba(255,255,255,.94); box-shadow: var(--shadow); }.registration-copy .registration-visual { display: block; order: 2; width: 100%; height: auto; aspect-ratio: 1200 / 804; object-fit: contain; margin: 28px auto 0; border: 1px solid rgba(239,29,50,.12); border-radius: 24px; box-shadow: 0 18px 38px rgba(16,44,89,.14); }.registration-copy > div { order: 1; }.registration-copy h2 { margin-bottom: 18px; }.registration-headline { display: block; color: var(--navy); font-size: clamp(1.75rem,2.8vw,2.65rem); line-height: 1.35; }.registration-price { display: grid; gap: 2px; margin-top: 14px; }.registration-price small { color: var(--navy); font-size: clamp(1rem,1.5vw,1.25rem); font-weight: 900; }.registration-price strong { color: var(--red); font-size: clamp(3rem,4.8vw,4.35rem); line-height: 1.08; letter-spacing: -.04em; }.registration-limit { display: inline-flex; align-items: center; min-height: 38px; margin: 0; padding: 8px 14px; border: 1px solid rgba(239,29,50,.18); border-radius: 999px; color: var(--red); background: #fff5f6; font-size: .88rem; font-weight: 900; }
.registration-card { min-height: 650px; padding: 32px; border-radius: var(--radius-lg); background: #fff; box-shadow: var(--shadow); }.demo-notice { padding: 9px 12px; border-radius: 10px; background: var(--blue-soft); color: var(--navy); font-size: .76rem; text-align: center; }.registration-progress { display: flex; gap: 7px; margin: 24px 0 30px; }.registration-progress span { height: 5px; flex: 1; border-radius: 999px; background: var(--line); }.registration-progress span.active { background: var(--red); }.registration-step { display: none; }.registration-step.active { display: block; }.registration-step h3 { margin: 0 0 4px; font-size: 1.7rem; }.registration-step > p:not(.step-label):not(.form-error) { margin: 0 0 22px; color: var(--body-copy); font-weight: 500; }.step-label { margin: 0 0 5px; color: var(--red); font-size: .78rem; font-weight: 900; letter-spacing: .08em; }.form-field { display: grid; gap: 7px; margin: 18px 0; font-weight: 800; }.form-field input, .form-field select { width: 100%; min-height: 52px; padding: 11px 13px; border: 1px solid #cbd4e2; border-radius: 11px; background: #fff; color: var(--ink); font-size: 16px; }.form-field small { color: var(--muted); font-size: .76rem; font-weight: 400; }.form-check { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; margin: 13px 0; font-size: .9rem; cursor: pointer; }.form-check input { width: 20px; height: 20px; margin-top: 3px; accent-color: var(--red); }.form-check a { color: var(--navy); }.form-error { min-height: 24px; margin: 8px 0; color: var(--red-dark); font-size: .82rem; }.otp-input { text-align: center; letter-spacing: .35em; font-size: 1.4rem !important; font-variant-numeric: tabular-nums; }.text-button { display: block; margin: 14px auto 0; padding: 8px; border: 0; background: transparent; color: var(--navy); text-decoration: underline; cursor: pointer; }.completion { text-align: center; }.completion-mark { display: grid; place-items: center; width: 76px; height: 76px; margin: 8px auto 18px; border-radius: 50%; color: #fff; background: var(--green); font-size: 2.3rem; font-weight: 900; }.completion dl { margin: 24px 0; padding: 16px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.completion dl div { display: flex; justify-content: space-between; gap: 16px; padding: 7px 0; }.completion dt { color: var(--muted); }.completion dd { margin: 0; font-weight: 800; }

.site-footer { padding: 46px 0; background: var(--navy-dark); color: #fff; }.footer-grid { display: grid; grid-template-columns: 190px 1fr auto; align-items: center; gap: 42px; }.footer-grid img { width: 190px; height: auto; object-fit: contain; filter: brightness(0) invert(1); opacity: .92; }.footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 22px; }.footer-links a { display: inline-flex; min-height: 44px; align-items: center; color: rgba(255,255,255,.78); font-size: .88rem; text-decoration: none; }.footer-grid p { color: rgba(255,255,255,.65); font-size: .82rem; }
.company-dialog { width: min(calc(100% - 32px), 720px); max-height: calc(100dvh - 40px); margin: auto; padding: 0; overflow: auto; border: 0; border-radius: 30px; color: var(--ink); background: transparent; box-shadow: 0 28px 90px rgba(0,18,48,.32); }
.company-dialog::backdrop { background: rgba(2,18,43,.72); backdrop-filter: blur(5px); }
.company-dialog-panel { position: relative; padding: 42px 46px 38px; background: linear-gradient(150deg,#fff 0%,#f6faff 100%); }
.company-dialog-header { padding: 0 52px 24px 0; border-bottom: 1px solid #dce4ef; }
.company-dialog-header p { margin: 0 0 4px; color: var(--red); font-size: .78rem; font-weight: 900; letter-spacing: .13em; }
.company-dialog-header h2 { margin: 0; color: var(--navy); font-size: 2.25rem; letter-spacing: -.035em; }
.company-dialog-close-icon { position: absolute; top: 24px; right: 26px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0 0 3px; border: 1px solid rgba(7,62,131,.15); border-radius: 50%; color: var(--navy); background: #fff; font: 400 1.8rem/1 sans-serif; cursor: pointer; }
.company-dialog-close-icon:hover { color: #fff; background: var(--navy); }
.company-profile { margin: 12px 0 28px; }
.company-profile > div { display: grid; grid-template-columns: 130px minmax(0,1fr); gap: 24px; padding: 17px 8px; border-bottom: 1px solid var(--line); }
.company-profile dt { color: var(--navy); font-weight: 900; }
.company-profile dd { margin: 0; color: var(--body-copy); font-weight: 600; line-height: 1.75; overflow-wrap: anywhere; }
.company-profile a { color: var(--navy); font-weight: 800; text-underline-offset: 3px; }
.company-dialog-panel > .button { width: min(100%, 280px); margin: 0 auto; }
@media (min-width: 1200px) {
  .hero-grid {
    width: min(1280px, calc(100% - 64px));
    grid-template-columns: minmax(0, 540px) 1fr;
  }
}
@media (max-width: 900px) {
  .desktop-nav { display: none; }
  .header-inner { justify-content: space-between; }
  .hero-grid, .registration-grid { grid-template-columns: 1fr; }
  .hero { min-height: 1080px; }
  .hero-city-image { top: auto; bottom: 0; height: 450px; object-position: 72% center; }
  .hero-city-shade { background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.98) 48%, rgba(255,255,255,.56) 67%, rgba(255,255,255,.04) 88%); }
  .hero-benefit-pins { top: auto; left: 24%; bottom: 195px; width: 220px; height: 205px; }
  .hero-benefit-pins::before { width: 160px; height: 125px; }
  .hero-benefit-pins::after { right: 10px; bottom: 40px; width: 115px; }
  .hero-benefit-food { left: 48px; bottom: 2px; width: 40px; }
  .hero-benefit-drink { top: 78px; left: 92px; width: 44px; }
  .hero-benefit-discount { top: 22px; right: 10px; width: 48px; }
  .hero-benefit-twenty { top: 6px; left: 4px; width: 52px; }
  .hero-grid { min-height: 1080px; padding: 60px 0 430px; text-align: center; }
  .hero-copy { margin-inline: auto; }
  .launch-ticket { position: relative; top: auto; right: auto; width: 100%; }
  .eyebrow { justify-content: center; }
  .campaign-card { margin-top: 14px; text-align: left; }
  .section-copy { text-align: center; }.section-copy > p { margin-inline: auto; }
  .map-impact-comparison, .map-impact-visual { max-width: 760px; }
  .map-impact-visual { border-radius: 28px; }
  .benefit-route { grid-template-columns: 1fr; gap: 18px; min-height: auto; max-width: 560px; margin: 34px auto 0; padding: 0; }
  .benefit-route-path { top: 46px; left: 52px; width: 6px; height: calc(100% - 92px); background: var(--red-dark); border-radius: 999px; }
  .benefit-route-path path { display: none; }
  .benefit-stop, .benefit-stop-one, .benefit-stop-two, .benefit-stop-three, .benefit-stop-four { --stop-offset: 0px; grid-template-columns: 104px 1fr; align-items: center; justify-items: stretch; gap: 17px; transform: none; }
  .benefit-stop-pin { width: 104px; height: 104px; }
  .benefit-stop-pin::after { display: none; }
  .benefit-stop-pin img { width: 88px; height: 88px; }
  .benefit-stop-card { min-height: 0; padding: 17px 20px; text-align: left; }
  .how-stage { grid-template-columns: 1fr; gap: 16px; max-width: 700px; }
  .how-character { min-height: 280px; justify-items: end; }.how-character img { width: 210px; }.how-character p { top: 22px; left: auto; right: 170px; }
  .offer-panel { grid-template-columns: 1fr; max-width: 720px; }.offer-main { min-height: 410px; border-radius: 30px 30px 0 0; }.offer-details { border-top: 0; border-left: 1px solid rgba(16,44,89,.08); border-radius: 0 0 30px 30px; }
  .registration-copy { min-height: 0; padding: 30px; text-align: center; }.registration-copy .registration-visual { width: min(100%, 560px); }.registration-limit { justify-self: center; }
  .footer-grid { grid-template-columns: 1fr; justify-items: center; text-align: center; }
}

@media (max-width: 620px) {
  body { padding-bottom: 0; }
  .shell { width: min(100% - 28px, 1120px); }
  .section { padding: var(--section-space-mobile) 0; scroll-margin-top: 76px; }
  .site-header .button { display: none; }
  .header-inner { height: 64px; }.brand { width: 168px; height: 50px; }.brand img { max-height: 50px; }
  .hero { min-height: 980px; }.hero-city-image { height: 285px; object-position: 72% center; }.hero-city-shade { background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.98) 62%, rgba(255,255,255,.38) 79%, rgba(255,255,255,.02) 100%); }.hero-benefit-pins { left: 2%; bottom: 100px; width: 175px; height: 150px; }.hero-benefit-pins::before { width: 125px; height: 96px; }.hero-benefit-pins::after { right: 8px; bottom: 25px; width: 85px; transform: rotate(40deg); }.hero-benefit-food { left: 36px; bottom: 0; width: 31px; }.hero-benefit-drink { top: 56px; left: 70px; width: 34px; }.hero-benefit-discount { top: 14px; right: 6px; width: 38px; }.hero-benefit-twenty { top: 4px; left: 0; width: 40px; }.hero-grid { min-height: 980px; padding: 54px 0 320px; }.hero h1 { font-size: clamp(2.85rem, 14vw, 4.2rem); line-height: 1.12; letter-spacing: -.035em; }.hero-lead { margin: 18px 0; line-height: 1.72; }.desktop-only { display: none; }
  .launch-ticket { grid-template-columns: 54px minmax(0,1fr); gap: 12px; padding: 11px 13px 11px 11px; border-radius: 16px; text-align: left; }.launch-ticket-calendar { width: 54px; height: 54px; border-radius: 11px; }.launch-ticket-calendar b { height: 19px; font-size: .65rem; }.launch-ticket-calendar strong { font-size: 1.3rem; }.launch-ticket-status { margin-bottom: 4px; padding: 3px 8px; font-size: .72rem; }.launch-ticket-date { font-size: clamp(1.75rem,9vw,2.15rem); }.launch-ticket-copy small { margin-top: 5px; font-size: .72rem; }
  .campaign-card { grid-template-columns: 1fr; grid-template-rows: auto; justify-items: center; padding: 20px 18px; text-align: center; }.campaign-card::after { left: 20%; bottom: 22px; }.campaign-label { grid-column: 1; grid-row: auto; justify-items: center; }.campaign-main { grid-column: 1; grid-row: auto; justify-content: center; margin: 12px 0 3px; }.campaign-free, .campaign-sub { grid-column: 1; grid-row: auto; }.campaign-sub { text-align: center; }.campaign-stamp { top: 12px; right: 12px; }
  .quick-facts { margin-top: 0; padding: 18px 0 24px; background: linear-gradient(180deg,#f5faff 0%,#fff 100%); }.quick-facts .shell { width: min(100% - 28px,1120px); }.fact-grid { grid-template-columns: 1fr; border-radius: 22px; box-shadow: 0 12px 32px rgba(7,62,131,.14); }.fact-grid::before { top: 25px; bottom: 25px; left: 35px; right: auto; width: 3px; height: auto; border-top: 0; background: var(--red-dark); }.fact-grid div { grid-template-columns: 36px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 14px; justify-items: start; padding: 16px 18px; border-right: 0; border-bottom: 2px dashed rgba(7,62,131,.14); text-align: left; }.fact-grid div:last-child { border-bottom: 0; }.fact-ticket-number { grid-row: 1 / span 2; align-self: center; }.fact-grid strong { margin: 0; }
  .section-copy h2, .section-heading h2, .registration-copy h2 { font-size: 2.15rem; line-height: 1.34; letter-spacing: -.025em; }
  .mobile-only { display: initial; }
  .map-experience-heading { margin-bottom: 28px; }
  .map-experience-heading .section-kicker {
    min-width: 240px;
    min-height: 42px;
    margin-bottom: 16px;
    padding: 9px 32px;
    font-size: .9375rem;
    letter-spacing: .08em;
  }
  .map-experience-heading h2 { font-size: 1.65rem; text-wrap: wrap; overflow-wrap: anywhere; }
  .map-experience-heading > p:last-child { font-size: .9375rem; line-height: 1.8; text-wrap: wrap; overflow-wrap: anywhere; }
  .map-impact-visual { border-width: 4px; border-radius: 22px; box-shadow: 0 18px 42px rgba(7,62,131,.18); }
  .map-impact-visual::after { border-radius: 18px; }
  .map-impact-comparison { gap: 7px; margin-bottom: 8px; }
  .map-impact-label { min-width: 0; min-height: 76px; padding: 9px 10px; border-radius: 12px; box-shadow: 0 7px 16px rgba(3,24,54,.12); }
  .map-impact-label strong { font-size: .82rem; line-height: 1.4; letter-spacing: 0; }
  .map-impact-label span { font-size: .8rem; line-height: 1.4; }
  .benefits-section { min-height: 0; }
  .benefits-city-map { object-position: 54% center; opacity: .6; }
  .benefits-section::before { background: linear-gradient(180deg, rgba(255,255,255,.93), rgba(245,250,255,.72) 45%, rgba(255,255,255,.9)); }
  .benefits-heading h2 { font-size: 2rem; }
  .benefit-route { gap: 15px; margin-top: 28px; }
  .benefit-route-path { left: 43px; }
  .benefit-stop, .benefit-stop-one, .benefit-stop-two, .benefit-stop-three, .benefit-stop-four { grid-template-columns: 86px 1fr; gap: 13px; }
  .benefit-stop-pin { width: 86px; height: 86px; border-width: 4px; }
  .benefit-stop-pin img { width: 73px; height: 73px; }
  .benefit-number { top: -7px; left: -5px; width: 31px; height: 31px; border-width: 2px; font-size: .7rem; }
  .benefit-stop-card { padding: 15px 16px; border-radius: 17px; }
  .benefit-stop-card strong { font-size: 1.3rem; }
  .benefit-value-banner { margin-top: 24px; padding: 20px 16px 22px; border-radius: 21px; }
  .benefit-value-banner span { font-size: .95rem; }
  .benefit-value-banner strong { font-size: 1.65rem; }
  .how-heading { margin-bottom: 26px; }
  .how-story { gap: 18px; }
  .how-story::before { left: 30px; top: 38px; bottom: 38px; width: 5px; box-shadow: 0 0 0 5px #fff; }
  .how-story-step { grid-template-columns: 62px 96px minmax(0,1fr); gap: 9px; min-height: 156px; }
  .how-step-number { width: 60px; height: 60px; border-width: 5px; font-size: .8rem; }
  .how-app-art { width: 96px; min-height: 150px; }
  .how-app-art img { width: 92px; height: auto; }
  .how-step-copy > span { font-size: .75rem; }.how-step-copy h3 { margin: 2px 0 5px; font-size: 1.05rem; }.how-step-copy p { font-size: .92rem; line-height: 1.7; }
  .how-character { min-height: 205px; }.how-character img { width: 165px; }.how-character p { top: 18px; right: 124px; min-width: 128px; padding: 11px 13px; font-size: .84rem; }.how-character p strong { font-size: 1.1rem; }
  .area-heading h2 { font-size: clamp(2rem,10vw,3rem); }.area-launch { margin-top: 13px; }
  .city-route { grid-template-columns: 1fr; gap: 18px; width: min(100%,410px); margin: 38px auto 0; }
  .city-route::before { top: 36px; bottom: 36px; left: 34px; right: auto; width: 5px; height: auto; background: rgba(255,255,255,.68); }
  .city-stop { grid-template-columns: 70px minmax(0,1fr); gap: 16px; align-items: center; justify-items: stretch; }
  .city-stop-marker { width: 70px; height: 70px; border-width: 6px; box-shadow: 0 10px 22px rgba(0,0,0,.2), 0 0 0 5px rgba(255,255,255,.1); }.city-stop-marker::after { width: 28px; height: 28px; }
  .city-stop-card { margin-top: 0; padding: 17px 19px; border-radius: 19px; text-align: left; }.city-stop-card strong { font-size: 1.55rem; }
  .price-heading { margin-bottom: 26px; }.offer-main { min-height: 370px; padding: 30px 18px; border-radius: 25px 25px 0 0; }.offer-deadline { font-size: .8rem; }.offer-start { margin-top: 18px; }.offer-until strong { font-size: 3.75rem; }.offer-until em { font-size: 2rem; }.offer-details { padding: 28px 18px; border-radius: 0 0 25px 25px; }.offer-details-title { font-size: 1.08rem; }.reassurance-list li { grid-template-columns: 42px minmax(0,1fr); padding: 14px 13px; }.reassurance-list li > span { width: 40px; height: 40px; }.offer-eligibility { padding-inline: 6px; font-size: .9rem; }.registration-card { min-height: 650px; padding: 24px 18px; border-radius: 24px; }
  .faq-list summary { padding: 17px 15px; grid-template-columns: 34px 1fr auto; }.faq-list details p { padding: 0 16px 18px; }
  .registration-copy { padding: 24px 18px; border-radius: 24px; }.registration-copy .registration-visual { width: 100%; max-width: 420px; }.registration-headline { font-size: 2rem; }.registration-price strong { font-size: 3.35rem; }.registration-limit { font-size: .78rem; }
  .footer-links { flex-direction: column; }
  .company-dialog { width: min(calc(100% - 24px), 720px); max-height: calc(100dvh - 24px); border-radius: 24px; }
  .company-dialog-panel { padding: 30px 20px 24px; }
  .company-dialog-header { padding: 0 48px 18px 2px; }
  .company-dialog-header h2 { font-size: 1.85rem; }
  .company-dialog-close-icon { top: 16px; right: 16px; width: 42px; height: 42px; }
  .company-profile { margin-bottom: 22px; }
  .company-profile > div { grid-template-columns: 1fr; gap: 4px; padding: 13px 3px; }
  .company-profile dt { font-size: .8rem; }
  .company-profile dd { font-size: .95rem; line-height: 1.65; }
}

/* Email-confirmed early access registration */
.registration-card { min-height: 620px; padding: 30px 36px 36px; border: 1px solid rgba(7,62,131,.08); }
.demo-notice { display: flex; justify-content: center; gap: 8px; align-items: center; padding: 10px 14px; border: 1px solid #cfe0f7; border-radius: 12px; background: #f3f8ff; font-size: .8rem; line-height: 1.55; }
.demo-notice strong { color: var(--navy); }
.demo-notice span { color: var(--body-copy); }
.registration-progress { position: relative; display: grid; grid-template-columns: repeat(3,1fr); gap: 0; margin: 24px 0 34px; padding: 0; list-style: none; }
.registration-progress::before { content: ""; position: absolute; top: 17px; left: 16.66%; right: 16.66%; height: 3px; background: var(--line); }
.registration-progress li { position: relative; z-index: 1; display: grid; justify-items: center; gap: 7px; color: var(--muted); font-weight: 800; }
.registration-progress li > span { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border: 3px solid #fff; border-radius: 50%; background: #fff; color: var(--muted); font-size: .82rem; box-shadow: 0 0 0 1px var(--line); }
.registration-progress li > small { font-size: .74rem; font-weight: 800; }
.registration-progress li.active > span { background: var(--red); color: #fff; box-shadow: 0 0 0 1px var(--red), 0 7px 16px rgba(16,44,89,.16); }
.registration-progress li.active { color: var(--navy); }
.registration-step h3 { margin-bottom: 7px; color: var(--navy); font-size: 1.8rem; letter-spacing: -.025em; }
.registration-step h3:focus { outline: none; }
.registration-step > p:not(.step-label):not(.form-error):not(.form-status):not(.form-privacy-note) { margin-bottom: 22px; color: var(--body-copy); font-size: .98rem; line-height: 1.75; }
.form-field > span { display: flex; align-items: center; gap: 8px; color: var(--navy); font-size: .93rem; }
.form-field em, .required-badge { padding: 2px 7px; border-radius: 999px; background: #fff0f2; color: var(--red-dark); font-size: .72rem; font-style: normal; line-height: 1.5; }
.required-badge { display: inline-flex; align-items: center; margin-left: 5px; vertical-align: .1em; white-space: nowrap; }
.form-field input, .form-field select { border-width: 2px; transition: border-color .18s ease, box-shadow .18s ease; }
.form-field input:focus, .form-field select:focus { outline: none; border-color: var(--navy); box-shadow: 0 0 0 4px rgba(7,62,131,.1); }
.form-field input[aria-invalid="true"], .form-field select[aria-invalid="true"] { border-color: var(--red); background: #fffafb; }
.form-check:has(input[aria-invalid="true"]) { padding: 9px 10px; border-radius: 10px; background: #fff3f4; color: var(--red-dark); }
.form-alert { grid-template-columns: 30px minmax(0,1fr); gap: 11px; align-items: start; margin: 18px 0; padding: 14px 15px; border: 1px solid #ffc8ce; border-radius: 14px; background: #fff4f5; color: #9d1020; font-size: .86rem; line-height: 1.6; }
.form-alert:not([hidden]) { display: grid; }
.form-alert-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--red); color: #fff; font-weight: 900; }
.form-alert strong { display: block; color: var(--red-dark); }
.form-alert ul { margin: 4px 0 0; padding-left: 1.25em; }
.form-alert p { margin: 4px 0 0; }
.form-privacy-note { margin: 13px 0 0; color: var(--muted); font-size: .76rem; line-height: 1.65; text-align: center; }
.registration-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.registration-email-sent { text-align: center; }
.registration-mail-mark { display: grid; place-items: center; width: 76px; height: 76px; margin: 2px auto 18px; border: 1px solid #cfe0f7; border-radius: 24px; background: var(--blue-soft); color: var(--navy); font-size: 2rem; font-weight: 900; }
.confirmation-instructions { margin: 20px 0; padding: 17px 18px; border: 1px solid #cfe0f7; border-radius: 14px; background: #f7faff; color: var(--body-copy); text-align: left; }
.confirmation-instructions strong { display: block; margin-bottom: 4px; color: var(--navy); font-size: .95rem; }
.confirmation-instructions p { margin: 0; font-size: .84rem; line-height: 1.7; }
.otp-meta { display: flex; justify-content: space-between; align-items: center; margin: -7px 0 12px; padding: 11px 14px; border-radius: 11px; background: var(--canvas); color: var(--body-copy); font-size: .82rem; }
.otp-meta strong { color: var(--navy); font-size: .92rem; }
.otp-input { height: 64px; letter-spacing: .48em; font-size: 1.65rem !important; font-weight: 900; }
.form-status { margin: 14px 0; padding: 11px 13px; border: 1px solid #bfe7d5; border-radius: 11px; background: #effbf6; color: #166b4c; font-size: .84rem; font-weight: 700; text-align: center; }
.registration-secondary-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 2px 16px; margin-top: 9px; }
.registration-secondary-actions .text-button { margin: 0; font-size: .84rem; font-weight: 700; text-underline-offset: 3px; }
.payment-summary { display: grid; gap: 0; margin: 4px 0 16px; overflow: hidden; border: 1px solid #d9e3f0; border-radius: 14px; background: #fff; }
.payment-summary div { display: flex; justify-content: space-between; gap: 18px; padding: 12px 14px; border-bottom: 1px solid #e8eef6; }
.payment-summary div:last-child { border-bottom: 0; }
.payment-summary span { color: var(--muted); font-size: .8rem; }
.payment-summary strong { color: var(--navy); font-size: .88rem; text-align: right; }
.final-confirmation-badge { display: inline-flex; width: fit-content; margin: 0 0 8px !important; padding: 5px 10px; border-radius: 999px; background: #fff0f2; color: var(--red-dark) !important; font-size: .72rem !important; font-weight: 900; letter-spacing: .04em; }
.current-charge { display: grid; grid-template-columns: 1fr auto; gap: 1px 16px; align-items: center; margin: 2px 0 14px; padding: 15px 17px; border: 2px solid #ffc7cd; border-radius: 16px; background: linear-gradient(135deg,#fff 0%,#fff4f5 100%); }
.current-charge > span { color: var(--navy); font-size: .86rem; font-weight: 900; }
.current-charge > strong { grid-row: span 2; color: var(--red); font-size: 2.25rem; line-height: 1; }
.current-charge > strong small { margin-left: 2px; font-size: .85rem; }
.current-charge > p { margin: 2px 0 0; color: var(--body-copy); font-size: .75rem; }
.application-review { display: grid; gap: 0; margin: 0 0 14px; overflow: hidden; border: 1px solid #d9e3f0; border-radius: 14px; background: #fff; }
.application-review div { display: grid; grid-template-columns: minmax(110px,.8fr) 1.5fr; gap: 16px; padding: 10px 14px; border-bottom: 1px solid #e8eef6; }
.application-review div:last-child { border-bottom: 0; }
.application-review dt { color: var(--muted); font-size: .78rem; }
.application-review dd { margin: 0; color: var(--navy); font-size: .83rem; font-weight: 850; text-align: right; }
.cancellation-summary { margin: 14px 0; padding: 14px 15px; border: 1px solid #d9e3f0; border-radius: 13px; background: var(--canvas); }
.cancellation-summary strong { color: var(--navy); font-size: .84rem; }
.cancellation-summary p { margin: 5px 0 8px; color: var(--body-copy); font-size: .77rem; line-height: 1.65; }
.cancellation-summary a { color: var(--navy); font-size: .76rem; font-weight: 850; text-underline-offset: 3px; }
.secure-payment-note { display: grid; grid-template-columns: 30px 1fr; gap: 10px; align-items: start; margin: 16px 0; padding: 14px; border-radius: 14px; background: var(--blue-soft); color: var(--body-copy); font-size: .8rem; line-height: 1.65; }
.secure-payment-note p { margin: 0; }
.secure-payment-note strong { color: var(--navy); }
.secure-payment-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--green); color: #fff; font-weight: 900; }
.billing-consent { margin: 16px 0; padding: 12px; border: 1px solid #d9e3f0; border-radius: 12px; background: #fff; line-height: 1.6; }
.final-submit { display: grid; gap: 2px; line-height: 1.35; }
.final-submit small { font-size: .7rem; font-weight: 700; opacity: .9; }
.edit-registration { margin-top: 10px; }
.completion-mark { position: relative; width: 84px; height: 84px; margin-top: 0; box-shadow: 0 12px 28px rgba(21,139,96,.23); }
.completion-mark::after { content: ""; position: absolute; inset: -9px; border: 2px solid rgba(21,139,96,.16); border-radius: 50%; }
.completion dl { text-align: left; }
.completion dl div { align-items: start; }
.completion dt { flex: 0 0 112px; font-size: .86rem; }
.completion dd { color: var(--navy); text-align: right; }
.completion-note { display: grid; gap: 3px; margin: -4px 0 22px; padding: 14px; border-radius: 14px; background: var(--blue-soft); color: var(--navy); }
.completion-note strong { font-size: .9rem; }
.completion-note span { color: var(--body-copy); font-size: .8rem; }
.completion-next { display: grid; gap: 5px; margin: 0 0 18px; padding: 15px; border: 1px solid #d8e5f4; border-radius: 14px; background: #fff; color: var(--body-copy); text-align: left; }
.completion-next strong { color: var(--navy); font-size: .92rem; }
.completion-next p { margin: 0; font-size: .84rem; line-height: 1.7; }
.completion-next a { width: fit-content; color: var(--navy); font-size: .84rem; font-weight: 800; text-underline-offset: 3px; }

@media (max-width: 620px) {
  .registration-card { min-height: 620px; padding: 22px 17px 26px; }
  .demo-notice { display: grid; gap: 1px; }
  .registration-progress { margin: 21px 0 29px; }
  .registration-progress li > small { font-size: .72rem; }
  .payment-summary div { display: grid; gap: 3px; }
  .payment-summary strong { text-align: left; }
  .application-review div { grid-template-columns: 1fr; gap: 3px; }
  .application-review dd { text-align: left; }
  .registration-step h3 { font-size: 1.6rem; }
  .registration-step > p:not(.step-label):not(.form-error):not(.form-status):not(.form-privacy-note) { font-size: .9rem; }
  .form-check { font-size: .86rem; }
  .form-alert { padding: 12px; }
  .completion dl div { display: grid; gap: 3px; }
  .completion dt { font-size: .78rem; }
  .completion dd { text-align: left; }
}

/* Readability polish for supporting copy and registration details */
.registration-progress li > small { font-size: .8rem; }
.form-field small { color: var(--muted); font-size: .86rem; font-weight: 500; }
.form-privacy-note { font-size: .82rem; }
.application-review dt { font-size: .86rem; }
.application-review dd { font-size: .88rem; }
.cancellation-summary p { font-size: .86rem; }
.cancellation-summary a { font-size: .84rem; }
.secure-payment-note { font-size: .86rem; }

@media (max-width: 620px) {
  .registration-progress li > small { font-size: .76rem; }
  .form-check { font-size: .9rem; }
}

/* Final visual rhythm and interaction polish */
.faq-list details { transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease; }
.faq-list details[open] { border-color: rgba(7,62,131,.22); box-shadow: 0 10px 26px rgba(16,44,89,.08); }
.faq-list details[open] summary { color: var(--navy); }
@media (hover: hover) {
  .faq-list details:not([open]):hover { border-color: rgba(7,62,131,.2); background: #fbfdff; }
}

@media (max-width: 620px) {
  .hero-lead { font-size: 1rem; line-height: 1.75; }
  .price-heading h2 { font-size: 1.78rem; line-height: 1.42; letter-spacing: -.025em; }
  .price-heading > p:last-child { font-size: .9375rem; line-height: 1.8; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
}