/* Cavelux Home launch observatory — selected visual reference, 2026-08-20. */

body[data-page="launch"] {
  min-height: var(--cvl-launch-shell-legacy);
  background: var(--cvl-bg);
  background-image: none;
  color: var(--cvl-ink);
}

@supports (min-height: -webkit-fill-available) {
  html {
    height: var(--cvl-launch-shell-fill);
  }

  body[data-page="launch"] {
    min-height: var(--cvl-launch-shell-fill);
  }
}

@supports (min-height: 100svh) {
  body[data-page="launch"] {
    min-height: var(--cvl-launch-shell-min);
  }
}

@supports (min-height: 100dvh) {
  body[data-page="launch"] {
    min-height: min(var(--cvl-launch-shell-min), var(--cvl-launch-shell-dynamic));
  }
}

body[data-page="launch"] .skip:focus-visible {
  top: max(var(--cvl-space-4), var(--cvl-safe-area-top));
  left: max(var(--cvl-space-4), var(--cvl-safe-area-left));
}

body[data-page="launch"] .nav {
  min-height: var(--cvl-launch-nav-h);
  padding-top: var(--cvl-safe-area-top);
  border-bottom-color: var(--cvl-border);
  background: var(--cvl-bg);
}

body[data-page="launch"] .nav-inner {
  min-height: var(--cvl-launch-nav-h);
  padding-right: max(var(--cvl-launch-gutter), var(--cvl-safe-area-right));
  padding-left: max(var(--cvl-launch-gutter), var(--cvl-safe-area-left));
  justify-content: space-between;
}

body[data-page="launch"] .nav-brand {
  gap: calc(var(--cvl-space-4) + var(--cvl-space-2));
}

body[data-page="launch"] .nav-mark {
  width: var(--cvl-launch-mark);
  height: var(--cvl-launch-mark);
}

body[data-page="launch"] .nav-brand-text,
body[data-page="launch"] .nav-brand-word {
  display: block !important;
  color: var(--cvl-ink);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-1p05rem);
  font-weight: 500;
  letter-spacing: var(--cvl-launch-word-tracking);
  line-height: var(--cvl-leading-tight);
}

body[data-page="launch"] .nav-brand-text {
  width: auto;
  min-width: 0;
}

body[data-page="launch"] .nav-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--cvl-space-3);
  width: var(--cvl-launch-cta-w);
  min-height: var(--cvl-launch-cta-h);
  border-color: var(--cvl-border-control);
  color: var(--cvl-ink);
}

body[data-page="launch"] .nav-cta:hover,
body[data-page="launch"] .nav-cta:focus-visible {
  border-color: var(--cvl-lime);
  background: var(--cvl-bg);
  color: var(--cvl-ink);
}

.launch-main {
  display: block;
}

.launch-visually-hidden {
  position: absolute !important;
  width: var(--cvl-master-rule) !important;
  height: var(--cvl-master-rule) !important;
  padding: 0 !important;
  margin: calc(var(--cvl-master-rule) * -1) !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.launch-shell {
  width: var(--cvl-full);
  max-width: var(--cvl-max);
  margin-inline: auto;
  padding-top: var(--cvl-space-7);
  padding-right: max(var(--cvl-launch-gutter), var(--cvl-safe-area-right));
  padding-bottom: var(--cvl-safe-area-bottom);
  padding-left: max(var(--cvl-launch-gutter), var(--cvl-safe-area-left));
  transition:
    opacity var(--cvl-motion-fast) linear,
    transform var(--cvl-motion-fast) linear;
}

body.is-launch-leaving .launch-shell {
  opacity: 0;
  transform: scale(0.995);
}

.launch-observatory {
  display: grid;
  grid-template-columns: minmax(0, var(--cvl-launch-readout-track)) minmax(0, var(--cvl-launch-stage-track));
  width: var(--cvl-full);
  height: var(--cvl-launch-observatory-h);
  border: var(--cvl-master-rule) solid var(--cvl-border-control);
  background: var(--cvl-bg);
  overflow: hidden;
}

.launch-readout {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding-block: calc(var(--cvl-space-7) + var(--cvl-space-4));
  padding-right: var(--cvl-space-2);
  padding-left: calc(var(--cvl-space-7) + var(--cvl-space-4));
  background: var(--cvl-bg);
}

.launch-readout::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--cvl-master-rule);
  background: var(--cvl-border-control);
  content: "";
}

