:root{--headerH:68px;--bg:#070a12;--ink:#e6e9f4;--mut:#b9c0d4;--accent:#ffcf5b;--card:rgba(255,255,255,.06);--line:rgba(255,255,255,.12)}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
section[id]{scroll-margin-top:90px}
.wrap{max-width:1120px;margin:0 auto;padding:0 20px}
.btn{display:inline-block;background:var(--accent);color:#111;font-weight:800;padding:12px 18px;border-radius:14px;box-shadow:0 8px 30px rgba(255,207,91,.25);transition:transform .18s,box-shadow .18s,filter .18s;position:relative;isolation:isolate}
.btn:hover{transform:translateY(-1.5px);box-shadow:0 14px 38px rgba(255,207,91,.35);filter:saturate(1.15)}
.btn.alt{background:transparent;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.btn.alt:hover{border-color:rgba(255,207,91,.55);box-shadow:0 8px 28px rgba(255,207,91,.18)}
header.sticky{position:sticky;top:0;backdrop-filter:saturate(1.2) blur(8px);background:rgba(7,10,18,.7);border-bottom:1px solid var(--line);z-index:20}
header .bar{display:flex;align-items:center;justify-content:space-between;height:68px}
header .brand{display:flex;align-items:center;gap:12px}
.logo{height:48px;width:48px;border-radius:999px;border:3px solid rgba(255,207,91,.35)}
header nav{position:relative;display:flex;align-items:center;gap:18pxposition:relative;}
header nav a.navlink{opacity:.92;letter-spacing:.02em;padding:10px 4px;transition:letter-spacing .15s,color .15s,text-shadow .15s}
header nav a.navlink:hover{letter-spacing:.04em;color:#fff;text-shadow:0 0 12px rgba(255,207,91,.35)}
.mobile-toggle{display:none;appearance:none;background:transparent;border:0;color:var(--ink);width:42px;height:42px;border-radius:10px;align-items:center;justify-content:center;cursor:pointer}
.mobile-menu{display:none;padding:12px 20px;background:rgba(7,10,18,.96);border-bottom:1px solid var(--line)}
header.open .mobile-menu{display:block}
.mobile-menu a{display:block;padding:14px 6px;border-radius:10px}
.mobile-menu a:hover{background:rgba(255,255,255,.06)}
.hero{position:relative;isolation:isolate}

.hero .sh{inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,10,18,.2),rgba(7,10,18,.92))}
h1{font-size:clamp(28px,6.2vw,60px);line-height:1.05;margin:14px 0 0}h2{font-size:30px;margin:0}h3{font-size:24px;margin:0}.lead{max-width:760px;color:var(--mut)}

.headline .ink{background:linear-gradient(90deg,var(--ink),var(--accent),var(--ink));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;transition:background-position .5s,filter .3s}
.headline::after{content:"";bottom:-4px;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transform:scaleX(.25);transform-origin:left;transition:transform .35s;opacity:.9}
.headline.revealed .ink{background-position:100% 0}.headline.revealed::after{transform:scaleX(1)}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;position:relative}
.section{padding:72px 0}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;align-items:center}
.pill{display:inline-block;border:1px solid var(--line);background:rgba(255,255,255,.05);padding:6px 10px;border-radius:999px;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.crest{height:220px;width:220px;border-radius:999px;border:6px solid rgba(255,207,91,.28);box-shadow:0 10px 40px rgba(255,207,91,.22)}
.list2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:18px}
.token{display:flex;align-items:center;justify-content:space-between}
.how{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.video{overflow:hidden;border-radius:18px;border:1px solid var(--line);background:var(--card)}
.footer{border-top:1px solid var(--line);padding:26px 0;background:#000000aa}
@media (max-width:900px){.row{grid-template-columns:1fr}.grid3{grid-template-columns:1fr 1fr}.how{grid-template-columns:1fr 1fr}header nav{display:noneposition:relative;}.mobile-toggle{display:flex}.wrap{padding:0 16px}}
@media (max-width:520px){.grid3{grid-template-columns:1fr}.how{grid-template-columns:1fr}.btn,.btn.alt{width:100%;text-align:center}.section{padding:56px 0}.crest{height:160px;width:160px;border-width:5px}.lead{font-size:.98rem}}
.desktop-only{display:inline-block}
@media (max-width:900px){.desktop-only{display:none}}


.contractbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}
.contractwrap{display:flex;align-items:center;gap:10px;padding:10px 20px;flex-wrap:wrap;justify-content:flex-start}
.contractwrap .label{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.contractwrap .addr{font:600 0.9rem/1.2 ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;background:var(--card);border:1px solid var(--line);padding:8px 10px;border-radius:12px}
.btn.small{padding:8px 12px;border-radius:12px;font-weight:700}
@media (max-width:520px){
  .contractwrap .addr{word-break:break-all;flex:1 1 100%}
}

.mobile-only{display:none}
@media (max-width:900px){.mobile-only{display:inline}.desktop-only{display:none}}

@media (max-width:900px){.contractbar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}}

@media (max-width:900px){.contractbar{display:none!important}}

.hero .bg{position:absolute;inset:0;z-index:-2;opacity:.65;background:url(./banner-hero.png) center/cover no-repeat}

.headline{display:inline-block;position:relative;padding-bottom:6px;margin-bottom:18px}
.headline .ink{background:linear-gradient(90deg,var(--ink),var(--accent),var(--ink));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;transition:background-position .5s,filter .3s}
.headline::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);transform:scaleX(.25);transform-origin:left;transition:transform .35s;opacity:.95;pointer-events:none}
.headline.revealed .ink{background-position:100% 0}.headline.revealed::after{transform:scaleX(1)}

