:root{
  --slate: #52535B;
  --slate-mid: #7A7B84;
  --slate-deep: #1A1B1F;
  --panel: #232429;
  --cream: #F1ECE1;
  --red: #E51E2E;
}

@font-face{
  font-family: 'Oswald';
  src: url('../fonts/Oswald Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face{
  font-family: 'Nasalization';
  src: url('../fonts/Nasalization Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face{
  font-family: 'JetBrains Mono';
  src: url('../fonts/JetBrainsMono-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}
@font-face{
  font-family: 'Caflisch Script Pro';
  src: url('../fonts/Caflisch Script Pro Light.ttf') format('truetype');
  font-weight: 300;
  font-display: swap;
}

*{ box-sizing: border-box; }
html{ overflow-x:hidden; }
html,body{
  margin:0; padding:0;
  background: var(--slate-deep);
  color: var(--cream);
  font-family:'Oswald', sans-serif;
  scroll-behavior: smooth;
}
img{ max-width:100%; display:block; }
a{ color: inherit; }
section{ position:relative; scroll-margin-top: 72px; }

a:focus-visible, button:focus-visible, [tabindex]:focus-visible{
  outline: 2px solid var(--red); outline-offset: -2px; border-radius: 2px;
}

.js .reveal{ opacity:0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; }
.reveal.visible{ opacity:1; transform: translateY(0); }

@media (prefers-reduced-motion: reduce){
  html,body{ scroll-behavior:auto; }
  .js .reveal{ opacity:1; transform:none; transition:none; }
}

.site-nav{
  position: sticky; top:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding: 12px 24px;
  background: rgba(26,27,31,.85);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(241,236,225,.1);
}
.site-nav a.site-nav__brand{ opacity: 1; display:flex; align-items:center; }
.site-nav nav{ display:flex; gap: 20px; }
.site-nav a{
  font-family:'JetBrains Mono', monospace;
  font-size: 12px; letter-spacing:.08em; text-transform:uppercase;
  text-decoration:none; color: var(--cream); opacity:.7;
  transition: opacity .2s ease, color .2s ease;
}
.site-nav a:hover{ opacity:1; }
.site-nav a.active{ opacity:1; color: var(--red); }
@media (max-width: 640px){
  .site-nav nav{ gap:12px; }
  .site-nav a{ font-size:10px; }
}

.hero{
  min-height: 100vh;
  display:flex; align-items:center; justify-content:center; text-align:center;
  overflow:hidden;
}
.hero__bg{
  position:absolute; inset:0;
  background:
    linear-gradient(160deg, rgba(43,74,82,.55) 0%, rgba(26,27,31,.85) 70%)
    center/cover no-repeat,
    url('../graphics/hero-bg.jpg') center/cover no-repeat;
  filter: saturate(.75) brightness(.75);
  animation: hero-zoom 24s ease-in-out infinite alternate;
}
.hero__video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit: cover;
}
@keyframes hero-zoom{
  from{ transform: scale(1); }
  to{ transform: scale(1.08); }
}
.hero__overlay{
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(26,27,31,.35) 0%, rgba(26,27,31,.9) 92%);
}
.hero__content{ position:relative; z-index:2; padding: 0 24px; }
.hero__wordmark{ margin: 0 0 14px; }
.hero__wordmark-img{
  display:block;
  margin: 0 auto;
  width: clamp(200px, 85%, 640px);
  height: auto;
}
.hero__sub{
  font-family:'JetBrains Mono', monospace;
  font-size: clamp(11px, 1.4vw, 14px);
  letter-spacing:.08em; text-transform:uppercase;
  color: var(--cream); opacity:.8;
}
.hero__scroll{
  position:absolute; bottom: 24px; left:50%; transform: translateX(-50%);
  color: var(--cream); font-size: 20px; text-decoration:none;
  animation: hero-bounce 2s ease-in-out infinite;
}
@keyframes hero-bounce{
  0%,100%{ transform: translate(-50%, 0); }
  50%{ transform: translate(-50%, 8px); }
}
@media (prefers-reduced-motion: reduce){
  .hero__bg{ animation:none; }
  .hero__scroll{ animation:none; }
}

.about{ padding: 96px 24px; max-width: 960px; margin: 0 auto; text-align:center; }
.section-label{
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:.2em;
  text-transform:uppercase; color: var(--red); margin-bottom: 24px;
}
.crew{ display:flex; gap: 24px; justify-content:center; flex-wrap:wrap; margin-bottom: 32px; }
.crew__card{
  position:relative; overflow:hidden;
  background: var(--panel); border:1px solid rgba(241,236,225,.08); border-radius:12px;
  padding: 26px 24px 24px; width: 240px;
}
.crew__card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:0;
  border-top:2px dashed var(--red); opacity:.55;
}
.crew__id{
  display:flex; justify-content:space-between;
  font-family:'JetBrains Mono', monospace; font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color: var(--slate-mid); margin: 0 0 14px;
}
.crew__photo-wrap{ position:relative; width:78px; height:78px; margin: 0 auto 14px; }
.crew__photo-wrap::before{
  content:''; position:absolute; inset:-6px; border-radius:50%;
  border: 1px dashed rgba(241,236,225,.5);
}
.crew__photo{
  width:78px; height:78px; border-radius:50%;
  display:block; object-fit:cover;
  border: 1.5px solid var(--red);
}
.crew__card h3{ font-family:'Nasalization', sans-serif; margin: 0 0 8px; font-size:17px; }
.crew__role{
  display:inline-block; font-family:'JetBrains Mono', monospace; font-size:9.5px; letter-spacing:.15em;
  text-transform:uppercase; color: var(--slate-deep); background: var(--red);
  padding: 3px 10px; border-radius:3px; font-weight:700; margin: 0 0 14px;
}
.crew__bio{ font-family:'Oswald', sans-serif; font-weight:300; font-size:13.5px; line-height:1.6; color: var(--cream); opacity:.85; margin:0; }
.about__story{ font-family:'Oswald', sans-serif; font-weight:300; font-size: clamp(16px,2.2vw,20px); line-height:1.6; }
@media (max-width: 560px){
  .crew{ flex-direction:column; align-items:center; }
}

.videos{ padding: 96px 24px; max-width: 1100px; margin: 0 auto; text-align:center; }
.video-grid{
  display:grid; grid-template-columns: repeat(3, 1fr); gap:20px; text-align:left; margin-top:24px;
}
.video-card{ background: var(--panel); border-top:3px solid var(--red); border-radius:4px; overflow:hidden; }
.video-card__thumb{ position:relative; display:block; width:100%; padding:0; border:0; cursor:pointer; background:none; aspect-ratio:16/9; }
.video-card__thumb img{ width:100%; height:100%; object-fit:cover; }
.video-card__play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-size:28px; color:#fff; background: rgba(26,27,31,.3); transition: background .2s ease;
}
.video-card__thumb:hover .video-card__play{ background: rgba(229,30,46,.55); }
.video-card__iframe{ width:100%; aspect-ratio:16/9; border:0; }
.video-card__tag{ font-family:'JetBrains Mono', monospace; font-size:11px; color: var(--red); letter-spacing:.1em; margin: 12px 16px 4px; }
.video-card__title{ font-family:'Oswald', sans-serif; font-weight:400; font-size:14px; margin: 0 16px 16px; line-height:1.4; }
@media (max-width: 860px){ .video-grid{ grid-template-columns: repeat(2,1fr); } }
@media (max-width: 560px){ .video-grid{ grid-template-columns: 1fr; } }

