:root {
  --space: #05030a;
  --ink: #f7f1e6;
  --muted: #cbbba6;
  --cyan: #e6b34a;
  --cyan-deep: #c4842a;
  --line: rgba(230, 179, 74, 0.42);
}

body,
.home-page {
  background: var(--space) url("brand/solana-field.jpg") center top / cover no-repeat fixed;
  color: var(--ink);
}

.home-page:before {
  opacity: 0.22;
  background-image: radial-gradient(rgba(255, 255, 255, 0.55) 0.6px, transparent 0.8px);
  mix-blend-mode: screen;
}

.launch-strip {
  background: #16130f;
  color: var(--cyan);
  letter-spacing: 0.16em;
}

.site-header {
  color: var(--ink);
  background: rgba(16, 12, 8, 0.82);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.site-header .brand,
.site-header .brand strong {
  color: var(--ink);
}

.site-header .brand small,
.site-nav a.active,
.home-footer .footer-brand small {
  color: var(--cyan);
}

.site-header .brand-mascot,
.home-footer .brand-mascot {
  border: 2px solid var(--cyan);
  border-radius: 50%;
  transform: none;
  box-shadow: 0 0 18px rgba(230, 179, 74, 0.55);
  background: #16130f;
}

.site-nav a {
  color: var(--ink);
}

.site-nav a:hover,
.text-action:hover {
  color: var(--cyan);
}

.chain-identity {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 3px;
  width: auto;
  min-width: 112px;
  background: #000;
  border: 1px solid var(--line);
  text-decoration: none;
}

.chain-identity span {
  color: #c4b49a;
}

.chain-identity strong {
  color: #fff;
  font: 800 14px/1 Manrope, sans-serif;
  letter-spacing: 0.12em;
}

.nav-toggle {
  display: none;
  border: 1px solid var(--line);
  background: transparent;
  color: var(--ink);
  padding: 8px 12px;
  font: 800 11px Manrope, sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
}

.home-hero:before {
  background: rgba(18, 14, 10, 0.78);
  box-shadow: 0 0 0 1px var(--line), 0 24px 70px rgba(196, 132, 42, 0.22);
  clip-path: none;
  border-radius: 18px;
}

.home-hero:after,
.home-page > .official-links:before,
.home-page > .official-links:after {
  display: none;
}

.hero-kicker {
  color: #1a1208 !important;
  background: var(--cyan);
}

.home-hero h1 {
  color: var(--ink);
  font-size: clamp(64px, 6.2vw, 108px);
  text-shadow: 0 0 28px rgba(230, 179, 74, 0.28);
}

.home-hero h1:after {
  background: var(--cyan);
}

.home-hero-copy > p,
.home-intro > div > p,
.not-list p,
.identity-is > p,
.identity-is blockquote {
  color: var(--muted);
}

.hero-market-highlight {
  color: #1a1208;
  background: var(--cyan);
  border-color: #1a1208;
  box-shadow: 7px 7px #1a1208;
}

.primary-action {
  color: #1a1208;
  background: var(--cyan);
  border-color: #1a1208;
  box-shadow: 0 0 24px rgba(230, 179, 74, 0.45);
}

.primary-action:hover {
  background: #f6d78a;
}

.text-action {
  color: var(--ink);
  border-bottom-color: var(--cyan);
}

.paste-shadow {
  background: rgba(196, 132, 42, 0.55);
}

.halftone-disc {
  background-color: #120f0c;
  background-image: radial-gradient(rgba(230, 179, 74, 0.45) 1.4px, transparent 1.6px);
}

.home-hero-art img {
  filter: drop-shadow(0 0 28px rgba(230, 179, 74, 0.45));
}

.art-note {
  color: var(--ink);
  background: rgba(18, 14, 10, 0.88);
  border-color: var(--cyan);
  box-shadow: 0 0 16px rgba(230, 179, 74, 0.35);
}

.art-note.note-two {
  background: var(--cyan);
  color: #1a1208;
}

.home-hero-copy {
  min-width: 0;
  max-width: 100%;
}

.home-hero-copy > p {
  max-width: 100%;
}

.marker-heart {
  color: var(--cyan);
}

.hero-stamp {
  color: var(--ink);
  border-color: var(--cyan);
  background: rgba(18, 14, 10, 0.72);
}

.hero-stamp:before,
.hero-stamp:after {
  border-color: var(--cyan);
}

.hero-stamp i,
.hero-stamp i:after {
  color: var(--cyan);
  background: transparent;
}

.home-page > .official-links {
  background: rgba(18, 14, 10, 0.86);
  box-shadow: 0 0 0 1px var(--line), 0 18px 50px rgba(196, 132, 42, 0.18);
  transform: none;
}

.home-page > .official-links .official-links-heading h2,
.official-links-heading > p {
  color: var(--ink);
}

.official-links-heading > p,
.home-section-number,
.not-list article > span {
  color: var(--cyan);
}

.home-page > .official-links .official-links-list {
  border-color: var(--line);
}

.home-page > .official-links .contract-link,
.contract-link {
  background: var(--cyan);
  color: #1a1208;
  clip-path: none;
}

.contract-link code {
  overflow-wrap: anywhere;
  font-size: 13px;
}

.contract-link button {
  border-color: #1a1208;
  color: #1a1208;
}

.home-page > .official-links .official-links-list > a,
.official-links-list > a {
  background: rgba(22, 16, 10, 0.92);
  color: var(--ink);
  border-color: var(--line);
}

.official-links-list a small,
.home-page > .official-links .official-links-list a small {
  color: var(--muted);
}

.home-page > .official-links .official-links-list > a:hover,
.official-links-list > a:hover {
  background: rgba(140, 90, 30, 0.5);
}

.link-symbol {
  color: var(--cyan);
  border-color: var(--line);
}

.swappy-girls-section:before {
  background:
    linear-gradient(rgba(16, 12, 8, 0.45), rgba(16, 12, 8, 0.62)),
    url("brand/gold-band.jpg") center / cover no-repeat;
  border-color: var(--line);
  box-shadow: 0 0 40px rgba(230, 179, 74, 0.28);
}

.swappy-girls-heading h2 {
  color: var(--ink);
}

.swappy-girls-heading h2 strong {
  color: #1a1208;
  background: var(--cyan);
}

.swappy-girls-heading h2 span {
  color: #1a1208;
  background: #f6e7c4;
}

.swappy-girls-heading > p {
  color: #1a1208;
  background: var(--cyan);
  border-color: #f6e7c4;
  box-shadow: 10px 10px #8d5e16;
}

@keyframes recruitment-poster-float {
  0%,
  100% {
    transform: translateY(0) rotate(-1deg);
    box-shadow: 10px 10px #8d5e16;
  }

  50% {
    transform: translateY(-8px) rotate(0.35deg);
    box-shadow: 15px 16px #8d5e16;
  }
}

.swappy-girls-heading > p:after {
  color: #fff;
}

.sigil-banner {
  display: block;
  width: calc(100% - 84px);
  height: auto;
  margin: 6px 42px 8px;
  border: 1px solid var(--line);
  box-shadow: 0 0 36px rgba(230, 179, 74, 0.35);
}

.home-intro {
  background: rgba(18, 14, 10, 0.88);
  color: var(--ink);
  clip-path: none;
  transform: none;
  border: 1px solid var(--line);
  box-shadow: 0 0 32px rgba(196, 132, 42, 0.2);
}

.home-intro .home-section-number {
  color: var(--cyan);
  border-color: var(--cyan);
}

.home-intro h2,
.identity-not h2,
.identity-is h3,
.identity-is-title {
  color: var(--ink);
}

.identity-not {
  background: rgba(18, 14, 10, 0.9);
  color: var(--ink);
  border-color: var(--line);
  clip-path: none;
}

.identity-not .not-list,
.identity-not .not-list article {
  border-color: var(--line);
}

.identity-not .not-list p {
  color: var(--muted);
}

.identity-is {
  background:
    linear-gradient(rgba(18, 14, 10, 0.78), rgba(18, 14, 10, 0.88)),
    url("brand/gold-band.jpg") center / cover no-repeat;
  color: var(--ink);
  clip-path: none;
  transform: none;
  box-shadow: inset 0 0 0 1px var(--line), 0 0 40px rgba(230, 179, 74, 0.16);
}

.identity-is-title {
  border-bottom-color: var(--cyan);
}

.identity-is h3 em {
  color: var(--cyan);
}

.identity-is blockquote {
  border-top-color: var(--line);
}

.home-footer {
  background: rgba(14, 11, 8, 0.92);
  box-shadow: 0 0 0 1px var(--line), 0 0 28px rgba(196, 132, 42, 0.2);
  clip-path: none;
}

.home-footer .footer-brand,
.home-footer a {
  color: var(--ink);
}

.home-footer p {
  color: var(--muted);
}

.brand strong {
  max-width: 240px;
}

@media (max-width: 900px) {
  .site-header {
    position: relative;
    flex-wrap: wrap;
    row-gap: 8px;
  }

  .site-header .header-actions {
    display: flex;
    margin-left: auto;
  }

  .nav-toggle {
    display: inline-flex;
  }

  .site-header .chain-identity {
    display: none;
  }

  .site-header nav.site-nav {
    display: none;
    order: 3;
    flex: 1 0 100%;
    flex-direction: column;
    gap: 0;
    padding: 8px 0 4px;
  }

  .site-header nav.site-nav.open {
    display: flex;
  }

  .site-nav a {
    padding: 10px 0;
  }

  .sigil-banner {
    width: calc(100% - 24px);
    margin-inline: 12px;
  }
}

@media (max-width: 720px) {
  .site-header {
    min-height: 74px;
  }

  .site-header .brand {
    min-width: 0;
    flex: 1 1 auto;
  }

  .site-header .brand > span:last-child {
    display: flex;
    min-width: 0;
  }

  .site-header .brand strong {
    max-width: 100%;
    font-size: 13px;
  }

  .nav-toggle {
    flex: 0 0 auto;
  }

  .home-hero {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding-left: 16px;
    padding-right: 16px;
    box-sizing: border-box;
  }

  .home-hero h1,
  .home-hero-copy > p {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .home-hero h1 {
    font-size: 34px;
  }
}