:root{--bg:#06111d;--panel:#0d2032;--line:#1b4565;--blue:#69c0ff;--text:#eef8ff;--muted:#9db4c5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 5%,#123d61 0,#06111d 30%),#06111d;color:var(--text);font-family:Arial,Helvetica,sans-serif}.wrap{width:min(1120px,calc(100% - 32px));margin:auto}header{position:sticky;top:0;z-index:10;background:#06111ddd;backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav{height:78px;display:flex;align-items:center;justify-content:space-between}.brand{font-weight:800;letter-spacing:.14em}.brand span{font-weight:400;color:var(--muted);font-size:12px;letter-spacing:0}.nav nav{display:flex;gap:22px}.nav a,footer a{color:var(--muted);text-decoration:none}.nav nav a:hover{color:#fff}section{padding:82px 0;border-bottom:1px solid #14334b}.hero{min-height:650px;display:grid;grid-template-columns:1.15fr .85fr;gap:60px;align-items:center}.eyebrow{color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.18em}h1{font-size:64px;line-height:1.02;margin:12px 0 22px}h1 em{font-style:normal;color:var(--blue)}h2{font-size:42px;margin:8px 0 18px}h3{margin-top:0}p{color:var(--muted);line-height:1.7}.lead{font-size:18px;max-width:680px}.buttons{display:flex;gap:12px;margin:28px 0}.btn{display:inline-flex;padding:14px 20px;border:1px solid #32658a;border-radius:12px;text-decoration:none;color:#fff;font-weight:700}.primary{background:linear-gradient(135deg,#77c8ff,#2699e7);color:#06111d;border:0}.stats{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:14px;overflow:hidden}.stats div{padding:17px;background:#091827}.stats b,.stats span,.specs span,.links span{display:block}.stats span,.specs span,.links span{font-size:11px;color:var(--muted);margin-top:5px}.coin{margin:auto;width:360px;aspect-ratio:1;border:1px solid #4c9ed4;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 80px #1b82c93d,inset 0 0 70px #1b82c91e;background:radial-gradient(circle,#143b59,#081522 70%)}.coin div{font-size:92px;font-weight:800}.coin strong{font-size:28px;letter-spacing:.2em}.coin span{color:var(--muted);font-size:12px;margin-top:10px}.cards,.links,.specs{display:grid;gap:14px}.cards{grid-template-columns:repeat(3,1fr)}.cards article,.links a,.specs div,.hash,.schedule,.supply{background:linear-gradient(#10283e,#0a1927);border:1px solid var(--line);border-radius:14px}.cards article{padding:24px;min-height:170px}.split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.split li{margin:14px 0;color:#c7d7e3}.specs{grid-template-columns:repeat(3,1fr)}.specs div{padding:18px}.hash{margin-top:14px;padding:18px}.hash span{display:block;font-size:11px;color:var(--muted);margin-bottom:8px}.hash code{word-break:break-all;color:#c8e8ff}.supply{padding:18px}.schedule{overflow:hidden}.schedule div{display:flex;justify-content:space-between;padding:15px 18px;border-bottom:1px solid var(--line)}.schedule div:last-child{border-bottom:0}.schedule span{color:var(--muted)}.links{grid-template-columns:repeat(3,1fr)}.links a{padding:22px;min-height:110px;color:#fff;text-decoration:none}.exchange{display:flex;justify-content:space-between;align-items:center;gap:35px}.exchange>div{max-width:760px}footer{padding:35px 0 55px;color:var(--muted);font-size:12px}@media(max-width:900px){.nav nav{display:none}.hero,.split{grid-template-columns:1fr}.coin{width:min(360px,86vw)}.cards,.links,.specs{grid-template-columns:repeat(2,1fr)}.exchange{align-items:flex-start;flex-direction:column}}@media(max-width:560px){h1{font-size:42px}h2{font-size:32px}section{padding:58px 0}.stats,.cards,.links,.specs{grid-template-columns:1fr}.hero{min-height:auto;padding-top:54px}}
.hero-emblem{
  position:relative;
  display:grid;
  place-items:center;
  min-height:460px;
}
.hero-emblem::before{
  content:"";
  position:absolute;
  width:82%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(54,169,255,.28) 0%,rgba(54,169,255,.10) 42%,transparent 72%);
  filter:blur(18px);
  pointer-events:none;
}
.hero-emblem img{
  position:relative;
  z-index:1;
  width:min(470px,100%);
  height:auto;
  display:block;
  filter:drop-shadow(0 0 22px rgba(50,170,255,.28)) drop-shadow(0 18px 34px rgba(0,0,0,.38));
}
@media(max-width:900px){
  .hero-emblem{min-height:380px}
  .hero-emblem img{width:min(430px,88vw)}
}
@media(max-width:560px){
  .hero-emblem{min-height:310px}
  .hero-emblem img{width:min(330px,88vw)}
}