header nav a.navlink{position:relative}
header nav a.navlink::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:-6px;
  height:2px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s ease;
  pointer-events:none;
  border-radius:2px;
}
header nav a.navlink:hover::after{ transform:scaleX(1); }


/* Mobile fixes */

}

/* Mobile footer contract pill */
#mobile-contract{ display:none; }

}

/* Mobile footer contract pill */
#mobile-contract{ display:none; }
@media (max-width: 900px){
  #mobile-contract{ display:block; }
  #mobile-contract .label{ display:block; margin-bottom:6px; }
  
}


/* Mobile menu overlay */
@media (max-width: 900px){
  header .bar nav{ display:none !important; }
  header .mobile-toggle{ display:flex !important; }
  .mobile-menu{
    display:none;
    position:fixed;
    left:0; right:0;
    top: calc(var(--headerH) + env(safe-area-inset-top));
    z-index:1000;
    background:rgba(7,10,18,.98);
    border-bottom:1px solid var(--line);
    padding:8px 20px 14px;
    box-shadow:0 12px 32px rgba(0,0,0,.4);
  }
  header.open .mobile-menu{ display:block; }
  .mobile-menu a{
    display:block;
    padding:14px 6px;
    border-radius:10px;
    font-size:1.05rem;
  }
  .mobile-menu a:hover{ background:rgba(255,255,255,.06); }
  /* Hide the large top contract bar on mobile */
  .contractbar{ display:none !important; }
}

#mobile-contract{ display:none; }
@media (max-width: 900px){
  #mobile-contract{ display:block; }
  #mobile-contract .label{ display:block; margin-bottom:6px; }
  
}


/* Ensure mobile toggle is always visible above the overlay */
header .bar{ position:relative; z-index:1102; }
.mobile-toggle{ z-index:1101; }
@media (max-width:900px){
  header .bar nav{ display:none !important; }
  header .mobile-toggle{ display:flex !important; }
  .mobile-menu{ z-index:1100; }
}

/* Stronger mobile contract font sizing */
@media (max-width:900px){
  
}



/* Visible hamburger button */
.mobile-toggle{
  display:none;
  appearance:none;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  width:44px; height:44px;
  border-radius:10px;
  align-items:center; justify-content:center;
  margin-left:auto;
  cursor:pointer;
  z-index:1101;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.mobile-toggle .burger,
.mobile-toggle .burger::before,
.mobile-toggle .burger::after{
  content:"";
  display:block;
  width:22px; height:2px;
  background:var(--ink);
  border-radius:2px;
  position:relative;
}
.mobile-toggle .burger::before{ position:absolute; top:-7px; left:0 }
.mobile-toggle .burger::after{ position:absolute; top:7px; left:0 }
header.open .mobile-toggle .burger{ transform: rotate(45deg) }
header.open .mobile-toggle .burger::before{ transform: translateY(7px) rotate(90deg) }
header.open .mobile-toggle .burger::after{ opacity:0 }

@media (max-width:900px){
  header .bar nav{ display:none !important; }
  header .mobile-toggle{ display:flex !important; }
}


#mobile-contract code{
  display:block; width:100%;
  overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch;
  font-size:0.6rem !important; line-height:1.2;
  padding:4px 8px;
  background:var(--card); border:1px solid var(--line); border-radius:10px;
  text-align:center;
}