.mission-hero{
  display:flex; gap:28px; align-items:center;
  padding-bottom:20px; margin-bottom:20px; border-bottom:1px dashed rgba(241,236,225,.15);
}
.mission-hero__patch{ flex-shrink:0; display:block; width:200px; height:200px; border-radius:50%; background: var(--slate-deep); }
.mission-hero__patch.status-active{ filter: drop-shadow(0 0 14px rgba(229,30,46,.5)); }
.mission-hero__info{ min-width:0; }
.mission-hero__num{
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color: var(--red); margin:0 0 6px;
}
.mission-hero__title{ font-family:'Oswald', sans-serif; font-weight:500; font-size:28px; color: var(--cream); margin:0 0 12px; line-height:1.15; }
.mission-hero__status-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.mission-hero__status{
  display:inline-flex; align-items:center; gap:6px;
  font-family:'JetBrains Mono', monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase;
  padding:5px 12px; border-radius:3px; font-weight:700;
}
.mission-hero__status.status-active{ background: var(--red); color: var(--slate-deep); }
.mission-hero__status.status-active .mission-dot{ background: var(--slate-deep); }
.mission-hero__status.status-complete{ color: var(--cream); border:1px solid rgba(241,236,225,.3); }
.mission-hero__status.status-locked{ color: var(--slate-mid); border:1px solid rgba(122,123,132,.4); }
.mission-hero__count{ font-family:'JetBrains Mono', monospace; font-size:11px; color: var(--slate-mid); }
.mission-hero__desc{ font-family:'Oswald', sans-serif; font-weight:300; font-size:15px; line-height:1.6; margin:0; max-width:560px; }
@media (max-width: 640px){
  .mission-hero{ flex-direction:column; text-align:center; }
  .mission-hero__patch{ width:150px; height:150px; }
  .mission-hero__status-row{ justify-content:center; }
  .mission-hero__desc{ max-width:none; }
}