/* v3 hero image sizing */
.hero-emblem{
  min-height: 430px;
  display:grid;
  place-items:center;
  overflow:visible;
}
.hero-emblem::before{
  display:none;
}
.hero-emblem img{
  width: min(330px, 76%);
  max-width: 330px;
  height: auto;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 0 36px rgba(43,157,235,.18);
}
@media (max-width:900px){
  .hero-emblem{min-height:360px}
  .hero-emblem img{width:min(380px,84vw);max-width:380px}
}
@media (max-width:560px){
  .hero-emblem{min-height:300px}
  .hero-emblem img{width:min(300px,86vw);max-width:300px}
}

/* Fix hero overflow and keep emblem contained */
.hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr) !important;
  overflow: hidden !important;
}

.hero > * {
  min-width: 0 !important;
}

.hero-emblem {
  width: 100% !important;
  max-width: 460px !important;
  min-width: 0 !important;
  justify-self: center !important;
  overflow: hidden !important;
}

.hero-emblem img {
  width: 300px !important;
  max-width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}

body {
  overflow-x: hidden !important;
}

/* Final desktop hero sizing */
.hero {
  grid-template-columns: minmax(0, 1fr) 420px !important;
  gap: 40px !important;
  min-height: 620px !important;
}

.hero-emblem {
  width: 420px !important;
  max-width: 100% !important;
  min-height: 0 !important;
  justify-self: center !important;
}

.hero-emblem img {
  width: 410px !important;
  max-width: 410px !important;
  max-height: 410px !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr !important;
  }

  .hero-emblem {
    width: 100% !important;
  }

  .hero-emblem img {
    width: 320px !important;
    max-width: 80vw !important;
    max-height: 320px !important;
  }
}

/* Make the medallion fill its frame more tightly */
.hero-emblem {
  width: 420px !important;
  height: 360px !important;
  overflow: hidden !important;
  border-radius: 18px !important;
}

.hero-emblem img {
  width: 520px !important;
  max-width: none !important;
  height: auto !important;
  transform: translateY(-55px) !important;
}

/* Simple centered hero coin */
.hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr) !important;
  align-items: center !important;
  overflow: hidden !important;
}

.hero > * {
  min-width: 0 !important;
}

.hero-emblem {
  width: 100% !important;
  max-width: 420px !important;
  min-height: 420px !important;
  margin: 0 auto !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  overflow: visible !important;
}

.hero-emblem::before {
  display: none !important;
}

.hero-emblem img {
  width: min(320px, 78%) !important;
  max-width: 320px !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  transform: none !important;
  border-radius: 50% !important;
  box-shadow: 0 0 28px rgba(43,157,235,.22) !important;
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr !important;
  }

  .hero-emblem {
    min-height: 320px !important;
    max-width: 100% !important;
  }

  .hero-emblem img {
    width: min(280px, 72vw) !important;
    max-width: 280px !important;
  }
}

/* Enlarge medallion inside circular frame */
.hero-emblem img {
  width: 390px !important;
  max-width: 390px !important;
  transform: scale(1.18) !important;
}


/* Final clean transparent hero coin */
.hero {
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr) !important;
  align-items: center !important;
  overflow: hidden !important;
}

.hero > * {
  min-width: 0 !important;
}