.launch-readout > * {
  transform: translateY(var(--cvl-space-4));
}

.launch-readout-index {
  display: flex;
  align-items: baseline;
  gap: var(--cvl-space-4);
  margin: 0 0 var(--cvl-space-5);
  color: var(--cvl-ink);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-1p4rem);
  letter-spacing: var(--cvl-tracking-nav);
  line-height: var(--cvl-leading-tight);
  text-transform: uppercase;
}

.launch-readout-number {
  color: var(--cvl-lime);
}

.launch-readout h2 {
  margin: 0 0 var(--cvl-space-4);
  color: var(--cvl-ink);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-1p4rem);
  font-weight: 500;
  letter-spacing: var(--cvl-tracking-nav);
  line-height: var(--cvl-leading-tight);
  text-transform: uppercase;
}

.launch-readout-copy {
  max-width: var(--cvl-master-copy-col);
  margin: 0 0 var(--cvl-space-4);
  color: var(--cvl-ink-dim);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p9375rem);
  line-height: var(--cvl-leading-body);
}

.launch-identity-stamp {
  max-width: var(--cvl-master-copy-col);
  margin: 0 0 var(--cvl-space-5);
  color: var(--cvl-muted);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p75rem);
  line-height: var(--cvl-leading-body);
}

.launch-readout-action {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  min-height: var(--cvl-master-control-h);
  color: var(--cvl-ink);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p95rem);
  font-weight: 500;
  letter-spacing: var(--cvl-tracking-nav);
  text-decoration: none;
  text-transform: uppercase;
}

.launch-action-arrow {
  margin-left: var(--cvl-space-2);
  color: var(--cvl-lime);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-1p05rem);
  line-height: var(--cvl-leading-tight);
}

.launch-readout-action .launch-action-arrow {
  margin-left: var(--cvl-space-4);
  font-size: var(--cvl-fs-1p4rem);
}

.launch-readout-action:hover,
.launch-readout-action:focus-visible {
  color: var(--cvl-lime);
}

.launch-stage {
  position: relative;
  min-width: 0;
  height: var(--cvl-full);
  background: var(--cvl-bg);
  isolation: isolate;
  overflow: hidden;
}

.launch-canvas,
.launch-core-layer,
.launch-routes {
  position: absolute;
  inset: 0;
}

.launch-canvas {
  z-index: 0;
  width: var(--cvl-full);
  height: var(--cvl-full);
}

.launch-core-layer {
  z-index: 1;
  display: grid;
  pointer-events: none;
  place-items: center;
  transform: none;
}

.launch-core {
  position: relative;
  width: var(--cvl-launch-core);
  max-width: var(--cvl-full);
  aspect-ratio: var(--cvl-ratio-square);
}

.launch-core img {
  position: absolute;
  inset: 0;
  display: block;
  width: var(--cvl-full);
  height: var(--cvl-full);
  object-fit: contain;
}

.launch-core-swirl {
  z-index: 1;
  animation: none;
  transform-origin: center;
}

.launch-core-eye {
  z-index: 2;
}

.launch-core-assembly {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  width: var(--cvl-full);
  height: var(--cvl-full);
  object-fit: contain;
  pointer-events: none;
}

.launch-core-assembly[hidden] {
  display: none;
}

body[data-page="launch"].is-launch-motion-enabled .launch-core-swirl {
  animation:
    launch-portal-in var(--cvl-launch-portal-duration) var(--cvl-launch-portal-ease) both,
    launch-swirl var(--cvl-motion-orbit) linear var(--cvl-launch-portal-duration) infinite;
  will-change: opacity, transform;
}

body.is-launch-eye-assembling .launch-core-eye {
  opacity: 0;
}

.launch-routes {
  z-index: 3;
  margin: 0;
  padding: 0;
  list-style: none;
  pointer-events: none;
}

