:root {
  --outdoor-blue: #1b63e8;
  --outdoor-sky: #19afe5;
  --outdoor-green: #23b97b;
  --outdoor-yellow: #ffd83f;
  --outdoor-pink: #f45d9d;
  --outdoor-coral: #ff6c55;
  --outdoor-ink: #172238;
  --outdoor-soft: #f5f9ff;
}

body.outdoor {
  --accent: var(--outdoor-blue);
  --accent-dark: #1548a9;
  --accent-soft: #eaf5ff;
  --yellow: var(--outdoor-yellow);
  --orange: var(--outdoor-coral);
  --soft: var(--outdoor-soft);
  color: var(--outdoor-ink);
  background: #fff;
}

.outdoor .header-inner { min-height: 88px; }
.outdoor .brand { width: 230px; flex: 0 0 auto; display: block; }
.outdoor .brand img { width: 100%; height: auto; }

.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;
}

.breadcrumb { padding: 13px 0; color: #64708a; font-size: 12px; }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.breadcrumb li + li::before { margin-right: 8px; color: #9aa5bb; content: "/"; }
.breadcrumb a { font-weight: 700; }

.outdoor-hero {
  position: relative;
  min-height: 660px;
  display: grid;
  align-items: center;
  overflow: hidden;
  background: #fff;
  color: var(--outdoor-ink);
}

.outdoor-hero::before,
.outdoor-hero::after {
  position: absolute;
  z-index: 0;
  content: "";
  border-radius: 999px;
  transform: rotate(-13deg);
}

.outdoor-hero::before {
  top: 38px;
  left: 24%;
  width: 300px;
  height: 28px;
  background: var(--outdoor-green);
}

.outdoor-hero::after {
  right: 3%;
  bottom: 42px;
  width: 110px;
  height: 28px;
  background: var(--outdoor-pink);
}

.outdoor-hero > img {
  position: absolute;
  top: 50%;
  right: 2.5%;
  width: min(45vw, 860px);
  height: auto;
  aspect-ratio: 1.52 / 1;
  border: 10px solid var(--outdoor-sky);
  border-radius: 50%;
  object-fit: cover;
  object-position: 63% center;
  box-shadow: 0 24px 60px rgba(27, 99, 232, .2);
  transform: translateY(-50%);
}

.outdoor-hero-shade { display: none; }

.outdoor-hero-copy {
  position: relative;
  z-index: 2;
  padding-block: 90px;
}

.outdoor-hero h1 {
  max-width: 650px;
  margin: 0;
  color: var(--outdoor-ink);
  font-size: 47px;
  line-height: 1.28;
  letter-spacing: -.025em;
}

.outdoor-hero h1 span,
.outdoor-hero h1 em { display: block; white-space: nowrap; }
.outdoor-hero h1 em { color: var(--outdoor-blue); font-style: normal; }
.outdoor-hero-copy > p { max-width: 560px; color: #3e4f68; font-size: 18px; font-weight: 700; }
.outdoor-hero .button { border-color: var(--outdoor-coral); background: var(--outdoor-coral); }
.outdoor-hero .button-sub { border-color: var(--outdoor-blue); background: #fff; color: var(--outdoor-blue); }

.hero-facts { display: flex; flex-wrap: wrap; gap: 10px; max-width: 610px; margin-top: 32px; }
.hero-facts span {
  min-width: 150px;
  padding: 13px 14px;
  border: 3px solid #e1e9f7;
  border-radius: 18px;
  background: #fff;
  color: #53627a;
  font-size: 12px;
  box-shadow: 0 10px 24px rgba(31, 79, 155, .08);
}
.hero-facts span:nth-child(1) { border-color: var(--outdoor-sky); }
.hero-facts span:nth-child(2) { border-color: var(--outdoor-green); }
.hero-facts span:nth-child(3) { border-color: var(--outdoor-yellow); }
.hero-facts b { display: block; color: var(--outdoor-blue); font-size: 15px; }

.answer-strip { background: linear-gradient(100deg, #edf8ff, #fff 48%, #fff8cc); }
.answer-grid { grid-template-columns: 1fr; gap: 24px; padding-block: 56px; }
.answer-copy { max-width: 840px; margin-inline: auto; text-align: center; }
.answer-grid h2 { color: var(--outdoor-blue); }
.answer-copy p { margin-top: 14px; font-size: 16px; line-height: 1.9; }
.satellite-note { margin-top: 18px; padding: 14px 18px; border: 2px solid var(--outdoor-sky); border-radius: 16px; background: #edf9ff; color: var(--outdoor-ink); line-height: 1.75; }
.answer-illustration { width: min(760px, 100%); margin: 0 auto; overflow: hidden; border-radius: 36px; }
.answer-illustration img { width: 100%; height: auto; }
.section-muted { background: #f7faff; }
.section-heading .kicker { color: var(--outdoor-blue); }
.speech { --speech-accent: var(--outdoor-sky); border: 3px solid var(--speech-accent); border-radius: 24px; box-shadow: 0 14px 34px rgba(28, 71, 143, .1); }
.speech::after { border-right-color: var(--speech-accent); border-bottom-color: var(--speech-accent); }
.speech:nth-child(2) { --speech-accent: var(--outdoor-pink); }
.speech:nth-child(3) { --speech-accent: var(--outdoor-green); }
.speech b { background: var(--outdoor-blue); }

.map-section {
  position: relative;
  overflow: hidden;
  background: #fff;
}

.map-section::before {
  position: absolute;
  top: 20px;
  right: -80px;
  width: 260px;
  height: 48px;
  border-radius: 999px;
  background: var(--outdoor-yellow);
  content: "";
  transform: rotate(-12deg);
}

.outdoor-map {
  position: relative;
  margin: 26px 0 0;
  border: 8px solid #fff;
  border-radius: 42px;
  background: #eff9ff;
  box-shadow: 0 22px 60px rgba(27, 99, 232, .16);
  overflow: hidden;
}

.outdoor-map > img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.map-label {
  position: absolute;
  z-index: 2;
  min-width: 140px;
  padding: 11px 16px;
  border: 4px solid #fff;
  border-radius: 999px;
  background: var(--outdoor-blue);
  color: #fff;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.35;
  text-align: center;
  box-shadow: 0 9px 24px rgba(20, 62, 130, .2);
}
.map-label b { display: block; color: #fff; }
.map-label::after {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  z-index: 8;
  width: 250px;
  padding: 12px 14px;
  border-radius: 12px;
  background: rgba(23, 34, 56, .96);
  color: #fff;
  content: attr(data-tip);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.65;
  text-align: left;
  box-shadow: 0 12px 30px rgba(23, 34, 56, .24);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -4px);
  transition: opacity .18s ease, transform .18s ease;
}
.map-label:hover::after,
.map-label:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
.map-gate::after,
.map-shop::after { top: auto; bottom: calc(100% + 10px); }
.map-stage { top: 8%; left: 46%; background: var(--outdoor-blue); }
.map-gate { bottom: 17%; left: 6%; background: var(--outdoor-sky); }
.map-shop { right: 7%; bottom: 27%; background: var(--outdoor-pink); }
.map-hq { top: 15%; right: 7%; background: var(--outdoor-green); }

.planning-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 20px; }
.planning-grid article {
  padding: 20px;
  border: 3px solid var(--outdoor-blue);
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(28, 71, 143, .09);
}
.planning-grid article:nth-child(2) { border-color: var(--outdoor-green); }
.planning-grid article:nth-child(3) { border-color: var(--outdoor-pink); }
.planning-grid article:nth-child(4) { border-color: var(--outdoor-yellow); }
.planning-grid b, .planning-grid span { display: block; }
.planning-grid b { color: var(--outdoor-blue); font-size: 18px; }
.planning-grid span { margin-top: 6px; color: #5d6b82; font-size: 13px; }

.outdoor-device {
  position: relative;
  width: min(100%, 480px);
  min-height: 0;
  aspect-ratio: 1 / 1;
  padding: 46px;
  display: grid;
  place-items: center;
  justify-self: center;
  border: 8px solid #fff;
  border-radius: 50%;
  background: var(--outdoor-yellow);
  color: var(--outdoor-ink);
  text-align: center;
  box-shadow: 0 18px 46px rgba(27, 99, 232, .13);
}
.outdoor-device img { width: min(100%, 350px); border-radius: 0; filter: drop-shadow(0 14px 13px rgba(0,0,0,.16)); }
.outdoor-device > div { display: flex; gap: 8px; }
.outdoor-device span { padding: 6px 11px; border-radius: 999px; background: var(--outdoor-blue); color: #fff; font-size: 11px; font-weight: 900; }
.outdoor-device strong { color: var(--outdoor-ink); font-size: 19px; }
.text-link { display: inline-block; margin-top: 18px; color: var(--outdoor-blue); font-weight: 900; }

.outdoor #plans .plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.plan { border: 3px solid var(--outdoor-sky); border-radius: 24px; box-shadow: 0 14px 34px rgba(28, 71, 143, .1); }
.plan:nth-child(2) { border-color: var(--outdoor-pink); }
.plan:nth-child(3) { border-color: var(--outdoor-green); }
.plan-conditions { grid-column: 1 / -1; }
.plan-spec { display: block; min-height: 46px; color: #65738a; font-size: 12px; font-weight: 700; }
.price-route { margin-top: 24px; padding: 18px 20px; border: 0; border-radius: 18px; background: #fff5c3; }
.price-route a { color: var(--outdoor-blue); font-weight: 900; }

.outdoor .contact-form button[disabled] { cursor: wait; opacity: .65; }
.outdoor .form-status { margin: 14px 0 18px; padding: 12px 14px; border-radius: 8px; font-size: 13px; font-weight: 800; text-align: center; }
.outdoor .form-status.is-success { border: 1px solid #8bc6a3; background: #eaf8ef; color: #176537; }
.outdoor .form-status.is-error { border: 1px solid #ef9aaa; background: #fff0f3; color: #9f1730; }

.detail-links { background: linear-gradient(180deg, #fff, #f3f8ff); }
.outdoor-card-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.outdoor-card-grid a {
  min-height: 180px;
  padding: 22px 18px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border-radius: 35% 25% 30% 20%;
  background: var(--outdoor-blue);
  color: #fff;
  text-decoration: none;
  box-shadow: 0 12px 28px rgba(27, 99, 232, .18);
}
.outdoor-card-grid a:nth-child(2) { background: var(--outdoor-pink); }
.outdoor-card-grid a:nth-child(3) { background: var(--outdoor-green); }
.outdoor-card-grid a:nth-child(4) { background: var(--outdoor-sky); }
.outdoor-card-grid a:nth-child(5) { background: #f3b500; color: #302600; }
.outdoor-card-grid i {
  align-self: center;
  width: 72px;
  margin-bottom: auto;
  color: inherit;
  font-size: 44px;
  line-height: 1;
  text-align: center;
  filter: drop-shadow(0 5px 10px rgba(0,0,0,.12));
}
.outdoor-card-grid b { color: inherit; font-size: 17px; }
.outdoor-card-grid span { margin-top: 8px; font-size: 12px; }
.column-links { display: flex; flex-wrap: wrap; gap: 10px 18px; margin-top: 24px; padding: 18px 20px; border: 1px solid #dce6f6; border-radius: 18px; background: #fff; }
.column-links a { color: var(--outdoor-blue); font-size: 13px; font-weight: 800; }

.outdoor .faq-section,
.outdoor #faq { background: #fff8cc; }
.outdoor .faq { grid-template-columns: 1fr; gap: 24px; }
.outdoor .contact { background: linear-gradient(135deg, #1d62df, #13aada); }
.outdoor .contact .kicker { color: #fff5a9; }

@media (max-width: 960px) {
  .outdoor-hero { min-height: 650px; }
  .outdoor-hero > img { right: -5%; width: min(49vw, 670px); }
  .outdoor-hero h1 { max-width: 560px; font-size: 40px; }
  .planning-grid { grid-template-columns: repeat(2, 1fr); }
  .outdoor-card-grid { grid-template-columns: repeat(2, 1fr); }
  .outdoor-card-grid a:last-child { grid-column: 1 / -1; min-height: 130px; border-radius: 28px; }
}

@media (max-width: 680px) {
  .outdoor .header-inner { min-height: 72px; }
  .outdoor .brand { width: 178px; }
  .outdoor-hero { min-height: 830px; align-items: end; }
  .outdoor-hero::before { top: 18px; left: -20px; width: 180px; height: 18px; }
  .outdoor-hero::after { right: -30px; bottom: 300px; }
  .outdoor-hero > img { top: 28px; right: auto; left: 50%; width: min(calc(100% - 32px), 360px); height: auto; aspect-ratio: 1 / 1; border-width: 7px; border-radius: 50%; object-position: 60% center; transform: translateX(-50%); }
  .outdoor-hero-shade { display: none; }
  .outdoor-hero-copy { padding-block: 418px 40px; }
  .outdoor-hero h1 { font-size: clamp(23px, 6.5vw, 27px); line-height: 1.36; letter-spacing: -.035em; }
  .outdoor-hero-copy > p { font-size: 15px; }
  .hero-facts { display: grid; grid-template-columns: 1fr 1fr; }
  .hero-facts span:last-child { grid-column: 1 / -1; }
  .answer-grid { padding-block: 44px; }
  .answer-copy { text-align: left; }
  .answer-copy p { font-size: 15px; }
  .answer-illustration { border-radius: 24px; }
  .outdoor-map { border-width: 4px; border-radius: 24px; }
  .outdoor-map > img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center; }
  .map-label { min-width: 104px; padding: 7px 9px; border-width: 2px; font-size: 10px; }
  .map-label::after { width: min(210px, 70vw); font-size: 11px; }
  .map-stage { top: 7%; left: 35%; }
  .map-gate { bottom: 14%; left: 2%; }
  .map-shop { right: 1%; bottom: 24%; }
  .map-hq { top: 18%; right: 2%; }
  .planning-grid, .outdoor-card-grid { grid-template-columns: 1fr; }
  .outdoor #plans .plan-grid { grid-template-columns: 1fr; }
  .plan-conditions { grid-column: auto; }
  .outdoor-card-grid a, .outdoor-card-grid a:last-child { grid-column: auto; min-height: 130px; border-radius: 28px; }
  .outdoor-device { width: min(100%, 360px); min-height: 0; padding: 32px; }
}

@media (max-width: 360px) {
  .outdoor-hero h1 { font-size: 21px; }
}