.hero-emblem {
  width: 100% !important;
  max-width: 420px !important;
  min-height: 420px !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.hero-emblem::before {
  display: none !important;
}

.hero-emblem img {
  width: 330px !important;
  max-width: 330px !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
  transform: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 0 22px rgba(70,175,255,.28)) !important;
}

@media (max-width: 980px) {
  .hero {
    grid-template-columns: 1fr !important;
  }

  .hero-emblem {
    min-height: 320px !important;
    max-width: 100% !important;
  }

  .hero-emblem img {
    width: 280px !important;
    max-width: 72vw !important;
  }
}

/* Journey section visual upgrade */
#game {
  position: relative;
  gap: 48px !important;
}

#game::before {
  content: "";
  position: absolute;
  inset: 20px -20px;
  border-radius: 24px;
  background:
    radial-gradient(circle at 72% 38%, rgba(57,168,255,.10), transparent 34%),
    linear-gradient(180deg, rgba(11,29,46,.30), rgba(6,17,29,.10));
  border: 1px solid rgba(57,168,255,.08);
  pointer-events: none;
  z-index: 0;
}

#game > * {
  position: relative;
  z-index: 1;
}

#game ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 12px !important;
}

#game li {
  margin: 0 !important;
  padding: 16px 18px 16px 44px !important;
  border: 1px solid rgba(57,168,255,.18) !important;
  border-radius: 14px !important;
  background: linear-gradient(
    180deg,
    rgba(16,40,62,.86),
    rgba(8,24,39,.88)
  ) !important;
  color: #d7e8f4 !important;
  position: relative !important;
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
}

#game li::before {
  content: "◆";
  position: absolute;
  left: 18px;
  color: #69c0ff;
  font-size: 10px;
  text-shadow: 0 0 12px rgba(57,168,255,.55);
}

#game h2 {
  margin-bottom: 18px !important;
}

#game p {
  max-width: 620px !important;
}

@media (max-width: 980px) {
  #game {
    grid-template-columns: 1fr !important;
  }

  #game::before {
    inset: 10px 0;
  }
}


/* Tighten Journey-to-Network spacing */
#game {
  padding-bottom: 58px !important;
}

#network {
  padding-top: 58px !important;
}

/* Tighter Journey-to-Network transition */
#game {
  padding-bottom: 34px !important;
  margin-bottom: 0 !important;
}

#network {
  padding-top: 34px !important;
  margin-top: 0 !important;
}

/* Network card cleanup */
#network .specs {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 14px !important;
}

#network .specs > div {
  min-height: 92px !important;
  padding: 18px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

#network .specs span {
  margin: 0 0 6px 0 !important;
}

#network .specs b {
  line-height: 1.1 !important;
}

@media (max-width: 980px) {
  #network .specs {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 560px) {
  #network .specs {
    grid-template-columns: 1fr !important;
  }
}

/* Tokenomics visual upgrade */
#tokenomics {
  gap: 48px !important;
  align-items: stretch !important;
}

#tokenomics > div:first-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

#tokenomics .supply {
  margin-top: 22px !important;
  padding: 18px 20px !important;
  border: 1px solid rgba(57,168,255,.24) !important;
  border-radius: 14px !important;
  background: linear-gradient(
    180deg,
    rgba(17,43,66,.92),
    rgba(8,25,40,.92)
  ) !important;
  box-shadow: inset 0 0 28px rgba(57,168,255,.04) !important;
}

#tokenomics .supply b {
  display: block !important;
  color: #eef8ff !important;
  margin-bottom: 6px !important;
}

#tokenomics .schedule {
  border-radius: 16px !important;
  overflow: hidden !important;
  border: 1px solid rgba(57,168,255,.24) !important;
  background: rgba(8,24,39,.92) !important;
  box-shadow: inset 0 0 34px rgba(57,168,255,.035) !important;
}

#tokenomics .schedule div {
  padding: 18px 20px !important;
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid rgba(57,168,255,.14) !important;
}

#tokenomics .schedule div:last-child {
  border-bottom: 0 !important;
}

#tokenomics .schedule div:first-child {
  background: linear-gradient(
    90deg,
    rgba(57,168,255,.16),
    rgba(57,168,255,.04)
  ) !important;
}