.mission-grid-head{
  display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:10px;
  max-width:900px; margin:0 auto 16px;
}
.mission-grid-status{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color: var(--slate-mid); margin:0;
}
.mission-view-toggle{
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.1em; text-transform:uppercase;
  color: var(--slate-mid); text-decoration:none; border-bottom:1px dashed var(--slate-mid); padding-bottom:2px;
  transition: color .2s ease, border-color .2s ease; white-space:nowrap;
}
.mission-view-toggle:hover{ color: var(--cream); border-color: var(--cream); }

.mission-patches{
  --patch-size: 96px;
  display:flex; flex-wrap:wrap; gap:24px 20px; max-width:900px; margin:0 auto 40px;
}
.mission-patch-unit{ display:flex; flex-direction:column; align-items:center; gap:8px; width:var(--patch-size); cursor:pointer; text-align:center; }
.mission-patch-unit.is-locked{ cursor:default; }
.mission-patch-img{
  display:block; width:var(--patch-size); height:var(--patch-size);
  border-radius:50%; background: var(--slate-deep); transition: transform .15s ease;
}
.mission-patch-unit:not(.is-locked):hover .mission-patch-img{ transform: scale(1.05); }
.mission-patch-img.is-selected{ outline: 2px dashed var(--cream); outline-offset: 3px; }
.mission-patch-img.status-active{ filter: drop-shadow(0 0 8px rgba(229,30,46,.4)); }
.mission-patch-img.status-locked{ opacity:.85; }
.mission-patch-num{ font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:.1em; color: var(--red); }
.mission-patch-title{
  font-family:'Oswald', sans-serif; font-size:12px; line-height:1.25; color: var(--cream); opacity:.85;
}
@media (max-width: 560px){
  .mission-patches{ --patch-size: 76px; gap:18px 14px; }
  .mission-patch-title{ font-size:11px; }
}

.mission-dot{ width:5px; height:5px; border-radius:50%; background: var(--red); animation: mission-pulse 1.6s ease-in-out infinite; }
@keyframes mission-pulse{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } }
@media (prefers-reduced-motion: reduce){
  .mission-dot{ animation:none; }
}

.mission-briefing{
  max-width:900px; margin:0 auto; border:1px solid rgba(241,236,225,.12); border-radius:10px;
  padding:24px 28px; background: var(--panel); text-align:left; scroll-margin-top:72px;
}
.mission-briefing__head{
  display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px;
  font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase;
  color: var(--red); border-bottom:1px dashed rgba(241,236,225,.15); padding-bottom:10px; margin-bottom:14px;
}
.mission-briefing .video-grid{ margin-top:0; }
.mission-briefing__error{ font-family:'Oswald', sans-serif; text-align:center; padding:24px; }
.mission-briefing__error a{ color: var(--red); }

