:root {
  --ink: #12171b;
  --muted: #637078;
  --lime: #a9e965;
  --hero: #b9f77a;
  --aqua: #32dfd1;
  --yellow: #bedc21;
}

* { box-sizing: border-box; }
h1, h2, h3, h4, p { margin: 0; }
button { font: inherit; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: #fff;
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  height: 50px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  background: rgba(255,255,255,.96);
  border-top: 2px solid var(--ink);
  box-shadow: 0 1px 0 rgba(10,20,25,.03);
}
.brand { display:flex; align-items:center; gap:6px; font-size:18px; font-weight:800; margin-right:22px; }
.brand-mark { position:relative; width:22px; height:18px; display:inline-block; }
.brand-mark i { position:absolute; width:13px; height:9px; border:2px solid var(--ink); border-radius:50%; transform:rotate(-32deg); }
.brand-mark i:first-child { left:0; top:5px; border-right-color:transparent; }
.brand-mark i:last-child { right:0; top:3px; border-left-color:transparent; }
.main-nav { display:flex; align-items:stretch; height:100%; gap:4px; }
.main-nav a { display:flex; align-items:center; gap:7px; padding:0 9px; font-size:12px; color:#3d474d; border-radius:8px; }
.main-nav a:hover, .main-nav .active { background:#fafcfb; }
.main-nav small { padding:2px 5px; background:#e7ef9c; font-size:8px; }
.header-actions { margin-left:auto; display:flex; align-items:center; gap:8px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 18px; border-radius:999px; font-size:12px; font-weight:700; cursor:pointer; transition:transform .2s, box-shadow .2s; }
.button:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(12,22,28,.12); }
.button-dark { color:white; background:linear-gradient(180deg,#293137,#13191d); border:1px solid #111; box-shadow:inset 0 2px 2px rgba(255,255,255,.16); }
.button-outline { border:1px solid #8d999f; background:#fff; }
.button-small { min-height:28px; padding:0 14px; font-size:10px; }
.icon-button { width:24px; height:28px; border:0; background:transparent; font-size:20px; color:#4b555a; cursor:pointer; }
.download { font-size:24px; line-height:1; transform:translateY(-1px); }

.hero {
  min-height: 760px;
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 48%, rgba(149,239,74,.72), transparent 48%),
    linear-gradient(180deg, #dfffc9 0%, #b9f47c 43%, #e4ffd0 100%);
  display:flex;
  justify-content:center;
  align-items:center;
  padding:80px 20px 92px;
}
.hero-copy { position:relative; z-index:2; text-align:center; max-width:840px; }
.hero h1, .intro h2, .banks h2, .trusted h3 { margin:0; text-transform:uppercase; font-weight:900; letter-spacing:-.055em; line-height:.98; }
.hero h1 { font-size:76px; }
.hero-copy > p { margin:26px 0 34px; font-size:17px; line-height:1.15; font-weight:600; }
.hero-button { min-width:180px; min-height:48px; }
.float-card { position:absolute; z-index:3; background:#fff; border-radius:14px; box-shadow:0 20px 34px rgba(42,68,33,.13); }
.interest-toast { z-index:1; width:275px; padding:17px 17px 10px; top:48px; left:50%; transform:translateX(-45%) rotate(-9deg); }
.toast-row { display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:7px; margin-bottom:12px; }
.interest-badge { width:27px; height:27px; position:relative; display:block; }
.interest-badge i { position:absolute; right:-3px; bottom:-2px; width:10px; height:10px; border-radius:50%; background:#172026; color:#fff; display:flex; align-items:center; justify-content:center; font-size:8px; line-height:1; font-style:normal; }
.toast-row b, .toast-row small, .products-card b, .products-card small { display:block; }
.toast-row b { font-size:11px; }.toast-row small { color:#7b8489; font-size:9px; }.toast-row strong { color:#18a879; font-size:9px; }
.see-all { display:block; text-align:center; font-size:9px; }
.coin { flex:0 0 auto; width:25px; height:25px; border-radius:50%; background:#86a710; color:white; display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:800; }
.coin-orange { background:#ff7a00; }.coin-silver { background:#edf0f2; color:#6d757a; }.coin-blue { background:#087ec6; font-size:7px; }
.coin-red { background:#e91e38; }.coin-white { background:white; color:#4285f4; font-size:18px; box-shadow:0 0 0 1px #e2e5e6; }.coin-gold { background:#d69905; }
.coin-violet { background:#5134c8; }.coin-lavender { background:#9e9dff; }.coin-mint { background:#20dc74; }
.markets-card { left:22%; bottom:84px; width:245px; padding:18px; transform:rotate(14deg); }
.markets-card > div:not(.market-labels) { display:flex; justify-content:space-between; padding:0 5px; }
.asset-icon { width:25px; height:25px; object-fit:contain; }
.market-labels { display:flex; justify-content:space-between; margin:3px 0 12px; font-size:9px; color:#434b50; }
.market-labels small { color:#858f94; font-size:7px; }
.products-card { right:17%; top:220px; width:270px; padding:15px 17px; transform:rotate(13deg); }
.products-card p { margin:0 0 9px; display:flex; align-items:center; gap:9px; }
.products-card p:last-child { margin-bottom:0; }
.products-card p > span { flex:1; min-width:0; }
.product-logo { width:25px; height:25px; flex:0 0 25px; object-fit:contain; border-radius:50%; }
.bundle-brand { width:25px; height:25px; flex:0 0 25px; object-fit:contain; border-radius:50%; }
.products-card b { font-size:9px; }.products-card small { font-size:7px; color:#7d878b; }

.intro {
  max-width: 1000px;
  margin: 0 auto;
  padding: 120px 28px 145px;
}
.intro-copy { max-width:760px; margin:0 auto; }
.intro h2 { font-size:58px; line-height:1.3; }
.intro-copy p { color:#3e4a51; font-size:16px; margin:22px 0 26px; }
.stats { display:flex; justify-content:center; gap:24px; margin:64px auto 60px; }
.stat { width:235px; height:134px; border-radius:15px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.stat strong { font-size:46px; letter-spacing:-.055em; }
.stat span { margin-top:10px; font-size:17px; }
.stat-lime { background:var(--lime); }.stat-aqua { background:var(--aqua); }.stat-yellow { background:var(--yellow); }
.trusted { display:flex; align-items:center; gap:34px; margin-left:70px; }
.trusted-copy { width:270px; }
.trusted h3 { font-size:52px; }
.trusted-copy p { font-size:14px; line-height:1.28; }
.partner-list { flex:1; min-width:0; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent); }
.partner-track { width:max-content; display:flex; gap:16px; animation:partner-scroll 36s linear infinite; will-change:transform; }
.partner { width:96px; height:96px; flex:0 0 96px; border:1px solid #e0e5e6; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; color:#475158; }
.partner img { width:100%; height:100%; object-fit:contain; border-radius:50%; }
@keyframes partner-scroll { to { transform:translateX(calc(-50% - 8px)); } }

.banks { padding:0 24px 220px; }
.banks > h2 { text-align:center; font-size:64px; margin-bottom:46px; }
.earn-card { max-width:1000px; min-height:600px; margin:0 auto; padding:48px; border-radius:29px; background:var(--lime); display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:80px; }
.earn-copy { display:flex; flex-direction:column; justify-content:space-between; }
.earn-copy h3 { margin:0 0 16px; font-size:31px; font-weight:800; letter-spacing:-.025em; }
.earn-copy h4 { margin:0; font-size:20px; font-weight:750; }
.earn-description { padding-top:18px; border-top:1px solid rgba(18,23,27,.65); }
.earn-description p { max-width:510px; margin:0 0 76px; font-size:16px; line-height:1.22; }
.button-white { border-color:#79858b; }
.earnings-panel { background:#fff; border-radius:16px; padding:16px; box-shadow:0 18px 28px rgba(50,90,32,.08); }
.protocols { padding:18px 16px; border-radius:18px; box-shadow:0 8px 18px rgba(20,30,35,.09); }
.protocols p, .payment-list p { display:flex; align-items:center; gap:12px; margin:0 0 18px; }
.protocols p:last-child, .payment-list p:last-child { margin-bottom:0; }
.protocols p > span:not(.coin), .payment-list p > span:not(.coin) { flex:1; }
.protocols .coin, .payment-list .coin { width:38px; height:38px; flex:0 0 38px; }
.protocol-icon { width:38px; height:38px; flex:0 0 38px; object-fit:contain; }
.protocols b, .protocols small, .payment-list b, .payment-list small { display:block; }
.protocols b { font-size:16px; font-weight:500; }
.protocols small { font-size:13px; color:#748086; margin-top:3px; }
.payment-list b { font-size:14px; font-weight:500; }
.payment-list small { font-size:11px; color:#748086; margin-top:4px; }
.protocols strong { font-size:13px; font-weight:500; }
.earnings-total { display:flex; justify-content:space-between; text-align:left; padding:44px 0 40px; color:#748086; font-size:11px; }
.earnings-total span:last-child { text-align:right; }
.earnings-total b { color:#13191c; font-size:16px; }.earnings-total span:last-child b { color:#09a874; }
.earnings-total small { font-size:10px; }
.payment-list p { margin-bottom:30px; }
.payment-list .coin { width:30px; height:30px; flex-basis:30px; }
.payment-list strong { color:#0ca978; font-size:12px; font-weight:500; }

@media (max-width: 900px) {
  .hero { min-height:720px; }
  .hero h1 { font-size:60px; }
  .markets-card { left:7%; }.products-card { right:6%; }
  .intro h2 { font-size:42px; }
  .trusted { flex-direction:column; align-items:flex-start; }
  .trusted { margin-left:0; }
  .trusted-copy { width:auto; max-width:430px; }
  .earn-card { grid-template-columns:minmax(0,1fr) 300px; gap:40px; padding:38px; }
}

@media (max-width: 680px) {
  .site-header { height:56px; padding:0 14px; }
  .main-nav a:not(.active) { display:none; }
  .main-nav .active { padding:0 4px; }
  .header-actions .button-outline, .header-actions .icon-button { display:none; }
  .hero { min-height:690px; padding:110px 18px 90px; align-items:center; }
  .hero h1 { font-size:43px; line-height:1.02; }
  .hero-copy > p { font-size:14px; line-height:1.25; }
  .desktop-break { display:none; }
  .interest-toast { top:36px; width:180px; transform:translateX(-50%) rotate(-7deg); }
  .interest-toast .toast-row:last-of-type { display:none; }
  .interest-toast .toast-row { margin-bottom:5px; }
  .products-card { top:auto; bottom:30px; right:-30px; width:175px; }
  .markets-card { bottom:36px; left:-32px; width:160px; padding:12px; }
  .markets-card .asset-icon { width:20px; height:20px; }
  .products-card .bundle-brand { display:none; }
  .intro { padding:65px 20px 85px; }
  .intro h2 { font-size:35px; }
  .stats { flex-direction:column; gap:12px; margin:40px 0; }
  .stat { width:100%; height:94px; }
  .trusted h3 { font-size:35px; }
  .partner-list { gap:8px; }
  .partner { width:62px; height:62px; font-size:9px; }
  .banks { padding:0 16px 100px; }
  .banks > h2 { font-size:42px; }
  .earn-card { padding:24px; grid-template-columns:1fr; gap:28px; }
  .earn-copy { gap:48px; }
  .earn-description p { margin-bottom:24px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .button { transition:none; }
}