:root {
  color-scheme:light;
  --navy:#071629;
  --ink:#102032;
  --cream:#f4f0e8;
  --red:#ec3342;
  --red-bright:#ff5262;
  --line-light:rgba(255,255,255,.25)
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth
}

body {
  margin:0;
  background:var(--navy);
  color:#fff;
  font-family:Inter,"Helvetica Neue",Arial,sans-serif
}

a {
  color:inherit
}

:focus-visible {
  outline:3px solid #ff8b78;
  outline-offset:4px
}

.skip-link {
  position:absolute;
  z-index:100;
  top:-100px;
  left:1rem;
  padding:.75rem 1rem;
  background:#fff;
  color:var(--ink)
}

.skip-link:focus {
  top:1rem
}

.page-shell {
  overflow:hidden
}

.site-header {
  position:absolute;
  z-index:10;
  top:0;
  left:0;
  width:100%;
  min-height:90px;
  display:flex;
  align-items:center;
  gap:2rem;
  padding:1.3rem clamp(1.25rem,4.2vw,5rem);
  border-bottom:1px solid var(--line-light)
}

.brand {
  display:inline-flex;
  align-items:center;
  gap:.72rem;
  text-decoration:none;
  font-size:1.24rem;
  font-weight:900;
  letter-spacing:-.045em;
  white-space:nowrap
}

.brand img {
  display:block;
  height:36px;
  width:auto
}

.brand-dot,.footer-brand span {
  color:var(--red-bright)
}

.site-nav {
  display:flex;
  align-items:center;
  gap:clamp(1rem,2.7vw,2.9rem);
  margin-left:auto
}

.site-nav a,.nav-action {
  text-decoration:none;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.03em
}

.site-nav a {
  opacity:.9
}

.site-nav a:hover {
  opacity:1;
  text-decoration:underline;
  text-underline-offset:.35rem
}

.nav-action {
  display:inline-flex;
  gap:1.3rem;
  align-items:center;
  padding:.85rem 1rem;
  border:1px solid rgba(255,255,255,.55);
  border-radius:4px;
  white-space:nowrap;
  transition:background .2s,color .2s
}

.nav-action:hover {
  color:var(--navy);
  background:#fff
}

.nav-action span {
  font-size:1.1rem
}

.hero {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  min-height:max(770px,100svh);
  padding:120px clamp(1.25rem,7.4vw,8.5rem) 105px;
  background:var(--navy)
}

.hero-art,.hero-grid {
  position:absolute;
  inset:0;
  z-index:-1
}

.hero-art {
  background-image:linear-gradient(90deg,rgba(5,17,32,.96) 0%,rgba(5,17,32,.85) 31%,rgba(5,17,32,.32) 63%,rgba(5,17,32,.12) 100%),linear-gradient(0deg,rgba(5,17,32,.79) 0%,transparent 28%,transparent 73%,rgba(5,17,32,.36) 100%),url('/assets/frontier-hero.webp');
  background-size:cover;
  background-position:center
}

.hero-grid {
  opacity:.14;
  background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);
  background-size:94px 94px;
  mask-image:linear-gradient(90deg,#000,transparent 85%)
}

.hero-content {
  position:relative;
  width:min(100%,980px);
  padding-top:2rem
}

.eyebrow {
  display:flex;
  align-items:center;
  gap:.85rem;
  margin:0 0 1.6rem;
  color:#c8d6e2;
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.2em;
  text-transform:uppercase
}

.hero-eyebrow {
  color:#f0e3dc
}

.signal-dot {
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--red-bright);
  box-shadow:0 0 0 5px rgba(255,82,98,.13),0 0 24px 5px rgba(255,82,98,.5)
}

h1,h2,p {
  margin-top:0
}

h1,h2 {
  font-family:Impact,"Arial Narrow","Helvetica Neue",Arial,sans-serif;
  font-weight:900;
  letter-spacing:-.018em;
  text-transform:uppercase
}

.hero h1 {
  margin:0;
  max-width:950px;
  font-size:clamp(4.2rem,8.2vw,9.3rem);
  line-height:.9;
  text-shadow:0 8px 40px rgba(0,0,0,.16)
}

h1 em,h2 em {
  color:var(--red-bright);
  font-style:normal
}

.hero-description {
  width:min(100%,560px);
  margin:2rem 0 2.3rem;
  color:#e0e6e8;
  font-size:clamp(1.06rem,1.55vw,1.27rem);
  line-height:1.65
}

.hero-actions {
  display:flex;
  align-items:center;
  gap:.85rem;
  flex-wrap:wrap
}

