:root{
  --ink:#11100d;
  --paper:#fff5d8;
  --gold:#ffbd00;
  --orange:#f28b00;
  --cream:#fff8e8;
  --line:rgba(17,16,13,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.wrap{width:min(1160px,calc(100% - 34px));margin-inline:auto}
.grain{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:99;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
.nav{height:84px;display:flex;align-items:center;justify-content:space-between;border-bottom:2px solid var(--ink)}
.brand{display:flex;align-items:center;gap:10px;font-weight:1000;font-size:23px;letter-spacing:-1px}
.brand img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.nav nav{display:flex;align-items:center;gap:24px;font-size:13px;font-weight:900;letter-spacing:.05em}
.nav-buy{background:var(--ink);color:white;padding:11px 17px;border-radius:99px}
.hero{min-height:700px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:40px;padding-block:60px 70px}
.eyebrow,.section-kicker{font-size:13px;font-weight:1000;letter-spacing:.12em;margin-bottom:16px}
.hero h1,.section h2,.how-section h2,.finale h2{font-size:clamp(58px,8vw,115px);line-height:.82;letter-spacing:-.075em;margin:0;font-weight:1000;text-transform:uppercase}
.hero h1 span{color:var(--orange);-webkit-text-stroke:2px var(--ink);text-shadow:5px 5px 0 var(--ink)}
.lede{font-size:20px;line-height:1.45;max-width:590px;margin:30px 0 0;font-weight:700}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:0 22px;border:2px solid var(--ink);font-weight:1000;font-size:14px;letter-spacing:.04em;box-shadow:5px 5px 0 var(--ink);transition:.15s transform,.15s box-shadow}
.btn:hover{transform:translate(2px,2px);box-shadow:3px 3px 0 var(--ink)}
.primary{background:var(--gold)}
.ghost{background:var(--cream)}
.contract-card{margin-top:30px;border:2px solid var(--ink);padding:14px 14px 14px 18px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#fff;max-width:610px;box-shadow:6px 6px 0 rgba(17,16,13,.12)}
.contract-card .label{display:block;font-size:10px;font-weight:1000;letter-spacing:.12em;margin-bottom:6px}
.contract-card code{font-size:13px;word-break:break-all}
.contract-card button{border:0;background:var(--ink);color:#fff;font-weight:1000;padding:12px 15px;cursor:pointer}
.hero-art{position:relative;display:grid;place-items:center;min-height:520px}
.logo-shell{width:min(510px,95%);aspect-ratio:1;border-radius:50%;overflow:hidden;box-shadow:16px 18px 0 var(--ink);transform:rotate(2deg);position:relative;z-index:2}
.logo-shell img{width:100%;height:100%;object-fit:cover}
.sun{position:absolute;width:460px;height:460px;border-radius:50%;background:var(--gold);right:-35px;top:45px;border:3px solid var(--ink);z-index:0}
.ticker-stamp{position:absolute;z-index:4;right:-4px;bottom:50px;background:#fff;color:var(--ink);border:3px solid var(--ink);padding:12px 20px;font-size:28px;font-weight:1000;transform:rotate(-7deg);box-shadow:6px 6px 0 var(--ink)}
.ticker-strip{overflow:hidden;background:var(--ink);color:var(--gold);padding:18px 0;border-block:3px solid var(--ink);transform:rotate(-1deg);width:102%;margin-left:-1%}
.ticker-track{display:flex;gap:50px;white-space:nowrap;font-size:22px;font-weight:1000;letter-spacing:.04em;animation:marquee 18s linear infinite;width:max-content}
@keyframes marquee{to{transform:translateX(-25%)}}
.section{padding-block:110px}
.about-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end}
.section h2{font-size:clamp(48px,6vw,82px)}
.section h2 em{color:var(--orange);font-style:normal}
.about-copy p{font-size:20px;line-height:1.5;font-weight:700;margin:0 0 20px}
.about-copy .micro{font-size:13px;font-weight:700;opacity:.65}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:60px}
.card{border:2px solid var(--ink);padding:28px;background:#fff;min-height:220px;box-shadow:7px 7px 0 var(--ink)}
.card span{font-weight:1000;color:var(--orange)}
.card h3{font-size:30px;letter-spacing:-.04em;margin:35px 0 8px}
.card p{font-weight:700;line-height:1.45;margin:0}
.how-section{background:var(--gold);border-block:3px solid var(--ink);padding-block:100px}
.section-kicker.dark{margin-bottom:15px}
.how-section h2{font-size:clamp(46px,6vw,76px);max-width:900px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:55px 0 34px}
.step{background:var(--paper);border:2px solid var(--ink);padding:24px;display:flex;gap:16px;box-shadow:7px 7px 0 var(--ink)}
.step b{display:grid;place-items:center;width:44px;height:44px;min-width:44px;border-radius:50%;background:var(--ink);color:#fff;font-size:20px}
.step h3{margin:3px 0 7px;font-size:22px}
.step p{margin:0;line-height:1.4;font-weight:700}
.dark-btn{background:var(--ink);color:white;box-shadow:5px 5px 0 #fff;border-color:var(--ink)}
.finale{padding-block:110px;display:grid;grid-template-columns:.8fr 1.2fr;gap:65px;align-items:center}
.finale>img{border-radius:34px;border:3px solid var(--ink);box-shadow:12px 12px 0 var(--gold)}
.finale h2{font-size:clamp(64px,9vw,128px);color:var(--ink)}
.social-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:30px}
.social-row a{border:2px solid var(--ink);padding:12px 16px;background:#fff;font-weight:1000;box-shadow:4px 4px 0 var(--ink)}
footer{background:var(--ink);color:#fff;padding:45px 0}
.footer-inner{display:grid;grid-template-columns:auto 1fr auto;gap:35px;align-items:start}
.footer-inner strong{font-size:22px}
.footer-inner p{margin:0;opacity:.65;font-size:12px;line-height:1.5;max-width:650px}
.footer-inner span{font-size:12px;opacity:.65}
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);background:var(--ink);color:#fff;border:2px solid #fff;padding:12px 18px;font-weight:1000;opacity:0;pointer-events:none;transition:.2s;z-index:100}
.toast.show{opacity:1;transform:translate(-50%,0)}
@media (max-width:820px){
  .nav nav a:not(.nav-buy){display:none}
  .hero{grid-template-columns:1fr;padding-top:45px;min-height:auto}
  .hero-art{min-height:390px;order:-1}
  .logo-shell{width:min(360px,88vw);box-shadow:10px 11px 0 var(--ink)}
  .sun{width:310px;height:310px;right:0;top:30px}
  .ticker-stamp{right:5px;bottom:20px;font-size:21px}
  .hero h1 span{-webkit-text-stroke:1.2px var(--ink);text-shadow:3px 3px 0 var(--ink)}
  .about-grid,.cards,.steps,.finale{grid-template-columns:1fr}
  .about-grid{gap:30px}
  .cards{gap:20px}
  .finale{gap:45px}
  .finale>img{width:min(420px,100%);margin:auto}
  .footer-inner{grid-template-columns:1fr;gap:18px}
}
@media (max-width:520px){
  .wrap{width:min(100% - 24px,1160px)}
  .nav{height:72px}
  .brand{font-size:20px}.brand img{width:38px;height:38px}
  .hero{padding-block:30px 55px;gap:25px}
  .hero-art{min-height:335px}
  .lede{font-size:17px}
  .actions{display:grid}.btn{width:100%}
  .contract-card{align-items:flex-start;flex-direction:column}
  .contract-card button{width:100%}
  .section,.finale{padding-block:78px}
  .how-section{padding-block:78px}
  .card{min-height:auto}
  .ticker-track{font-size:18px}
}
