.sky-animation{
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  touch-action:manipulation;
}
.sky-animation .stars,
.sky-animation .earth-horizon{pointer-events:none;}

.sky-animation .satellite{
  position:absolute;
  z-index:3;
  width:clamp(24px,3.2vw,44px);
  height:clamp(18px,2.35vw,32px);
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
  pointer-events:auto;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  outline:none;
  animation:cleanSatDrift var(--drift-speed,34s) linear infinite;
  animation-delay:var(--drift-delay,0s);
  will-change:left, top;
}
.sky-animation .satellite:focus-visible{
  outline:2px solid rgba(126,231,255,.82);
  outline-offset:8px;
  border-radius:999px;
}

/* Remove any older satellite trail/streak styling from assets/style.css.
   Satellites are in space, so only meteors should have visible trails. */
.sky-animation > .satellite::before,
.sky-animation > .satellite::after{
  content:none!important;
  display:none!important;
  background:none!important;
  box-shadow:none!important;
  border:0!important;
}

/* Satellite movement is on the outer element. Hover does NOT move position. */
.sky-animation .satellite .body{
  position:absolute;
  left:50%;
  top:50%;
  width:38%;
  height:44%;
  transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));
  transform-origin:center;
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
  filter:drop-shadow(0 0 5px rgba(125,210,255,.22));
  transition:filter .45s ease, brightness .45s ease;
  will-change:transform, filter;
}
.sky-animation .satellite .body::before,
.sky-animation .satellite .body::after{
  content:"";
  position:absolute;
  display:block;
}

/* Hover is deliberately only a soft glint — no translate/position change. */
.sky-animation .satellite:hover .body,
.sky-animation .satellite.is-hovered .body{
  filter:drop-shadow(0 0 9px rgba(190,235,255,.42)) brightness(1.12);
}