.button {
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
  min-height:58px;
  padding:.95rem 1.25rem;
  border-radius:4px;
  text-decoration:none;
  font-size:.87rem;
  font-weight:900;
  transition:transform .2s,background .2s,border-color .2s
}

.button:hover {
  transform:translateY(-3px)
}

.button span {
  font-size:1.25rem;
  line-height:1
}

.button-primary {
  background:var(--red);
  border:1px solid var(--red);
  color:#fff
}

.button-primary:hover {
  background:#ff4b5c
}

.button-outline {
  background:rgba(5,17,32,.24);
  border:1px solid rgba(255,255,255,.55);
  color:#fff
}

.button-outline:hover {
  background:rgba(255,255,255,.13);
  border-color:#fff
}

.hero-bottom {
  position:absolute;
  right:clamp(1.25rem,4.2vw,5rem);
  bottom:0;
  left:clamp(1.25rem,4.2vw,5rem);
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1.2rem 0;
  border-top:1px solid var(--line-light);
  color:#d9e0e2;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase
}

.hero-bottom i {
  display:inline-block;
  width:20px;
  height:1px;
  margin:0 .5rem .23rem;
  background:currentColor
}

.signal-band {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1.5rem;
  min-height:88px;
  padding:1.25rem clamp(1.25rem,4.2vw,5rem);
  background:var(--red);
  color:#fff;
  font-size:clamp(.68rem,1vw,.9rem);
  font-weight:900;
  letter-spacing:.12em;
  text-align:center
}

.signal-band span:nth-child(even) {
  font-size:1.5rem;
  line-height:1
}

.platform-section {
  padding:clamp(5rem,9vw,9rem) clamp(1.25rem,6vw,7rem);
  background:var(--cream);
  color:var(--ink)
}

.section-heading {
  display:grid;
  grid-template-columns:minmax(0,1.5fr) minmax(240px,.65fr);
  gap:1.6rem 4rem;
  align-items:end;
  max-width:1390px;
  margin:0 auto 3.5rem
}

.section-heading .eyebrow {
  grid-column:1/-1;
  margin-bottom:.1rem
}

.eyebrow-dark {
  color:#596575
}

.section-index {
  color:var(--red)
}

.section-heading h2 {
  margin:0;
  font-size:clamp(3.8rem,7vw,8rem);
  line-height:.94
}

.section-heading h2 span {
  color:#74808a
}

.section-heading>p:last-child {
  max-width:375px;
  margin:0 0 .35rem;
  color:#485766;
  font-size:1.05rem;
  line-height:1.7
}

.destination-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1rem;
  max-width:1390px;
  margin:0 auto
}

.destination-card {
  display:flex;
  flex-direction:column;
  min-height:390px;
  padding:clamp(1.25rem,2.6vw,2.4rem);
  border:1px solid rgba(16,32,50,.18);
  background:rgba(255,255,255,.45);
  color:var(--ink);
  text-decoration:none;
  transition:transform .25s,background .25s,border-color .25s,box-shadow .25s
}

.destination-card:hover {
  transform:translateY(-8px);
  border-color:rgba(236,51,66,.5);
  background:#fff;
  box-shadow:0 18px 45px rgba(16,32,50,.09)
}

.card-number {
  color:#76828d;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.16em
}

.card-icon {
  position:relative;
  display:block;
  width:68px;
  height:68px;
  margin:2.6rem 0 2rem;
  border:1px solid rgba(236,51,66,.22);
  border-radius:17px;
  background:#fff2ed
}

.card-icon i {
  position:absolute;
  display:block;
  background:var(--red)
}

.card-icon-app i {
  width:15px;
  height:15px;
  border-radius:3px
}

.card-icon-app i:nth-child(1) {
  top:17px;
  left:17px
}

.card-icon-app i:nth-child(2) {
  top:17px;
  right:17px;
  opacity:.5
}

.card-icon-app i:nth-child(3) {
  bottom:17px;
  left:17px;
  opacity:.5
}

.card-icon-app i:nth-child(4) {
  bottom:17px;
  right:17px
}

.card-icon-dash i {
  bottom:16px;
  width:9px;
  border-radius:3px 3px 0 0
}

.card-icon-dash i:nth-child(1) {
  left:18px;
  height:18px
}

.card-icon-dash i:nth-child(2) {
  left:30px;
  height:32px
}

.card-icon-dash i:nth-child(3) {
  left:42px;
  height:24px
}