.launch-route {
  position: absolute;
  display: flex;
  align-items: center;
  min-height: var(--cvl-master-control-h);
  color: var(--cvl-ink-dim);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p75rem);
  letter-spacing: var(--cvl-tracking-nav);
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: auto;
}

body.is-launch-orbiting .launch-route {
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  left: 0 !important;
  will-change: transform;
}

.launch-route:nth-child(1) {
  top: var(--cvl-launch-route-system-y);
  left: var(--cvl-launch-route-system-x);
}

.launch-route:nth-child(2) {
  top: var(--cvl-launch-route-showcase-y);
  right: var(--cvl-launch-route-showcase-x);
}

.launch-route:nth-child(3) {
  bottom: var(--cvl-launch-route-about-y);
  left: var(--cvl-launch-route-about-x);
}

.launch-route:nth-child(4) {
  right: var(--cvl-launch-route-contact-x);
  bottom: var(--cvl-launch-route-contact-y);
}

.launch-route-indicator {
  position: relative;
  display: grid;
  flex: 0 0 var(--cvl-master-control-h);
  width: var(--cvl-master-control-h);
  height: var(--cvl-master-control-h);
  border: var(--cvl-master-rule) solid var(--cvl-border-control);
  border-radius: var(--cvl-full);
  background: var(--cvl-bg);
  box-shadow:
    0 0 0 var(--cvl-master-rule) var(--cvl-bg),
    0 0 0 calc(var(--cvl-master-rule) * 2) var(--cvl-border-control);
  place-items: center;
}

.launch-route[data-launch-route="system"] {
  --launch-route-icon: url("/media/icons/lucide-atom.svg");
}

.launch-route[data-launch-route="showcase"] {
  --launch-route-icon: url("/media/icons/lucide-telescope.svg");
}

.launch-route[data-launch-route="about"] {
  --launch-route-icon: url("/media/icons/lucide-dna.svg");
}

.launch-route[data-launch-route="contact"] {
  --launch-route-icon: url("/media/icons/lucide-radio-tower.svg");
}

.launch-route-icon {
  display: block;
  width: var(--cvl-space-5);
  height: var(--cvl-space-5);
  background: currentColor;
  -webkit-mask: var(--launch-route-icon) center / contain no-repeat;
  mask: var(--launch-route-icon) center / contain no-repeat;
}

.launch-route.is-active,
.launch-route:hover,
.launch-route:focus-visible {
  color: var(--cvl-ink);
}

.launch-route.is-active .launch-route-indicator,
.launch-route:hover .launch-route-indicator,
.launch-route:focus-visible .launch-route-indicator {
  border-color: var(--cvl-lime);
}

.launch-route.is-active .launch-route-icon {
  background: var(--cvl-lime);
}

.launch-route.is-active .launch-route-indicator {
  box-shadow:
    0 0 0 var(--cvl-master-rule) var(--cvl-bg),
    0 0 0 calc(var(--cvl-master-rule) * 2) var(--cvl-lime),
    0 0 var(--cvl-space-3) var(--cvl-lime-edge-18);
}

.launch-route:focus-visible,
.launch-index-link:focus-visible,
.launch-readout-action:focus-visible,
.launch-motion-toggle:focus-visible,
.launch-legal a:focus-visible,
body[data-page="launch"] .nav-brand:focus-visible {
  outline: calc(var(--cvl-master-rule) * 2) solid var(--cvl-lime);
  outline-offset: var(--cvl-space-2);
}

.launch-motion-toggle {
  position: absolute;
  right: var(--cvl-space-4);
  bottom: var(--cvl-space-3);
  z-index: 4;
  min-height: var(--cvl-master-control-h);
  padding: var(--cvl-space-2) var(--cvl-space-3);
  border: 0;
  background: var(--cvl-bg);
  color: var(--cvl-muted);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p68rem);
  letter-spacing: var(--cvl-tracking-nav);
  text-transform: uppercase;
}

.launch-motion-toggle:hover {
  color: var(--cvl-ink);
}

.launch-motion-toggle:disabled {
  color: var(--cvl-muted);
  cursor: default;
}