.video-card__duration{
  position:absolute; bottom:6px; right:6px; background:rgba(26,27,31,.85);
  color: var(--cream); font-family:'JetBrains Mono', monospace; font-size:10px; padding:2px 5px; border-radius:3px;
}
.video-card__ytlink{
  display:block; font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:.08em;
  text-transform:uppercase; color: var(--red); text-decoration:none; margin:0 16px 14px; opacity:.85;
}
.video-card__ytlink:hover{ opacity:1; }

@media (max-width: 560px){
  .mission-briefing{ padding:18px; }
}

.specs{ padding: 96px 24px; max-width: 720px; margin: 0 auto; text-align:center; }
.specs__card{
  position:relative; overflow:hidden;
  background: var(--panel); border:1px solid rgba(241,236,225,.08); border-radius:12px;
  padding: 28px 32px 32px; text-align:left;
}
.specs__card::before{
  content:''; position:absolute; top:0; left:0; right:0; height:0;
  border-top:2px dashed var(--red); opacity:.55;
}
.specs__id{
  display:flex; justify-content:space-between;
  font-family:'JetBrains Mono', monospace; font-size:9px; letter-spacing:.2em;
  text-transform:uppercase; color: var(--slate-mid); margin: 0 0 20px;
}
.specs__body{ display:flex; gap:24px; align-items:center; }
.specs__mark-wrap{ position:relative; width:64px; height:64px; flex-shrink:0; }
.specs__mark-wrap::before{
  content:''; position:absolute; inset:-8px; border-radius:50%;
  border: 1px dashed rgba(241,236,225,.4);
}
.specs__mark{ width:64px; height:64px; object-fit:contain; }
.specs__list{ display:grid; grid-template-columns: 1fr 1fr; gap: 10px 24px; margin:0; flex:1; }
.specs__list dt{ font-family:'JetBrains Mono', monospace; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color: var(--red); }
.specs__list dd{ margin:0; font-family:'Oswald', sans-serif; font-size:14px; display:flex; align-items:center; gap:6px; }
@media (max-width: 560px){
  .specs__body{ flex-direction:column; text-align:center; }
  .specs__list{ grid-template-columns: 1fr; text-align:center; }
  .specs__list dd{ justify-content:center; }
}

.route{ padding: 96px 24px; max-width: 1100px; margin: 0 auto; text-align:center; }
.route-map{ height: 420px; border-radius: 12px; overflow:hidden; margin-top:24px; border:1px solid rgba(241,236,225,.08); }
.route-pin span{
  display:block; width:14px; height:14px; border-radius:50%;
  background: var(--red); border:2px solid var(--cream); box-shadow: 0 0 0 2px rgba(229,30,46,.4);
}
.route-tooltip{
  font-family:'JetBrains Mono', monospace !important; font-size:11px !important;
  background: var(--panel) !important; color: var(--cream) !important; border: 1px solid var(--red) !important;
}
@media (max-width: 560px){ .route-map{ height: 320px; } }

.site-footer{ padding: 48px 24px 32px; text-align:center; border-top: 1px solid rgba(241,236,225,.08); }
.site-footer__row{
  display:flex; flex-wrap:wrap; gap:20px; align-items:center; justify-content:center; margin-bottom:16px;
}
.site-footer__contact{ font-family:'JetBrains Mono', monospace; font-size:13px; color: var(--red); text-decoration:none; }
.site-footer__sitemap{ display:flex; gap:16px; }
.site-footer__sitemap a{ font-family:'JetBrains Mono', monospace; font-size:11px; text-decoration:none; opacity:.7; }
.site-footer__social{ display:flex; gap:12px; }
.site-footer__social a{ font-family:'JetBrains Mono', monospace; font-size:11px; text-decoration:none; opacity:.7; }
.site-footer__copy{ font-family:'JetBrains Mono', monospace; font-size:11px; opacity:.5; margin:0; }