.card-icon-download i:first-child {
  top:13px;
  left:29px;
  width:9px;
  height:28px;
  border-radius:3px
}

.card-icon-download i:first-child::after {
  position:absolute;
  top:16px;
  left:-7px;
  width:18px;
  height:18px;
  border-right:7px solid var(--red);
  border-bottom:7px solid var(--red);
  content:'';
  transform:rotate(45deg)
}

.card-icon-download i:last-child {
  bottom:13px;
  left:17px;
  width:33px;
  height:4px;
  border-radius:3px
}

.card-title {
  margin-bottom:.7rem;
  font-family:Impact,"Arial Narrow",Arial,sans-serif;
  font-size:clamp(1.7rem,2.4vw,2.4rem);
  line-height:1.1;
  text-transform:uppercase
}

.card-description {
  max-width:300px;
  color:#5b6874;
  font-size:.96rem;
  line-height:1.6
}

.card-link {
  display:flex;
  align-items:center;
  gap:.7rem;
  margin-top:auto;
  padding-top:2rem;
  color:#b22130;
  font-size:.82rem;
  font-weight:900
}

.card-link b {
  font-size:1.2rem
}

.mission-section {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  min-height:690px;
  padding:4.5rem clamp(1.25rem,6vw,7rem);
  background:radial-gradient(circle at 77% 52%,#1a3651 0%,#0b2035 32%,var(--navy) 69%)
}

.mission-copy {
  position:relative;
  z-index:1;
  max-width:700px
}

.mission-copy h2 {
  margin:0 0 1.6rem;
  font-size:clamp(3.9rem,6.3vw,7.5rem);
  line-height:.96
}

.mission-copy p:not(.eyebrow) {
  max-width:510px;
  color:#c8d5df;
  font-size:1.12rem;
  line-height:1.7
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:.8rem;
  margin-top:1.6rem;
  padding-bottom:.5rem;
  border-bottom:2px solid var(--red-bright);
  font-size:.9rem;
  font-weight:900;
  text-decoration:none
}

.text-link span {
  font-size:1.2rem
}

.orbit-art {
  position:relative;
  width:min(100%,540px);
  aspect-ratio:1;
  margin:0 auto
}

.orbit-ring {
  position:absolute;
  border:1px solid rgba(220,235,255,.22);
  border-radius:50%
}

.orbit-ring-outer {
  inset:1%
}

.orbit-ring-middle {
  inset:15%;
  border-style:dashed;
  transform:rotate(13deg)
}

.orbit-ring-inner {
  inset:29%;
  border-color:rgba(255,92,104,.5);
  box-shadow:0 0 40px rgba(255,92,104,.09)
}

.orbit-art::before,.orbit-art::after {
  position:absolute;
  top:50%;
  left:-5%;
  width:110%;
  height:1px;
  background:rgba(220,235,255,.13);
  content:''
}

.orbit-art::after {
  transform:rotate(90deg)
}

.orbit-core {
  position:absolute;
  inset:37%;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.35);
  border-radius:50%;
  background:radial-gradient(circle,#243a53,#0a1c30 72%);
  box-shadow:0 0 65px rgba(236,51,66,.22)
}

.orbit-core img {
  width:58%;
  height:auto
}

.orbit-point {
  position:absolute;
  z-index:1;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--red-bright);
  box-shadow:0 0 0 7px rgba(255,82,98,.14),0 0 24px var(--red-bright)
}

.orbit-point-a {
  top:15%;
  right:20%
}

.orbit-point-b {
  bottom:20%;
  left:10%;
  width:7px;
  height:7px;
  background:#d7e4ed;
  box-shadow:0 0 0 7px rgba(215,228,237,.1)
}

.orbit-coordinate {
  position:absolute;
  right:0;
  bottom:5%;
  color:#9fb3c5;
  font-size:.65rem;
  font-weight:800;
  letter-spacing:.2em
}

.closing-section {
  position:relative;
  padding:clamp(5rem,8vw,8rem) 1.25rem;
  overflow:hidden;
  background:var(--cream);
  color:var(--ink);
  text-align:center
}

.closing-section::before {
  position:absolute;
  top:12%;
  left:50%;
  width:min(120vw,1100px);
  aspect-ratio:1;
  border:1px solid rgba(16,32,50,.08);
  border-radius:50%;
  content:'';
  transform:translateX(-50%);
  box-shadow:0 0 0 130px rgba(16,32,50,.025),0 0 0 260px rgba(16,32,50,.02);
  pointer-events:none
}

.closing-section>* {
  position:relative
}

.closing-section .eyebrow {
  justify-content:center
}