.launch-index {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, var(--cvl-track)));
  min-height: var(--cvl-launch-index-min);
  margin-top: var(--cvl-launch-index-gap);
  border: var(--cvl-master-rule) solid var(--cvl-border-control);
}

.launch-index-link {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--cvl-space-3);
  min-width: 0;
  min-height: var(--cvl-master-control-h);
  padding: var(--cvl-space-5) var(--cvl-space-6);
  color: var(--cvl-ink-dim);
  text-decoration: none;
}

.launch-index-link:last-child {
  border-right: 0;
}

.launch-index-link:not(:last-child)::after {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: var(--cvl-master-rule);
  background: var(--cvl-border-control);
  content: "";
}

.launch-index-title {
  display: flex;
  align-items: center;
  gap: var(--cvl-space-4);
  color: var(--cvl-ink);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-1p05rem);
  font-weight: 500;
  letter-spacing: var(--cvl-tracking-nav);
  text-transform: uppercase;
}

.launch-index-title::before {
  width: var(--cvl-space-2);
  height: var(--cvl-space-2);
  background: var(--cvl-muted);
  content: "";
}

.launch-index-copy {
  color: var(--cvl-muted);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p875rem);
  line-height: var(--cvl-leading-body);
}

.launch-index-link.is-active .launch-index-title::before,
.launch-index-link:hover .launch-index-title::before,
.launch-index-link:focus-visible .launch-index-title::before {
  background: var(--cvl-lime);
}

.launch-index-link:hover .launch-index-copy,
.launch-index-link:focus-visible .launch-index-copy {
  color: var(--cvl-ink-dim);
}

.launch-footer {
  display: none;
  align-items: center;
  justify-content: space-between;
  width: var(--cvl-full);
  max-width: var(--cvl-max);
  min-height: var(--cvl-launch-legal-h);
  margin-inline: auto;
  padding-inline: var(--cvl-gutter);
  color: var(--cvl-muted);
  font-family: var(--cvl-mono);
  font-size: var(--cvl-fs-0p68rem);
  letter-spacing: var(--cvl-tracking-nav);
  text-transform: uppercase;
}

.launch-legal {
  display: flex;
  gap: var(--cvl-space-4);
}

.launch-legal a {
  color: var(--cvl-muted);
  text-decoration: none;
}

.launch-legal a:hover,
.launch-legal a:focus-visible {
  color: var(--cvl-ink);
}

body[data-page="launch"].is-launch-paused .launch-core-swirl {
  animation-play-state: paused;
}

@keyframes launch-portal-in {
  0% {
    opacity: 0;
    transform: rotate(540deg) scale(0.1);
  }

  55% { opacity: 1; }

  100% {
    opacity: 1;
    transform: rotate(0deg) scale(1);
  }
}

@keyframes launch-swirl {
  to { transform: rotate(-1turn); }
}

@media (max-width: 900px) {
  body[data-page="launch"] .nav {
    min-height: var(--cvl-master-nav-h);
  }

  body[data-page="launch"] .nav-inner {
    min-height: var(--cvl-master-nav-h);
  }

  .launch-shell {
    padding-top: var(--cvl-space-5);
  }

  .launch-observatory {
    grid-template-columns: minmax(0, var(--cvl-track));
    height: auto;
  }

  .launch-readout {
    padding: var(--cvl-space-7);
    border-right: 0;
    border-bottom: var(--cvl-master-rule) solid var(--cvl-border-control);
  }

  .launch-readout::after {
    display: none;
  }

  .launch-readout > * {
    transform: none;
  }

  .launch-core-layer {
    transform: none;
  }

  .launch-stage {
    height: var(--cvl-launch-stage-mobile-h);
  }

  .launch-core {
    width: var(--cvl-launch-core-mobile);
  }

  .launch-index {
    grid-template-columns: repeat(2, minmax(0, var(--cvl-track)));
  }

  .launch-index-link:nth-child(2) {
    border-right: 0;
  }

  .launch-index-link:nth-child(-n + 2) {
    border-bottom: var(--cvl-master-rule) solid var(--cvl-border-control);
  }

  .launch-index-link:nth-child(2)::after {
    display: none;
  }
}