#tokenomics .schedule div:first-child span::after {
  content: "  CURRENT";
  margin-left: 10px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #69c0ff;
}

#tokenomics .schedule div:last-child {
  background: linear-gradient(
    90deg,
    rgba(31,74,108,.24),
    rgba(12,30,46,.10)
  ) !important;
}

#tokenomics .schedule div:last-child span::after {
  content: "  TAIL";
  margin-left: 10px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .12em;
  color: #9dd7ff;
}

#tokenomics .schedule span {
  color: #b9cfdf !important;
}

#tokenomics .schedule b {
  font-size: 18px !important;
  color: #ffffff !important;
}

@media (max-width: 980px) {
  #tokenomics {
    grid-template-columns: 1fr !important;
  }
}

/* Official Links polish */
#links .links a {
  position: relative !important;
  overflow: hidden !important;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease !important;
}

#links .links a::after {
  content: "→";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  color: #69c0ff;
  font-size: 20px;
  opacity: .65;
  transition: transform .18s ease, opacity .18s ease;
}

#links .links a:hover {
  transform: translateY(-3px);
  border-color: rgba(105,192,255,.45) !important;
  background: linear-gradient(
    180deg,
    rgba(20,53,81,.95),
    rgba(10,29,45,.95)
  ) !important;
  box-shadow:
    0 10px 28px rgba(0,0,0,.22),
    0 0 24px rgba(57,168,255,.08) !important;
}

#links .links a:hover::after {
  transform: translate(4px,-50%);
  opacity: 1;
}

#links .links span {
  margin-bottom: 6px !important;
}

#links .links b {
  padding-right: 28px !important;
  line-height: 1.25 !important;
}

/* Exchange & Technical Review panel */
.exchange {
  position: relative !important;
  padding: 44px 38px !important;
  margin-top: 0 !important;
  border: 1px solid rgba(57,168,255,.20) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 85% 45%, rgba(57,168,255,.10), transparent 32%),
    linear-gradient(
      180deg,
      rgba(15,39,60,.78),
      rgba(7,22,35,.82)
    ) !important;
  box-shadow: inset 0 0 42px rgba(57,168,255,.025) !important;
}

.exchange h2 {
  margin-bottom: 14px !important;
}

.exchange p {
  max-width: 800px !important;
}

.exchange .btn {
  min-width: 250px !important;
  min-height: 56px !important;
  font-size: 15px !important;
  box-shadow: 0 10px 28px rgba(57,168,255,.14) !important;
}

.exchange .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px rgba(57,168,255,.22) !important;
}

@media (max-width: 980px) {
  .exchange {
    padding: 32px 24px !important;
  }

  .exchange .btn {
    width: 100% !important;
    max-width: 320px !important;
  }
}


/* ===== Final site polish v18 ===== */

.exchange-copy {
  max-width: 820px;
}

.exchange-status {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 22px;
}

.exchange-status span {
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(105,192,255,.22);
  background: rgba(57,168,255,.07);
  color: #bfe3fb;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
}

.exchange-status span::first-letter {
  color: #69c0ff;
}

.exchange-contact {
  margin-top: 18px !important;
  font-size: 13px;
}

.exchange-contact a {
  color: #69c0ff;
  font-weight: 700;
}

.exchange-actions {
  flex: 0 0 auto;
}

.exchange-actions .btn {
  gap: 10px;
  white-space: nowrap;
}

.exchange-actions small {
  padding: 3px 6px;
  border-radius: 5px;
  background: rgba(6,17,29,.16);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .08em;
}

footer.wrap {
  min-height: 125px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

footer.wrap strong,
footer.wrap span {
  display: block;
}

footer.wrap strong {
  color: #eef8ff;
  margin-bottom: 6px;
}

footer.wrap a {
  color: #9db4c5;
}

footer.wrap a:hover {
  color: #69c0ff;
}

footer.wrap > div:last-child {
  text-align: right;
}

footer.wrap > div:last-child span {
  display: inline;
}

@media (max-width: 980px) {
  .exchange-status {
    gap: 7px;
  }

  footer.wrap {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
  }

  footer.wrap > div:last-child {
    text-align: left;
  }
}