/* Original/simple home-page satellite */
.sky-animation .satellite.sat-type-original .body,
.sky-animation .satellite.sat-type-classic .body{
  border-radius:5px;
  background:linear-gradient(135deg,#f5fbff,#91a0b1 54%,#263446);
  box-shadow:0 0 0 1px rgba(255,255,255,.34) inset,0 0 6px rgba(126,231,255,.14);
}
.sky-animation .satellite.sat-type-original .body::before,
.sky-animation .satellite.sat-type-original .body::after,
.sky-animation .satellite.sat-type-classic .body::before,
.sky-animation .satellite.sat-type-classic .body::after{
  top:22%;
  width:66%;
  height:56%;
  border-radius:3px;
  background:linear-gradient(180deg,#80d8ff,#174b73 72%,#102f4a);
  box-shadow:0 0 0 1px rgba(185,232,255,.36) inset;
}
.sky-animation .satellite.sat-type-original .body::before,
.sky-animation .satellite.sat-type-classic .body::before{right:108%;}
.sky-animation .satellite.sat-type-original .body::after,
.sky-animation .satellite.sat-type-classic .body::after{left:108%;}

/* Broader solar panel satellite */
.sky-animation .satellite.sat-type-panel .body{
  width:34%;
  height:42%;
  border-radius:6px;
  background:linear-gradient(135deg,#e7f3ff,#708297 55%,#263244);
  box-shadow:0 0 0 1px rgba(255,255,255,.34) inset;
}
.sky-animation .satellite.sat-type-panel .body::before,
.sky-animation .satellite.sat-type-panel .body::after{
  top:16%;
  width:78%;
  height:68%;
  border-radius:3px;
  background:repeating-linear-gradient(90deg,#79cff3 0 3px,#1a507a 3px 6px);
  box-shadow:0 0 0 1px rgba(185,232,255,.38) inset;
}
.sky-animation .satellite.sat-type-panel .body::before{right:116%;}
.sky-animation .satellite.sat-type-panel .body::after{left:116%;}

/* CubeSat */
.sky-animation .satellite.sat-type-cubesat .body{
  width:42%;
  height:58%;
  border-radius:7px;
  background:linear-gradient(145deg,#f4f8ff,#718397 60%,#293646);
  box-shadow:0 0 0 1px rgba(255,255,255,.34) inset;
}
.sky-animation .satellite.sat-type-cubesat .body::before{
  left:-52%;top:14%;width:44%;height:72%;border-radius:3px;
  background:linear-gradient(180deg,#75d9ff,#164a78);
}
.sky-animation .satellite.sat-type-cubesat .body::after{
  right:-42%;top:39%;width:36%;height:9%;border-radius:999px;
  background:#dceeff;
  box-shadow:12px 0 0 rgba(220,238,255,.65);
}

/* Probe / dish */
.sky-animation .satellite.sat-type-probe .body{
  width:40%;
  height:36%;
  border-radius:999px 999px 45% 45%;
  background:radial-gradient(circle at 50% 25%,#ffffff,#8796a8 58%,#354253 100%);
}
.sky-animation .satellite.sat-type-probe .body::before{
  left:-42%;top:28%;width:44%;height:48%;border-radius:50%;
  border:2px solid rgba(230,245,255,.88);
  border-right-color:transparent;
  transform:rotate(18deg);
}
.sky-animation .satellite.sat-type-probe .body::after{
  right:-74%;top:45%;width:72%;height:5px;border-radius:999px;
  background:linear-gradient(90deg,#eaf6ff,rgba(234,246,255,.1));
}

/* Telescope style */
.sky-animation .satellite.sat-type-telescope .body{
  width:60%;
  height:36%;
  border-radius:12px;
  background:linear-gradient(90deg,#243042,#cdd9e8 30%,#74859a 70%,#1e2b3c);
}
.sky-animation .satellite.sat-type-telescope .body::before{
  right:-20%;top:8%;width:30%;height:84%;border-radius:50%;
  background:radial-gradient(circle,#111b28 0 42%,#d9e7f5 44% 70%,transparent 72%);
}
.sky-animation .satellite.sat-type-telescope .body::after{
  left:-30%;top:42%;width:36%;height:8%;border-radius:999px;
  background:#dceeff;
}

/* Relay/antenna style */
.sky-animation .satellite.sat-type-relay .body{
  width:34%;
  height:48%;
  border-radius:50%;
  background:linear-gradient(135deg,#eef7ff,#68788b 60%,#202b3a);
}
.sky-animation .satellite.sat-type-relay .body::before,
.sky-animation .satellite.sat-type-relay .body::after{
  top:20%;width:54%;height:60%;border-radius:50%;
  border:2px solid rgba(126,231,255,.82);
}
.sky-animation .satellite.sat-type-relay .body::before{left:-62%;border-left-color:transparent;transform:rotate(-12deg);}
.sky-animation .satellite.sat-type-relay .body::after{right:-62%;border-right-color:transparent;transform:rotate(12deg);}

/* Movement-only click/tap actions. These never set opacity or position. */
.sky-animation .satellite.action-loop .body{animation:clickLoop 3.8s cubic-bezier(.36,.04,.16,1) both;}
.sky-animation .satellite.action-swoop .body{animation:clickSwoop 3.6s cubic-bezier(.32,.04,.18,1) both;}
.sky-animation .satellite.action-spin .body{animation:clickSpinDrift 3.7s cubic-bezier(.34,.04,.18,1) both;}
.sky-animation .satellite.action-height .body{animation:clickHeightGlide 3.9s cubic-bezier(.32,.04,.18,1) both;}
.sky-animation .satellite.action-dip .body{animation:clickEarthDip 3.8s cubic-bezier(.32,.04,.18,1) both;}

@keyframes cleanSatDrift{
  0%{left:var(--x0);top:var(--y0);}
  50%{top:calc(var(--y0) + var(--wave));}
  100%{left:var(--x1);top:var(--y0);}
}
@keyframes clickLoop{
  0%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
  28%{transform:translate(calc(-50% + 12px),calc(-50% - 16px)) rotate(calc(var(--sat-rot,0deg) + 90deg));}
  55%{transform:translate(calc(-50% - 2px),calc(-50% - 26px)) rotate(calc(var(--sat-rot,0deg) + 195deg));}
  82%{transform:translate(calc(-50% - 13px),calc(-50% - 8px)) rotate(calc(var(--sat-rot,0deg) + 305deg));}
  100%{transform:translate(-50%,-50%) rotate(calc(var(--sat-rot,0deg) + 360deg));}
}
@keyframes clickSwoop{
  0%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
  38%{transform:translate(calc(-50% + 24px),calc(-50% - 12px)) rotate(calc(var(--sat-rot,0deg) + 5deg));}
  72%{transform:translate(calc(-50% + 9px),calc(-50% + 8px)) rotate(calc(var(--sat-rot,0deg) - 3deg));}
  100%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
}
@keyframes clickSpinDrift{
  0%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
  50%{transform:translate(calc(-50% + 16px),calc(-50% - 8px)) rotate(calc(var(--sat-rot,0deg) + 190deg));}
  100%{transform:translate(-50%,-50%) rotate(calc(var(--sat-rot,0deg) + 360deg));}
}
@keyframes clickHeightGlide{
  0%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
  44%{transform:translate(calc(-50% + 6px),calc(-50% + var(--lift))) rotate(calc(var(--sat-rot,0deg) + 2deg));}
  74%{transform:translate(calc(-50% - 6px),calc(-50% + var(--lift) + 6px)) rotate(calc(var(--sat-rot,0deg) - 2deg));}
  100%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
}
@keyframes clickEarthDip{
  0%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
  42%{transform:translate(calc(-50% + 7px),calc(-50% + 27px)) rotate(calc(var(--sat-rot,0deg) + 5deg));}
  72%{transform:translate(calc(-50% - 5px),calc(-50% + 12px)) rotate(calc(var(--sat-rot,0deg) - 2deg));}
  100%{transform:translate(-50%,-50%) rotate(var(--sat-rot,0deg));}
}

/* Slower meteors. They travel in from space, but only visibly burn very low near the Earth horizon/atmosphere. */
.sky-animation .meteor{
  position:absolute;
  z-index:2;
  left:0;
  top:0;
  width:clamp(95px,15vw,210px);
  height:clamp(2px,.36vw,5px);
  border-radius:999px;
  opacity:0;
  pointer-events:none!important;
  transform:translate3d(var(--mx0),var(--my0),0) rotate(var(--meteor-rot));
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,134,48,.18) 26%,rgba(255,188,86,.55) 62%,#fff4d4 86%,#ffffff 98%);
  box-shadow:0 0 10px rgba(255,145,48,.35),0 0 26px rgba(255,80,30,.18);
  animation:meteorBurn var(--meteor-speed,5.6s) cubic-bezier(.2,.06,.52,1) forwards;
}
.sky-animation .meteor::before{
  content:"";
  position:absolute;
  right:18%;
  top:50%;
  width:3px;
  height:3px;
  border-radius:50%;
  transform:translateY(-50%);
  background:rgba(255,228,170,.75);
  box-shadow:-18px 7px 0 rgba(255,149,66,.32),-36px -5px 0 rgba(255,210,130,.22),-58px 4px 0 rgba(255,120,40,.16);
}
.sky-animation .meteor::after{
  content:"";
  position:absolute;
  right:-5px;
  top:50%;
  width:clamp(8px,1.3vw,15px);
  height:clamp(8px,1.3vw,15px);
  border-radius:50%;
  transform:translateY(-50%);
  background:radial-gradient(circle,#fff 0 16%,#ffe3a8 28%,#ff7b32 55%,rgba(255,107,43,0) 74%);
}
@keyframes meteorBurn{
  /* In space: still travelling, but not glowing yet. */
  0%{opacity:0;transform:translate3d(var(--mx0),var(--my0),0) rotate(var(--meteor-rot)) scale(.72);filter:brightness(.8);}
  74%{opacity:0;transform:translate3d(var(--mxMid),var(--myMid),0) rotate(var(--meteor-rot)) scale(.78);filter:brightness(.85);}
  /* Low atmosphere entry: burn-up starts very close to the Earth horizon. */
  82%{opacity:.82;filter:brightness(1.08);}
  92%{opacity:.96;filter:brightness(1.2);}
  100%{opacity:0;transform:translate3d(var(--mx1),var(--my1),0) rotate(var(--meteor-rot)) scale(.42);filter:brightness(.75);}
}

@media (max-width:720px){
  .sky-animation .satellite{
    width:clamp(24px,7vw,36px);
    height:clamp(18px,5.4vw,27px);
  }
}
@media (hover:none){
  .sky-animation .satellite:hover .body{filter:drop-shadow(0 0 5px rgba(125,210,255,.22));}
}
@media (prefers-reduced-motion:reduce){
  .sky-animation .satellite,
  .sky-animation .satellite .body,
  .sky-animation .meteor{
    animation:none!important;
    transition:none!important;
  }
  .sky-animation .meteor{display:none;}
}

/* Optional space animations toggle.
   Default is clean/serious: animated satellites, meteors and the large ISS graphic are hidden. */
body:not(.space-animations-on) .sky-animation .satellite,
body:not(.space-animations-on) .sky-animation .meteor,
body:not(.space-animations-on) .iss-display{
  display:none!important;
}

.space-animations-toggle{
  border:1px solid rgba(126,231,255,.26);
  background:rgba(7,20,34,.42);
  color:rgba(234,246,255,.78);
  border-radius:999px;
  padding:.38rem .66rem;
  font:inherit;
  font-size:.78rem;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  backdrop-filter:blur(8px);
  transition:border-color .2s ease, background .2s ease, color .2s ease, transform .2s ease;
}
.space-animations-toggle:hover,
.space-animations-toggle:focus-visible{
  border-color:rgba(126,231,255,.56);
  background:rgba(20,48,76,.62);
  color:#eaf6ff;
  outline:none;
}
.space-animations-toggle[aria-pressed="true"]{
  border-color:rgba(126,231,255,.72);
  background:rgba(34,84,124,.70);
  color:#ffffff;
}
.space-animations-toggle:active{transform:translateY(1px);}

.space-animations-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  margin-top:.72rem;
}

@media (max-width:720px){
  .brand-row{
    gap:.65rem;
  }
  .space-animations-toggle{
    font-size:.74rem;
    padding:.36rem .58rem;
  }
}


/* SpaceOpsLab theme toggle + light mode */
:root{
  --border: rgba(126,231,255,0.26);
}
body[data-theme="dark"]{
  color-scheme: dark;
}
body[data-theme="light"]{
  color-scheme: light;
  --border: rgba(33,53,87,0.20);
  color:#142033;
}

.hero-card{
  position:relative;
}
.hero-theme-toggle{
  position:absolute;
  top:1rem;
  right:1rem;
  z-index:8;
}
.theme-toggle {
  display: inline-flex;
  align-items: center;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: rgba(11,20,40,0.80);
  cursor: pointer;
}

.toggle-track {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 58px;
  height: 30px;
  padding: 0 7px;
  border-radius: 999px;
  background: rgba(5,10,22,0.65);
}

.toggle-icon {
  position: relative;
  z-index: 1;
  font-size: 0.83rem;
}

.toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: linear-gradient(180deg, #ffffff, #d9e8ff);
  box-shadow: 0 4px 12px rgba(0,0,0,0.26);
  transition: transform 180ms ease;
}

body[data-theme="light"] .toggle-thumb {
  transform: translateX(28px);
  background: linear-gradient(180deg, #fff6c7, #ffd166);
}

body[data-theme="light"] .theme-toggle{
  background:rgba(255,255,255,0.74);
  border-color:rgba(24,45,78,0.20);
  box-shadow:0 10px 24px rgba(31,56,92,0.12);
}
body[data-theme="light"] .toggle-track{
  background:rgba(214,230,249,0.86);
}
/* Keep the space background looking like SpaceOpsLab in light mode.
   Only the content panels become light; the sky itself is not washed out. */
body[data-theme="light"] .sky-animation{
  background:transparent;
}
body[data-theme="light"] .stars{
  opacity:.72;
  filter:none;
}
body[data-theme="light"] .earth-horizon{
  opacity:.88;
  filter:none;
}
body[data-theme="light"] .card{
  background:rgba(255,255,255,0.78)!important;
  border-color:rgba(37,60,96,0.16)!important;
  box-shadow:0 18px 50px rgba(33,56,91,0.14)!important;
  color:#142033;
}
body[data-theme="light"] .eyebrow,
body[data-theme="light"] .tagline,
body[data-theme="light"] .section-title h2,
body[data-theme="light"] h2,
body[data-theme="light"] h3{
  color:#142033!important;
}
body[data-theme="light"] .tagline,
body[data-theme="light"] small,
body[data-theme="light"] .site-footer,
body[data-theme="light"] .site-footer a{
  color:#41536d!important;
}
body[data-theme="light"] .btn-primary{
  color:#082037!important;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(214,235,255,.86))!important;
  border-color:rgba(31,97,146,.28)!important;
  box-shadow:0 12px 28px rgba(49,89,132,.14)!important;
}
body[data-theme="light"] .btn-primary:hover,
body[data-theme="light"] .btn-primary:focus-visible{
  background:linear-gradient(180deg,#ffffff,#d7ecff)!important;
  border-color:rgba(31,97,146,.42)!important;
}
body[data-theme="light"] .link{
  color:#102641!important;
  background:rgba(234,243,255,.72)!important;
  border-color:rgba(31,73,118,.14)!important;
}
body[data-theme="light"] .link:hover,
body[data-theme="light"] .link:focus-visible{
  background:rgba(218,237,255,.95)!important;
  border-color:rgba(31,97,146,.32)!important;
}
body[data-theme="light"] .space-animations-toggle{
  color:#253b56;
  background:rgba(255,255,255,.72);
  border-color:rgba(31,73,118,.20);
}
body[data-theme="light"] .space-animations-toggle:hover,
body[data-theme="light"] .space-animations-toggle:focus-visible,
body[data-theme="light"] .space-animations-toggle[aria-pressed="true"]{
  color:#102641;
  background:rgba(219,238,255,.92);
  border-color:rgba(31,97,146,.34);
}


/* Make the SpaceOpsLab brand mark behave like a normal homepage logo link. */
.brand-home{
  display:inline-flex;
  align-items:center;
  width:fit-content;
  color:inherit;
  text-decoration:none;
  border-radius:14px;
}
.brand-home .eyebrow{
  margin-bottom:12px;
}
.brand-home:hover,
.brand-home:focus-visible{
  text-decoration:none;
  outline:none;
}
.brand-home:focus-visible{
  box-shadow:0 0 0 3px rgba(126,231,135,.28);
}

/* Light-mode header readability fixes.
   No boxes, no padding, no margin changes: colour/contrast only so the hero height does not shift. */
body[data-theme="light"] .brand-row{
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body[data-theme="light"] .eyebrow{
  color:inherit!important;
  filter:saturate(1.08) contrast(1.04);
}
body[data-theme="light"] .brand-space,
body[data-theme="light"] .brand-lab{
  color:#1f9b57!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.78),
    0 0 10px rgba(7,18,34,.14),
    0 5px 14px rgba(7,18,34,.12);
}
body[data-theme="light"] .brand-ops{
  color:#1778b3!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.78),
    0 0 10px rgba(7,18,34,.14),
    0 5px 14px rgba(7,18,34,.12);
}
body[data-theme="light"] .tagline{
  color:#263a54!important;
  font-weight:700;
  text-shadow:0 1px 0 rgba(255,255,255,.62);
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  margin-top:inherit;
}
body[data-theme="light"] .orbit-logo{
  filter:drop-shadow(0 2px 5px rgba(7,18,34,.18));
}
body[data-theme="light"] .orbit-logo .orbit-ring{
  stroke:#219452;
}
body[data-theme="light"] .orbit-logo .orbit-link{
  stroke:#1e83bd;
}
/* Light-mode section label and footer fixes */
body[data-theme="light"] .section-title{
  margin-top:inherit;
}
body[data-theme="light"] .section-title h2{
  display:inline-flex;
  align-items:center;
  padding:.42rem .72rem;
  border:1px solid rgba(126,231,255,.20);
  border-radius:999px;
  color:#f4fbff!important;
  background:linear-gradient(180deg,rgba(7,18,34,.86),rgba(7,18,34,.64));
  box-shadow:0 12px 28px rgba(4,12,24,.18);
  text-shadow:0 1px 8px rgba(0,0,0,.42);
}
body[data-theme="light"] .site-footer{
  position:relative;
  z-index:6;
  width:fit-content;
  max-width:calc(100% - 2rem);
  margin:.75rem auto .45rem;
  padding:.24rem .55rem;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  color:#eaf6ff!important;
  background:rgba(7,18,34,.42);
  box-shadow:none;
  backdrop-filter:blur(6px);
}
body[data-theme="light"] .site-footer a{
  color:#ffffff!important;
}
body[data-theme="light"] .site-footer span{
  color:#d8e9ff!important;
}

/* Dark-mode borders: keep the original softer panel look.
   Panels stay subtle by default, then lift slightly on hover/focus. */
body[data-theme="dark"] .card,
body[data-theme="dark"] .resource-card{
  border-color:rgba(126,231,255,0.075)!important;
}

body[data-theme="dark"] .card:hover,
body[data-theme="dark"] .resource-card:hover{
  border-color:rgba(126,231,255,0.18)!important;
}

/* Prevent mouse-clicked controls from leaving the parent card visually highlighted.
   Keyboard users still get the proper focus-visible outline on the actual control. */
.theme-toggle:focus:not(:focus-visible),
.space-animations-toggle:focus:not(:focus-visible){
  outline:none;
}


/* Keep the top hero/app-links container static.
   The buttons inside still hover, but the whole large hero card no longer lights up/lifts. */
.hero-card,
.hero-card:hover,
.hero-card:focus-within{
  transform:none!important;
}
body[data-theme="dark"] .hero-card:hover,
body[data-theme="dark"] .hero-card:focus-within{
  border-color:rgba(126,231,255,0.075)!important;
}
body[data-theme="light"] .hero-card:hover,
body[data-theme="light"] .hero-card:focus-within{
  background:rgba(255,255,255,0.78)!important;
  border-color:rgba(37,60,96,0.16)!important;
  box-shadow:0 18px 50px rgba(33,56,91,0.14)!important;
}

body[data-theme="dark"] .btn-primary,
body[data-theme="dark"] .link{
  border-color:rgba(126,231,255,0.09)!important;
}

body[data-theme="dark"] .btn-primary:hover,
body[data-theme="dark"] .btn-primary:focus-visible,
body[data-theme="dark"] .link:hover,
body[data-theme="dark"] .link:focus-visible{
  border-color:rgba(126,231,255,0.18)!important;
}

@media (max-width:720px){
  .hero-theme-toggle{
    top:.65rem;
    right:.65rem;
  }
  .hero-card{
    padding-top:inherit!important;
  }
}

/* Final no-shift guard for theme switching.
   Light mode must not add dimensions to the hero brand area. */
body[data-theme="light"] .hero-card,
body[data-theme="light"] .hero-main,
body[data-theme="light"] .brand-row,
body[data-theme="light"] .eyebrow,
body[data-theme="light"] .tagline{
  line-height:inherit;
}
body[data-theme="light"] .hero-theme-toggle{
  top:1rem;
  right:1rem;
}


/* Hide UI / Show UI control
   Fixed to the top-right of the viewport, outside the hero card so it does not trigger card hover glow.
   The theme switch is nudged left to keep the two controls clear on desktop and mobile. */
.hero-theme-toggle{
  display:flex;
  align-items:center;
  gap:.55rem;
  right:calc(1rem + 88px);
}
.ui-hide-toggle{
  position:fixed;
  top:1rem;
  right:1rem;
  z-index:90;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:76px;
  height:38px;
  padding:0 .72rem;
  border:1px solid rgba(126,231,255,.34);
  border-radius:999px;
  background:rgba(7,18,34,.72);
  color:#eaf6ff;
  box-shadow:0 10px 24px rgba(0,0,0,.22);
  backdrop-filter:blur(9px);
  font:inherit;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.01em;
  line-height:1;
  cursor:pointer;
  opacity:.94;
  white-space:nowrap;
  transition:opacity .18s ease, background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, min-width .18s ease, width .18s ease, padding .18s ease;
}
.ui-hide-toggle:hover,
.ui-hide-toggle:focus-visible{
  opacity:1;
  background:rgba(15,38,62,.86);
  border-color:rgba(126,231,255,.60);
  color:#ffffff;
  outline:none;
}
.ui-hide-toggle:active{transform:translateY(1px);}
.ui-hide-toggle::before{
  content:"◐";
  margin-right:.34rem;
  font-size:.86rem;
  line-height:1;
  opacity:.95;
}
.ui-hide-label{display:inline-block;}
body[data-theme="light"] .ui-hide-toggle{
  background:rgba(255,255,255,.84);
  color:#102641;
  border-color:rgba(24,45,78,.22);
  box-shadow:0 10px 24px rgba(31,56,92,.14);
}
body[data-theme="light"] .ui-hide-toggle:hover,
body[data-theme="light"] .ui-hide-toggle:focus-visible{
  background:rgba(219,238,255,.96);
  border-color:rgba(31,97,146,.38);
  color:#082037;
}

/* Hide the page UI, including the dark/light switch, but leave this restore control available. */
body.ui-hidden .theme-toggle,
body.ui-hidden .hero-main,
body.ui-hidden .section-title,
body.ui-hidden .grid,
body.ui-hidden .site-footer{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.ui-hidden .hero-card{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body.ui-hidden .ui-hide-toggle{
  min-width:42px;
  width:42px;
  height:42px;
  padding:0;
  opacity:.42;
  background:rgba(7,18,34,.46);
  border-color:rgba(255,255,255,.16);
  color:#eaf6ff;
  overflow:hidden;
}
body.ui-hidden .ui-hide-toggle::before{
  content:"☰";
  margin:0;
  font-size:1.05rem;
}
body.ui-hidden .ui-hide-label{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
body.ui-hidden .ui-hide-toggle:hover,
body.ui-hidden .ui-hide-toggle:focus-visible{
  min-width:76px;
  width:auto;
  padding:0 .72rem;
  opacity:.96;
}
body.ui-hidden .ui-hide-toggle:hover::before,
body.ui-hidden .ui-hide-toggle:focus-visible::before{
  content:"☰";
  margin-right:.34rem;
}
body.ui-hidden .ui-hide-toggle:hover .ui-hide-label,
body.ui-hidden .ui-hide-toggle:focus-visible .ui-hide-label{
  position:static!important;
  width:auto!important;
  height:auto!important;
  padding:0!important;
  margin:0!important;
  overflow:visible!important;
  clip:auto!important;
  white-space:nowrap!important;
}

@media (max-width:720px){
  .hero-theme-toggle{
    top:.65rem;
    right:calc(.65rem + 76px);
  }
  .ui-hide-toggle{
    top:.65rem;
    right:.65rem;
    min-width:64px;
    height:34px;
    padding:0 .54rem;
    font-size:.72rem;
  }
  .ui-hide-toggle::before{
    margin-right:.24rem;
    font-size:.80rem;
  }
  body.ui-hidden .ui-hide-toggle{
    min-width:38px;
    width:38px;
    height:38px;
  }
  body.ui-hidden .ui-hide-toggle:hover,
  body.ui-hidden .ui-hide-toggle:focus-visible{
    min-width:68px;
  }
}


/* Strong fix: remove hover/focus highlight from the main hero card only.
   This overrides the shared .card:hover styling from assets/style.css. */
.hero-card,
.hero-card:hover,
.hero-card:focus,
.hero-card:focus-within,
.hero-card:active{
  transform:none!important;
  filter:none!important;
}
body[data-theme="dark"] .hero-card,
body[data-theme="dark"] .hero-card:hover,
body[data-theme="dark"] .hero-card:focus,
body[data-theme="dark"] .hero-card:focus-within,
body[data-theme="dark"] .hero-card:active{
  border-color:rgba(126,231,255,0.075)!important;
  box-shadow:none!important;
}
body[data-theme="light"] .hero-card,
body[data-theme="light"] .hero-card:hover,
body[data-theme="light"] .hero-card:focus,
body[data-theme="light"] .hero-card:focus-within,
body[data-theme="light"] .hero-card:active{
  border-color:rgba(37,60,96,0.16)!important;
  box-shadow:none!important;
}
.hero-card::before,
.hero-card::after,
.hero-card:hover::before,
.hero-card:hover::after,
.hero-card:focus-within::before,
.hero-card:focus-within::after{
  opacity:0!important;
  box-shadow:none!important;
  filter:none!important;
}


/* Final hide-mode guard.
   The hero hover override above must not make the main card visible again when UI is hidden.
   In hidden mode, hide the full page UI and leave only the small restore control available. */
body.ui-hidden .wrap{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
body.ui-hidden .hero-card,
body.ui-hidden .hero-card:hover,
body.ui-hidden .hero-card:focus,
body.ui-hidden .hero-card:focus-within,
body.ui-hidden .hero-card:active{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
body.ui-hidden .hero-theme-toggle,
body.ui-hidden .theme-toggle{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}


/* Mobile header control fix.
   Keep both controls at the top-right of the screen and reserve space so they do not sit over SpaceOpsLab. */
@media (max-width:720px){
  .hero-theme-toggle{
    position:fixed!important;
    top:.65rem!important;
    right:.65rem!important;
    left:auto!important;
    transform:none!important;
    z-index:91!important;
  }
  .ui-hide-toggle{
    top:3.55rem!important;
    right:.65rem!important;
    left:auto!important;
    z-index:92!important;
  }
  .hero-card{
    padding-top:5.25rem!important;
  }
  body.ui-hidden .ui-hide-toggle{
    top:.65rem!important;
    right:.65rem!important;
  }
  body.ui-hidden .hero-card{
    padding-top:0!important;
  }
}


/* Final position lock for header controls.
   Prevent light/dark mode from changing the theme-toggle position. */
.hero-theme-toggle,
body[data-theme="light"] .hero-theme-toggle,
body[data-theme="dark"] .hero-theme-toggle{
  right:calc(1rem + 88px)!important;
  top:1rem!important;
  left:auto!important;
  transform:none!important;
}

@media (max-width:720px){
  .hero-theme-toggle,
  body[data-theme="light"] .hero-theme-toggle,
  body[data-theme="dark"] .hero-theme-toggle{
    position:fixed!important;
    top:.65rem!important;
    right:.65rem!important;
    left:auto!important;
    transform:none!important;
    z-index:91!important;
  }
  .ui-hide-toggle,
  body[data-theme="light"] .ui-hide-toggle,
  body[data-theme="dark"] .ui-hide-toggle{
    top:3.55rem!important;
    right:.65rem!important;
    left:auto!important;
  }
  body.ui-hidden .ui-hide-toggle{
    top:.65rem!important;
    right:.65rem!important;
  }
}



/* Mobile tidy-up.
   Keep SpaceOpsLab high in the hero, while the two controls stay stacked at top-right. */
@media (max-width:720px){
  .hero-card{
    padding-top:1.05rem!important;
  }
  .hero-theme-toggle,
  body[data-theme="light"] .hero-theme-toggle,
  body[data-theme="dark"] .hero-theme-toggle{
    position:fixed!important;
    top:.55rem!important;
    right:.55rem!important;
    left:auto!important;
    z-index:91!important;
  }
  .ui-hide-toggle,
  body[data-theme="light"] .ui-hide-toggle,
  body[data-theme="dark"] .ui-hide-toggle{
    top:3.25rem!important;
    right:.55rem!important;
    left:auto!important;
    z-index:92!important;
  }
  .brand-row{
    align-items:flex-start!important;
    padding-right:5.65rem!important;
  }
  .eyebrow{
    font-size:clamp(1.7rem, 9.2vw, 2.35rem)!important;
    line-height:.98!important;
    max-width:calc(100vw - 7.2rem)!important;
    white-space:nowrap!important;
  }
  .site-mark,
  .orbit-logo{
    width:clamp(34px, 10vw, 42px)!important;
    height:clamp(34px, 10vw, 42px)!important;
    flex:0 0 auto!important;
  }
  .tagline{
    padding-right:5.65rem!important;
  }
  body.ui-hidden .ui-hide-toggle{
    top:.55rem!important;
    right:.55rem!important;
  }
  body.ui-hidden .hero-card{
    padding-top:0!important;
  }
}

@media (max-width:420px){
  .eyebrow{
    font-size:clamp(1.45rem, 8.4vw, 1.9rem)!important;
    max-width:calc(100vw - 6.6rem)!important;
  }
  .brand-row,
  .tagline{
    padding-right:5.2rem!important;
  }
}



/* Mobile-only: make the header controls less dominant without changing desktop.
   The controls stay top-right, but are smaller, lighter and take up less visual space. */
@media (max-width:720px){
  .hero-card{
    padding-top:.55rem!important;
  }

  .hero-theme-toggle,
  body[data-theme="light"] .hero-theme-toggle,
  body[data-theme="dark"] .hero-theme-toggle{
    position:fixed!important;
    top:.48rem!important;
    right:.48rem!important;
    left:auto!important;
    z-index:91!important;
    opacity:.78!important;
    transform:scale(.84)!important;
    transform-origin:top right!important;
  }
  .hero-theme-toggle:hover,
  .hero-theme-toggle:focus-within{
    opacity:1!important;
  }
  .theme-toggle{
    padding:4px!important;
    box-shadow:none!important;
  }
  .toggle-track{
    width:50px!important;
    height:26px!important;
    padding:0 6px!important;
  }
  .toggle-thumb{
    width:20px!important;
    height:20px!important;
  }
  body[data-theme="light"] .toggle-thumb{
    transform:translateX(24px)!important;
  }

  .ui-hide-toggle,
  body[data-theme="light"] .ui-hide-toggle,
  body[data-theme="dark"] .ui-hide-toggle{
    top:2.82rem!important;
    right:.48rem!important;
    left:auto!important;
    z-index:92!important;
    min-width:52px!important;
    height:28px!important;
    padding:0 .46rem!important;
    font-size:.68rem!important;
    font-weight:750!important;
    opacity:.72!important;
    background:rgba(7,18,34,.42)!important;
    border-color:rgba(126,231,255,.20)!important;
    box-shadow:none!important;
    backdrop-filter:blur(7px)!important;
  }
  body[data-theme="light"] .ui-hide-toggle{
    background:rgba(255,255,255,.62)!important;
    border-color:rgba(24,45,78,.14)!important;
    color:#20334d!important;
  }
  .ui-hide-toggle::before{
    margin-right:.18rem!important;
    font-size:.72rem!important;
  }
  .ui-hide-toggle:hover,
  .ui-hide-toggle:focus-visible{
    opacity:1!important;
    background:rgba(15,38,62,.72)!important;
    border-color:rgba(126,231,255,.42)!important;
  }
  body[data-theme="light"] .ui-hide-toggle:hover,
  body[data-theme="light"] .ui-hide-toggle:focus-visible{
    background:rgba(235,244,255,.92)!important;
    border-color:rgba(31,97,146,.28)!important;
  }

  .brand-row{
    padding-right:4.9rem!important;
  }
  .tagline{
    padding-right:4.9rem!important;
  }
  .eyebrow{
    max-width:calc(100vw - 6.4rem)!important;
  }

  body.ui-hidden .ui-hide-toggle{
    top:.48rem!important;
    right:.48rem!important;
    min-width:34px!important;
    width:34px!important;
    height:34px!important;
    padding:0!important;
    opacity:.38!important;
  }
  body.ui-hidden .ui-hide-toggle:hover,
  body.ui-hidden .ui-hide-toggle:focus-visible{
    min-width:62px!important;
    width:auto!important;
    padding:0 .52rem!important;
    opacity:.95!important;
  }
}

@media (max-width:420px){
  .hero-theme-toggle,
  body[data-theme="light"] .hero-theme-toggle,
  body[data-theme="dark"] .hero-theme-toggle{
    transform:scale(.80)!important;
  }
  .ui-hide-toggle,
  body[data-theme="light"] .ui-hide-toggle,
  body[data-theme="dark"] .ui-hide-toggle{
    top:2.65rem!important;
    min-width:48px!important;
    height:27px!important;
    font-size:.65rem!important;
  }
  .brand-row,
  .tagline{
    padding-right:4.55rem!important;
  }
  .eyebrow{
    max-width:calc(100vw - 6rem)!important;
  }
}



/* External links section.
   Collapsed by default, but the heading stays visually close to the original page style. */
.external-links-title{
  margin-top:1.35rem;
  margin-bottom:.65rem;
}
.external-links-title h2{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-shadow:none!important;
  opacity:1;
}
.external-links-toggle{
  display:inline-flex;
  align-items:center;
  gap:.42rem;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  font:inherit;
  font-size:inherit;
  font-weight:inherit;
  letter-spacing:inherit;
  text-transform:none;
  cursor:pointer;
}
.external-links-toggle:hover,
.external-links-toggle:focus-visible{
  color:#eaf6ff;
  outline:none;
}
.external-links-toggle:focus-visible{
  box-shadow:0 0 0 3px rgba(126,231,255,.22);
  border-radius:.35rem;
}
.external-links-chevron{
  display:inline-block;
  width:1em;
  font-size:.74em;
  line-height:1;
  transform:translateY(-1px);
  opacity:.72;
  transition:transform .16s ease;
}
.external-links-toggle[aria-expanded="true"] .external-links-chevron{
  transform:rotate(90deg) translateX(1px);
}
.external-links-count{
  display:none;
}
.external-links-grid[hidden]{
  display:none!important;
}
.external-links-grid{
  animation:externalLinksReveal .18s ease-out;
}
@keyframes externalLinksReveal{
  from{opacity:0;transform:translateY(-4px);}
  to{opacity:1;transform:translateY(0);}
}
body[data-theme="light"] .external-links-title h2,
body[data-theme="light"] .external-links-toggle{
  color:#142033!important;
  opacity:1;
}
body[data-theme="light"] .external-links-toggle:hover,
body[data-theme="light"] .external-links-toggle:focus-visible{
  color:#102641!important;
}
@media (prefers-reduced-motion:reduce){
  .external-links-chevron,
  .external-links-grid{
    transition:none!important;
    animation:none!important;
  }
}

@media (max-width:720px){
  .external-links-title{
    margin-top:1.05rem;
  }
}

/* External Links restore: keep collapse behaviour, but preserve the original smaller/secondary styling. */
.external-links-title{
  margin-top:1.35rem!important;
  margin-bottom:.65rem!important;
}
.external-links-title h2{
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  text-shadow:none!important;
  font-size:.88rem!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  opacity:.78!important;
}
.external-links-toggle{
  display:inline-flex!important;
  align-items:center!important;
  gap:.42rem!important;
  border:0!important;
  padding:0!important;
  background:transparent!important;
  color:inherit!important;
  font:inherit!important;
  font-size:inherit!important;
  font-weight:inherit!important;
  letter-spacing:inherit!important;
  text-transform:inherit!important;
  cursor:pointer!important;
}
.external-links-toggle:hover,
.external-links-toggle:focus-visible{
  background:transparent!important;
  color:inherit!important;
}
.external-links-grid{
  gap:.82rem!important;
}
.external-links-grid .resource-card{
  padding:1rem!important;
  background:rgba(7,18,34,.34)!important;
  border-color:rgba(126,231,255,.055)!important;
  box-shadow:none!important;
}
.external-links-grid .resource-card:hover{
  transform:none!important;
  border-color:rgba(126,231,255,.12)!important;
  background:rgba(9,24,40,.44)!important;
}
.external-links-grid .resource-card h3{
  margin-bottom:.65rem!important;
  font-size:.94rem!important;
  font-weight:750!important;
  opacity:.86!important;
}
.external-links-grid .link{
  background:transparent!important;
  box-shadow:none!important;
}
.external-links-grid .link:hover,
.external-links-grid .link:focus-visible{
  background:rgba(126,231,255,.055)!important;
}
body[data-theme="light"] .external-links-title h2,
body[data-theme="light"] .external-links-toggle{
  color:#142033!important;
}
body[data-theme="light"] .external-links-grid .resource-card{
  background:rgba(255,255,255,.52)!important;
  border-color:rgba(37,60,96,.10)!important;
  box-shadow:none!important;
}
body[data-theme="light"] .external-links-grid .resource-card:hover{
  background:rgba(255,255,255,.62)!important;
  border-color:rgba(37,60,96,.16)!important;
}
body[data-theme="light"] .external-links-grid .link{
  background:transparent!important;
  box-shadow:none!important;
}
body[data-theme="light"] .external-links-grid .link:hover,
body[data-theme="light"] .external-links-grid .link:focus-visible{
  background:rgba(31,97,146,.055)!important;
}

/* Space Activity feature button
   Keep the main button family consistent, but give the live activity entry a subtle green identity again. */
.btn-live-ops,
body[data-theme="dark"] .btn-live-ops{
  color:#eafff1!important;
  background:
    radial-gradient(circle at 18% 18%, rgba(126,231,135,.28), transparent 34%),
    linear-gradient(180deg, rgba(25,118,70,.94), rgba(14,82,49,.88))!important;
  border-color:rgba(126,231,135,.46)!important;
  box-shadow:
    0 12px 28px rgba(0,0,0,.22),
    0 0 0 1px rgba(126,231,135,.08) inset,
    0 0 22px rgba(126,231,135,.12)!important;
}
.btn-live-ops:hover,
.btn-live-ops:focus-visible,
body[data-theme="dark"] .btn-live-ops:hover,
body[data-theme="dark"] .btn-live-ops:focus-visible{
  color:#ffffff!important;
  background:
    radial-gradient(circle at 18% 18%, rgba(126,231,135,.36), transparent 36%),
    linear-gradient(180deg, rgba(34,145,85,.98), rgba(17,96,57,.94))!important;
  border-color:rgba(126,231,135,.66)!important;
  box-shadow:
    0 14px 32px rgba(0,0,0,.25),
    0 0 0 1px rgba(126,231,135,.13) inset,
    0 0 26px rgba(126,231,135,.18)!important;
}
body[data-theme="light"] .btn-live-ops{
  color:#08351e!important;
  background:
    radial-gradient(circle at 18% 18%, rgba(126,231,135,.38), transparent 34%),
    linear-gradient(180deg, rgba(218,255,229,.98), rgba(143,229,171,.90))!important;
  border-color:rgba(31,142,80,.36)!important;
  box-shadow:
    0 12px 28px rgba(31,97,62,.13),
    0 0 0 1px rgba(255,255,255,.56) inset!important;
}
body[data-theme="light"] .btn-live-ops:hover,
body[data-theme="light"] .btn-live-ops:focus-visible{
  background:
    radial-gradient(circle at 18% 18%, rgba(126,231,135,.48), transparent 36%),
    linear-gradient(180deg, rgba(236,255,242,.98), rgba(158,238,184,.94))!important;
  border-color:rgba(31,142,80,.48)!important;
}
.btn-live-ops .live-pulse{
  background:#7ee787!important;
  box-shadow:0 0 0 0 rgba(126,231,135,.42), 0 0 10px rgba(126,231,135,.58)!important;
}