@media (max-width: 640px) {
  body[data-page="launch"] .nav-inner {
    gap: var(--cvl-space-3);
    padding-right: max(var(--cvl-space-4), var(--cvl-safe-area-right));
    padding-left: max(var(--cvl-space-4), var(--cvl-safe-area-left));
  }

  body[data-page="launch"] .nav-brand {
    flex: 0 1 auto;
    gap: var(--cvl-space-2);
    min-width: 0;
    min-height: var(--cvl-master-control-h);
  }

  body[data-page="launch"] .nav-mark {
    flex: 0 0 var(--cvl-master-mark);
    width: var(--cvl-master-mark);
    height: var(--cvl-master-mark);
  }

  body[data-page="launch"] .nav-brand-text,
  body[data-page="launch"] .nav-brand-word {
    min-width: 0;
    font-size: var(--cvl-fs-0p75rem);
    letter-spacing: var(--cvl-tracking-label);
  }

  body[data-page="launch"] .nav-cta {
    display: inline-flex;
    flex: 0 0 auto;
    gap: var(--cvl-space-2);
    width: auto;
    min-height: var(--cvl-master-control-h);
    padding-inline: var(--cvl-space-2);
    font-size: var(--cvl-fs-0p62rem);
    white-space: nowrap;
  }

  body[data-page="launch"] .nav-cta .launch-action-arrow {
    margin-left: 0;
    font-size: var(--cvl-fs-0p875rem);
  }

  .launch-shell {
    padding-right: max(var(--cvl-space-4), var(--cvl-safe-area-right));
    padding-left: max(var(--cvl-space-4), var(--cvl-safe-area-left));
  }

  .launch-readout {
    padding: var(--cvl-space-6);
  }

  .launch-readout h2 {
    font-size: var(--cvl-fs-fluid-16);
  }

  .launch-core {
    width: var(--cvl-launch-core-mobile);
  }

  .launch-route {
    flex-direction: column;
    gap: var(--cvl-space-2);
  }

  body:not(.is-launch-orbiting) .launch-route:nth-child(1) {
    top: var(--cvl-space-4);
    left: var(--cvl-space-4);
  }

  body:not(.is-launch-orbiting) .launch-route:nth-child(2) {
    top: var(--cvl-space-4);
    right: var(--cvl-space-4);
  }

  body:not(.is-launch-orbiting) .launch-route:nth-child(3) {
    bottom: var(--cvl-space-4);
    left: var(--cvl-space-4);
  }

  body:not(.is-launch-orbiting) .launch-route:nth-child(4) {
    right: var(--cvl-space-4);
    bottom: var(--cvl-space-4);
  }

  body.is-launch-orbit-unavailable .launch-motion-toggle {
    right: 0;
    bottom: var(--cvl-space-4);
    left: 0;
    width: max-content;
    margin-inline: auto;
  }

  .launch-route-label {
    min-width: 0;
    font-size: var(--cvl-fs-0p68rem);
  }

  .launch-route-indicator {
    flex-basis: var(--cvl-master-control-h);
  }

  .launch-index {
    grid-template-columns: minmax(0, var(--cvl-track));
  }

  .launch-index-link,
  .launch-index-link:nth-child(2) {
    border-right: 0;
    border-bottom: var(--cvl-master-rule) solid var(--cvl-border-control);
  }

  .launch-index-link:last-child {
    border-bottom: 0;
  }

  .launch-index-link::after {
    display: none;
  }

  .launch-footer {
    align-items: flex-start;
    flex-direction: column;
    gap: var(--cvl-space-3);
    padding-block: var(--cvl-space-4);
  }
}

@media (any-hover: none), (any-pointer: coarse) {
  .launch-route,
  .launch-index-link {
    touch-action: manipulation;
  }
}

@media (forced-colors: active) {
  .launch-canvas,
  .launch-routes {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  body[data-page="launch"] .launch-core-swirl {
    animation: none;
  }

  .launch-core-assembly {
    display: none;
  }

  .launch-shell {
    transition: none;
  }
}