.closing-section h2 {
  margin:0 auto 1.5rem;
  font-size:clamp(4.2rem,8vw,9rem);
  line-height:.94
}

.closing-section h2 em {
  color:var(--red)
}

.closing-section>p:not(.eyebrow) {
  color:#52606d;
  font-size:1.12rem
}

.button-dark {
  margin-top:1.1rem;
  background:var(--navy);
  color:#fff
}

.button-dark:hover {
  background:#1c3550
}

.site-footer {
  display:flex;
  align-items:center;
  gap:1.5rem;
  padding:2.3rem clamp(1.25rem,4.2vw,5rem);
  border-top:1px solid var(--line-light);
  color:#aebdcb;
  font-size:.8rem
}

.footer-brand {
  color:#fff;
  font-size:1.4rem;
  font-weight:900;
  letter-spacing:-.055em;
  text-decoration:none
}

.site-footer p {
  margin:0
}

.footer-links {
  display:flex;
  gap:1.5rem;
  margin-left:auto
}

.footer-links a {
  text-decoration:none
}

.footer-links a:hover {
  color:#fff;
  text-decoration:underline
}

@media(max-width:900px) {
  .site-header {
    flex-wrap:wrap;
    gap:.7rem 1.5rem
  }
  .site-nav {
    order:3;
    width:100%;
    justify-content:center;
    padding-top:.7rem;
    border-top:1px solid var(--line-light)
  }
  .nav-action {
    margin-left:auto
  }
  .hero {
    padding-top:175px
  }
  .hero-art {
    background-position:60% center
  }
  .section-heading {
    grid-template-columns:1fr
  }
  .section-heading>p:last-child {
    max-width:650px
  }
  .destination-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .destination-card:last-child {
    grid-column:1/-1;
    min-height:320px
  }
  .mission-section {
    grid-template-columns:1fr;
    padding-top:6rem
  }
  .orbit-art {
    margin:2rem auto -1rem
  }
  .site-footer {
    flex-wrap:wrap
  }
}

@media(max-width:600px) {
  .site-header {
    min-height:0;
    padding:1rem 1.1rem
  }
  .brand {
    font-size:1rem
  }
  .brand img {
    height:31px
  }
  .nav-action {
    gap:.4rem;
    padding:.65rem .7rem;
    font-size:.74rem
  }
  .site-nav {
    justify-content:space-between;
    gap:.4rem
  }
  .site-nav a {
    font-size:.73rem
  }
  .hero {
    min-height:790px;
    align-items:flex-start;
    padding:200px 1.25rem 100px
  }
  .hero-art {
    background-image:linear-gradient(180deg,rgba(5,17,32,.88) 0%,rgba(5,17,32,.72) 40%,rgba(5,17,32,.55) 68%,rgba(5,17,32,.92) 100%),url('/assets/frontier-hero.webp');
    background-position:66% center
  }
  .hero-grid {
    background-size:64px 64px
  }
  .hero h1 {
    font-size:clamp(3.35rem,13.8vw,5.9rem)
  }
  .hero-description {
    margin:1.7rem 0 2rem;
    font-size:1rem
  }
  .hero-actions {
    align-items:stretch
  }
  .hero-actions .button {
    width:100%
  }
  .hero-bottom {
    font-size:.58rem
  }
  .hero-bottom span:nth-child(2) {
    display:none
  }
  .signal-band {
    justify-content:center;
    min-height:70px
  }
  .signal-band span:nth-child(n+3) {
    display:none
  }
  .platform-section {
    padding:5rem 1.25rem
  }
  .section-heading {
    margin-bottom:2.4rem
  }
  .section-heading h2 {
    font-size:clamp(3.5rem,13vw,5rem)
  }
  .destination-grid {
    grid-template-columns:1fr
  }
  .destination-card,.destination-card:last-child {
    grid-column:auto;
    min-height:330px
  }
  .card-icon {
    margin:1.8rem 0 1.4rem
  }
  .mission-section {
    min-height:0;
    padding:5rem 1.25rem 4rem
  }
  .mission-copy h2 {
    font-size:clamp(3.5rem,12vw,5.6rem)
  }
  .orbit-art {
    width:min(100%,420px);
    margin-top:2.5rem
  }
  .closing-section h2 {
    font-size:clamp(3.7rem,13vw,6rem)
  }
  .site-footer {
    align-items:flex-start;
    flex-direction:column
  }
  .footer-links {
    margin-left:0
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .button,.destination-card,.nav-action {
    transition:none
  }
}