/*
 * V66 approved brand / orbit-chain / black-surface pass.
 * Scope is intentionally limited to the new VNISH lockup, the alternating
 * miner-logo chain, the two previously light sections, and the footer wordmark.
 */

body,
main,
main > section {
  background: #000 !important;
}

/* Full approved lockup in the fixed navigation. */
.site-header {
  height: 108px;
}

.site-header.is-scrolled {
  height: 84px;
}

.brand.brand--master {
  width: 176px;
  height: 96px;
  gap: 0;
}

.brand.brand--master img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: 50% 50%;
  mix-blend-mode: screen;
  filter:
    saturate(1.05)
    contrast(1.06)
    drop-shadow(0 0 11px rgba(238, 176, 54, .18));
}

.site-header.is-scrolled .brand.brand--master {
  height: 74px;
}

/* The approved cyan edge remains bound to Earth, below every chain object. */
.hero--v53 .global-earth-emission {
  z-index: 1;
}

.hero--v53 .global-orbit-overlay {
  position: absolute;
  z-index: 2;
  inset: 0 0 0 31%;
  overflow: hidden;
  pointer-events: none;
  contain: layout paint style;
}

.hero--v53 .global-orbit-chain,
.hero--v53 .global-orbit-logo-fleet,
.hero--v53 .global-orbit-overlay .global-miner-fleet {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero--v53 .global-orbit-chain {
  z-index: 0;
  overflow: visible;
}

.hero--v53 .global-orbit-chain path {
  fill: none;
  opacity: .68;
  stroke: rgba(244, 205, 112, .78);
  stroke-width: 1.12;
  stroke-dasharray: 1 8.4;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  filter:
    drop-shadow(0 0 2px rgba(255, 225, 156, .46))
    drop-shadow(0 0 7px rgba(205, 139, 31, .18));
  animation: v66ChainFlow 10s linear infinite;
}

@keyframes v66ChainFlow {
  to { stroke-dashoffset: -94; }
}

.hero--v53 .global-orbit-overlay .global-miner-fleet--back {
  z-index: 2;
}

.hero--v53 .global-orbit-logo-fleet {
  z-index: 3;
}

.hero--v53 .global-orbit-overlay .global-miner-fleet--front {
  z-index: 4;
}

.hero--v53 .global-orbit-logo {
  position: absolute;
  top: 0;
  left: 0;
  width: clamp(58px, 4.8vw, 76px);
  opacity: var(--logo-opacity, 0);
  transform:
    translate3d(var(--logo-x, 50%), var(--logo-y, 50%), 0)
    translate(-50%, -50%)
    scale(var(--logo-scale, .84));
  transform-origin: 50% 50%;
  will-change: transform, opacity;
}

.hero--v53 .global-orbit-logo img {
  width: 100%;
  height: auto;
  object-fit: contain;
  mix-blend-mode: screen;
  filter:
    brightness(var(--logo-brightness, 1))
    saturate(1.10)
    contrast(1.09)
    drop-shadow(0 6px 12px rgba(0, 0, 0, .78))
    drop-shadow(0 0 7px rgba(244, 188, 68, .30));
}

/* Same exact S21-like bodies, with only a restrained champagne-gold finish. */
.hero--v53 .global-orbit-miner img {
  filter:
    sepia(.20)
    saturate(1.20)
    hue-rotate(350deg)
    brightness(1.06)
    contrast(1.05);
}

.hero--v53 .global-orbit-miner__visual {
  filter:
    drop-shadow(0 1px 0 rgba(255, 226, 164, .18))
    drop-shadow(0 0 7px rgba(224, 158, 42, .10));
}

/* The two light chapters become black while preserving their content/layout. */
.finder,
.models {
  background: #000 !important;
  color: var(--ivory) !important;
}

.finder::before {
  background: radial-gradient(circle at 50% 0, rgba(190, 136, 51, .10), transparent 65%);
}

.finder .eyebrow,
.models .eyebrow {
  color: var(--gold);
}

.finder-head p:last-child,
.models-deck,
.model-actions span {
  color: #918d84;
}

.catalog-lock {
  border-color: rgba(231, 199, 125, .16);
  background: rgba(9, 11, 11, .88);
  color: #d7d0c2;
}

.finder-shell {
  border-color: rgba(231, 199, 125, .17);
  background: #070909;
  box-shadow: 0 40px 110px rgba(0, 0, 0, .55);
  color: var(--ivory);
}

.finder-resolver-panel {
  background: #070909;
  color: var(--ivory);
}

.finder-resolver-panel .resolver-steps {
  background: rgba(231, 199, 125, .045);
}

.finder-resolver-panel .resolver-steps span {
  border-color: rgba(231, 199, 125, .12);
  color: #79776f;
}

.finder-resolver-panel .resolver-steps span.is-active {
  background: rgba(231, 199, 125, .08);
  color: var(--gold);
}

.finder-resolver-panel .resolver-prompt {
  color: var(--ivory);
}

.finder-search span {
  color: rgba(227, 220, 205, .45);
}

.finder-search input {
  border-color: rgba(231, 199, 125, .16);
  background: #0c0f0f;
  color: var(--ivory);
}

.finder-search input::placeholder {
  color: rgba(223, 218, 205, .30);
}

.finder-resolver-panel .resolver-options {
  background: rgba(231, 199, 125, .10);
}

.finder-resolver-panel .resolver-option {
  border-color: rgba(231, 199, 125, .10);
  background: #0c0f0f;
  color: #d9d4ca;
}

.finder-resolver-panel .resolver-option:hover,
.finder-resolver-panel .resolver-option:focus-visible {
  background: #151818;
  color: #fff;
}

.finder-resolver-panel .resolver-option small {
  color: #77766f;
}

.finder-resolver-panel .resolver-actions {
  border-color: rgba(231, 199, 125, .12);
  background: #080a0a;
}

.finder .back-button,
.finder .text-button {
  color: #bdb7aa;
}

.models {
  --ink: var(--ivory);
  --paper: #000;
  background-image: none !important;
}

.models::before {
  opacity: .62;
  background:
    radial-gradient(circle at var(--models-x, 50%) 56%, rgba(174, 126, 50, .13), transparent 24%),
    linear-gradient(110deg, transparent 24%, rgba(255, 227, 166, .025) 48%, transparent 72%);
}

.models-deck {
  border-left-color: rgba(231, 199, 125, .18);
}

.kinetic-word > .kinetic-outline {
  -webkit-text-stroke-color: rgba(231, 199, 125, .42);
  mix-blend-mode: screen;
}

.kinetic-outline::after {
  color: rgba(5, 6, 6, .76);
  -webkit-text-stroke-color: rgba(231, 199, 125, .22);
}

/* Approved large wordmark at the end, responsive and never self-overlapping. */
.footer-word.footer-word--approved {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: clamp(54px, 7vw, 92px) clamp(14px, 3vw, 46px) clamp(30px, 4vw, 54px);
  background:
    radial-gradient(circle at var(--word-x, 50%) 50%, rgba(231, 199, 125, .10), transparent 25%),
    #000;
  line-height: 1;
  white-space: normal;
}

.footer-word.footer-word--approved > img,
.footer-word-art {
  width: min(92vw, 1396px);
  aspect-ratio: var(--wordmark-ratio, 1396 / 188);
}

.footer-word.footer-word--approved > img {
  position: relative;
  z-index: 1;
  max-height: 188px;
  object-fit: contain;
  mix-blend-mode: normal;
  transform: scaleX(1);
  transform-origin: 50% 50%;
  transition: transform .55s cubic-bezier(.18, .78, .2, 1), filter .35s ease;
}

.footer-word.footer-word--approved:hover > img {
  transform: scaleX(1.018);
}

.footer-word-art {
  position: absolute;
  top: clamp(54px, 7vw, 92px);
  left: 50%;
  z-index: 2;
  display: block;
  flex: 0 0 auto;
  max-height: 188px;
  overflow: visible;
  opacity: 0;
  transform: translateX(-50%);
  transition: opacity .18s ease-out;
}

.footer-word.footer-word--approved.is-letter-art-ready > .footer-wordmark-base {
  visibility: hidden;
}

.footer-word.footer-word--approved.is-letter-art-ready > .footer-word-art {
  opacity: 1;
}

.footer-word.footer-word--approved .footer-letter {
  position: absolute;
  top: 0;
  height: 100%;
  overflow: hidden;
  transform: translate3d(0, 0, 0);
  transform-origin: 50% 88%;
  will-change: transform;
  transition:
    transform .72s cubic-bezier(.16, 1, .3, 1);
}

.footer-word.footer-word--approved .footer-letter img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
}

@media (min-width: 761px) and (max-width: 1180px) {
  .hero--v53 .global-orbit-overlay {
    left: 24%;
  }
}

@media (max-width: 760px) {
  body {
    min-width: 0;
  }

  .site-header {
    height: 78px;
  }

  .site-header.is-scrolled {
    height: 70px;
  }

  .brand.brand--master,
  .site-header.is-scrolled .brand.brand--master {
    width: 112px;
    height: 66px;
  }

  .hero--v53 .global-orbit-overlay {
    inset: 205px -18% 128px -18%;
  }

  .hero--v53 .global-orbit-logo {
    width: clamp(42px, 12vw, 52px);
  }

  .hero--v53 .global-orbit-chain path {
    opacity: .60;
    stroke-width: 1.02;
    stroke-dasharray: .7 8.2;
  }

  .models-deck {
    border-left: 0;
  }

  .footer-word.footer-word--approved {
    padding-top: 54px;
  }
}

@media (max-width: 390px) {
  .hero--v53 .global-orbit-overlay {
    top: 210px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero--v53 .global-orbit-chain path {
    animation: none;
  }

  .footer-word.footer-word--approved > img,
  .footer-letter {
    transition: none;
  }
}