:root {
  --navy-950: #01040b;
  --navy-900: #020713;
  --navy-850: #041020;
  --navy-800: #07162c;
  --white: #f8fbff;
  --muted: #aab5c6;
  --cyan: #18bff2;
  --blue: #0078ff;
  --gold: #f2bd43;
  --gold-light: #ffe696;
  --gold-deep: #9b641a;
  --line: rgba(237, 183, 62, .42);
  --header-height: 80px;
  --z-back: 0;
  --z-content: 10;
  --z-header: 30;
  --z-menu: 40;
  --z-toast: 50;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--white);
  background: var(--navy-950);
  font-family: Inter, Montserrat, "Segoe UI", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.page-shell { min-height: 100dvh; background: #01040b; }
.site-header {
  height: var(--header-height);
  padding: 0 clamp(24px, 2.6vw, 42px);
  display: grid;
  grid-template-columns: minmax(260px, 1fr) auto minmax(290px, 1fr);
  align-items: center;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: var(--z-header);
  border-bottom: 1px solid rgba(224, 171, 56, .22);
  background: #01040b;
}
.site-header::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 25%;
  width: 37%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #1489d3, transparent);
}
.brand { display: flex; align-items: center; width: fit-content; gap: 13px; }
.brand-mark { width: 72px; height: 62px; display: grid; place-items: center; flex: 0 0 72px; filter: drop-shadow(0 0 7px rgba(27, 151, 255, .2)); }
.brand-mark img { width: 70px; height: 70px; object-fit: contain; }
.brand-copy { display: flex; flex-direction: column; }
.brand-copy strong { color: #f8cb64; font-size: 19px; line-height: 1.15; font-weight: 800; }
.brand-copy small { color: #c4ad82; font-size: 10px; text-transform: uppercase; margin-top: 3px; }
.main-nav { display: flex; align-items: center; gap: clamp(16px, 1.5vw, 26px); height: 100%; }
.main-nav a { position: relative; display: grid; place-items: center; height: 100%; font-size: 12px; font-weight: 650; text-transform: uppercase; color: #e8ebf0; white-space: nowrap; transition: color 160ms ease-out; }
.main-nav a:hover, .main-nav a.active { color: var(--gold-light); }
.main-nav a::after { content: ""; position: absolute; bottom: 0; width: 0; height: 2px; background: var(--gold); transition: width 160ms ease-out; }
.main-nav a:hover::after, .main-nav a.active::after { width: 100%; }
.header-actions { display: flex; justify-content: flex-end; align-items: center; gap: 16px; margin-left: 12px; }
.button { min-height: 40px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid transparent; border-radius: 8px; font-size: 13px; font-weight: 750; text-transform: uppercase; cursor: pointer; transition: transform 160ms ease-out, box-shadow 160ms ease-out, border-color 160ms ease-out; }
.button:hover { transform: translateY(-2px); }
.button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.button-login { border-color: rgba(235, 182, 62, .64); background: #050b16; }
.button-login:hover { border-color: var(--gold-light); box-shadow: 0 0 18px rgba(231, 174, 50, .16); }
.button-gold { position: relative; overflow: hidden; color: #171208; border-color: #ffd875; background: linear-gradient(110deg, #9f6717 0%, #ffd96f 20%, #f3bb42 55%, #fff0aa 82%, #b77b21 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.68), 0 8px 25px rgba(225, 165, 38, .22); }
.button-gold::after { content: ""; position: absolute; inset: -120% auto -120% -35%; width: 25%; transform: rotate(18deg); background: rgba(255,255,255,.55); animation: sheen 4.8s ease-in-out infinite; }
.button-gold:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 10px 32px rgba(244, 187, 64, .4); }
.button-small { min-width: 204px; }
.menu-toggle { display: none; width: 44px; height: 44px; padding: 10px; border: 1px solid rgba(235, 182, 62, .4); border-radius: 7px; background: #050b16; cursor: pointer; }
.menu-toggle span { display: block; width: 100%; height: 2px; margin: 5px 0; background: var(--gold-light); transition: transform 160ms ease-out, opacity 160ms ease-out; }

.hero {
  position: relative;
  min-height: max(calc(100dvh - var(--header-height)), 820px);
  padding: 47px clamp(38px, 5.4vw, 88px) 132px;
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 70% 47%, rgba(0, 89, 190, .18), transparent 29%),
    radial-gradient(circle at 100% 45%, rgba(4, 57, 117, .22), transparent 31%),
    linear-gradient(90deg, #01040b 0%, #020712 42%, #031023 100%);
}
.hero::before { content: ""; position: absolute; z-index: var(--z-back); inset: 0; opacity: .32; background-image: radial-gradient(rgba(255, 205, 90, .7) .75px, transparent .75px); background-size: 48px 48px; mask-image: linear-gradient(90deg, transparent 30%, #000 60%); }
#network-canvas { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .82; }
.hero-copy { width: min(560px, 39vw); position: relative; z-index: var(--z-content); }
.chain-row { display: flex; gap: 18px; margin-bottom: 24px; }
.chain-pill { min-height: 48px; padding: 0 20px; display: inline-flex; align-items: center; gap: 12px; border: 1px solid rgba(132, 169, 195, .2); border-radius: 999px; color: #c7d1dd; background: linear-gradient(110deg, rgba(6, 17, 30, .9), rgba(5, 7, 16, .76)); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); font-family: Consolas, monospace; font-size: 14px; font-weight: 700; text-transform: uppercase; }
.chain-pill svg { width: 19px; fill: #f2b721; }
.status-dot { width: 11px; height: 11px; border-radius: 50%; background: #35e6a5; box-shadow: 0 0 14px #1dd999; animation: statusPulse 2.4s ease-in-out infinite; }
.eyebrow { margin: 0 0 15px; color: #25c9ef; font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .27em; }
h1 { max-width: 600px; margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(58px, 4.75vw, 76px); line-height: 1.04; font-weight: 700; text-wrap: balance; text-shadow: 0 2px 20px rgba(0,0,0,.45); }
h1 em { color: #f6c858; font-style: normal; white-space: nowrap; text-shadow: 0 0 27px rgba(240, 184, 62, .13); }
.hero-description { max-width: 550px; margin: 25px 0 0; color: #adb6c4; font-size: 16px; line-height: 1.65; text-wrap: pretty; }
.hero-description strong { color: #f3f5f8; }
.hero-actions { display: grid; grid-template-columns: 230px 150px; gap: 20px; margin-top: 20px; }
.button-large { width: 100%; min-width: 0; min-height: 54px; font-size: 14px; text-transform: none; }
.button-outline { color: #f2f3f5; border-color: rgba(235, 180, 54, .74); background: rgba(3, 9, 20, .76); }
.button-outline span { color: #f2bd43; font-size: 24px; }
.button-outline:hover { border-color: #ffe49a; box-shadow: 0 0 24px rgba(243, 188, 61, .13); }
.wallet-row { display: grid; grid-template-columns: 262px 325px; gap: 15px; margin-top: 16px; }
.wallet-button, .contract { min-height: 45px; border: 1px solid rgba(30, 107, 186, .45); border-radius: 7px; color: #d5dce7; background: rgba(3, 9, 20, .74); cursor: pointer; transition: border-color 160ms ease-out, transform 160ms ease-out; }
.wallet-button:hover, .contract:hover { border-color: #168de6; transform: translateY(-1px); }
.wallet-button { width: 100%; display: flex; align-items: center; justify-content: center; gap: 11px; font-size: 14px; font-weight: 650; }
.wallet-button svg { width: 20px; fill: none; stroke: #20bdf3; stroke-width: 1.6; }
.contract { width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; font-family: Consolas, monospace; font-size: 13px; white-space: nowrap; }
.contract span { color: #7f8999; }
.contract strong { color: #19b9f2; }
.contract svg { width: 18px; margin-left: 8px; fill: none; stroke: #6c829f; stroke-width: 1.5; }

.hero-visual { position: absolute; z-index: 5; top: 0; right: 1.5%; width: 63%; height: calc(100% - 88px); pointer-events: none; }
.hero-visual > img { position: absolute; z-index: 6; width: 126%; height: auto; right: -20%; bottom: 3.5%; filter: drop-shadow(0 20px 30px rgba(0,0,0,.35)); animation: heroFloat 5.5s ease-in-out infinite; }
.globe { position: absolute; z-index: 2; width: min(40vw, 620px); aspect-ratio: 1; left: 13%; top: 5%; opacity: .72; animation: globeTurn 38s linear infinite; }
.globe img { width: 100%; height: 100%; object-fit: contain; filter: saturate(.84) brightness(.76); }
/* z-index 2 keeps the coins behind .hero-copy (10) and .hero-visual (5) - they read as a background layer */
.coin-rain { position:absolute; z-index:2; inset:0; pointer-events:none; overflow:hidden; }
.coin-rain span { position:absolute; top:var(--coin-top,-70px); left:var(--coin-x,50%); width:var(--coin-size,72px); aspect-ratio:1; border-radius:50%; background:url("assets/wpp-falling-coin.webp") center / cover no-repeat; clip-path:circle(48% at 50% 50%); filter:drop-shadow(0 0 10px rgba(246,190,54,.72)) drop-shadow(0 8px 13px rgba(0,0,0,.42)); opacity:0; transform:translate3d(var(--drift-start,0),-120px,0) scale(.86); animation:coinDrop var(--coin-time,6s) linear infinite; animation-delay:var(--coin-delay,0s); }
/* spread across the whole hero width - 1..6 fall behind the copy, 7..10 behind the mascot */
.coin-rain span:nth-child(1){--coin-top:35px;--coin-x:4%;--drift-start:-8px;--drift-end:24px;--coin-size:64px;--coin-time:6.2s;--coin-delay:-1.1s}
.coin-rain span:nth-child(2){--coin-top:150px;--coin-x:15%;--drift-start:12px;--drift-end:-14px;--coin-size:44px;--coin-time:7.4s;--coin-delay:-3.9s}
.coin-rain span:nth-child(3){--coin-top:60px;--coin-x:26%;--drift-start:-10px;--drift-end:26px;--coin-size:52px;--coin-time:6.6s;--coin-delay:-5.4s}
.coin-rain span:nth-child(4){--coin-top:280px;--coin-x:9%;--drift-start:8px;--drift-end:32px;--coin-size:40px;--coin-time:8.1s;--coin-delay:-2.3s}
.coin-rain span:nth-child(5){--coin-top:210px;--coin-x:34%;--drift-start:-6px;--drift-end:-22px;--coin-size:47px;--coin-time:7.8s;--coin-delay:-6.7s}
.coin-rain span:nth-child(6){--coin-top:95px;--coin-x:46%;--drift-start:0;--drift-end:18px;--coin-size:52px;--coin-time:7.6s;--coin-delay:-5.8s}
.coin-rain span:nth-child(7){--coin-top:65px;--coin-x:91%;--drift-start:14px;--drift-end:-10px;--coin-size:58px;--coin-time:5.7s;--coin-delay:-3.2s}
.coin-rain span:nth-child(8){--coin-top:245px;--coin-x:62%;--drift-start:10px;--drift-end:35px;--coin-size:57px;--coin-time:7s;--coin-delay:-4.6s}
.coin-rain span:nth-child(9){--coin-top:315px;--coin-x:82%;--drift-start:-6px;--drift-end:-18px;--coin-size:70px;--coin-time:6.8s;--coin-delay:-.4s}
.coin-rain span:nth-child(10){--coin-top:130px;--coin-x:73%;--drift-start:6px;--drift-end:-26px;--coin-size:46px;--coin-time:8.4s;--coin-delay:-7.2s}
.coin-halo { position: absolute; z-index: 4; width: 46%; aspect-ratio: 1; left: 20%; top: 20%; border-radius: 50%; box-shadow: 0 0 70px 15px rgba(5, 129, 255, .18), inset 0 0 36px rgba(255, 195, 55, .16); }
.platform { position: absolute; z-index: 4; width: 60%; height: 16%; right: 0; bottom: -1%; border-radius: 50%; border: 2px solid rgba(247, 191, 58, .5); background: radial-gradient(ellipse at center, rgba(0, 121, 255, .26), rgba(4, 15, 31, .72) 49%, transparent 71%); box-shadow: 0 0 28px rgba(0, 127, 255, .44), inset 0 0 24px rgba(246, 184, 42, .26); }
.platform::before, .platform::after { content: ""; position: absolute; inset: 15%; border-radius: 50%; border: 1px solid rgba(239, 181, 49, .43); }
.platform::after { inset: 29%; border-color: rgba(0, 146, 255, .72); }
.platform span { position: absolute; width: 12px; height: 12px; left: 51%; top: 43%; border-radius: 50%; background: white; box-shadow: 0 0 10px 4px #23adff, 0 0 30px 12px rgba(0, 126, 255, .68); }
.orbital { position: absolute; z-index: 2; border-radius: 50%; border: 2px solid rgba(230, 167, 39, .43); pointer-events: none; }
.orbital-one { width: 72%; height: 96%; right: -19%; top: -8%; transform: rotate(-18deg); box-shadow: 0 0 8px rgba(190, 129, 28, .32); border-color: rgba(167, 109, 24, .35); }
.orbital-two { width: 48%; height: 100%; right: -13%; top: -4%; transform: rotate(31deg); border-color: rgba(19, 116, 216, .36); }
.light-ray { position: absolute; z-index: 2; width: 2px; height: 70%; background: linear-gradient(transparent, #ffd65d, transparent); opacity: .56; transform-origin: center; box-shadow: 0 0 10px #eab03b; }
.ray-one { right: 10%; top: -18%; transform: rotate(36deg); }
.ray-two { left: 49%; top: -29%; transform: rotate(-32deg); opacity: .25; }

.metrics { position: absolute; z-index: 12; left: 4.3%; right: 3.1%; bottom: 38px; min-height: 107px; display: grid; grid-template-columns: repeat(4, 1fr); align-items: center; border: 1px solid rgba(236, 182, 60, .65); border-radius: 12px; background: linear-gradient(105deg, rgba(3, 14, 28, .94), rgba(7, 25, 43, .89) 57%, rgba(3, 13, 28, .95)); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 0 22px rgba(0, 104, 229, .18); overflow: hidden; }
.metric { min-height: 66px; padding: 0 clamp(15px, 2.1vw, 34px); display: flex; align-items: center; gap: 18px; border-right: 1px solid rgba(227, 177, 70, .42); }
.metric:last-of-type { border-right: 0; }
.metric-icon { flex: 0 0 62px; width: 62px; height: 62px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, rgba(15, 90, 151, .33), rgba(2, 10, 20, .7) 68%); box-shadow: inset 0 0 17px rgba(0, 157, 255, .36), 0 0 14px rgba(0, 125, 255, .18); }
.metric-icon svg { width: 42px; height: 42px; fill: none; stroke: #f4c659; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; filter: drop-shadow(0 0 5px rgba(248, 192, 73, .35)); }
.metric > span:last-child { display: flex; flex-direction: column; }
.metric strong { color: #f4c75d; font-family: "Arial Narrow", Arial, sans-serif; font-size: clamp(29px, 2.5vw, 41px); line-height: 1; font-weight: 850; font-variant-numeric: tabular-nums; text-shadow: 0 0 14px rgba(245, 188, 60, .25); }
.metric small { margin-top: 7px; color: #c5cbd5; font-size: 13px; text-transform: uppercase; white-space: nowrap; }
.metrics-flare { position: absolute; left: 42%; bottom: -1px; width: 24%; height: 2px; background: #28b7ff; box-shadow: 0 0 9px 2px #078cf0, 0 0 30px 8px rgba(0, 126, 255, .65); }
.metrics-flare::after { content: ""; position: absolute; left: 50%; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: white; box-shadow: 0 0 11px #1cb9ff; }

.content-section { padding: 110px max(6vw, 35px); background: radial-gradient(circle at 50% 0, rgba(1, 106, 194, .13), transparent 32%), #030815; text-align: center; }
.content-section h2 { margin: 0 auto 52px; font-family: Georgia, serif; font-size: clamp(40px, 5vw, 72px); text-wrap: balance; }
.feature-grid { max-width: 1200px; margin: auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; text-align: left; }
.feature-grid article { min-height: 220px; padding: 30px; border: 1px solid rgba(229, 178, 67, .23); border-radius: 13px; background: #06101f; }
.feature-grid article span { color: var(--gold); font-family: Consolas, monospace; }
.feature-grid h3 { margin: 28px 0 10px; font-size: 23px; }
.feature-grid p { margin: 0; color: var(--muted); line-height: 1.7; text-wrap: pretty; }

.why-section {
  position: relative;
  scroll-margin-top: var(--header-height);
  isolation: isolate;
  min-height: 900px;
  padding: 38px clamp(24px, 3vw, 48px) 28px;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 36%, rgba(0, 95, 181, .16), transparent 31%),
    linear-gradient(180deg, #020712, #03101d 58%, #020812);
}
.why-section::before { content: ""; position: absolute; z-index: -2; inset: 0; opacity: .25; background-image: radial-gradient(rgba(234, 180, 58, .7) .7px, transparent .8px); background-size: 38px 38px; }
.why-section::after { content: ""; position: absolute; z-index: -1; left: -12%; right: -12%; bottom: -11%; height: 36%; border: 1px solid rgba(17, 105, 186, .25); border-radius: 50%; box-shadow: 0 -30px 60px rgba(0, 91, 180, .08), inset 0 18px 50px rgba(225, 166, 35, .05); }
.why-map { position: absolute; z-index: -1; width: 58%; aspect-ratio: 1; left: 19%; top: -3%; opacity: .14; background: url("assets/digital-globe.webp") center/contain no-repeat; filter: grayscale(.2) brightness(.8); }
.why-top { max-width: 1510px; height: 370px; margin: 0 auto 8px; display: grid; grid-template-columns: 34% 31% 35%; align-items: center; }
.why-intro { align-self: center; padding: 0 18px 0 20px; }
.why-intro h2 { margin: 0; color: #efb93d; font-family: Georgia, "Times New Roman", serif; font-size: clamp(42px, 3.35vw, 54px); line-height: 1.05; white-space: nowrap; }
.why-intro h2 span { display: block; color: #f7f8fa; }
.gold-divider { position: relative; width: 100%; height: 18px; margin: 10px 0 14px; }
.gold-divider::before { content: ""; position: absolute; left: 0; right: 2%; top: 8px; height: 1px; background: linear-gradient(90deg, #815b18, #e8b63e, transparent); }
.gold-divider i { position: absolute; top: 4px; left: 48%; width: 9px; height: 9px; transform: rotate(45deg); background: #ffe28a; box-shadow: 0 0 13px #d69624; }
.why-intro p { max-width: 460px; margin: 0; color: #c0c7d2; font-size: 15px; line-height: 1.72; text-wrap: pretty; }
.why-intro p strong { color: #f0bd49; }
.why-medallion { position: relative; align-self: stretch; display: grid; place-items: center; }
.why-medallion img { position: relative; z-index: 2; width: min(100%, 430px); height: auto; filter: drop-shadow(0 18px 28px rgba(0,0,0,.45)); animation: heroFloat 5.5s ease-in-out infinite; }
.medallion-glow { position: absolute; z-index: 1; left: 18%; right: 18%; bottom: 2%; height: 9%; border-radius: 50%; background: #075b9e; box-shadow: 0 0 18px 5px rgba(0, 126, 255, .4), 0 0 50px 10px rgba(227, 164, 35, .24); }
.benefit-panel { align-self: center; display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid rgba(64, 125, 177, .55); border-radius: 10px; background: linear-gradient(120deg, rgba(4, 20, 37, .92), rgba(3, 11, 23, .95)); box-shadow: inset 0 0 30px rgba(0, 111, 205, .1), 0 10px 35px rgba(0,0,0,.22); overflow: hidden; }
.benefit-panel article { min-height: 108px; padding: 13px 16px; display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 12px; border-right: 1px solid rgba(221, 169, 54, .22); border-bottom: 1px solid rgba(221, 169, 54, .2); }
.benefit-panel article:nth-child(2n) { border-right: 0; }
.benefit-panel article:nth-last-child(-n+2) { border-bottom: 0; }
.benefit-icon { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(229, 173, 49, .62); border-radius: 50%; background: radial-gradient(circle, rgba(11, 65, 103, .55), rgba(2, 9, 18, .8)); box-shadow: inset 0 0 13px rgba(0, 135, 230, .3), 0 0 13px rgba(225, 168, 41, .15); }
.benefit-icon svg { width: 34px; height: 34px; fill: none; stroke: #efb635; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.benefit-panel h3 { margin: 0 0 6px; color: #eeb73c; font-size: 14px; text-transform: uppercase; }
.benefit-panel p { margin: 0; color: #bdc5d0; font-size: 12px; line-height: 1.55; }
.why-cards { width: 100%; max-width: 1510px; margin: 0 auto 20px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.why-cards article { min-width: 0; min-height: 280px; padding: 12px 7px 15px; display: flex; flex-direction: column; align-items: center; text-align: center; border: 1px solid rgba(217, 165, 50, .35); border-radius: 8px; background: linear-gradient(155deg, rgba(4, 16, 29, .94), rgba(3, 10, 19, .96)); box-shadow: inset 0 0 26px rgba(0, 103, 191, .08); transition: transform 180ms ease-out, border-color 180ms ease-out; overflow: hidden; }
.why-cards article:hover { transform: translateY(-4px); border-color: rgba(244, 190, 67, .76); }
.card-art { width: 118px; height: 130px; display: grid; place-items: center; position: relative; }
.card-art::after { content: ""; position: absolute; left: 9%; right: 9%; bottom: 6%; height: 9px; border-radius: 50%; background: #ce8e1d; box-shadow: 0 0 13px 3px rgba(235, 166, 34, .44), 0 0 25px rgba(0, 121, 255, .28); opacity: .58; }
.card-art svg { position: relative; z-index: 2; width: 94px; height: 94px; fill: rgba(185, 121, 18, .18); stroke: #e9b138; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px rgba(228, 165, 40, .38)); }
.card-art .blue-stroke { stroke: #29aef6; }
.reference-art { width: 190px; max-width: 100%; height: 150px; flex: 0 0 150px; background-image: url("assets/why-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; filter: saturate(1.08) contrast(1.03); }
.reference-art::after { display: none; }
.ref-financial { background-position: -63px -500px; }
.ref-bnb { background-position: -318px -500px; }
.ref-community { background-position: -562px -500px; }
.ref-growth { background-position: -808px -500px; }
.ref-privacy { background-position: -1051px -500px; }
.ref-future { background-position: -1307px -500px; }
.why-cards h3 { min-height: 36px; margin: 0 0 6px; color: #efb839; font-size: 14px; line-height: 1.25; text-transform: uppercase; display: grid; place-items: center; }
.why-cards p { margin: 0; color: #c1c8d3; font-size: 12px; line-height: 1.55; text-wrap: pretty; }
.movement-banner { max-width: 1338px; min-height: 78px; margin: auto; padding: 10px 50px 10px 35px; display: grid; grid-template-columns: 68px 1fr auto; align-items: center; gap: 16px; border: 1px solid rgba(225, 172, 55, .48); border-radius: 10px; background: linear-gradient(95deg, rgba(5, 22, 38, .95), rgba(4, 10, 18, .94)); box-shadow: inset 0 0 25px rgba(0, 105, 196, .1); }
.movement-icon { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle, rgba(12, 83, 137, .48), rgba(2, 10, 19, .8)); box-shadow: inset 0 0 13px rgba(0, 145, 234, .3); }
.movement-icon svg { width: 42px; fill: none; stroke: #f0b638; stroke-width: 2.5; stroke-linecap: round; }
.movement-banner h3 { margin: 0 0 3px; color: #eeb83c; font-size: 25px; font-weight: 650; }
.movement-banner p { margin: 0; color: #c1c9d5; font-size: 13px; }
.movement-button { min-width: 300px; min-height: 46px; justify-content: space-between; }
.movement-button span { font-size: 26px; }

@media (max-width: 1250px) {
  .why-top { height: auto; grid-template-columns: 31% 32% 37%; }
  .why-intro { padding-left: 0; }
  .why-intro h2 { font-size: 43px; }
  .why-intro h2 { white-space: normal; }
  .why-medallion img { width: 370px; }
  .benefit-panel article { min-height: 103px; padding: 10px; grid-template-columns: 48px 1fr; gap: 9px; }
  .benefit-icon { width: 45px; height: 45px; }
  .benefit-icon svg { width: 29px; }
  .why-cards { grid-template-columns: repeat(3, 1fr); }
  .why-cards article { min-height: 255px; }
}

@media (max-width: 900px) {
  .why-section { padding-top: 55px; }
  .why-top { grid-template-columns: 1fr 1fr; gap: 20px; }
  .why-intro h2 { font-size: clamp(40px, 6vw, 56px); }
  .why-medallion img { width: min(100%, 400px); }
  .benefit-panel { grid-column: 1 / -1; }
  .movement-banner { padding-inline: 20px; grid-template-columns: 58px 1fr; }
  .movement-button { grid-column: 1 / -1; width: 100%; min-width: 0; }
}

@media (max-width: 620px) {
  .why-section { padding: 50px 18px 28px; }
  .why-map { width: 130%; left: -15%; top: 5%; }
  .why-top { grid-template-columns: 1fr; gap: 12px; }
  .why-intro { padding: 0; text-align: center; }
  .why-intro h2 { font-size: clamp(39px, 12vw, 50px); }
  .why-intro p { font-size: 14px; }
  .gold-divider { max-width: 330px; margin-inline: auto; }
  .why-medallion { min-height: 340px; }
  .why-medallion img { width: min(100%, 365px); }
  .benefit-panel { grid-template-columns: 1fr; margin-top: 5px; }
  .benefit-panel article, .benefit-panel article:nth-child(2n), .benefit-panel article:nth-last-child(-n+2) { min-height: 92px; border-right: 0; border-bottom: 1px solid rgba(221, 169, 54, .2); }
  .benefit-panel article:last-child { border-bottom: 0; }
  .benefit-panel p br { display: none; }
  .why-cards { grid-template-columns: 1fr; gap: 12px; margin-top: 22px; }
  .why-cards article { min-height: 235px; }
  .card-art { height: 112px; }
  .reference-art { width: 190px; height: 150px; flex-basis: 150px; }
  .why-cards h3 { min-height: 0; }
  .movement-banner { grid-template-columns: 50px 1fr; gap: 10px; text-align: left; }
  .movement-icon { width: 48px; height: 48px; }
  .movement-banner h3 { font-size: 19px; }
  .movement-banner p { font-size: 11px; line-height: 1.5; }
}

.ecosystem-section {
  position: relative;
  isolation: isolate;
  min-height: 900px;
  padding: 18px clamp(35px, 4.4vw, 72px) 22px;
  scroll-margin-top: var(--header-height);
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(0, 91, 185, .18), transparent 34%),
    linear-gradient(180deg, #020712, #030b16 68%, #02060d);
}
.ecosystem-section::before { content: ""; position: absolute; z-index: -2; inset: 0; background-image: radial-gradient(rgba(230, 175, 49, .55) .65px, transparent .8px); background-size: 42px 42px; opacity: .22; }
.ecosystem-section::after { content: ""; position: absolute; z-index: -1; inset: 20% 22% 10%; border-radius: 50%; border: 1px solid rgba(0, 111, 220, .2); box-shadow: 0 0 90px rgba(0, 101, 205, .12); }
.ecosystem-heading { position: relative; z-index: 5; height: 168px; text-align: center; }
.ecosystem-heading > p:first-child { margin: 0 0 2px; color: #27bff2; font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .28em; }
.ecosystem-heading h2 { margin: 0; color: #efb83d; font-family: Georgia, "Times New Roman", serif; font-size: clamp(52px, 4.4vw, 70px); line-height: 1.05; }
.ecosystem-heading h2 span { color: #f8f9fb; }
.ecosystem-title-line { width: 260px; height: 1px; margin: 4px auto 10px; background: linear-gradient(90deg, transparent, #148de5, transparent); box-shadow: 0 0 8px rgba(0, 145, 255, .55); }
.ecosystem-lead { position: relative; z-index: 7; display: inline-block; margin: 0; padding: 1px 24px 9px; color: #c3cad5; background: linear-gradient(180deg, #020712 0%, #020712 72%, rgba(2,7,18,.92) 86%, transparent 100%); box-shadow: 0 7px 18px 8px #020712; font-size: 15px; line-height: 1.5; }
.ecosystem-lead strong { color: #efbd47; }
.ecosystem-body { position: relative; z-index: 3; max-width: 1460px; height: 545px; margin: -92px auto 12px; display: grid; grid-template-columns: 315px minmax(500px, 1fr) 315px; align-items: center; }
.ecosystem-list { position: relative; z-index: 4; display: grid; gap: 14px; }
.ecosystem-card { position: relative; min-height: 128px; padding: 12px 15px 12px 108px; display: flex; align-items: center; border: 1px solid rgba(224, 169, 48, .42); border-radius: 13px; background: linear-gradient(110deg, rgba(4, 17, 30, .96), rgba(3, 10, 19, .94)); box-shadow: inset 0 0 25px rgba(0, 108, 200, .1), 0 10px 22px rgba(0,0,0,.18); }
.ecosystem-card h3 { margin: 0 0 7px; color: #edb63b; font-size: 15px; text-transform: uppercase; }
.ecosystem-card p { margin: 0; color: #c3cad5; font-size: 12px; line-height: 1.5; text-wrap: pretty; }
.ecosystem-icon { position: absolute; left: 9px; top: 18px; width: 90px; height: 90px; border-radius: 50%; background-image: url("assets/ecosystem-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; }
.ecosystem-left .ecosystem-card::after, .ecosystem-right .ecosystem-card::before { content: ""; position: absolute; top: 50%; width: 105px; border-top: 2px dotted rgba(238, 179, 50, .78); filter: drop-shadow(0 0 3px rgba(244, 180, 42, .5)); }
.ecosystem-left .ecosystem-card::after { left: 100%; }
.ecosystem-right .ecosystem-card::before { right: 100%; }
.eco-wallet { background-position: -80px -176px; }
.eco-slots { background-position: -80px -318px; }
.eco-airdrop { background-position: -80px -460px; }
.eco-staking { background-position: -80px -602px; }
.ecosystem-right .ecosystem-card { padding: 12px 15px 12px 108px; }
.ecosystem-right .ecosystem-icon { left: 9px; }
.eco-gateway { background-position: -1204px -176px; }
.eco-exchange { background-position: -1204px -318px; }
.eco-merchant { background-position: -1204px -460px; }
.eco-utility { background-position: -1204px -602px; }
/* float the artwork via background-position, not transform - a transform would drag
   the ::after bottom fade with it and expose a hard edge */
.ecosystem-core { --eco-y: -225px; position: relative; z-index: 2; width: 100%; height: 545px; display: grid; place-items: center; background-image: url("assets/ecosystem-reference-sprite.webp"); background-repeat: no-repeat; background-position: center var(--eco-y); background-size: 1600px 900px; animation: ecoFloat 6.5s ease-in-out infinite; }
/* --eco-y is re-set at every breakpoint, so the float rides on top of each layout's own
   sprite offset instead of forcing the desktop one everywhere */
@keyframes ecoFloat { 0%, 100% { background-position: center var(--eco-y); } 50% { background-position: center calc(var(--eco-y) - 13px); } }
.ecosystem-core::after { content: ""; position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; height: 66px; background: linear-gradient(180deg, transparent, #020a14 32%, #020a14); }
@media (min-width: 1101px) {
  .ecosystem-core::before { content: ""; position: absolute; z-index: 3; top: 0; left: 0; right: 0; height: 118px; pointer-events: none; background: linear-gradient(180deg, #020712 0%, #020712 48%, rgba(2,7,18,.93) 68%, rgba(2,7,18,.45) 85%, transparent 100%); }
}
.ecosystem-trust { position: relative; z-index: 5; max-width: 1440px; min-height: 118px; margin: auto; padding: 10px 18px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border: 1px solid rgba(224, 169, 48, .43); border-radius: 12px; background: linear-gradient(110deg, rgba(4, 17, 30, .96), rgba(3, 10, 19, .96)); box-shadow: inset 0 0 28px rgba(0, 104, 198, .09); }
.ecosystem-trust article { min-width: 0; display: grid; grid-template-columns: 86px 1fr; align-items: center; gap: 8px; padding: 0 12px; border-right: 1px solid rgba(225, 174, 61, .22); }
.ecosystem-trust article:last-child { border-right: 0; }
.ecosystem-trust h3 { margin: 0 0 7px; color: #edb63a; font-size: 13px; text-transform: uppercase; }
.ecosystem-trust p { margin: 0; color: #bec6d2; font-size: 11px; line-height: 1.5; }
.trust-icon { width: 84px; height: 84px; border-radius: 50%; background-image: url("assets/ecosystem-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; }
.trust-secure { background-position: -94px -773px; }
.trust-decentralized { background-position: -392px -773px; }
.trust-community { background-position: -673px -773px; }
.trust-global { background-position: -974px -773px; }
.trust-fast { background-position: -1259px -773px; }

@media (max-width: 1250px) {
  .ecosystem-section { padding-inline: 34px; }
  .ecosystem-body { grid-template-columns: 270px minmax(410px, 1fr) 270px; }
  .ecosystem-card { padding-left: 87px; }
  .ecosystem-icon { left: 5px; transform: scale(.82); }
  .ecosystem-card h3 { font-size: 13px; }
  .ecosystem-card p { font-size: 11px; }
  .ecosystem-left .ecosystem-card::after, .ecosystem-right .ecosystem-card::before { width: 55px; }
  .ecosystem-core { --eco-y: -220px; background-size: 1400px 788px; background-position: center var(--eco-y); }
  .ecosystem-trust article { grid-template-columns: 68px 1fr; padding-inline: 7px; }
  .trust-icon { transform: scale(.78); transform-origin: left center; }
}

@media (max-width: 1100px) {
  .ecosystem-section { min-height: auto; padding-top: 35px; }
  .ecosystem-heading { height: auto; margin-bottom: 10px; }
  .ecosystem-heading h2 { font-size: clamp(47px, 7vw, 64px); }
  .ecosystem-body { height: auto; grid-template-columns: 1fr 1fr; gap: 14px; }
  .ecosystem-body { margin: 12px auto; }
  .ecosystem-core { --eco-y: -198px; grid-column: 1 / -1; grid-row: 1; height: 410px; background-size: 1280px 720px; background-position: center var(--eco-y); }
  .ecosystem-left { grid-column: 1; grid-row: 2; }
  .ecosystem-right { grid-column: 2; grid-row: 2; }
  .ecosystem-left .ecosystem-card::after, .ecosystem-right .ecosystem-card::before { display: none; }
  .ecosystem-card { min-height: 112px; }
  .ecosystem-trust { grid-template-columns: repeat(2, 1fr); gap: 0; margin-top: 18px; }
  .ecosystem-trust article { min-height: 100px; border-bottom: 1px solid rgba(225, 174, 61, .18); }
  .ecosystem-trust article:nth-child(2n) { border-right: 0; }
  .ecosystem-trust article:last-child { grid-column: 1 / -1; border-bottom: 0; }
}

@media (max-width: 620px) {
  .ecosystem-section { padding: 38px 18px 26px; }
  .ecosystem-heading > p:first-child { font-size: 10px; }
  .ecosystem-heading h2 { font-size: clamp(42px, 12vw, 52px); }
  .ecosystem-lead { font-size: 13px; }
  .ecosystem-lead { padding-inline: 8px; box-shadow: 0 5px 12px 4px #020712; }
  .ecosystem-body { grid-template-columns: 1fr; }
  .ecosystem-core { --eco-y: -127px; grid-column: 1; height: 270px; background-size: 850px 478px; background-position: center var(--eco-y); }
  .ecosystem-left, .ecosystem-right { grid-column: 1; }
  .ecosystem-left { grid-row: 2; }
  .ecosystem-right { grid-row: 3; }
  .ecosystem-card { min-height: 112px; padding-left: 102px; }
  .ecosystem-icon { left: 7px; transform: scale(.9); }
  .ecosystem-card h3 { font-size: 14px; }
  .ecosystem-card p { font-size: 12px; }
  .ecosystem-trust { grid-template-columns: 1fr; padding: 5px 12px; }
  .ecosystem-trust article, .ecosystem-trust article:nth-child(2n), .ecosystem-trust article:last-child { grid-column: 1; min-height: 92px; border-right: 0; border-bottom: 1px solid rgba(225, 174, 61, .18); }
  .ecosystem-trust article:last-child { border-bottom: 0; }
}

.tokenomics-section {
  position: relative;
  isolation: isolate;
  min-height: 944px;
  padding: 34px clamp(34px, 3.4vw, 54px) 26px;
  scroll-margin-top: var(--header-height);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 72% 46%, rgba(11, 63, 105, .28), transparent 47%),
    linear-gradient(180deg, #01050d, #020914 58%, #030812);
}
.tokenomics-section::before { content: ""; position: absolute; z-index: -2; inset: 0; background: url("assets/digital-globe.webp") 76% 10% / 850px auto no-repeat; opacity: .18; filter: sepia(.7) saturate(.8); }
.tokenomics-section::after { content: ""; position: absolute; z-index: -1; inset: 0; background-image: radial-gradient(rgba(239, 182, 46, .5) .7px, transparent .9px); background-size: 43px 43px; opacity: .18; }
.tokenomics-main { position: relative; z-index: 2; max-width: 1480px; min-height: 745px; margin: 0 auto 13px; display: grid; grid-template-columns: minmax(480px, 44%) minmax(0, 56%); align-items: center; }
.tokenomics-info { min-width: 0; padding-right: 20px; }
.tokenomics-info h2 { margin: 0; color: #f0bb43; font-size: clamp(55px, 4.5vw, 72px); line-height: 1.05; font-weight: 800; letter-spacing: .005em; text-transform: uppercase; text-shadow: 0 3px 12px rgba(0,0,0,.75); }
.tokenomics-info h2 span { color: #f5f6f8; }
.tokenomics-title-line { position: relative; width: 88%; height: 24px; margin-top: 5px; }
.tokenomics-title-line::before { content: ""; position: absolute; left: 2%; right: 0; top: 11px; height: 1px; background: linear-gradient(90deg, #b97516, #f3bf47 50%, rgba(230,166,41,.2)); }
.tokenomics-title-line i { position: absolute; top: 7px; left: 49%; width: 8px; height: 8px; transform: rotate(45deg); background: #ffe07d; box-shadow: 0 0 13px #e9a828; }
.tokenomics-subtitle { margin: 2px 0 24px; color: #f0f2f5; font-size: clamp(20px, 1.75vw, 27px); line-height: 1.3; }
.token-sprite { display: block; flex: 0 0 auto; background-image: url("assets/tokenomics-reference-sprite.webp"); background-repeat: no-repeat; }
.total-supply-card { min-height: 138px; padding: 8px 22px 8px 12px; display: flex; align-items: center; gap: 25px; border: 1px solid rgba(243, 184, 52, .9); border-radius: 15px; background: linear-gradient(105deg, rgba(8,19,28,.94), rgba(2,7,13,.96)); box-shadow: inset 0 0 25px rgba(226,166,35,.06); }
.total-supply-icon { width: 127px; height: 127px; background-size: 1536px 1024px; background-position: -69px -223px; }
.total-supply-card div { display: flex; flex-direction: column; }
.total-supply-card strong { color: #f5bd3e; font-size: clamp(52px, 4.25vw, 67px); line-height: .95; letter-spacing: .02em; white-space: nowrap; }
.total-supply-card span:not(.token-sprite) { margin-top: 8px; color: #f5f5f5; font-size: 25px; line-height: 1; text-transform: uppercase; }
.allocation-list { margin-top: 16px; display: grid; gap: 8px; }
.allocation-row { min-height: 68px; padding: 3px 18px 3px 10px; display: grid; grid-template-columns: 78px minmax(0, 1fr) 102px 148px; column-gap: 8px; align-items: center; border: 1px solid rgba(235, 177, 48, .7); border-radius: 12px; background: linear-gradient(100deg, rgba(7,17,27,.97), rgba(2,8,15,.95)); overflow: hidden; }
.allocation-icon { width: 68px; height: 62px; background-size: 1536px 1024px; }
.allocation-airdrop .allocation-icon { background-position: -72px -382px; }
.allocation-ecosystem .allocation-icon { background-position: -72px -460px; }
.allocation-team .allocation-icon { background-position: -72px -537px; }
.allocation-liquidity .allocation-icon { background-position: -72px -615px; }
.allocation-marketing .allocation-icon { background-position: -72px -692px; }
.allocation-development .allocation-icon { background-position: -72px -770px; }
.allocation-row h3 { min-width: 0; margin: 0; padding-right: 3px; color: #f2f4f6; font-size: clamp(16px, 1.2vw, 19px); font-weight: 650; letter-spacing: -.015em; text-transform: uppercase; white-space: nowrap; }
.allocation-row > strong { justify-self: center; min-width: 82px; padding: 4px 10px; border: 1px solid currentColor; border-radius: 7px; color: #f1d8ff; background: linear-gradient(#73449b, #301044); font-size: 23px; line-height: 1; text-align: center; text-shadow: 0 1px 3px #000; }
.allocation-row > b { padding-left: 20px; border-left: 1px solid rgba(231,177,55,.3); color: #f2bd44; font-size: 22px; font-weight: 650; text-align: right; }
.allocation-ecosystem > strong { color: #daf0ff; background: linear-gradient(#1767a7, #07315e); }
.allocation-team > strong { color: #e6ffd8; background: linear-gradient(#348b19, #123c09); }
.allocation-liquidity > strong { color: #fff0cf; background: linear-gradient(#c3710b, #693500); }
.allocation-marketing > strong { color: #ffe4e8; background: linear-gradient(#be304a, #641021); }
.allocation-development > strong { color: #dcffff; background: linear-gradient(#11939b, #06444c); }
.tokenomics-chart { position: relative; width: 100%; max-width: 810px; aspect-ratio: 1; justify-self: center; display: grid; place-items: center; overflow: hidden; pointer-events: none; }
.tokenomics-chart img { position: static; width: 100%; height: 100%; max-width: 100%; object-fit: contain; object-position: center; user-select: none; }
.tokenomics-bottom { position: relative; z-index: 3; max-width: 1430px; min-height: 130px; margin: auto; padding: 8px 33px; display: grid; grid-template-columns: 135px 440px 1px 110px 1fr; align-items: center; border: 1px solid rgba(237, 179, 48, .85); border-radius: 15px; background: linear-gradient(100deg, rgba(5,19,31,.97), rgba(2,9,17,.98)); box-shadow: inset 0 0 30px rgba(0,93,173,.08); }
.fixed-supply-icon { width: 124px; height: 116px; background-size: 1536px 1024px; background-position: -82px -871px; }
.fixed-supply-copy h3 { margin: 0; color: #f1bb40; font-size: 34px; line-height: 1; text-transform: uppercase; }
.fixed-supply-copy strong { display: block; margin-top: 5px; color: #f3f4f6; font-size: 23px; line-height: 1.1; text-transform: uppercase; }
.fixed-supply-copy p { margin: 4px 0 0; color: #f0f1f2; font-size: 16px; }
.token-bottom-divider { width: 1px; height: 82px; background: rgba(231,177,55,.5); }
.commitment-shield { width: 78px; height: 88px; display: grid; place-items: center; justify-self: center; border: 5px solid #efb938; color: #efb938; font-size: 42px; font-weight: 800; line-height: 1; clip-path: polygon(50% 0, 93% 18%, 88% 70%, 50% 100%, 12% 70%, 7% 18%); background: rgba(236,176,45,.08); }
.commitment-copy { margin: 0; color: #f0f2f4; font-size: 22px; line-height: 1.45; }
.commitment-copy strong { color: #f0b83e; font-weight: 600; }

@media (max-width: 1180px) {
  .tokenomics-section { min-height: auto; }
  .tokenomics-main { grid-template-columns: minmax(420px, 48%) minmax(0, 52%); min-height: 670px; }
  .tokenomics-info h2 { font-size: 55px; }
  .total-supply-card { min-height: 110px; }
  .total-supply-icon { transform: scale(.78); margin: -14px; }
  .total-supply-card strong { font-size: 46px; }
  .total-supply-card span:not(.token-sprite) { font-size: 19px; }
  .allocation-row { min-height: 61px; grid-template-columns: 65px minmax(0,1fr) 76px 118px; column-gap: 5px; padding-right: 12px; }
  .allocation-icon { transform: scale(.82); transform-origin: left center; }
  .allocation-row h3 { font-size: 16px; }
  .allocation-row > strong { min-width: 68px; font-size: 18px; }
  .allocation-row > b { padding-left: 10px; font-size: 17px; }
  .tokenomics-bottom { grid-template-columns: 110px 340px 1px 100px 1fr; }
  .fixed-supply-icon { transform: scale(.82); transform-origin: left center; }
  .fixed-supply-copy h3 { font-size: 27px; }
  .fixed-supply-copy strong { font-size: 19px; }
  .commitment-copy { font-size: 17px; }
}

@media (max-width: 860px) {
  .tokenomics-section { padding: 40px 24px 26px; }
  .tokenomics-main { grid-template-columns: 1fr; }
  .tokenomics-info { padding-right: 0; }
  .tokenomics-chart { width: min(100%, 700px); margin: 12px auto 0; justify-self: center; }
  .tokenomics-bottom { grid-template-columns: 100px 1fr; gap: 4px 8px; padding: 12px 20px; }
  .token-bottom-divider { display: none; }
  .commitment-shield { width: 68px; height: 78px; grid-column: 1; }
  .commitment-copy { grid-column: 2; }
}

@media (max-width: 560px) {
  .tokenomics-section { padding: 46px 18px 22px; }
  .tokenomics-info { padding-right: 0; text-align: center; }
  .tokenomics-info h2 { width: 100%; font-size: clamp(38px, 11.2vw, 45px); letter-spacing: -.025em; white-space: nowrap; text-align: center; }
  .tokenomics-title-line { width: 82%; margin-inline: auto; }
  .tokenomics-title-line::before { left: 0; right: 0; background: linear-gradient(90deg, transparent, #f3bf47 50%, transparent); }
  .tokenomics-title-line i { left: calc(50% - 4px); }
  .tokenomics-subtitle { width: 100%; margin-bottom: 17px; font-size: 16px; text-align: center; }
  .total-supply-card { min-height: 102px; gap: 8px; padding-inline: 5px 10px; }
  .total-supply-icon { transform: scale(.64); margin: -23px; }
  .total-supply-card strong { font-size: clamp(32px, 10.5vw, 46px); }
  .total-supply-card span:not(.token-sprite) { font-size: 15px; }
  .allocation-row { min-height: 65px; grid-template-columns: 52px minmax(0,1fr) 62px; grid-template-rows: 32px 24px; column-gap: 5px; padding: 3px 9px 3px 4px; }
  .allocation-icon { grid-row: 1 / 3; transform: scale(.7); }
  .allocation-row h3 { align-self: end; font-size: 13px; white-space: normal; }
  .allocation-row > strong { grid-column: 3; grid-row: 1 / 3; min-width: 54px; padding: 4px 5px; font-size: 16px; }
  .allocation-row > b { grid-column: 2; grid-row: 2; align-self: start; padding-left: 0; border-left: 0; font-size: 14px; text-align: left; }
  .tokenomics-chart { width: calc(100% + 10px); margin-left: -5px; }
  .tokenomics-bottom { grid-template-columns: 72px 1fr; padding: 9px 10px; }
  .fixed-supply-icon { transform: scale(.58); transform-origin: left center; margin-right: -45px; }
  .fixed-supply-copy h3 { font-size: 22px; }
  .fixed-supply-copy strong { font-size: 15px; }
  .fixed-supply-copy p { font-size: 13px; }
  .commitment-shield { width: 58px; height: 66px; border-width: 4px; font-size: 30px; }
  .commitment-copy { font-size: 14px; }
  .commitment-copy br { display: none; }
}

.slot-airdrop-section {
  position: relative;
  isolation: isolate;
  min-height: 944px;
  padding: 20px clamp(38px, 3vw, 50px) 20px;
  scroll-margin-top: var(--header-height);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 73% 32%, rgba(0, 80, 161, .28), transparent 43%),
    linear-gradient(180deg, #020711, #030b16 65%, #02060d);
}
.slot-airdrop-section::before { content: ""; position: absolute; z-index: -1; inset: 0; background-image: radial-gradient(rgba(224,171,44,.5) .65px, transparent .85px); background-size: 42px 42px; opacity: .18; }
.slot-airdrop-hero { max-width: 1450px; min-height: 565px; margin: 0 auto 6px; display: grid; grid-template-columns: 47% 53%; align-items: center; }
.slot-airdrop-copy { position: relative; z-index: 3; min-width: 0; padding-right: 12px; }
.slot-airdrop-copy h2 { margin: 0 0 9px; color: #f0b83d; font-size: clamp(55px, 4.5vw, 72px); line-height: 1.05; font-weight: 800; letter-spacing: .005em; text-transform: uppercase; }
.slot-airdrop-copy h2 span { color: #f5f6f8; }
.slot-airdrop-tagline { width: fit-content; max-width: 100%; margin: 0 0 20px; padding: 9px 17px; border: 1px solid rgba(239,180,49,.72); border-radius: 12px; color: #f1f2f4; font-size: clamp(18px,1.55vw,24px); line-height: 1.2; text-transform: uppercase; }
.slot-airdrop-tagline strong { color: #efb93e; font-size: 1.22em; white-space: nowrap; }
.slot-airdrop-lead { margin: 0 0 18px 6px; color: #e7e9ec; font-size: clamp(19px,1.75vw,27px); line-height: 1.48; }
.slot-airdrop-lead strong { color: #f1b93e; font-size: 1.55em; line-height: 1.25; text-transform: uppercase; }
.slot-airdrop-lead span { font-size: .82em; }
.airdrop-benefits { max-width: 650px; min-height: 110px; padding: 7px 10px; display: grid; grid-template-columns: repeat(3,1fr); border: 1px solid rgba(164,207,239,.65); border-radius: 12px; background: rgba(3,14,27,.88); }
.airdrop-benefits article { min-width: 0; display: flex; align-items: center; gap: 7px; padding: 0 7px; border-right: 1px solid rgba(229,177,55,.35); }
.airdrop-benefits article:last-child { border-right: 0; }
.airdrop-benefits p { margin: 0; color: #eef1f4; font-size: 16px; line-height: 1.45; text-transform: uppercase; }
.airdrop-mini-icon { width: 78px; height: 80px; flex: 0 0 78px; background: url("assets/slot-airdrop-reference-sprite.webp") no-repeat; background-size: 1536px 1024px; }
.mini-secure { background-position: -56px -427px; }
.mini-instant { background-position: -270px -427px; }
.mini-wallet { background-position: -470px -427px; }
.slot-airdrop-visual {
  align-self: center; width: 100%; min-width: 0; aspect-ratio: 1420 / 1118; overflow: hidden;
  background: url("assets/wpp-airdrop-parachute-full.webp") center / contain no-repeat;
  filter: drop-shadow(0 18px 35px rgba(0,72,162,.2));
  /* the artwork's blue particle field is baked in, so fade the rectangle's edges
     instead of trying to key it out - kills the visible hard box edge */
  -webkit-mask-image: radial-gradient(ellipse 74% 76% at 50% 47%, #000 52%, rgba(0,0,0,.55) 78%, transparent 96%);
  mask-image: radial-gradient(ellipse 74% 76% at 50% 47%, #000 52%, rgba(0,0,0,.55) 78%, transparent 96%);
  animation: airdropFloat 6.2s ease-in-out infinite;
}
@keyframes airdropFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.airdrop-steps { position: relative; z-index: 3; max-width: 1445px; min-height: 334px; margin: auto; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border: 1px solid rgba(226,171,47,.65); border-radius: 14px; overflow: hidden; background: rgba(3,13,24,.86); }
.airdrop-step { position: relative; min-width: 0; min-height: 334px; padding: 13px 24px 16px; display: flex; flex-direction: column; align-items: center; text-align: center; border-right: 1px solid rgba(229,175,52,.62); }
.airdrop-step:last-child { border-right: 0; }
.step-number { position: absolute; z-index: 4; top: 17px; left: 31px; width: 62px; height: 62px; display: grid; place-items: center; border: 2px solid #e9ae35; border-radius: 50%; color: #f0bd4b; font-size: 33px; background: #06101c; }
.airdrop-step-art { width: 230px; max-width: 100%; height: 160px; flex: 0 0 160px; background-repeat: no-repeat; background-position: center; background-size: contain; filter: drop-shadow(0 9px 14px rgba(0,103,220,.22)); }
.step-account { background-image: url("assets/airdrop-step-account.webp"); }
.step-slot { background-image: url("assets/airdrop-step-slot.webp"); }
.step-receive { background-image: url("assets/airdrop-step-wallet.webp"); }
.step-add { background-image: url("assets/airdrop-step-phone.webp"); }
.airdrop-step h3 { margin: 0 0 8px; color: #efb73b; font-size: 21px; line-height: 1.15; text-transform: uppercase; }
.airdrop-step p { max-width: 250px; margin: 0; color: #d9dde3; font-size: 16px; line-height: 1.45; text-wrap: pretty; }
.airdrop-trustbar { position: relative; z-index: 3; max-width: 1445px; min-height: 88px; margin: 22px auto 0; padding: 6px 12px; display: grid; grid-template-columns: 1fr 1fr 1.35fr .7fr; border: 1px solid rgba(224,170,46,.7); border-radius: 14px; background: linear-gradient(100deg,rgba(4,17,28,.96),rgba(3,10,17,.96)); }
.airdrop-trustbar article { min-width: 0; display: flex; align-items: center; gap: 9px; padding: 0 15px; border-right: 1px solid rgba(225,174,53,.27); }
.airdrop-trustbar article:last-child { border-right: 0; }
.airdrop-trust-icon { width: 72px; height: 72px; flex: 0 0 72px; background-image: url("assets/slot-airdrop-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1536px 1024px; }
.trust-chain { background-position: -76px -918px; }
.trust-fair { background-position: -426px -918px; }
.trust-bnb { background-position: -787px -918px; }
.trust-future { background-position: -1214px -918px; }
.airdrop-trustbar h3 { margin: 0 0 5px; color: #efb63a; font-size: 16px; text-transform: uppercase; }
.airdrop-trustbar p { margin: 0; color: #d2d7de; font-size: 14px; }

@media (max-width: 1180px) {
  .slot-airdrop-section { min-height: auto; padding-inline: 28px; }
  .slot-airdrop-hero { height: auto; min-height: 540px; grid-template-columns: 52% 48%; }
  .slot-airdrop-copy h2 { font-size: 55px; }
  .slot-airdrop-lead { font-size: 19px; }
  .airdrop-benefits p { font-size: 12px; }
  .airdrop-mini-icon { transform: scale(.78); margin: -9px; }
  .slot-airdrop-visual { min-height: 0; background-size: contain; }
  .airdrop-step { padding-inline: 12px; }
  .airdrop-step-art { transform: scale(.82); margin: -15px 0; }
  .airdrop-step h3 { font-size: 17px; }
  .airdrop-step p { font-size: 13px; }
  .airdrop-trustbar { grid-template-columns: repeat(2,1fr); }
  .airdrop-trustbar article:nth-child(2) { border-right: 0; }
  .airdrop-trustbar article { min-height: 82px; border-bottom: 1px solid rgba(225,174,53,.2); }
  .airdrop-trustbar article:nth-child(n+3) { border-bottom: 0; }
}

@media (max-width: 820px) {
  .slot-airdrop-section { padding: 34px 20px 24px; }
  .slot-airdrop-hero { grid-template-columns: 1fr; }
  .slot-airdrop-copy { padding-right: 0; }
  .slot-airdrop-copy h2 { text-align: center; }
  .slot-airdrop-tagline { margin-inline: auto; text-align: center; }
  .slot-airdrop-lead { text-align: center; }
  .airdrop-benefits { margin-inline: auto; }
  .slot-airdrop-visual { width: min(100%,650px); min-height: 0; justify-self: center; background-size: contain; }
  .airdrop-steps { grid-template-columns: repeat(2,1fr); }
  .airdrop-step:nth-child(2) { border-right: 0; }
  .airdrop-step:nth-child(-n+2) { border-bottom: 1px solid rgba(229,175,52,.62); }
}

@media (max-width: 560px) {
  .slot-airdrop-section { padding-inline: 14px; }
  .slot-airdrop-copy h2 { font-size: clamp(38px,11.2vw,45px); white-space: nowrap; }
  .slot-airdrop-tagline { padding: 8px 10px; font-size: 13px; }
  .slot-airdrop-lead { margin-left: 0; font-size: 16px; }
  .slot-airdrop-lead strong { font-size: 1.25em; }
  .airdrop-benefits { grid-template-columns: 1fr; padding: 5px 12px; }
  .airdrop-benefits article { min-height: 75px; border-right: 0; border-bottom: 1px solid rgba(229,177,55,.25); }
  .airdrop-benefits article:last-child { border-bottom: 0; }
  .airdrop-mini-icon { transform: scale(.68); margin: -13px; }
  .airdrop-benefits p { font-size: 13px; }
  .slot-airdrop-visual { min-height: 0; height: auto; max-height: none; aspect-ratio: 1420 / 1118; background-size: contain; }
  .airdrop-steps { grid-template-columns: 1fr; }
  .airdrop-step, .airdrop-step:nth-child(2) { min-height: 320px; border-right: 0; border-bottom: 1px solid rgba(229,175,52,.62); }
  .airdrop-step:last-child { border-bottom: 0; }
  .airdrop-step-art { transform: none; margin: 0; }
  .airdrop-step h3 { font-size: 19px; }
  .airdrop-step p { font-size: 14px; }
  .airdrop-trustbar { grid-template-columns: 1fr; padding: 5px 10px; }
  .airdrop-trustbar article, .airdrop-trustbar article:nth-child(2), .airdrop-trustbar article:nth-child(n+3) { min-height: 82px; border-right: 0; border-bottom: 1px solid rgba(225,174,53,.2); }
  .airdrop-trustbar article:last-child { border-bottom: 0; }
  .airdrop-trust-icon { transform: scale(.8); margin: -7px; }
}

.slots-section {
  position: relative;
  isolation: isolate;
  min-height: 944px;
  padding: 25px clamp(38px, 3vw, 50px) 26px;
  scroll-margin-top: var(--header-height);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 77% 16%, rgba(6,83,154,.23), transparent 38%),
    linear-gradient(180deg,#020711,#030b16 65%,#02060d);
}
/* same globe, same spot - moved onto its own 780px square so it can spin in place.
   left reproduces the old "83%" background-position: offset = (W - 780) * 0.83.
   The old y was a fixed -130px, so top stays -130px. */
.slots-section::before { content:""; position:absolute; z-index:-2; left:calc(83% - 647.4px); top:-130px; width:780px; height:780px; background:url("assets/digital-globe.webp") center / contain no-repeat; opacity:.19; filter:sepia(.72) saturate(.8); animation:globeTurn 64s linear infinite; }
.slots-section::after { content:""; position:absolute; z-index:-1; inset:0; background-image:radial-gradient(rgba(229,173,42,.55) .65px,transparent .85px); background-size:43px 43px; opacity:.18; }
.slots-intro { max-width:1450px; min-height:250px; margin:0 auto 10px; display:grid; grid-template-columns:54% 46%; align-items:center; }
.slots-copy { position:relative; z-index:3; }
.slots-copy h2 { margin:0; color:#f0b83e; font-size:clamp(50px,4vw,64px); line-height:1.05; font-weight:800; letter-spacing:.005em; text-transform:uppercase; }
.slots-copy h2 span { color:#f5f6f8; }
.slots-subtitle { margin:4px 0 9px; color:#f0f2f5; font-size:clamp(20px,1.7vw,27px); }
.slots-subtitle strong { color:#efb83c; }
.slots-intro-line { position:relative; width:76%; height:17px; }
.slots-intro-line::before { content:""; position:absolute; left:0; right:0; top:8px; height:1px; background:linear-gradient(90deg,#c18220,#efbc49 60%,transparent); }
.slots-intro-line i { position:absolute; left:49%; top:4px; width:8px; height:8px; transform:rotate(45deg); background:#ffe18a; box-shadow:0 0 12px #e7a728; }
.slots-notice { min-height:96px; padding:12px 20px 12px 12px; display:grid; grid-template-columns:82px 1fr; align-items:center; border:1px solid rgba(230,175,51,.68); border-radius:12px; background:linear-gradient(100deg,rgba(6,18,29,.96),rgba(3,11,20,.92)); }
.slots-notice > span { width:70px; height:70px; display:grid; place-items:center; border:1px solid #e6ad35; border-radius:50%; font-size:34px; background:#07111d; box-shadow:0 0 15px rgba(228,168,38,.16); }
.slots-notice p { min-width:0; margin:0; color:#e5e8ed; font-size:20px; line-height:1.45; overflow-wrap:anywhere; }
.slots-notice strong { color:#efb73a; }
.slots-coin { position:relative; height:250px; display:grid; place-items:center; }
.slots-coin::after { content:""; position:absolute; z-index:-1; width:90%; height:34%; bottom:4%; border-radius:50%; background:radial-gradient(ellipse,rgba(239,178,38,.38),transparent 68%); filter:blur(5px); }
.slots-coin img { width:min(390px,75%); height:250px; object-fit:contain; filter:drop-shadow(0 12px 24px rgba(234,170,34,.22)); }
.slot-icon-defs { position:absolute; width:0; height:0; overflow:hidden; }
.slots-grid { position:relative; z-index:3; max-width:1450px; margin:auto; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
.slot-card {
  --notch:24px;
  position:relative; min-width:0;
  filter:drop-shadow(0 14px 26px rgba(0,0,0,.45));
  transition:transform 200ms ease-out, filter 200ms ease-out;
}
.slot-card:hover { transform:translateY(-5px); filter:drop-shadow(0 18px 30px rgba(0,0,0,.5)) drop-shadow(0 0 18px rgba(242,189,67,.3)); }
/* outer 2px gold frame — a separate layer so the hex badge can hang outside the card */
.slot-card::after {
  content:""; position:absolute; z-index:0; inset:0; pointer-events:none;
  clip-path:polygon(var(--notch) 0,calc(100% - var(--notch)) 0,100% var(--notch),100% calc(100% - var(--notch)),calc(100% - var(--notch)) 100%,var(--notch) 100%,0 calc(100% - var(--notch)),0 var(--notch));
  background:linear-gradient(152deg,#ffe8a4,#c08d22 24%,#fff6dd 50%,#b07d1a 74%,#f8d066);
}
.slot-card::before {
  content:""; position:absolute; z-index:3; inset:12px; padding:1.5px; pointer-events:none;
  clip-path:polygon(15px 0,calc(100% - 15px) 0,100% 15px,100% calc(100% - 15px),calc(100% - 15px) 100%,15px 100%,0 calc(100% - 15px),0 15px);
  background:linear-gradient(150deg,#ffeaae,#c48c2a 30%,#fff8e4 52%,#c48c2a 74%,#fbd97a);
  filter:drop-shadow(0 0 4px rgba(242,189,67,.35));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  mask-composite:exclude;
}
.slot-body {
  --notch:22.5px;
  position:relative; z-index:1; overflow:hidden; margin:2px;
  height:100%; padding:10px 13px 12px; display:flex; flex-direction:column;
  clip-path:polygon(var(--notch) 0,calc(100% - var(--notch)) 0,100% var(--notch),100% calc(100% - var(--notch)),calc(100% - var(--notch)) 100%,var(--notch) 100%,0 calc(100% - var(--notch)),0 var(--notch));
  background:
    radial-gradient(ellipse at 50% 44%,rgba(6,86,164,.3),transparent 62%),
    linear-gradient(158deg,#08192b,#02090f 55%,#051324);
  box-shadow:inset 0 0 30px rgba(0,108,205,.14);
}
.slot-body::before {
  content:""; position:absolute; z-index:0; inset:0; pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.075),transparent 42%),
    /* left-edge circuit traces */
    repeating-linear-gradient(180deg,transparent 0 6px,rgba(58,168,240,.32) 6px 7px,transparent 7px 15px) 17px 26% / 12px 42% no-repeat,
    linear-gradient(180deg,transparent,rgba(233,177,58,.42) 30%,rgba(233,177,58,.42) 70%,transparent) 24px 30% / 1px 34% no-repeat,
    /* right-edge circuit traces */
    repeating-linear-gradient(180deg,transparent 0 6px,rgba(58,168,240,.22) 6px 7px,transparent 7px 15px) calc(100% - 17px) 30% / 12px 34% no-repeat;
}
.slot-body::after { content:""; position:absolute; z-index:2; inset:-130% auto -130% -45%; width:20%; pointer-events:none; transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,247,214,.16),transparent); animation:sheen 6.5s ease-in-out infinite; }
.slots-grid .slot-card:nth-child(4n+2) .slot-body::after { animation-delay:-1.6s; }
.slots-grid .slot-card:nth-child(4n+3) .slot-body::after { animation-delay:-3.2s; }
.slots-grid .slot-card:nth-child(4n) .slot-body::after { animation-delay:-4.8s; }
.slot-head { position:relative; z-index:1; min-height:44px; padding-left:34px; display:flex; align-items:center; }
.slot-index {
  --hex:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);
  position:absolute; z-index:6; top:-15px; left:-15px;
  width:53px; height:59px; display:grid; place-items:center;
  clip-path:var(--hex);
  background:linear-gradient(155deg,#ffefbe,#b8842b 26%,#fff6dd 50%,#a4741a 74%,#f8d066);
  color:#fbe089; font-size:21px; font-weight:800; letter-spacing:.01em;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.5)) drop-shadow(0 0 9px rgba(242,189,67,.28));
}
.slot-index::before { content:""; position:absolute; inset:2px; clip-path:var(--hex); background:radial-gradient(ellipse at 50% 22%,rgba(16,104,196,.5),transparent 62%),linear-gradient(160deg,#0d2138,#04101d 62%,#081827); box-shadow:inset 0 0 12px rgba(0,120,255,.3); }
.slot-index i { position:relative; z-index:1; font-style:normal; text-shadow:0 0 10px rgba(246,202,92,.5); }
.slot-card h3 { flex:1; min-width:0; width:auto; margin:0; padding:0 2px; border:0; color:#f7cf67; font-size:clamp(12px,1.04vw,16px); font-weight:800; line-height:1.15; letter-spacing:.1em; text-align:center; text-transform:uppercase; text-shadow:0 0 15px rgba(242,189,67,.5); }
/* one fixed height for every card so rows stay level whatever art each slot uses */
.slot-art { position:relative; z-index:1; height:146px; margin:2px 0 0; display:grid; place-items:center; }
.slot-art::before { content:""; position:absolute; z-index:0; bottom:18px; width:84%; height:34px; border-radius:50%; background:radial-gradient(ellipse,rgba(96,222,255,.7),rgba(0,120,240,.28) 40%,transparent 72%); filter:blur(.5px); }
.slot-art::after { content:""; position:absolute; z-index:0; bottom:31px; width:38%; height:11px; border-radius:50%; border:1.5px solid rgba(160,238,255,.8); box-shadow:0 0 16px rgba(50,190,255,.7),inset 0 0 12px rgba(140,230,255,.55),0 0 0 7px rgba(60,190,255,.1),0 0 0 8px rgba(130,225,255,.3),0 0 0 16px rgba(60,190,255,.07),0 0 0 17px rgba(130,225,255,.17); }
/* Icon slot: works with inline <svg> OR a dropped-in PNG (<img>) */
.slot-art svg, .slot-art img { position:relative; z-index:1; width:100px; height:100px; object-fit:contain; overflow:visible; filter:drop-shadow(0 9px 15px rgba(0,0,0,.6)) drop-shadow(0 0 14px rgba(0,150,255,.45)); animation:slotFloat 4.4s ease-in-out infinite; }
/* Plain object PNG — floats above the CSS blue platform, same geometry as the SVG icons */
.slot-art img { width:auto; height:auto; max-width:86%; max-height:100px; margin:auto; filter:drop-shadow(0 9px 15px rgba(0,0,0,.6)) drop-shadow(0 0 14px rgba(0,150,255,.4)); }
/* class="with-portal" — the PNG already contains its own podium, so drop the CSS platform */
.slot-art:has(img.with-portal) { height:146px; }
.slot-art:has(img.with-portal)::before, .slot-art:has(img.with-portal)::after { display:none; }
.slot-art img.with-portal { max-width:92%; max-height:144px; animation:none; filter:drop-shadow(0 10px 18px rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(0,140,255,.28)); }
/* class="on-dark" — PNG has a solid dark background instead of alpha */
.slot-art img.on-dark { mix-blend-mode:screen; }
.slots-grid .slot-card:nth-child(2n) .slot-art svg { animation-delay:-1.1s; }
.slots-grid .slot-card:nth-child(3n) .slot-art svg { animation-delay:-2.2s; }
@keyframes slotFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
.slot-price { position:relative; z-index:1; margin:2px 0 9px; display:flex; align-items:baseline; justify-content:center; gap:6px; color:#eef2f7; line-height:1; white-space:nowrap; }
.slot-price strong { font-size:clamp(25px,2.3vw,34px); font-weight:800; letter-spacing:-.02em; color:#fbfdff; text-shadow:0 0 18px rgba(120,205,255,.35); }
.slot-price em { color:#ccd6e3; font-size:14px; font-style:normal; font-weight:700; letter-spacing:.05em; }
/* Slot 01 has no airdrop button (the airdrop unlocks from Slot 02), so centre its
   contents instead of leaving a gap where the button used to sit */
.slot-no-airdrop .slot-body { justify-content:center; padding-bottom:20px; }
.slot-no-airdrop .slot-art { margin-top:6px; }
.slot-no-airdrop .slot-price { margin-bottom:0; }
.slot-airdrop-label { position:relative; z-index:1; width:100%; min-height:37px; margin-top:auto; display:grid; place-items:center; border:1px solid #ffe08f; border-radius:10px; color:#1a1307; background:linear-gradient(100deg,#a86f16,#f5c64f 30%,#fff0b8 52%,#f0bb43 72%,#b3781d); font-size:15px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; box-shadow:0 6px 16px rgba(224,164,36,.24),inset 0 1px 0 rgba(255,255,255,.6); }
.slots-trustbar { position:relative; z-index:3; max-width:1450px; min-height:96px; margin:26px auto 0; padding:8px 6px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); border:1px solid rgba(225,171,48,.7); border-radius:13px; background:linear-gradient(100deg,rgba(4,17,29,.97),rgba(3,10,18,.97)); }
.slots-trustbar article { min-width:0; display:grid; grid-template-columns:46px 1fr; align-items:center; gap:9px; padding:0 11px; border-right:1px solid rgba(227,175,53,.28); }
.slots-trustbar article:last-child { border-right:0; }
.slots-trustbar article > span { width:46px; height:46px; display:grid; place-items:center; border:1px solid #dfa733; border-radius:50%; color:#efb83d; background:#06111d; box-shadow:inset 0 0 15px rgba(0,112,221,.18); }
.slots-trustbar article > span svg { width:26px; height:26px; overflow:visible; fill:none; stroke:#efb83d; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 5px rgba(31,143,255,.4)); }
.slots-trustbar h3 { margin:0 0 3px; color:#efb63a; font-size:12px; line-height:1.15; letter-spacing:.05em; text-transform:uppercase; }
.slots-trustbar p { margin:0; color:#c9cfd8; font-size:11px; line-height:1.35; }

@media (max-width:1180px) {
  .slots-section { min-height:auto; padding-inline:28px; }
  .slots-copy h2 { font-size:52px; }
  .slots-notice p { font-size:16px; }
  .slots-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .slots-trustbar { grid-template-columns:repeat(3,1fr); }
  .slots-trustbar article { min-height:82px; border-bottom:1px solid rgba(227,175,53,.2); }
  .slots-trustbar article:nth-child(3n) { border-right:0; }
  .slots-trustbar article:nth-child(n+4) { border-bottom:0; }
}
@media (max-width:900px) {
  .slots-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
}
@media (max-width:760px) {
  .slots-section { padding:38px 18px 25px; }
  .slots-intro { grid-template-columns:1fr; }
  .slots-copy { text-align:center; }
  .slots-copy h2 { font-size:clamp(38px,11.2vw,45px); white-space:nowrap; }
  .slots-intro-line { width:82%; margin-inline:auto; }
  .slots-notice { margin-top:5px; text-align:left; }
  .slots-coin { height:260px; }
  .slots-coin img { height:255px; }
  .slots-trustbar { grid-template-columns:repeat(2,1fr); }
  .slots-trustbar article:nth-child(3n) { border-right:1px solid rgba(227,175,53,.28); }
  .slots-trustbar article:nth-child(2n) { border-right:0; }
  .slots-trustbar article:nth-child(n+3) { border-bottom:1px solid rgba(227,175,53,.2); }
  .slots-trustbar article:nth-child(n+5) { border-bottom:0; }
}
@media (max-width:520px) {
  .slots-section { padding-inline:14px; }
  .slots-copy h2 { font-size:clamp(30px,8.7vw,35px); letter-spacing:-.025em; }
  .slots-subtitle { font-size:16px; }
  .slots-notice { grid-template-columns:60px 1fr; padding:9px; }
  .slots-notice > span { width:52px; height:52px; font-size:25px; }
  .slots-notice p { font-size:13px; }
  .slots-coin { height:225px; }
  .slots-coin img { height:220px; }
  .slots-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .slot-card { --notch:13px; }
  .slot-body { --notch:12px; padding:11px 10px 12px; }
  .slot-head { min-height:40px; padding-left:38px; }
  .slot-index { top:-2px; left:-5px; width:36px; height:40px; font-size:14px; }
  .slot-card h3 { font-size:10px; letter-spacing:.05em; }
  .slot-card::before { inset:6px; }
  .slot-art { height:96px; margin:3px 0 0; }
  .slot-art::before { bottom:12px; }
  .slot-art::after { bottom:21px; }
  .slot-art svg, .slot-art img { width:60px; height:60px; }
  .slot-art img { max-width:88%; max-height:60px; }
  .slot-art:has(img.with-portal) { height:96px; }
  .slot-art img.with-portal { max-width:94%; max-height:94px; }
  .slot-index { top:-11px; left:-11px; }
  .slot-head { padding-left:24px; }
  .slot-price { gap:4px; }
  .slot-price strong { font-size:21px; }
  .slot-price em { font-size:11px; }
  .slot-airdrop-label { min-height:27px; font-size:11px; letter-spacing:.1em; }
  .slots-trustbar { grid-template-columns:1fr; padding:5px 10px; }
  .slots-trustbar article,.slots-trustbar article:nth-child(2n),.slots-trustbar article:nth-child(3n) { min-height:70px; border-right:0; border-bottom:1px solid rgba(227,175,53,.2); }
  .slots-trustbar article:last-child { border-bottom:0; }
}

.roadmap-section {
  position: relative;
  isolation: isolate;
  min-height: 900px;
  padding: 20px clamp(35px, 5.2vw, 84px) 20px;
  scroll-margin-top: var(--header-height);
  overflow: hidden;
  background:
    radial-gradient(ellipse at 50% 52%, rgba(7, 45, 81, .62), transparent 49%),
    linear-gradient(180deg, #020610, #030b16 65%, #01050b);
}
/* the globe is already centred in this box (contain + center), so rotating the box
   spins it in place - the old static rotate(-3deg) is replaced by the animation */
.roadmap-section::before { content: ""; position: absolute; z-index: -2; width: 145%; aspect-ratio: 2.7; left: -22.5%; top: 30px; background: url("assets/digital-globe.webp") center/contain no-repeat; opacity: .26; filter: sepia(.55) saturate(.8) brightness(.8); animation: globeTurn 60s linear infinite; }
.roadmap-section::after { content: ""; position: absolute; z-index: -1; left: -10%; right: -10%; top: 205px; height: 56%; border-radius: 50% 50% 8% 8%; border-top: 2px solid rgba(237, 184, 61, .72); background: radial-gradient(ellipse at 50% 0, rgba(234, 173, 47, .12), transparent 45%); box-shadow: 0 -5px 16px rgba(0, 117, 228, .35); }
.roadmap-heading { position: relative; z-index: 5; height: 150px; text-align: center; }
.roadmap-heading h2 { margin: 0; color: #efbb48; font-family: Georgia, "Times New Roman", serif; font-size: clamp(55px, 4.5vw, 72px); line-height: 1.05; }
.roadmap-heading h2 span { color: #f8f9fb; }
.roadmap-title-line { position: relative; width: 380px; max-width: 70%; height: 18px; margin: 2px auto 4px; }
.roadmap-title-line::before { content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 1px; background: linear-gradient(90deg, transparent, #f0b83e, transparent); }
.roadmap-title-line i { position: absolute; top: 4px; left: calc(50% - 5px); width: 9px; height: 9px; transform: rotate(45deg); background: #ffe38b; box-shadow: 0 0 12px #e2a32a; }
.roadmap-heading p { margin: 0; color: #c3cad5; font-size: 16px; }
.roadmap-grid { position: relative; z-index: 4; max-width: 1430px; height: 410px; margin: 62px auto 30px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(28px, 3.6vw, 58px); }
.roadmap-grid::before { content: ""; position: absolute; left: 10%; right: 10%; top: -48px; border-top: 2px solid rgba(237, 179, 48, .72); box-shadow: 0 0 8px rgba(235, 171, 38, .5); }
.roadmap-card { position: relative; min-width: 0; height: 410px; padding: 13px 20px 34px; display: flex; flex-direction: column; align-items: center; text-align: center; border: 1px solid rgba(231, 177, 53, .47); border-radius: 13px; background: linear-gradient(160deg, rgba(4, 18, 31, .95), rgba(2, 9, 17, .96)); box-shadow: inset 0 0 28px rgba(0, 103, 196, .1), 0 13px 30px rgba(0,0,0,.25); }
.phase-number { position: absolute; z-index: 4; top: -83px; left: 50%; width: 64px; height: 64px; display: grid; place-items: center; transform: translateX(-50%); border: 3px solid #f0b638; border-radius: 50%; color: #f7d16a; background: #05101e; font-family: Georgia, serif; font-size: 35px; box-shadow: 0 0 16px rgba(239, 176, 48, .28); }
.phase-number::after { content: ""; position: absolute; top: 61px; left: 29px; height: 22px; border-left: 2px solid #edb43b; }
.roadmap-art { width: 180px; max-width: 100%; height: 145px; flex: 0 0 145px; background-image: url("assets/roadmap-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; }
.road-art-launch { background-position: -155px -340px; }
.road-art-airdrop { background-position: -520px -340px; }
.road-art-app { background-position: -895px -340px; }
.road-art-growth { background-position: -1250px -340px; }
.phase-label { min-width: 120px; height: 27px; display: grid; place-items: center; margin: -2px 0 4px; color: #edf5ff; background: linear-gradient(90deg, transparent, #0a4d98 18%, #0b5bb2 50%, #0a4d98 82%, transparent); font-size: 15px; text-transform: uppercase; }
.roadmap-card > h3 { margin: 0; color: #efb940; font-size: 34px; line-height: 1.15; font-weight: 650; }
.phase-divider { position: relative; width: 85%; height: 18px; margin: 1px 0 6px; }
.phase-divider::before { content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 1px; background: linear-gradient(90deg, transparent, #e5ad36, transparent); }
.phase-divider i { position: absolute; left: calc(50% - 3px); top: 5px; width: 6px; height: 6px; border: 1px solid #f3c354; transform: rotate(45deg); }
.roadmap-card > p { max-width: 220px; margin: 0; color: #d0d5dd; font-size: 16px; line-height: 1.42; text-wrap: pretty; }
.phase-foot-icon { position: absolute; left: 50%; bottom: -17px; width: 78px; height: 78px; transform: translateX(-50%); border-radius: 50%; background-image: url("assets/roadmap-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; }
.road-foot-bnb { background-position: -200px -675px; }
.road-foot-community { background-position: -570px -675px; }
.road-foot-bank { background-position: -930px -675px; }
.road-foot-cart { background-position: -1300px -675px; }
.roadmap-bottom { position: relative; z-index: 5; max-width: 1490px; min-height: 112px; margin: auto; padding: 10px 20px; display: grid; grid-template-columns: 1fr 1fr 340px; align-items: center; border: 1px solid rgba(222, 169, 51, .4); border-radius: 12px; background: linear-gradient(100deg, rgba(5, 18, 31, .96), rgba(3, 9, 17, .96)); box-shadow: inset 0 0 26px rgba(0, 111, 204, .08); }
.roadmap-bottom > article { min-width: 0; display: grid; grid-template-columns: 92px 1fr; align-items: center; gap: 10px; padding: 0 22px; border-right: 1px solid rgba(227, 176, 62, .24); }
.roadmap-bottom-icon { width: 88px; height: 88px; border-radius: 50%; background-image: url("assets/roadmap-reference-sprite.webp"); background-repeat: no-repeat; background-size: 1600px 900px; }
.mission-icon { background-position: -91px -781px; }
.vision-icon { background-position: -644px -781px; }
.roadmap-bottom h3 { margin: 0 0 5px; color: #efba43; font-size: 18px; }
.roadmap-bottom p { margin: 0; color: #c3cad5; font-size: 12px; line-height: 1.55; text-wrap: pretty; }
.roadmap-journey { width:100%;max-width:310px;min-width:0;min-height:66px;margin-left:28px;padding:4px 8px;display:grid;grid-template-columns:54px minmax(0,1fr) 38px;align-items:center;gap:7px;justify-self:center;overflow:hidden;border:2px solid #ffd45f;border-radius:999px;color:#08101a;background:linear-gradient(180deg,#ffd84b 0%,#ffac08 54%,#ff8600 100%);box-shadow:inset 0 2px 0 rgba(255,255,255,.72),inset 0 -3px 0 rgba(190,73,0,.24),0 0 17px rgba(255,151,20,.28);transition:transform 180ms ease-out,box-shadow 180ms ease-out; }
.roadmap-journey:hover { transform:translateY(-2px); box-shadow:inset 0 2px 0 rgba(255,255,255,.75),inset 0 -4px 0 rgba(190,73,0,.24),0 5px 22px rgba(255,151,20,.38); }
.metamask-mark { width:54px;height:54px;display:grid;place-items:center;border:2px solid rgba(255,255,255,.88);border-radius:50%;background:#f7f4ef;box-shadow:0 2px 7px rgba(91,45,0,.22); }
.metamask-mark svg { width:48px;height:48px; }
.roadmap-journey-copy { min-width:0;display:flex;flex-direction:column;line-height:1.1; }
.roadmap-journey strong { color:#0c1118;font-size:15px;font-weight:800;white-space:nowrap; }
.roadmap-journey small { margin-top:5px;display:flex;align-items:center;gap:7px;color:#663c0d;font-size:10px;font-weight:600; }
.roadmap-journey small i { width:5px;height:5px;border-radius:50%;background:#ef6410; }
.roadmap-journey-arrow { width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:#fff;background:rgba(195,72,0,.64); }
.roadmap-journey-arrow svg { width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round; }

@media (max-width: 1200px) {
  .roadmap-section { min-height: auto; padding-top: 40px; }
  .roadmap-grid { height: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 95px 45px; margin-top: 75px; }
  .roadmap-grid::before { display: none; }
  .roadmap-card { height: 410px; }
  .roadmap-bottom { grid-template-columns: 1fr 1fr; margin-top: 55px; }
  .roadmap-journey { grid-column: 1 / -1; margin: 12px 0 0; }
}

@media (max-width: 650px) {
  .roadmap-section { padding: 42px 18px 28px; }
  .roadmap-heading { height: auto; }
  .roadmap-heading h2 { font-size: clamp(38px, 11.2vw, 45px); white-space: nowrap; }
  .roadmap-heading p { font-size: 13px; }
  .roadmap-grid { grid-template-columns: 1fr; gap: 100px; margin-top: 102px; }
  .roadmap-card { width: 100%; max-width: 360px; margin: auto; }
  .roadmap-bottom { grid-template-columns: 1fr; padding: 8px 12px; }
  .roadmap-bottom > article { min-height: 105px; padding: 0 5px; border-right: 0; border-bottom: 1px solid rgba(227, 176, 62, .2); grid-template-columns: 78px 1fr; }
  .roadmap-bottom-icon { transform: scale(.82); transform-origin: left center; }
  .roadmap-journey { min-height:66px;margin-inline:auto;grid-template-columns:54px minmax(0,1fr) 38px;gap:7px;padding:4px 8px; }
}

.team-section { position:relative; isolation:isolate; min-height:930px; padding:24px clamp(34px,3.4vw,56px) 24px; scroll-margin-top:var(--header-height); overflow:hidden; background:radial-gradient(ellipse at 48% 25%,rgba(8,62,105,.28),transparent 43%),linear-gradient(180deg,#020711,#030a14 70%,#02060d); }
.team-icon-sprite { position:absolute; width:0; height:0; overflow:hidden; }
.team-section svg { display:block; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.team-section::before { content:""; position:absolute; z-index:-1; inset:0; background:
  radial-gradient(ellipse at 52% 18%,rgba(14,70,126,.34),transparent 35%),
  linear-gradient(90deg,transparent 39%,rgba(239,184,62,.18) 39.2%,transparent 39.7%,transparent 49.6%,rgba(239,184,62,.22) 49.8%,transparent 50.2%,transparent 60.5%,rgba(239,184,62,.16) 60.8%,transparent 61.2%),
  linear-gradient(0deg,rgba(239,184,62,.45) 0 1px,transparent 1px),
  linear-gradient(180deg,transparent 0 106px,rgba(7,24,41,.92) 106px 150px,transparent 150px);
  background-size:auto,100% 180px,100% 180px,100% 180px;
  background-position:0 0,0 42px,0 140px,0 50px;
  opacity:.48; filter:sepia(.32) saturate(.9); }
/* globe pulled out of the layer stack above into its own square so it can spin in place.
   left/top reproduce the old "48% 7% / 660px" background-position exactly.
   z-index -2 keeps it under ::before, where it sat as the last background layer. */
.team-section::after { content:""; position:absolute; z-index:-2; pointer-events:none;
  left:calc(48% - 316.8px); top:calc(7% - 46.2px); width:660px; height:660px;
  background:url("assets/digital-globe.webp") center / contain no-repeat;
  opacity:.48; filter:sepia(.32) saturate(.9);
  animation:globeTurn 58s linear infinite; }
.team-layout { max-width:1490px; margin:auto; display:grid; grid-template-columns:64% 36%; gap:24px; }
.team-heading { min-height:160px; }
.team-heading h2,.faq-heading h2 { margin:0; color:#efb942; font-family:Georgia,"Times New Roman",serif; font-size:clamp(42px,3.35vw,54px); line-height:1.05; }
.team-heading h2 span,.faq-heading h2 span { color:#f5f6f8; }
.team-title-line,.faq-title-line { position:relative; width:360px; max-width:78%; height:20px; }
.team-title-line::before,.faq-title-line::before { content:""; position:absolute; left:0; right:0; top:9px; height:1px; background:linear-gradient(90deg,transparent,#efb83e,transparent); }
.team-title-line i,.faq-title-line i { position:absolute; left:50%; top:5px; width:8px; height:8px; transform:rotate(45deg); background:#ffe181; box-shadow:0 0 11px #e6a729; }
.team-heading p { margin:4px 0 0; display:flex; align-items:center; gap:12px; color:#cbd1d9; font-size:14px; line-height:1.45; }
.team-heading p b { color:#efb73b; }
.team-heading-icon { width:38px; height:38px; flex:0 0 38px; display:grid; place-items:center; }
.team-heading-icon svg { width:34px; height:34px; }
.core-team-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.core-team-grid article { min-width:0; height:326px; padding-bottom:9px; text-align:center; border:1px solid rgba(226,171,51,.58); border-radius:10px; overflow:hidden; background:rgba(3,13,23,.95); box-shadow:inset 0 0 22px rgba(0,95,181,.08); }
.core-team-grid article > * { opacity:1; pointer-events:auto; }
.team-photo,.advisor-photo { position:relative; overflow:hidden; background:
  radial-gradient(circle at 50% 18%,rgba(48,130,210,.24),transparent 32%),
  linear-gradient(90deg,transparent 9%,rgba(246,187,54,.28) 9.4%,transparent 9.8%,transparent 33%,rgba(246,187,54,.18) 33.4%,transparent 33.8%,transparent 66%,rgba(246,187,54,.18) 66.4%,transparent 66.8%,transparent 90%,rgba(246,187,54,.22) 90.4%,transparent 90.8%),
  linear-gradient(0deg,rgba(237,178,51,.72) 0 1px,transparent 1px),
  linear-gradient(180deg,#122033 0%,#172640 48%,#07101b 100%);
  background-size:auto,100% 100%,100% 100%,100% 100%;
}
.team-photo::before,.advisor-photo::before { content:""; position:absolute; left:50%; bottom:-2%; width:56%; height:58%; transform:translateX(-50%); border-radius:44% 44% 12% 12%; background:
  radial-gradient(ellipse at 50% 7%,var(--cloth-hi,#f4f5f5) 0 23%,transparent 24%),
  linear-gradient(135deg,var(--cloth,#0e1723),var(--cloth2,#1e2938));
  box-shadow:0 -16px 24px rgba(0,0,0,.28), inset 0 0 25px rgba(255,255,255,.06);
}
.team-photo::after,.advisor-photo::after { content:""; position:absolute; left:50%; top:12%; width:42%; height:52%; transform:translateX(-50%); border-radius:46% 46% 43% 43%; background:
  radial-gradient(circle at 34% 45%,#15100c 0 2px,transparent 3px),
  radial-gradient(circle at 66% 45%,#15100c 0 2px,transparent 3px),
  radial-gradient(ellipse at 50% 69%,rgba(120,55,35,.55) 0 7%,transparent 8%),
  linear-gradient(var(--skin,#d9a06d),var(--skin2,#b8724c));
  box-shadow:0 -13px 0 var(--hair,#1a1210), inset 0 0 18px rgba(255,255,255,.18), 0 11px 22px rgba(0,0,0,.35);
}
.core-team-grid .team-photo { width:100%; height:194px; }
.team-photo-1{background:url("assets/team-omar.webp") center 12% / cover no-repeat}
.team-photo-2{background:url("assets/team-aisha.webp") center 12% / cover no-repeat}
.team-photo-3{background:url("assets/team-yousef.webp") center 12% / cover no-repeat}
.team-photo-4{background:url("assets/team-layla.webp") center 12% / cover no-repeat}
.team-photo-1::before,.team-photo-1::after,.team-photo-2::before,.team-photo-2::after,.team-photo-3::before,.team-photo-3::after,.team-photo-4::before,.team-photo-4::after{display:none}
.team-photo-5{background:url("assets/team-james.webp") center 12% / cover no-repeat}
.team-photo-6{background:url("assets/team-sophia.webp") center 12% / cover no-repeat}
.team-photo-7{background:url("assets/team-liam.webp") center 12% / cover no-repeat}
.team-photo-8{background:url("assets/team-emily.webp") center 12% / cover no-repeat}
.team-photo-5::before,.team-photo-5::after,.team-photo-6::before,.team-photo-6::after,.team-photo-7::before,.team-photo-7::after,.team-photo-8::before,.team-photo-8::after{display:none}
.core-team-grid h3,.extended-team-grid h3 { margin:8px 0 3px; color:#efb83e; font-size:16px; text-transform:uppercase; }
.core-team-grid strong,.extended-team-grid strong { color:#e5e8ec; font-size:12px; font-weight:500; }
.team-location { display:block; margin-top:4px; color:#f2f5f8; font-size:10px; font-weight:700; line-height:1.2; }
.core-team-grid p,.extended-team-grid p { margin:8px 5px 0; color:#bfc6d0; font-size:10px; line-height:1.5; }
.extended-team-grid { margin-top:13px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.extended-team-grid article { min-width:0; height:325px; overflow:hidden; border:1px solid rgba(226,171,51,.53); border-radius:10px; text-align:center; background:rgba(3,13,23,.95); }
.extended-team-grid article > * { opacity:1; pointer-events:auto; }
.extended-team-grid .team-photo { width:100%; height:195px; }
.extended-team-grid article>div:last-child { padding:0 7px 9px; text-align:center; }
.extended-team-grid h3 { margin:8px 0 3px;font-size:16px; }.extended-team-grid strong{font-size:12px}.extended-team-grid p{margin:8px 5px 0;font-size:10px;line-height:1.5}
.team-aside { display:grid; gap:15px; align-content:start; }
.advisors-panel,.board-panel { padding:12px 14px; border:1px solid rgba(226,171,51,.48); border-radius:11px; background:linear-gradient(145deg,rgba(4,17,28,.97),rgba(3,10,18,.96)); }
.advisors-panel>h3,.board-panel>h3 { margin:0 0 10px; display:flex; align-items:center; gap:8px; color:#efb83d; font-size:18px; text-transform:uppercase; }
.panel-title-icon { width:28px; height:28px; flex:0 0 28px; display:grid; place-items:center; }
.panel-title-icon svg { width:27px; height:27px; }
.advisors-panel>h3 small { margin-left:auto; color:#d1d6de; font-size:10px; font-weight:500; text-transform:none; }
.advisor-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.advisor-grid article { min-width:0; min-height:258px; padding-bottom:8px; text-align:center; border:1px solid rgba(224,171,50,.3); border-radius:8px; overflow:hidden; background:#05111d; box-shadow:inset 0 0 18px rgba(0,98,190,.08); }
.advisor-grid article > * { opacity:1; pointer-events:auto; }
.advisor-photo { height:145px; background:url("assets/advisor-portraits-grid.webp") no-repeat; background-size:300% 100%; }
.advisor-photo::before,.advisor-photo::after { display:none; }
.advisor-1{background-position:0 0}.advisor-2{background-position:50% 0}.advisor-3{background-position:100% 0}
.advisor-grid h4 { margin:8px 2px 3px; color:#efb63a; font-size:12px; line-height:1.2; text-transform:uppercase; }.advisor-grid strong{color:#d9dee5;font-size:10px;font-weight:500}.advisor-grid p{margin:12px 5px 0;color:#b8c0cb;font-size:9px;line-height:1.4}
.board-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.board-grid article { min-width:0; min-height:192px; padding:10px 5px; text-align:center; border:1px solid rgba(225,171,50,.3); border-radius:8px; }
.board-grid article>.board-icon { width:48px; height:48px; margin:2px auto 4px; display:grid; place-items:center; color:#efb73c; }
.board-grid article>.board-icon svg { width:44px; height:44px; }
.board-grid h4{margin:8px 0;color:#efb73d;font-size:11px;line-height:1.4;text-transform:uppercase}.board-grid p{margin:8px 0 0;color:#bfc6d0;font-size:9px;line-height:1.45}
.team-footer-row { max-width:1490px; margin:14px auto 0; display:grid; grid-template-columns:64% 36%; gap:24px; }
.team-stats { min-height:105px; padding:7px 12px; display:grid; grid-template-columns:repeat(4,1fr); border:1px solid rgba(225,171,50,.45); border-radius:10px; background:#04101c; }
.team-stats article { min-width:0; display:flex; align-items:center; gap:13px; padding:0 14px; border-right:1px solid rgba(225,171,50,.22); }.team-stats article:last-child{border-right:0}.team-stat-icon{width:50px;height:50px;flex:0 0 50px;display:grid;place-items:center;color:#efb63a}.team-stat-icon svg{width:46px;height:46px}.team-stats strong{display:block;color:#efb83d;font-size:22px}.team-stats small{display:block;color:#d9dee5;font-size:8px;text-transform:uppercase}.team-stats p{margin:5px 0 0;color:#adb6c2;font-size:9px}
.team-footer-row blockquote { margin:0; padding:20px 28px; display:grid; align-content:center; border:1px solid rgba(225,171,50,.45); border-radius:10px; color:#d9dde3; background:#04101c; font-size:13px; line-height:1.55; }.team-footer-row blockquote strong{color:#efb73b}

.partners-section { position:relative;isolation:isolate;min-height:0;padding:22px clamp(32px,3.3vw,54px) 28px;scroll-margin-top:var(--header-height);overflow:hidden;background:radial-gradient(ellipse at 50% 52%,rgba(8,57,99,.48),transparent 50%),linear-gradient(180deg,#020711,#030b15 70%,#02060d); }
.partners-section::before { content:"";position:absolute;z-index:-2;inset:0;background:radial-gradient(ellipse at 50% 44%,rgba(7,58,105,.2),transparent 52%); }
/* rotating globe backdrop, centred behind the partner cards (transform is owned by
   globeTurn, so it is centred with left + negative margin, never translate) */
.partners-section::after { content:"";position:absolute;z-index:-3;pointer-events:none;
  /* max(), not min(): with negative values min() picks the MORE negative one,
     which pushed the globe off-centre on wide screens */
  left:50%; margin-left:max(-300px,-42vw); top:30px;
  width:min(600px,84vw); height:min(600px,84vw);
  background:url("assets/digital-globe.webp") center / contain no-repeat;
  opacity:.24; filter:sepia(.58) saturate(.8) brightness(.85);
  animation:globeTurn 64s linear infinite; }
.partners-heading { position:relative;z-index:2;text-align:center; }
.partner-laurel { position:absolute;top:-68px;width:170px;height:255px;color:#d9a331;overflow:visible;filter:drop-shadow(0 0 7px rgba(225,168,43,.22));pointer-events:none; }
.partner-laurel-left { left:7%;transform:scaleX(-1); }
.partner-laurel-right { right:7%; }
.partner-laurel .laurel-stem { fill:none;stroke:#b77b1d;stroke-width:2;stroke-linecap:round; }
.partners-kicker { min-width:170px;height:42px;padding:0 28px;display:inline-grid;place-items:center;border:1px solid rgba(236,179,49,.78);clip-path:polygon(12% 0,88% 0,100% 50%,88% 100%,12% 100%,0 50%);color:#f1bd48;background:#07101a;font-size:24px;font-weight:800;text-transform:uppercase; }
.partners-heading h2 { margin:10px 0 0;color:#efb942;font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,3.35vw,54px);font-weight:700;line-height:1.05;text-transform:uppercase;text-wrap:balance; }
.partners-heading h2 span { color:#f4f5f7; }
.partners-title-line { position:relative;width:440px;max-width:75%;height:23px;margin:auto; }
.partners-title-line::before { content:"";position:absolute;left:0;right:0;top:11px;height:1px;background:linear-gradient(90deg,transparent,#efb83e,transparent); }
.partners-title-line i { position:absolute;left:calc(50% - 4px);top:7px;width:8px;height:8px;transform:rotate(45deg);background:#ffe181;box-shadow:0 0 11px #e6a729; }
.partners-heading p { margin:3px 0 0;color:#d1d6dd;font-size:20px;text-wrap:pretty; }
.partner-cards { position:relative;z-index:2;max-width:1490px;margin:54px auto 22px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px; }
.partner-cards article { min-width:0;min-height:325px;padding:18px 12px 16px;display:flex;flex-direction:column;align-items:center;text-align:center;border:1px solid rgba(232,176,49,.72);border-radius:12px;background:linear-gradient(160deg,rgba(6,20,32,.96),rgba(2,9,17,.97));box-shadow:inset 0 0 25px rgba(0,97,184,.09),0 10px 26px rgba(0,0,0,.25); }
.partner-logo { width:144px;height:144px;display:grid;place-items:center;border:0;border-radius:50%;color:#efbd39;background-color:#07111d;background-image:url("assets/partners-reference-sprite.webp");background-repeat:no-repeat;background-size:1536px 1024px;box-shadow:none; }
.partner-logo svg { width:82px;height:82px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(22,134,255,.22)); }
.partner-logo svg { display:none; }
.bnb-logo { background-position:-98px -385px; }
.pancake-logo { background-position:-336px -385px; }
.cmc-logo { background-position:-574px -385px; }
.certik-logo { background-position:-812px -385px; }
.trust-logo { background-position:-1051px -385px; }
.fox-logo { background-position:-1287px -385px; }
.bnb-logo svg { fill:none;stroke:#f0bd24;stroke-width:4; }
.pancake-logo { color:#7b3e19; }.pancake-logo svg{stroke-width:3.4}
.cmc-logo { color:#fff; }
.certik-logo { color:#f1f3f5; }
.trust-logo { color:#fff; }
.fox-logo svg { stroke:#4b250e;stroke-width:.8; }
.fox-logo svg polygon:nth-child(1),.fox-logo svg polygon:nth-child(2){fill:#7d370f}.fox-logo svg polygon:nth-child(3),.fox-logo svg polygon:nth-child(4),.fox-logo svg polygon:nth-child(7){fill:#f6851b}.fox-logo svg polygon:nth-child(5),.fox-logo svg polygon:nth-child(6){fill:#ad4d13}.fox-logo svg path:nth-of-type(1){fill:#c0ad9e}.fox-logo svg path:nth-of-type(2){fill:#171717;stroke:none}
.partner-cards h3 { margin:14px 0 0;color:#efb83d;font-size:18px;text-transform:uppercase; }
/* brand colours keyed to the partner, not to card position, so the grid can be reordered freely */
.partner-cards article:has(.bnb-logo) h3 { color:#efb83d; }
.partner-cards article:has(.pancake-logo) h3 { color:#21c8d1; }
.partner-cards article:has(.cmc-logo) h3 { color:#3b80ff; }
.partner-cards article:has(.trust-logo) h3 { color:#3b80ff; }
.partner-cards article:has(.certik-logo) h3 { color:#f2f3f5; }
.partner-cards article:has(.fox-logo) h3 { color:#ef8c29; }
.partner-cards article>i { position:relative;width:92px;height:18px; }.partner-cards article>i::before{content:"";position:absolute;left:0;right:0;top:8px;height:1px;background:linear-gradient(90deg,transparent,#e8b23e,transparent)}.partner-cards article>i::after{content:"";position:absolute;left:calc(50% - 3px);top:5px;width:6px;height:6px;transform:rotate(45deg);background:#ffd964}
.partner-cards p { margin:0;color:#d0d5dc;font-size:13px;line-height:1.48;text-wrap:pretty; }

/* store / site buttons */
.partner-apps { width:100%; margin-top:auto; padding-top:14px; display:grid; gap:8px; }
.partner-app {
  position:relative; overflow:hidden; min-height:44px; padding:6px 11px;
  display:grid; grid-template-columns:21px 1fr; align-items:center; gap:10px; text-align:left;
  border:1px solid rgba(240,187,62,.6); border-radius:10px;
  background:linear-gradient(150deg,rgba(11,29,47,.96),rgba(3,10,18,.97));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 0 20px rgba(0,110,210,.15),0 5px 14px rgba(0,0,0,.28);
  transition:transform 170ms ease-out,border-color 170ms ease-out,box-shadow 170ms ease-out;
}
.partner-app::before { content:""; position:absolute; z-index:0; inset:0 0 auto 0; height:52%; pointer-events:none; background:linear-gradient(180deg,rgba(255,255,255,.07),transparent 85%); }
.partner-app::after { content:""; position:absolute; z-index:1; inset:-130% auto -130% -45%; width:18%; pointer-events:none; transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,247,214,.14),transparent); animation:sheen 7s ease-in-out infinite; }
.partner-app:nth-child(2)::after { animation-delay:-2.4s; }
.partner-app:hover { transform:translateY(-2px); border-color:#ffe08f; box-shadow:inset 0 1px 0 rgba(255,255,255,.09),inset 0 0 22px rgba(0,120,225,.2),0 9px 22px rgba(0,0,0,.4),0 0 20px rgba(242,189,67,.24); }
.partner-app:focus-visible { outline:2px solid #ffe08f; outline-offset:2px; }
.partner-app svg { position:relative; z-index:2; width:21px; height:21px; }
.partner-app span { position:relative; z-index:2; min-width:0; display:flex; flex-direction:column; gap:2px; }
.partner-app small { color:#8fa0b6; font-size:8.5px; font-weight:650; letter-spacing:.13em; text-transform:uppercase; }
.partner-app strong { color:#f4f7fb; font-size:13px; font-weight:750; letter-spacing:.01em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* on phones the cards go full width, so centre the icon + label instead of leaving them hard left */
@media (max-width:900px) {
  .partner-app { grid-template-columns:none; display:flex; justify-content:center; align-items:center; gap:11px; text-align:center; }
  .partner-app span { flex:0 1 auto; align-items:center; }
  .partner-app strong { overflow:visible; }
}
.partners-trustbar { position:relative;z-index:3;max-width:1490px;min-height:124px;margin:auto;padding:10px 18px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid rgba(232,176,49,.66);border-radius:12px;background:rgba(4,15,25,.96);box-shadow:inset 0 0 26px rgba(0,103,194,.09); }
.partners-trustbar article { min-width:0;display:flex;align-items:center;gap:13px;padding:0 19px;border-right:1px solid rgba(232,176,49,.25); }.partners-trustbar article:last-child{border-right:0}
.partners-trustbar article>span { width:88px;height:88px;flex:0 0 88px;display:grid;place-items:center;border:0;border-radius:50%;color:#efb83c;background-image:url("assets/partners-reference-sprite.webp");background-repeat:no-repeat;background-size:1536px 1024px; }.partners-trustbar article:nth-child(1)>span{background-position:-86px -735px}.partners-trustbar article:nth-child(2)>span{background-position:-454px -735px}.partners-trustbar article:nth-child(3)>span{background-position:-814px -735px}.partners-trustbar article:nth-child(4)>span{background-position:-1144px -735px}.partners-trustbar svg{display:none}
.partners-trustbar h3 { margin:0 0 4px;color:#efb83d;font-size:15px;text-transform:uppercase; }.partners-trustbar p{margin:0;color:#c3cad4;font-size:11px;line-height:1.45;text-wrap:pretty}
@media(max-width:1200px){.partner-cards{grid-template-columns:repeat(3,1fr);margin-top:46px}.partners-trustbar{grid-template-columns:repeat(2,1fr)}.partners-trustbar article{min-height:92px}.partners-trustbar article:nth-child(2){border-right:0}.partners-trustbar article:nth-child(-n+2){border-bottom:1px solid rgba(232,176,49,.2)}}
/* mobile team globe: matches the old "50% 3% / 520px" placement from the ::before stack */
@media(max-width:700px){
  .team-section::after{ left:calc(50% - 260px); top:calc(3% - 15.6px); width:520px; height:520px; opacity:.43; }
}
@media(max-width:900px){.partner-laurel{display:none}}
@media(max-width:700px){.partners-section{padding:36px 16px 22px}.partners-kicker{min-width:120px;height:34px;font-size:18px}.partners-heading h2{font-size:clamp(39px,12vw,50px)}.partners-heading p{font-size:14px}.partner-cards{grid-template-columns:1fr;margin-top:30px;gap:14px}.partner-cards article{min-height:320px}.partner-logo{width:144px;height:144px}.partners-trustbar{grid-template-columns:1fr;padding:6px 12px}.partners-trustbar article{min-height:105px;padding:0 6px;border-right:0;border-bottom:1px solid rgba(232,176,49,.2)}.partners-trustbar article:last-child{border-bottom:0}}

.faq-section { position:relative; isolation:isolate; min-height:820px; padding:20px clamp(45px,6vw,105px) 22px; scroll-margin-top:var(--header-height); overflow:hidden; background:radial-gradient(ellipse at 80% 20%,rgba(4,63,120,.22),transparent 35%),linear-gradient(180deg,#020711,#030b16 68%,#02060d); }
/* same globe, same spot - now its own 430px square so it can spin in place.
   left reproduces the old "-9% 0 / 430px" background-position: offset = (W - 430) * -0.09 */
.faq-section::before { content:""; position:absolute; z-index:-1; left:calc(-9% + 38.7px); top:0; width:430px; height:430px; background:url("assets/digital-globe.webp") center / contain no-repeat; opacity:.21; filter:sepia(.7) saturate(.75); animation:globeTurn 62s linear infinite; }
.faq-heading { position:relative; z-index:3; text-align:center; }
.faq-title-line { margin:2px auto 3px; }.faq-heading p{margin:0;color:#c7ced8;font-size:15px}
.faq-coin { position:absolute; z-index:1; right:4.5%; top:10px; width:230px; height:230px; }.faq-coin img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 20px rgba(0,89,190,.25))}
.faq-search { position:relative; z-index:3; width:min(700px,64%); min-height:54px; margin:22px auto 30px; padding:0 18px; display:flex; align-items:center; gap:13px; border:1px solid rgba(226,171,49,.55); border-radius:10px; background:#06101c; }.faq-search>span{color:#efb73b;font-size:30px}.faq-search input{width:100%;border:0;outline:0;color:#edf1f5;background:transparent;font:inherit}.faq-search input::placeholder{color:#8f99a8}
.faq-categories { position:relative; z-index:3; max-width:1200px; min-height:106px; margin:auto; padding:8px; display:grid; grid-template-columns:repeat(8,1fr); border:1px solid rgba(0,119,219,.24); border-radius:10px; background:#04101d; }
.faq-categories button { min-width:0; border:0;border-right:1px solid rgba(144,162,183,.16);color:#4ba4ff;background:transparent;cursor:pointer}.faq-categories button:last-child{border-right:0}.faq-categories button svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px rgba(38,138,255,.3))}.faq-categories button span{display:block;margin-top:7px;color:#dbe0e6;font-size:11px}.faq-categories button.active{border:1px solid rgba(235,177,48,.8);border-radius:9px;color:#efb83d;box-shadow:inset 0 0 18px rgba(226,166,34,.12)}
.faq-content { position:relative; z-index:3; max-width:1280px; margin:18px auto 0; display:grid; grid-template-columns:1fr 330px; gap:28px; }
.faq-list { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(5,auto); grid-auto-flow:column; gap:7px 22px; }
.faq-list details { min-width:0; border:1px solid rgba(26,73,114,.35); border-radius:7px; background:#05111e; overflow:hidden; }.faq-list summary{min-height:52px;padding:0 16px;display:flex;align-items:center;gap:12px;color:#dbe0e6;font-size:14px;cursor:pointer;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"⌄";margin-left:auto;font-size:20px}.faq-list summary b{width:29px;height:29px;display:grid;place-items:center;border:1px solid #b9801f;border-radius:50%;color:#efb73a;font-size:11px}.faq-list details p{margin:0;padding:0 18px 15px 57px;color:#aeb8c6;font-size:11px;line-height:1.5}.faq-list details[open] summary::after{transform:rotate(180deg)}
.faq-support { padding:18px 20px;text-align:center;border:1px solid rgba(231,175,52,.68);border-radius:11px;background:#06111d}.faq-support h3{margin:0;color:#efba47;font-family:Georgia,serif;font-size:24px}.faq-support>span{display:block;margin:10px;color:#efb73a}.faq-support>span svg{width:62px;height:62px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(235,175,48,.3))}.faq-support p{color:#cbd1d9;font-size:13px;line-height:1.5}.faq-support strong{color:#efb83e}.faq-support .button{width:100%;min-height:48px}.faq-support small{display:block;margin-top:14px;color:#aab5c3;font-size:10px}
.faq-trustbar { position:relative;z-index:3;max-width:1280px;min-height:88px;margin:22px auto 0;padding:8px 16px;display:grid;grid-template-columns:repeat(4,1fr);border:1px solid rgba(225,171,49,.28);border-radius:10px;background:#04101c}.faq-trustbar article{min-width:0;display:flex;align-items:center;gap:12px;padding:0 16px;border-right:1px solid rgba(225,171,49,.18);color:#efb73b}.faq-trustbar article:last-child{border-right:0}.faq-trustbar article>span{width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;border:1px solid rgba(231,176,52,.65);border-radius:50%;background:#06111d}.faq-trustbar article svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 5px rgba(27,135,255,.35))}.faq-trustbar h3{margin:0 0 4px;color:#efb73c;font-size:14px}.faq-trustbar p{margin:0;color:#b8c1cd;font-size:10px}

@media(max-width:1180px){.team-layout,.team-footer-row{grid-template-columns:1fr}.team-aside{grid-template-columns:1fr}.core-team-grid{grid-template-columns:repeat(2,1fr)}.extended-team-grid{grid-template-columns:repeat(2,1fr)}.team-footer-row{gap:14px}.faq-coin{opacity:.4}.faq-content{grid-template-columns:1fr}.faq-support{max-width:520px;width:100%;margin:auto}.faq-categories{grid-template-columns:repeat(4,1fr)}.faq-categories button{min-height:90px;border-bottom:1px solid rgba(144,162,183,.12)} }
@media(max-width:700px){.team-section,.faq-section{padding:38px 16px 24px}.team-section::before{background:url("assets/team-uae-skyline.webp") 50% 28px / 520px auto no-repeat;opacity:.43}.team-heading{text-align:center}.team-heading p{justify-content:center}.core-team-grid,.extended-team-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.team-aside{grid-template-columns:1fr}.core-team-grid article,.extended-team-grid article{height:auto;min-height:282px}.core-team-grid .team-photo,.extended-team-grid .team-photo{height:auto;aspect-ratio:418/470;background-size:cover}.core-team-grid h3,.extended-team-grid h3{font-size:12px;margin-top:7px}.core-team-grid strong,.extended-team-grid strong{font-size:9px}.team-location{font-size:8px}.core-team-grid p,.extended-team-grid p{font-size:8px;line-height:1.35;margin-top:6px}.advisor-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.advisor-grid article{min-height:244px}.advisor-photo{height:132px}.board-grid{grid-template-columns:repeat(2,1fr)}.team-stats{grid-template-columns:1fr}.team-stats article{min-height:85px;border-right:0;border-bottom:1px solid rgba(225,171,50,.2)}.team-stats article:last-child{border-bottom:0}.faq-heading h2{font-size:clamp(39px,12vw,50px)}.faq-coin{display:none}.faq-search{width:100%;margin-bottom:18px}.faq-categories{grid-template-columns:repeat(2,1fr)}.faq-list{grid-template-columns:1fr;grid-template-rows:none;grid-auto-flow:row}.faq-trustbar{grid-template-columns:1fr}.faq-trustbar article{min-height:75px;border-right:0;border-bottom:1px solid rgba(225,171,49,.18)}.faq-trustbar article:last-child{border-bottom:0}}
@media(max-width:700px){.advisors-panel,.board-panel{padding:12px 10px}.advisors-panel>h3,.board-panel>h3{font-size:16px}.advisor-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.advisor-grid article{min-height:218px;padding-bottom:7px}.advisor-photo{height:112px}.advisor-grid h4{font-size:9px;line-height:1.2}.advisor-grid strong{font-size:8px}.advisor-grid p{font-size:7px;line-height:1.3;margin-top:7px}.board-grid{gap:8px}.board-grid article{min-height:170px;padding:10px 6px}.board-grid article>.board-icon{width:54px;height:54px}.board-grid article>.board-icon svg{width:50px;height:50px}.board-grid h4{font-size:10px}.board-grid p{font-size:8px}}

.contact-section { position:relative; isolation:isolate; min-height:820px; padding:22px clamp(38px,4vw,64px) 26px; scroll-margin-top:var(--header-height); display:grid; grid-template-columns:52% 48%; gap:36px; overflow:hidden; background:radial-gradient(ellipse at 38% 42%,rgba(6,72,133,.28),transparent 40%),linear-gradient(180deg,#020711,#030b16 70%,#02060d); }
/* Same globe, same spot as before - but as its own 680px square instead of a background
   on an inset:0 layer, so it can spin in place. left/top reproduce the old "31% 8%"
   background-position exactly: offset = (container - 680) * pct. */
.contact-section::before { content:"";position:absolute;z-index:-2;left:calc(31% - 210.8px);top:calc(8% - 54.4px);width:680px;height:680px;background:url("assets/digital-globe.webp") center / contain no-repeat;opacity:.3;filter:sepia(.72) saturate(.72);animation:globeTurn 55s linear infinite}
.contact-section::after { content:"";position:absolute;z-index:-1;right:-15%;top:8%;width:55%;height:70%;border-top:2px solid rgba(239,181,49,.42);transform:rotate(-21deg);box-shadow:0 -2px 12px rgba(0,126,237,.18)}
.contact-left,.contact-right{position:relative;z-index:2;min-width:0}.contact-badges{display:flex;gap:14px;margin-bottom:15px}.contact-badges>span{min-height:40px;padding:0 18px;display:flex;align-items:center;gap:10px;border:1px solid rgba(138,162,185,.32);border-radius:22px;color:#cbd2dc;background:#06101b;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.contact-badges i{width:10px;height:10px;border-radius:50%;background:#20e29b;box-shadow:0 0 10px #12cb8c}.contact-badges b{color:#efb73b}
.contact-left>h2 { margin:0;color:#efb83e;font-family:Georgia,"Times New Roman",serif;font-size:clamp(42px,3.35vw,54px);line-height:1.05}.contact-left>h2 span{color:#f5f6f8}.contact-title-line{position:relative;width:310px;max-width:70%;height:22px}.contact-title-line::before{content:"";position:absolute;left:0;right:0;top:10px;height:1px;background:linear-gradient(90deg,#efb83e,transparent)}.contact-title-line i{position:absolute;left:20%;top:6px;width:8px;height:8px;transform:rotate(45deg);background:#ffe180;box-shadow:0 0 10px #e8a82b}.contact-lead{margin:4px 0 18px;color:#c6ced8;font-size:15px;line-height:1.55}
.contact-methods{width:52%;display:grid;gap:10px}.contact-methods article{min-height:83px;padding:8px 12px;display:grid;grid-template-columns:68px 1fr;align-items:center;border:1px solid rgba(225,171,50,.4);border-radius:9px;background:linear-gradient(105deg,rgba(5,18,30,.97),rgba(3,11,20,.95))}.contact-methods article>span{width:56px;height:56px;display:grid;place-items:center;border:1px solid #e1a833;border-radius:50%;color:#efb63a;background:#07111d}.contact-methods svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.contact-methods h3{margin:0 0 4px;color:#efb83d;font-size:14px}.contact-methods p{margin:0;color:#d3d8df;font-size:11px;line-height:1.45}.contact-methods small{color:#aab4c1;font-size:9px}.contact-coin{position:absolute;right:0;top:175px;width:52%;height:420px;display:grid;place-items:center}.contact-coin img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(0,98,209,.26))}
.social-panel{min-height:105px;margin-top:12px;padding:10px 20px;text-align:center;border:1px solid rgba(225,171,50,.34);border-radius:9px;background:#04101c}.social-panel h3{margin:0;color:#efb73b;font-size:15px;text-transform:uppercase}.social-panel p{margin:5px 0 10px;color:#b8c1cc;font-size:11px}.social-panel>div{display:flex;justify-content:center;gap:35px}.social-panel a{width:36px;height:36px;display:grid;place-items:center;border:1px solid #dca42f;border-radius:50%;color:#efb83d;background:#07111d;font-size:16px;font-weight:800;box-shadow:0 0 9px rgba(227,168,38,.15)}
.contact-right{display:grid;align-content:start;gap:20px}.contact-form{min-height:575px;padding:24px 20px 18px;border:1px solid rgba(225,171,50,.45);border-radius:12px;background:linear-gradient(145deg,rgba(5,18,31,.97),rgba(3,10,19,.98));box-shadow:inset 0 0 38px rgba(0,109,205,.08)}.contact-form>h2{margin:0;text-align:center;color:#efba46;font-family:Georgia,serif;font-size:30px}.form-title-line{width:140px;height:18px;margin:auto;border-bottom:1px solid #e6ad37}.contact-form>p{text-align:center;color:#abb5c3;font-size:12px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{min-width:0;min-height:72px;padding:12px 14px;display:flex;flex-direction:column;border:1px solid rgba(89,120,153,.35);border-radius:8px;background:#06111e}.form-grid label.full{grid-column:1/-1}.form-grid label:has(textarea){min-height:138px}.form-grid label>span{color:#dce1e7;font-size:11px;font-weight:650}.form-grid input,.form-grid textarea{width:100%;margin-top:8px;border:0;outline:0;resize:none;color:#edf1f5;background:transparent;font:inherit;font-size:12px}.form-grid textarea{min-height:86px}.form-grid input::placeholder,.form-grid textarea::placeholder{color:#7f8b9b}.contact-form>button{width:100%;min-height:50px;margin-top:13px}.contact-form>small{margin-top:14px;display:flex;align-items:center;justify-content:center;color:#aeb8c4;font-size:10px}.contact-form>small svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.instant-support{min-height:125px;padding:15px 25px;display:grid;grid-template-columns:88px 1fr 210px;align-items:center;gap:14px;border:1px solid rgba(90,121,153,.32);border-radius:10px;background:#04101c}.instant-support>span{color:#efb83d;font-size:55px}.instant-support h3{margin:0 0 8px;color:#efb83d;font-size:17px}.instant-support p{margin:0;color:#aeb8c5;font-size:11px;line-height:1.5}.instant-support a{min-height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #168fe2;border-radius:8px;color:#26a9ff;background:#051525;text-transform:uppercase;font-size:13px}
@media(max-width:1050px){.contact-section{grid-template-columns:1fr;padding-inline:28px}.contact-left{max-width:800px;width:100%;margin:auto}.contact-right{max-width:800px;width:100%;margin:auto}.contact-methods{width:52%}.contact-coin{width:48%}}
@media(max-width:620px){.contact-section{padding:38px 14px 24px}.contact-badges{justify-content:center;flex-wrap:wrap}.contact-left>h2{text-align:center}.contact-title-line{margin:auto}.contact-lead{text-align:center}.contact-methods{width:100%}.contact-coin{position:relative;top:auto;right:auto;width:100%;height:310px}.social-panel>div{gap:13px;flex-wrap:wrap}.contact-form{padding-inline:13px}.contact-form>h2{font-size:25px}.form-grid{grid-template-columns:1fr}.form-grid label{grid-column:1}.instant-support{grid-template-columns:65px 1fr;padding:14px}.instant-support>a{grid-column:1/-1;width:100%}}

/* A bare 1fr track means minmax(auto,1fr), so it could not shrink below its content's
   min-content width - the aside ran ~32px past the viewport (hidden by body{overflow-x:hidden}). */
@media (max-width:1180px) {
  .team-layout, .team-footer-row, .team-aside { grid-template-columns:minmax(0,1fr); }
}
.team-aside, .advisors-panel, .board-panel, .advisor-grid, .board-grid { min-width:0; }

/* Advisors on phones: the 3-up grid above squeezes the portraits to ~90px wide.
   One card per row, photo left at its true 2:3 aspect (sprite is 1774x887 = 591x887 per face). */
@media (max-width:700px) and (min-width:561px) {
  .advisor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  .advisor-grid article { min-height:262px; }
  .advisor-photo { height:150px; }
  .advisor-grid h4 { font-size:12px; }
  .advisor-grid strong { font-size:10px; }
  .advisor-grid p { font-size:9px; line-height:1.4; }
}
@media (max-width:560px) {
  .advisor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .advisor-grid article { min-height:0; padding:0 0 9px; display:block; text-align:center; }
  /* "auto" height keeps the portrait's real 2:3 proportions and crops the bottom
     instead of squashing the face; position-y 0 keeps the head in frame */
  .advisor-photo { width:100%; height:auto; aspect-ratio:.88; background-size:300% auto; background-position-y:0; }
  .advisor-grid h4 { margin:7px 4px 2px; font-size:11px; line-height:1.2; }
  .advisor-grid strong { font-size:9px; }
  .advisor-grid .team-location { display:block; margin-top:2px; font-size:8px; }
  .advisor-grid p { margin:6px 7px 0; font-size:9px; line-height:1.4; }
}

/* Contact coin float (the globe behind it is the section's own ::before, now rotating) */
.contact-coin img { position:relative; z-index:1; animation:contactCoinFloat 5.6s ease-in-out infinite; }
@keyframes contactCoinFloat { 0%, 100% { transform:translateY(0); } 50% { transform:translateY(-13px); } }
/* On phones height:100% did not resolve inside the centred grid, so the medallion
   fell back to intrinsic size and spilled ~45px past its box into the panel below. */
@media (max-width:620px) {
  .contact-coin { height:225px; }
  .contact-coin img { width:auto; height:auto; max-width:72%; max-height:225px; }
  /* The 680px globe was wider than the phone (‑95..585) so only its middle strip showed.
     Shrink it to fit and centre it on the coin so the whole sphere is visible. */
  .contact-section::before {
    width:min(330px, 88vw); height:min(330px, 88vw);
    left:50%; margin-left:max(-165px, -44vw);
    top:601px; margin-top:calc((225px - min(330px, 88vw)) / 2);
    opacity:.36;
  }
}
@media (max-width:360px) {
  .contact-coin { height:200px; }
  .contact-coin img { max-width:74%; max-height:200px; }
  .contact-section::before { top:601px; margin-top:calc((200px - min(330px, 88vw)) / 2); }
}

/* ============ ABOUT US ============ */
.about-section { position:relative; isolation:isolate; scroll-margin-top:var(--header-height);
  padding:34px clamp(18px,3vw,50px) 32px; display:grid; gap:20px; overflow:hidden;
  background:radial-gradient(ellipse at 24% 18%,rgba(6,74,140,.24),transparent 46%),linear-gradient(180deg,#02060d,#030b16 60%,#02060d); }
.about-section::before { content:""; position:absolute; z-index:-1; inset:0;
  background-image:radial-gradient(rgba(229,173,42,.45) .65px,transparent .85px); background-size:46px 46px; opacity:.14; }

.about-card { position:relative; overflow:hidden; border:1px solid rgba(233,177,55,.46); border-radius:16px;
  background:linear-gradient(160deg,rgba(6,19,33,.97),rgba(2,8,15,.98));
  box-shadow:inset 0 0 50px rgba(0,102,196,.09),0 12px 30px rgba(0,0,0,.36); }
.about-card::before { content:""; position:absolute; left:10%; right:10%; top:-1px; height:1px;
  background:linear-gradient(90deg,transparent,#ffe9a8,transparent); box-shadow:0 0 9px rgba(242,189,67,.55); }

.about-top { display:grid; grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr); gap:20px; align-items:stretch; }

/* intro */
.about-intro { padding:26px clamp(18px,2vw,30px) 0; display:flex; flex-direction:column; }
.about-eyebrow { display:flex; align-items:center; gap:12px; margin:0 0 10px; color:#efb83d; font-size:13px; font-weight:750; letter-spacing:.28em; text-transform:uppercase; }
.about-eyebrow i { flex:1; max-width:120px; height:1px; background:linear-gradient(90deg,#e0a93a,transparent); }
/* the medallion is absolutely positioned, so the copy is capped to the space left of
   it - otherwise the paragraph runs underneath the coin */
.about-eyebrow, .about-intro h2 { max-width:62%; }
.about-intro h2 { margin:0; color:#f6f9fc; font-family:Georgia,"Times New Roman",serif; font-size:clamp(30px,3.1vw,46px); font-weight:700; line-height:1.08; }
.about-intro h2 span { color:#f0bb43; }
.about-lead { max-width:min(430px,60%); margin:16px 0 8px; color:#b6c0cd; font-size:14.5px; line-height:1.75; }
.about-medal { position:absolute; z-index:0; right:16px; top:28px; width:min(210px,27%); aspect-ratio:1; pointer-events:none; }
.about-medal img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 14px 26px rgba(0,98,209,.3)); animation:contactCoinFloat 6.2s ease-in-out infinite; }

.about-pillars { margin-top:auto; padding-top:30px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.about-pillars article { min-width:0; padding:20px 14px 24px; text-align:center; border-right:1px solid rgba(231,175,52,.22); }
.about-pillars article:last-child { border-right:0; }
.about-pillars span { display:grid; place-items:center; height:52px; }
.about-pillars svg { width:42px; height:42px; fill:none; stroke:#efb83d; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 7px rgba(242,189,67,.35)); }
.about-pillars h3 { margin:12px 0 8px; color:#efb83d; font-size:15px; font-weight:750; }
.about-pillars p { margin:0; color:#a9b4c2; font-size:12.5px; line-height:1.6; text-wrap:pretty; }

/* photo panel */
.about-photo { display:grid; place-items:center; min-height:340px; padding:0; }
.about-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.about-photo-fallback { display:none; }
.about-photo.is-empty { padding:30px; background:
  radial-gradient(ellipse at 50% 34%,rgba(11,86,163,.34),transparent 58%),
  linear-gradient(160deg,rgba(7,22,38,.97),rgba(2,8,15,.98)); }
.about-photo.is-empty .about-photo-fallback { display:grid; place-items:center; gap:4px; text-align:center; }
.about-photo-badge { width:min(190px,52%); aspect-ratio:1; display:grid; place-items:center; }
.about-photo-badge img { width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 12px 24px rgba(0,98,209,.3)); }
.about-photo-fallback strong { margin-top:12px; color:#f6f9fc; font-family:Georgia,serif; font-size:24px; letter-spacing:.02em; }
.about-photo-fallback small { color:#c1a97e; font-size:11px; letter-spacing:.24em; text-transform:uppercase; }

/* vision + mission */
.about-mid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; align-items:stretch; }
.about-mid > .about-card { padding:22px clamp(18px,2vw,28px) 24px; }
.about-mid-head { display:flex; align-items:center; gap:14px; }
.about-mid-icon { width:62px; height:62px; flex:0 0 62px; display:grid; place-items:center; border:1px solid rgba(240,187,62,.5); border-radius:50%;
  background:radial-gradient(circle at 50% 30%,rgba(120,86,14,.4),rgba(5,14,26,.95)); box-shadow:0 0 18px rgba(242,189,67,.16); }
.about-mid-icon svg { width:32px; height:32px; fill:none; stroke:#efb83d; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.about-mid-head h3 { margin:0; color:#efb83d; font-size:15px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; }
.about-vision { position:relative; }
.about-vision-line { margin:16px 0 12px; color:#f6f9fc; font-family:Georgia,"Times New Roman",serif; font-size:clamp(22px,2.1vw,30px); font-weight:700; line-height:1.24; }
.about-vision-line em { color:#f0bb43; font-style:normal; }
/* kept clear of the globe sitting at the card's right edge */
.about-vision > p:last-of-type { max-width:min(385px,63%); margin:0; color:#adb8c6; font-size:13.5px; line-height:1.72; }
.about-vision-line { max-width:min(385px,63%); }
/* small gold globe inside the card, clipped by the card's own overflow:hidden.
   z-index 0 (not -1) - at -1 it painted behind the card background and vanished.
   transform belongs to globeTurn, so it is placed with offsets + margin, not translate. */
.about-vision-globe { position:absolute; z-index:0; right:-26px; top:50%; margin-top:-96px;
  width:192px; height:192px; pointer-events:none;
  background:url("assets/digital-globe.webp") center / contain no-repeat;
  opacity:.55; filter:sepia(1) saturate(2.6) hue-rotate(-12deg) brightness(1.05);
  animation:globeTurn 58s linear infinite; }
/* keep the copy above the globe */
.about-vision .about-mid-head, .about-vision p { position:relative; z-index:1; }

.about-mission-list { margin:16px 0 0; padding:0; list-style:none; display:grid; gap:11px; }
.about-mission-list li { display:grid; grid-template-columns:21px 1fr; align-items:start; gap:11px; color:#c3ccd8; font-size:13.5px; line-height:1.55; }
.about-mission-list svg { width:21px; height:21px; margin-top:1px; fill:none; stroke:#efb83d; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

@media (max-width:1150px) {
  .about-top { grid-template-columns:minmax(0,1fr); }
  .about-photo { min-height:300px; }
  .about-medal { width:190px; right:-6px; top:6px; }
}
@media (max-width:860px) {
  .about-mid { grid-template-columns:minmax(0,1fr); }
  .about-pillars { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-pillars article:nth-child(2n) { border-right:0; }
  .about-pillars article:nth-child(-n+2) { border-bottom:1px solid rgba(231,175,52,.22); }
  .about-vision-globe { right:-90px; width:240px; height:240px; opacity:.22; }
}
@media (max-width:560px) {
  .about-section { padding:28px 14px 24px; gap:14px; }
  .about-card { border-radius:14px; }
  .about-intro { padding:20px 14px 0; }
  .about-eyebrow { font-size:11px; letter-spacing:.22em; }
  .about-intro h2 { font-size:clamp(26px,8vw,34px); }
  .about-lead { font-size:13px; line-height:1.68; }
  .about-eyebrow, .about-intro h2, .about-lead { max-width:100%; }
  .about-medal { position:relative; right:auto; top:auto; width:150px; margin:14px auto 0; }
  .about-pillars { padding-top:16px; }
  .about-pillars article { padding:15px 9px 18px; }
  .about-pillars svg { width:34px; height:34px; }
  .about-pillars h3 { font-size:13px; margin:9px 0 6px; }
  .about-pillars p { font-size:11.5px; }
  .about-photo { min-height:230px; }
  .about-mid > .about-card { padding:18px 14px 20px; }
  .about-mid-icon { width:50px; height:50px; flex-basis:50px; }
  .about-mid-icon svg { width:26px; height:26px; }
  .about-vision-line { font-size:clamp(20px,6.4vw,25px); }
  .about-vision-globe { display:none; }
  .about-mission-list li { font-size:12.5px; }
}

/* ============ WPP TOKEN SECTION (overview left, live price right) ============ */
.token-section { position:relative; isolation:isolate; scroll-margin-top:var(--header-height);
  padding:34px clamp(18px,3vw,50px) 30px; overflow:hidden;
  display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr); gap:24px; align-items:start;
  background:radial-gradient(ellipse at 22% 26%,rgba(6,74,140,.26),transparent 44%),linear-gradient(180deg,#02060d,#030b16 62%,#02060d); }
.token-section::before { content:""; position:absolute; z-index:-1; inset:0;
  background-image:radial-gradient(rgba(229,173,42,.45) .65px,transparent .85px); background-size:46px 46px; opacity:.15; }

.token-card { position:relative; overflow:hidden; padding:22px clamp(16px,1.5vw,24px);
  border:1px solid rgba(70,140,220,.5); border-radius:18px;
  background:linear-gradient(160deg,rgba(6,18,32,.97),rgba(2,8,15,.98));
  box-shadow:inset 0 0 50px rgba(0,102,196,.1),0 14px 34px rgba(0,0,0,.4); }
.token-card::before { content:""; position:absolute; left:8%; right:8%; top:-1px; height:1px;
  background:linear-gradient(90deg,transparent,#5cc4ff,transparent); box-shadow:0 0 10px rgba(60,170,255,.7); }

/* ---- overview ---- */
.token-overview { display:grid; grid-template-columns:minmax(0,1fr) 210px; gap:16px; align-items:center; }
.token-overview-body { min-width:0; }
.token-head { display:flex; align-items:center; gap:14px; }
.token-head-icon { width:54px; height:54px; flex:0 0 54px; display:grid; place-items:center; border:1.5px solid rgba(126,110,255,.7); border-radius:50%;
  background:radial-gradient(circle at 50% 30%,rgba(80,70,190,.35),rgba(6,14,28,.9)); box-shadow:0 0 16px rgba(110,96,255,.28); }
.token-head-icon svg { width:26px; height:26px; fill:none; stroke:#9d92ff; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.token-head h2 { margin:0; color:#f4f7fb; font-family:Georgia,"Times New Roman",serif; font-size:clamp(26px,2.4vw,36px); font-weight:700; line-height:1.1; }
.token-head h2 span { color:#f0bb43; }
.token-head-line { position:relative; width:74%; height:16px; margin:8px 0 16px 68px; }
.token-head-line::before { content:""; position:absolute; left:0; right:0; top:8px; height:1px; background:linear-gradient(90deg,#c18220,#efbc49 45%,transparent); }
.token-head-line i { position:absolute; left:44%; top:4px; width:8px; height:8px; transform:rotate(45deg); background:#ffe18a; box-shadow:0 0 12px #e7a728; }

.token-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.tk { position:relative; overflow:hidden; min-width:0; min-height:74px; padding:11px 14px;
  display:grid; grid-template-columns:44px 1fr; align-items:center; gap:12px;
  border:1px solid rgba(84,116,158,.34); border-radius:12px;
  background:linear-gradient(150deg,rgba(9,22,38,.9),rgba(3,10,19,.94)); }
.tk::after { content:""; position:absolute; left:12%; right:12%; bottom:0; height:1px; background:linear-gradient(90deg,transparent,var(--tk),transparent); box-shadow:0 0 8px var(--tk); }
.tk > span { width:44px; height:44px; display:grid; place-items:center; border:1.4px solid var(--tk); border-radius:50%;
  background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--tk) 26%,transparent),rgba(5,13,25,.92)); }
.tk > span svg { width:22px; height:22px; fill:none; stroke:var(--tk); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.tk > span b { color:var(--tk); font-size:14px; font-weight:800; }
.tk div { min-width:0; }
.tk small { display:block; color:#9fabbb; font-size:11.5px; line-height:1.2; }
.tk strong { display:flex; align-items:center; gap:7px; margin-top:3px; color:#f2f6fb; font-size:15px; font-weight:750; line-height:1.15; }
.tk-violet  { --tk:#a78bfa; }
.tk-magenta { --tk:#e879f9; }
.tk-blue    { --tk:#4aa3ff; }
.tk-teal    { --tk:#2dd4bf; }
.tk-green   { --tk:#4ade80; }
.tk-gold    { --tk:#f0bb43; }
.tk-bnb { width:15px; height:15px; flex:0 0 15px; transform:rotate(45deg); border-radius:2px;
  background:linear-gradient(150deg,#ffdf6b,#e0a800); box-shadow:0 0 7px rgba(240,187,62,.55); }

.token-foot { margin-top:14px; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:12px; align-items:stretch; }
.token-contract { min-width:0; padding:12px 14px; display:grid; grid-template-columns:46px 1fr; align-items:center; gap:12px;
  border:1px solid rgba(84,116,158,.34); border-radius:12px; background:linear-gradient(150deg,rgba(9,22,38,.9),rgba(3,10,19,.94)); }
.token-contract-icon { width:46px; height:46px; display:grid; place-items:center; border:1.4px solid rgba(74,163,255,.6); border-radius:50%; background:rgba(6,18,34,.9); }
.token-contract-icon svg { width:24px; height:24px; fill:none; stroke:#4aa3ff; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.token-contract h3 { margin:0 0 7px; color:#4aa3ff; font-size:14px; font-weight:750; }
.token-contract-value { width:100%; min-height:38px; padding:0 12px; display:flex; align-items:center; justify-content:space-between; gap:10px;
  border:1px dashed rgba(45,212,191,.5); border-radius:9px; color:#2dd4bf; background:rgba(4,16,26,.8);
  font-size:13px; font-weight:650; cursor:pointer; transition:border-color 150ms ease-out,color 150ms ease-out; }
.token-contract-value:hover { border-color:#5ff0da; color:#7ef5e2; }
.token-contract-value svg { width:17px; height:17px; flex:0 0 17px; fill:none; stroke:currentColor; stroke-width:1.7; }

.token-actions { display:grid; gap:11px; align-content:center; }
.token-action { position:relative; overflow:hidden; min-height:52px; padding:0 14px;
  display:grid; grid-template-columns:26px 1fr 20px; align-items:center; gap:11px;
  border:1px solid var(--ta); border-radius:12px;
  background:linear-gradient(100deg,color-mix(in srgb,var(--ta) 20%,transparent),rgba(4,12,24,.92));
  transition:transform 170ms ease-out,box-shadow 170ms ease-out; }
.token-action:hover { transform:translateY(-2px); box-shadow:0 9px 22px rgba(0,0,0,.42),0 0 20px color-mix(in srgb,var(--ta) 45%,transparent); }
.token-action b { color:#f2f6fb; font-size:14.5px; font-weight:750; }
.token-action svg { fill:none; stroke:var(--ta); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.token-action .ta-lead { width:26px; height:26px; }
.token-action .ta-arrow { width:20px; height:20px; }
.token-action-blue   { --ta:#3b9dff; }
.token-action-violet { --ta:#a78bfa; }

.token-overview-coin { position:relative; display:grid; place-items:center; }
.token-overview-coin img { width:100%; max-width:210px; object-fit:contain; filter:drop-shadow(0 16px 28px rgba(0,98,209,.3)); animation:contactCoinFloat 5.8s ease-in-out infinite; }

/* ---- live price ---- */
.token-price { display:grid; align-content:start; gap:14px; }
.token-price-top { display:grid; grid-template-columns:64px minmax(0,1fr); gap:14px; align-items:start; }
.token-price-coin { width:64px; height:64px; display:grid; place-items:center; }
.token-price-coin img { width:64px; height:64px; object-fit:contain; filter:drop-shadow(0 0 10px rgba(239,176,45,.45)); }
.token-price-lead { min-width:0; }
.token-price-title { display:flex; align-items:center; gap:11px; flex-wrap:wrap; }
.token-price-title h3 { margin:0; color:#f4f7fb; font-size:19px; font-weight:750; }
.token-live { display:inline-flex; align-items:center; gap:6px; padding:3px 11px; border:1px solid rgba(74,222,128,.55); border-radius:999px;
  color:#4ade80; font-size:10.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; background:rgba(10,38,24,.6); }
.token-live i { width:7px; height:7px; border-radius:50%; background:#4ade80; box-shadow:0 0 8px #4ade80; animation:statusPulse 2.2s ease-in-out infinite; }
.token-price-value { display:block; margin:6px 0 8px; color:#fff; font-size:clamp(30px,3.1vw,44px); font-weight:800; letter-spacing:-.02em; line-height:1; text-shadow:0 0 22px rgba(120,205,255,.28); }
.token-price-change { display:flex; align-items:center; gap:10px; }
.token-delta { display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border:1px solid rgba(74,222,128,.55); border-radius:10px;
  color:#4ade80; font-size:15px; font-weight:800; background:rgba(10,38,24,.55); }
.token-delta svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.token-price-change small { color:#9fabbb; font-size:12.5px; }
.token-chart { position:relative; grid-column:1/-1; height:118px; margin-top:2px; }
.token-chart svg { width:100%; height:100%; overflow:visible; }
.token-chart-grid path { fill:none; stroke:rgba(120,150,190,.13); stroke-width:1; }
.token-chart-line { filter:drop-shadow(0 0 7px rgba(60,160,255,.6)); }
.token-chart-dot { position:absolute; right:-3px; top:2px; width:11px; height:11px; border-radius:50%; background:#fff;
  box-shadow:0 0 0 3px rgba(60,160,255,.35),0 0 14px 4px rgba(60,160,255,.75); }

.token-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ts { position:relative; overflow:hidden; min-width:0; min-height:74px; padding:11px 12px;
  display:grid; grid-template-columns:38px 1fr; align-items:center; gap:10px;
  border:1px solid rgba(84,116,158,.32); border-radius:12px;
  background:linear-gradient(150deg,rgba(9,22,38,.9),rgba(3,10,19,.94)); }
.ts::after { content:""; position:absolute; left:10%; right:10%; bottom:0; height:1px; background:linear-gradient(90deg,transparent,var(--ts),transparent); box-shadow:0 0 8px var(--ts); }
.ts > span { width:38px; height:38px; display:grid; place-items:center; border:1.3px solid var(--ts); border-radius:50%;
  background:radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--ts) 26%,transparent),rgba(5,13,25,.92)); }
.ts > span svg { width:19px; height:19px; fill:none; stroke:var(--ts); stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
.ts small { display:block; color:#9fabbb; font-size:11px; line-height:1.2; }
.ts strong { display:block; margin-top:3px; color:#f2f6fb; font-size:14.5px; font-weight:750; white-space:nowrap; }
.ts-up   { --ts:#4ade80; }
.ts-down { --ts:#f43f7a; }
.ts-vol  { --ts:#5b8cff; }

.token-swap { position:relative; overflow:hidden; min-height:60px; padding:0 16px;
  display:grid; grid-template-columns:40px 1fr 22px; align-items:center; gap:13px;
  border:1px solid rgba(240,187,62,.72); border-radius:13px;
  background:linear-gradient(100deg,rgba(46,32,8,.7),rgba(4,12,24,.94));
  box-shadow:inset 0 0 22px rgba(0,110,210,.14),0 7px 20px rgba(0,0,0,.34);
  transition:transform 170ms ease-out,border-color 170ms ease-out,box-shadow 170ms ease-out; }
.token-swap::after { content:""; position:absolute; inset:-130% auto -130% -45%; width:16%; pointer-events:none;
  transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,247,214,.16),transparent); animation:sheen 6.5s ease-in-out infinite; }
.token-swap:hover { transform:translateY(-2px); border-color:#ffe08f; box-shadow:0 10px 24px rgba(0,0,0,.45),0 0 22px rgba(242,189,67,.3); }
.token-swap-icon { position:relative; z-index:1; width:40px; height:40px; display:grid; place-items:center; }
.token-swap-icon svg { width:34px; height:34px; fill:none; stroke:#e8a86a; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.token-swap b { position:relative; z-index:1; color:#f4f7fb; font-size:17px; font-weight:750; }
.token-swap b em { color:#f0bb43; font-style:normal; }
.token-swap-out { position:relative; z-index:1; width:22px; height:22px; fill:none; stroke:#f0bb43; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

.token-price-foot { margin:0; display:flex; align-items:center; justify-content:center; gap:9px; color:#93a0b1; font-size:12px; }
.token-price-foot i { width:7px; height:7px; border-radius:50%; background:#4ade80; box-shadow:0 0 8px #4ade80; }
.token-price-foot span { color:#4a5665; }

@media (max-width:1250px) {
  .token-overview { grid-template-columns:minmax(0,1fr); }
  .token-overview-coin { display:none; }
  .token-head-line { width:88%; margin-left:0; }
}
@media (max-width:1050px) {
  .token-section { grid-template-columns:minmax(0,1fr); gap:20px; }
  .token-overview { grid-template-columns:minmax(0,1fr) 190px; }
  .token-overview-coin { display:grid; }
}
@media (max-width:820px) {
  .token-overview { grid-template-columns:minmax(0,1fr); }
  .token-overview-coin { display:none; }
  .token-foot { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:560px) {
  .token-section { padding:30px 14px 24px; }
  .token-card { padding:17px 13px; border-radius:15px; }
  .token-head-icon { width:44px; height:44px; flex-basis:44px; }
  .token-head-icon svg { width:22px; height:22px; }
  .token-head h2 { font-size:clamp(22px,7vw,28px); }
  .token-head-line { width:100%; margin:6px 0 13px; }
  .token-grid { grid-template-columns:1fr; gap:9px; }
  .tk { min-height:64px; padding:9px 11px; grid-template-columns:38px 1fr; gap:10px; }
  .tk > span { width:38px; height:38px; }
  .tk > span svg { width:19px; height:19px; }
  .tk strong { font-size:14px; }
  .token-price-top { grid-template-columns:50px minmax(0,1fr); gap:11px; }
  .token-price-coin, .token-price-coin img { width:50px; height:50px; }
  .token-price-title h3 { font-size:16px; }
  .token-chart { height:96px; }
  .token-stats { grid-template-columns:1fr; }
  .ts strong { font-size:14px; }
  .token-swap { grid-template-columns:32px 1fr 19px; gap:10px; padding-inline:12px; }
  .token-swap b { font-size:14px; }
  .token-swap-icon, .token-swap-icon svg { width:32px; height:32px; }
}

/* ============ SITE FOOTER (desktop only) ============ */
/* edge-to-edge: no side padding, no max-width, no side borders or corner radius */
.site-footer { position:relative; isolation:isolate; padding:0; overflow:hidden;
  background:radial-gradient(ellipse at 50% -10%,rgba(6,72,133,.3),transparent 46%),linear-gradient(180deg,#02060d,#020a14); }
.site-footer::before { content:""; position:absolute; z-index:-1; inset:0;
  background-image:radial-gradient(rgba(229,173,42,.5) .65px,transparent .85px); background-size:44px 44px; opacity:.16; }
.footer-panel { position:relative; width:100%;
  border:0; border-top:1px solid rgba(233,177,55,.6); border-radius:0;
  background:linear-gradient(160deg,rgba(6,20,34,.96),rgba(2,9,17,.98));
  box-shadow:inset 0 0 60px rgba(0,102,196,.09),0 -6px 30px rgba(0,0,0,.4); }
.footer-panel::before { content:""; position:absolute; left:18%; right:18%; top:-1px; height:1px;
  background:linear-gradient(90deg,transparent,#ffe9a8,transparent); box-shadow:0 0 10px rgba(242,189,67,.6); }

.footer-main { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1.25fr) minmax(0,.85fr) minmax(0,1.05fr);
  gap:34px; padding:32px clamp(26px,3.4vw,64px) 26px; }

/* brand block */
.footer-brand-head { display:grid; grid-template-columns:66px 1fr; align-items:center; gap:13px; }
.footer-logo { width:66px; height:66px; display:grid; place-items:center; }
.footer-logo img { width:66px; height:66px; object-fit:contain; filter:drop-shadow(0 0 9px rgba(27,151,255,.24)); }
.footer-brand strong { display:block; color:#f8cb64; font-family:Georgia,"Times New Roman",serif; font-size:20px; font-weight:700; text-shadow:0 0 14px rgba(242,189,67,.4); }
.footer-brand p { margin:6px 0 0; color:#aeb8c5; font-size:12.5px; line-height:1.5; }
.footer-mail { position:relative; overflow:hidden; width:100%; max-width:290px; min-height:56px; margin-top:16px; padding:8px 14px;
  display:grid; grid-template-columns:40px 1fr; align-items:center; gap:11px;
  border:1px solid rgba(240,187,62,.66); border-radius:11px;
  background:linear-gradient(150deg,rgba(11,29,47,.96),rgba(3,10,18,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),inset 0 0 20px rgba(0,110,210,.16),0 6px 16px rgba(0,0,0,.3);
  transition:transform 170ms ease-out,border-color 170ms ease-out,box-shadow 170ms ease-out; }
.footer-mail::after { content:""; position:absolute; inset:-130% auto -130% -45%; width:18%; pointer-events:none;
  transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,247,214,.16),transparent); animation:sheen 6.5s ease-in-out infinite; }
.footer-mail:hover { transform:translateY(-2px); border-color:#ffe08f; box-shadow:inset 0 0 22px rgba(0,120,225,.2),0 9px 22px rgba(0,0,0,.42),0 0 20px rgba(242,189,67,.26); }
.footer-mail-icon { position:relative; z-index:1; width:40px; height:40px; display:grid; place-items:center; border-radius:10px;
  background:linear-gradient(150deg,#ffefbe,#b8842b 28%,#fff6dd 52%,#a4741a 76%,#f8d066);
  box-shadow:0 3px 10px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.6); }
.footer-mail-icon svg { width:21px; height:21px; fill:none; stroke:#1a1307; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.footer-mail-copy { position:relative; z-index:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.footer-mail-copy small { color:#8fa0b6; font-size:8.5px; font-weight:650; letter-spacing:.14em; text-transform:uppercase; }
.footer-mail-copy b { color:#f4f7fb; font-size:14px; font-weight:750; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* link columns */
.footer-col h3 { margin:6px 0 15px; color:#efb83d; font-size:14px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.footer-col-split { display:grid; grid-template-columns:1fr 1fr; gap:0 18px; }
.footer-col ul { margin:0; padding:0; list-style:none; display:grid; gap:9px; align-content:start; }
.footer-col li a { position:relative; display:inline-flex; align-items:center; gap:8px; padding-left:14px; color:#c3cbd6; font-size:12.5px; transition:color 150ms ease-out,padding-left 150ms ease-out; }
.footer-col li a::before { content:""; position:absolute; left:0; width:5px; height:5px; border-top:1.4px solid #e0a93a; border-right:1.4px solid #e0a93a; transform:rotate(45deg); transition:border-color 150ms ease-out; }
.footer-col li a:hover { color:#ffe08f; padding-left:18px; }
.footer-col li a:hover::before { border-color:#ffe9a8; }

/* newsletter */
.footer-news p { margin:0 0 14px; color:#aeb8c5; font-size:12.5px; line-height:1.5; }
.footer-subscribe { display:grid; gap:11px; }
.footer-subscribe label { position:relative; display:block; }
.footer-subscribe input { width:100%; min-height:46px; padding:0 42px 0 14px; border:1px solid rgba(96,128,163,.42); border-radius:9px;
  color:#eef2f7; background:#061220; font:inherit; font-size:12.5px; outline:0; transition:border-color 150ms ease-out,box-shadow 150ms ease-out; }
.footer-subscribe input::placeholder { color:#7d8899; }
.footer-subscribe input:focus { border-color:#e0a93a; box-shadow:0 0 0 3px rgba(224,169,58,.14); }
.footer-subscribe label svg { position:absolute; right:14px; top:50%; width:19px; height:19px; transform:translateY(-50%); pointer-events:none;
  fill:none; stroke:#8b96a6; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.footer-subscribe button { width:100%; min-height:46px; font-size:13px; letter-spacing:.1em; }

/* bottom bar */
.footer-bottom { min-height:58px; padding:12px clamp(26px,3.4vw,64px);
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px;
  border-top:1px solid rgba(231,175,52,.34); }
.footer-bottom p { margin:0; display:inline-flex; align-items:center; gap:8px; color:#9fabba; font-size:11.5px; white-space:nowrap; }
.footer-bottom svg { width:17px; height:17px; flex:0 0 17px; fill:none; stroke:#efb83d; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.footer-tags { justify-self:center; color:#c9d2dd !important; }
.footer-accept { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.footer-accept > span { margin-right:3px; color:#9fabba; font-size:11.5px; }
.footer-accept b { margin-right:9px; color:#d6dde6; font-size:11px; font-weight:700; }
.footer-accept b:last-child { margin-right:0; }
.fcoin { width:21px; height:21px; display:grid; place-items:center; border-radius:50%; color:#fff; font-size:11px; font-style:normal; font-weight:800; box-shadow:0 2px 6px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.35); }
.fcoin-usdt { background:linear-gradient(160deg,#4ad4a6,#1a9e77); }
.fcoin-btc  { background:linear-gradient(160deg,#ffb85c,#e07d16); }
.fcoin-eth  { background:linear-gradient(160deg,#9aa8c8,#5b6b8f); }
.fcoin-bnb  { background:linear-gradient(160deg,#ffdf6b,#e0a800); color:#2a1f04; }
.fcoin-usdc { background:linear-gradient(160deg,#5aa8ff,#1a63c4); }
.fcoin-net { margin-left:5px; padding:1px 6px; border:1px solid rgba(240,187,62,.5); border-radius:5px; color:#efb83d; font-size:9px; font-weight:700; letter-spacing:.06em; }

/* ============ RESOURCE / LEGAL PAGES ============ */
.doc-page { position:relative; isolation:isolate; min-height:70vh; padding:34px clamp(18px,4vw,64px) 46px; overflow:hidden;
  background:radial-gradient(ellipse at 28% 12%,rgba(6,74,140,.24),transparent 46%),linear-gradient(180deg,#02060d,#030b16 60%,#02060d); }
.doc-page::before { content:""; position:absolute; z-index:-2; inset:0;
  background-image:radial-gradient(rgba(229,173,42,.45) .65px,transparent .85px); background-size:46px 46px; opacity:.14; }
.doc-page::after { content:""; position:absolute; z-index:-1; right:-160px; top:-120px; width:620px; height:620px; pointer-events:none;
  background:url("assets/digital-globe.webp") center / contain no-repeat; opacity:.16; filter:sepia(.7) saturate(.8);
  animation:globeTurn 68s linear infinite; }

.doc-shell { max-width:1080px; margin:auto; }
.doc-crumb { display:flex; align-items:center; gap:9px; margin:0 0 16px; color:#8f9cad; font-size:12px; }
.doc-crumb a { display:inline-flex; align-items:center; gap:7px; color:#efb83d; transition:color 150ms ease-out; }
.doc-crumb a:hover { color:#ffe08f; }
.doc-crumb svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }

.doc-head { position:relative; overflow:hidden; padding:26px clamp(18px,2.4vw,34px) 24px; margin-bottom:20px;
  border:1px solid rgba(233,177,55,.5); border-radius:16px;
  background:linear-gradient(160deg,rgba(6,19,33,.97),rgba(2,8,15,.98));
  box-shadow:inset 0 0 50px rgba(0,102,196,.09),0 12px 30px rgba(0,0,0,.34); }
.doc-head::before { content:""; position:absolute; left:10%; right:10%; top:-1px; height:1px;
  background:linear-gradient(90deg,transparent,#ffe9a8,transparent); box-shadow:0 0 9px rgba(242,189,67,.55); }
.doc-head-top { display:flex; align-items:center; gap:15px; }
.doc-head-icon { width:60px; height:60px; flex:0 0 60px; display:grid; place-items:center; border:1px solid rgba(240,187,62,.55); border-radius:15px;
  background:radial-gradient(circle at 50% 28%,rgba(120,86,14,.4),rgba(5,14,26,.95)); box-shadow:0 0 18px rgba(242,189,67,.16); }
.doc-head-icon svg { width:30px; height:30px; fill:none; stroke:#efb83d; stroke-width:2.1; stroke-linecap:round; stroke-linejoin:round; }
.doc-head h1 { margin:0; color:#f6f9fc; font-family:Georgia,"Times New Roman",serif; font-size:clamp(28px,3.4vw,44px); font-weight:700; line-height:1.1; }
.doc-head h1 span { color:#f0bb43; }
.doc-head-line { position:relative; width:56%; height:16px; margin:8px 0 12px 75px; }
.doc-head-line::before { content:""; position:absolute; left:0; right:0; top:8px; height:1px; background:linear-gradient(90deg,#c18220,#efbc49 45%,transparent); }
.doc-head-line i { position:absolute; left:38%; top:4px; width:8px; height:8px; transform:rotate(45deg); background:#ffe18a; box-shadow:0 0 12px #e7a728; }
.doc-head p { max-width:720px; margin:0; color:#b6c0cd; font-size:14px; line-height:1.75; }
.doc-updated { display:inline-flex; align-items:center; gap:8px; margin-top:16px; padding:6px 13px; border:1px solid rgba(96,128,163,.4); border-radius:999px;
  color:#93a0b1; font-size:11.5px; }
.doc-updated i { width:7px; height:7px; border-radius:50%; background:#4ade80; box-shadow:0 0 8px #4ade80; }

.doc-body { display:grid; gap:16px; }
.doc-card { position:relative; overflow:hidden; padding:22px clamp(16px,2.2vw,30px) 24px;
  border:1px solid rgba(84,116,158,.34); border-radius:15px;
  background:linear-gradient(160deg,rgba(7,20,35,.95),rgba(2,9,17,.97));
  box-shadow:inset 0 0 40px rgba(0,102,196,.07); }
.doc-card > h2 { display:flex; align-items:center; gap:12px; margin:0 0 14px; color:#efb83d; font-size:19px; font-weight:750; }
.doc-card > h2 b { width:30px; height:30px; flex:0 0 30px; display:grid; place-items:center; border:1px solid rgba(240,187,62,.55); border-radius:9px;
  color:#f0bb43; font-size:13px; font-weight:800; background:rgba(6,17,30,.9); }
.doc-card h3 { margin:20px 0 8px; color:#dbe3ec; font-size:15px; font-weight:750; }
.doc-card h3:first-of-type { margin-top:0; }
.doc-card p { margin:0 0 11px; color:#aeb9c7; font-size:13.5px; line-height:1.78; }
.doc-card p:last-child { margin-bottom:0; }
.doc-card a { color:#4aa3ff; transition:color 150ms ease-out; }
.doc-card a:hover { color:#8ecbff; }
.doc-list { margin:0 0 12px; padding:0; list-style:none; display:grid; gap:9px; }
.doc-list li { display:grid; grid-template-columns:19px 1fr; gap:11px; align-items:start; color:#aeb9c7; font-size:13.5px; line-height:1.65; }
.doc-list svg { width:19px; height:19px; margin-top:2px; fill:none; stroke:#efb83d; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.doc-note { margin-top:14px; padding:13px 16px; display:grid; grid-template-columns:22px 1fr; gap:12px; align-items:start;
  border:1px solid rgba(240,187,62,.4); border-left:3px solid #efb83d; border-radius:10px; background:rgba(38,27,6,.42); }
.doc-note svg { width:22px; height:22px; margin-top:1px; fill:none; stroke:#efb83d; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.doc-note p { margin:0; color:#d8ddE5; font-size:13px; line-height:1.7; }

.doc-faq { display:grid; gap:10px; }
.doc-faq details { border:1px solid rgba(84,116,158,.32); border-radius:11px; background:rgba(5,15,27,.8); overflow:hidden; }
.doc-faq summary { padding:14px 16px; display:flex; align-items:center; gap:11px; color:#e6ecf3; font-size:13.5px; font-weight:650; cursor:pointer; list-style:none; }
.doc-faq summary::-webkit-details-marker { display:none; }
.doc-faq summary::after { content:"+"; margin-left:auto; color:#efb83d; font-size:19px; line-height:1; }
.doc-faq details[open] summary::after { content:"–"; }
.doc-faq details[open] summary { color:#efb83d; }
.doc-faq p { margin:0; padding:0 16px 15px; color:#aeb9c7; font-size:13px; line-height:1.72; }

.doc-cta { margin-top:20px; padding:22px clamp(16px,2.2vw,30px); display:grid; grid-template-columns:1fr auto; gap:18px; align-items:center;
  border:1px solid rgba(240,187,62,.5); border-radius:15px; background:linear-gradient(100deg,rgba(30,22,6,.6),rgba(4,12,24,.94)); }
.doc-cta h3 { margin:0 0 6px; color:#efb83d; font-size:17px; font-weight:750; }
.doc-cta p { margin:0; color:#aeb9c7; font-size:13px; }
.doc-cta .button { min-height:48px; padding-inline:26px; white-space:nowrap; }

@media (max-width:760px) {
  .doc-page { padding:24px 14px 34px; }
  .doc-head { padding:20px 15px 20px; border-radius:14px; }
  .doc-head-icon { width:48px; height:48px; flex-basis:48px; border-radius:12px; }
  .doc-head-icon svg { width:25px; height:25px; }
  .doc-head-line { width:100%; margin:8px 0 12px; }
  .doc-head p { font-size:13px; }
  .doc-card { padding:18px 14px 20px; border-radius:13px; }
  .doc-card > h2 { font-size:17px; }
  .doc-cta { grid-template-columns:1fr; text-align:center; }
  .doc-cta .button { width:100%; }
  .doc-page::after { display:none; }
}

/* desktop only - the mobile bottom nav covers navigation on phones */
@media (max-width:900px) { .site-footer { display:none; } }

/* live-activity mute toggle */
.live-activity-topline { display:flex; align-items:center; gap:8px; }
.live-activity-topline .live-activity-time { margin-left:auto; }
.live-activity-mute { width:22px; height:22px; padding:0; flex:0 0 22px; display:grid; place-items:center;
  border:1px solid rgba(150,170,196,.34); border-radius:6px; color:#93a6bd; background:rgba(6,18,32,.7);
  cursor:pointer; transition:color 150ms ease-out, border-color 150ms ease-out; }
.live-activity-mute:hover { color:#efb83d; border-color:rgba(239,184,61,.6); }
.live-activity-mute svg { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.live-activity-mute .lam-off { display:none; }
.live-activity.is-muted .live-activity-mute { color:#6e7d90; }
.live-activity.is-muted .live-activity-mute .lam-on { display:none; }
.live-activity.is-muted .live-activity-mute .lam-off { display:block; }

/* Tokenomics donut: background keyed out of the PNG, plus the same slow float
   used by the airdrop and ecosystem art. */
.tokenomics-chart img { animation: tokenChartFloat 6.8s ease-in-out infinite; }
@keyframes tokenChartFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-15px); } }

/* Brand wordmark: Georgia serif to match the section headings, "World" in the theme's
   sky blue against the gold, with a soft glow on each half. */
.brand-copy strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 21px; font-weight: 700; letter-spacing: .005em; text-transform: none;
  color: #f8cb64; text-shadow: 0 0 14px rgba(242,189,67,.4);
  white-space: nowrap;
}
.brand-world { color: #35cdf5; text-shadow: 0 0 14px rgba(37,201,239,.5); }
@media (max-width:740px) { .brand-copy strong { font-size: 19px; } }
@media (max-width:360px) { .brand-copy strong { font-size: 17px; } }

/* The brand <img> was 60x60 inside a 58x48 .brand-mark, so it spilled out of its box
   and ran into the header edges. Size the mark to the image and give it breathing room. */
@media (max-width:1180px) {
  .brand-mark { width:52px; height:52px; flex:0 0 52px; }
  .brand-mark img { width:52px; height:52px; }
}
@media (max-width:740px) {
  :root { --header-height:86px; }
  .site-header { padding-inline:18px; }
  .brand { gap:11px; }
  .brand-mark { width:56px; height:56px; flex:0 0 56px; }
  .brand-mark img { width:56px; height:56px; }
}

.contact-badges>span>svg{width:22px;height:22px;fill:#efb73b;filter:drop-shadow(0 0 4px rgba(237,180,52,.3))}
.social-panel a{font-size:0;font-weight:400}.social-panel a svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.social-panel a[aria-label="Twitter"] svg,.social-panel a[aria-label="Facebook"] svg{fill:currentColor;stroke:none}.social-panel a[aria-label="YouTube"] svg path{fill:currentColor;stroke:none}
.form-grid label{position:relative;padding-right:46px}.form-icon{position:absolute;right:14px;top:50%;width:22px;height:22px;transform:translateY(-50%);fill:none;stroke:#aeb7c4;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.form-grid label:has(textarea) .form-icon{top:30px;transform:none}

/* contact email links inherit the panel colour instead of the browser blue */
.contact-methods a { color:inherit; text-decoration:none; transition:color 160ms ease-out; }
.contact-methods a:hover { color:#ffe08f; }

/* Connect With Us - single premium email button (replaces the old social icon row) */
.social-panel { min-height:0; padding:14px 20px 17px; }
.social-panel > div { display:block; }
.social-panel a.social-mail {
  position:relative; overflow:hidden;
  width:100%; min-height:60px; padding:9px 16px;
  display:grid; grid-template-columns:44px 1fr; align-items:center; gap:13px; text-align:left;
  border:1px solid rgba(240,187,62,.72); border-radius:12px;
  background:linear-gradient(150deg,rgba(12,31,50,.96),rgba(3,10,18,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),inset 0 0 24px rgba(0,110,210,.18),0 7px 20px rgba(0,0,0,.34);
  transition:transform 180ms ease-out,border-color 180ms ease-out,box-shadow 180ms ease-out;
}
.social-mail::before { content:""; position:absolute; z-index:0; inset:0 0 auto 0; height:52%; pointer-events:none; background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 85%); }
.social-mail::after { content:""; position:absolute; z-index:1; inset:-130% auto -130% -45%; width:16%; pointer-events:none; transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,247,214,.18),transparent); animation:sheen 6.5s ease-in-out infinite; }
.social-mail:hover { transform:translateY(-3px); border-color:#ffe08f; box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 0 26px rgba(0,120,225,.24),0 11px 26px rgba(0,0,0,.45),0 0 24px rgba(242,189,67,.3); }
.social-mail:focus-visible { outline:2px solid #ffe08f; outline-offset:3px; }
.social-mail-icon { position:relative; z-index:2; width:44px; height:44px; display:grid; place-items:center; border-radius:11px; background:linear-gradient(150deg,#ffefbe,#b8842b 28%,#fff6dd 52%,#a4741a 76%,#f8d066); box-shadow:0 4px 12px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.6); }
.social-mail-icon svg { width:23px; height:23px; fill:none; stroke:#1a1307; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.social-mail-copy { position:relative; z-index:2; min-width:0; display:flex; flex-direction:column; gap:3px; }
.social-mail-copy small { color:#94a4ba; font-size:9px; font-weight:650; letter-spacing:.15em; text-transform:uppercase; }
.social-mail-copy strong { color:#f8fafd; font-size:16px; font-weight:750; letter-spacing:.005em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@media (max-width:620px) {
  .social-panel { padding-inline:12px; }
  .social-panel a.social-mail { grid-template-columns:none; display:flex; justify-content:center; align-items:center; gap:11px; min-height:56px; padding-inline:12px; text-align:center; }
  .social-mail-icon { flex:0 0 40px; width:40px; height:40px; }
  .social-mail-icon svg { width:21px; height:21px; }
  .social-mail-copy { align-items:center; }
  .social-mail-copy strong { font-size:14px; overflow:visible; }
}
/* long support address needs room in the instant-support strip (desktop only -
   an unscoped rule here would override the max-width:620px mobile layout above) */
@media (min-width:1051px) { .instant-support { grid-template-columns:88px 1fr 252px; } }
.instant-support a { padding-inline:14px; gap:9px; font-size:12px; text-transform:none; white-space:nowrap; }
.instant-support a svg { width:20px; height:20px; flex:0 0 20px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:620px) {
  .instant-support { grid-template-columns:38px 1fr; gap:14px; padding:14px 13px; align-items:start; }
  .instant-support > span { font-size:0; line-height:0; }
  .instant-support > span svg { display:block; width:34px; height:34px; margin-top:2px; }
  .instant-support h3 { margin-bottom:6px; font-size:16px; }
  .instant-support p { font-size:12px; }
  .instant-support p br { display:none; }
  .instant-support a { grid-column:1/-1; width:100%; min-height:46px; font-size:12px; }
}
@media (max-width:360px) { .instant-support a { font-size:11px; padding-inline:8px; } }
.instant-support>span{width:75px;height:75px;display:grid;place-items:center;color:#efb83d;font-size:0}.instant-support>span svg{width:70px;height:70px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 6px rgba(20,139,255,.4))}.instant-support a{gap:9px}.instant-support a svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
/* must sit after the unscoped .instant-support>span sizing above, or it loses the cascade */
@media (max-width:620px) {
  .instant-support > span { width:36px; height:36px; margin-top:2px; }
  .instant-support > span svg { width:34px; height:34px; stroke-width:3.4; }
  .instant-support a svg { width:19px; height:19px; }
}

/* One visual scale for every primary section heading, matching Why WPP. */
.ecosystem-heading h2,
.tokenomics-info h2,
.slot-airdrop-copy h2,
.slots-copy h2,
.roadmap-heading h2,
.team-heading h2,
.faq-heading h2,
.contact-left > h2 { font-size: clamp(42px, 3.35vw, 54px); }

@media (max-width: 1250px) {
  .ecosystem-heading h2,
  .tokenomics-info h2,
  .slot-airdrop-copy h2,
  .slots-copy h2,
  .roadmap-heading h2,
  .team-heading h2,
  .faq-heading h2,
  .contact-left > h2 { font-size: 43px; }
}

@media (max-width: 900px) {
  .ecosystem-heading h2,
  .tokenomics-info h2,
  .slot-airdrop-copy h2,
  .slots-copy h2,
  .roadmap-heading h2,
  .team-heading h2,
  .faq-heading h2,
  .contact-left > h2 { font-size: clamp(40px, 6vw, 56px); }
}

@media (max-width: 620px) {
  .ecosystem-heading h2,
  .tokenomics-info h2,
  .slot-airdrop-copy h2,
  .slots-copy h2,
  .roadmap-heading h2,
  .team-heading h2,
  .faq-heading h2,
  .contact-left > h2 { font-size: clamp(39px, 12vw, 50px); white-space: normal; }
}
.toast { position: fixed; z-index: var(--z-toast); left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); padding: 13px 19px; border: 1px solid rgba(242, 189, 67, .65); border-radius: 8px; color: #101010; background: #f4c75d; font-weight: 750; opacity: 0; pointer-events: none; transform: translate(-50%, 16px); transition: transform 180ms ease-out, opacity 180ms ease-out; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

.mobile-bottom-nav { display:none; }

@keyframes sheen { 0%, 62% { transform: translateX(-180px) rotate(18deg); opacity: 0; } 68% { opacity: .7; } 82%, 100% { transform: translateX(500px) rotate(18deg); opacity: 0; } }
@keyframes heroFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes footerCoinPulse { 0%,100% { opacity:.45; transform:scale(.82); } 50% { opacity:1; transform:scale(1.12); } }
/* bottom-nav WPP coin: halo + expanding ring + a soft beat on the coin itself */
@keyframes wppCoinPulse { 0%,100% { opacity:.42; transform:scale(.84); } 50% { opacity:.82; transform:scale(1.14); } }
@keyframes wppCoinRing { 0% { opacity:.5; transform:scale(.88); } 70% { opacity:0; transform:scale(1.32); } 100% { opacity:0; transform:scale(1.32); } }
@keyframes wppCoinBeat { 0%,100% { transform:scale(1); } 50% { transform:scale(1.04); } }
@keyframes coinDrop {
  0% { opacity:0; transform:translate3d(var(--drift-start,0),-120px,0) scale(.78); }
  10% { opacity:var(--coin-op,.95); }
  72% { opacity:var(--coin-op,.95); transform:translate3d(var(--drift-end,0),360px,0) scale(1); }
  100% { opacity:0; transform:translate3d(var(--drift-end,0),500px,0) scale(.9); }
}
@keyframes globeTurn { to { transform: rotate(360deg); } }
@keyframes statusPulse { 0%, 100% { transform: scale(.82); opacity: .7; } 50% { transform: scale(1); opacity: 1; } }

@media (max-width: 1320px) {
  .site-header { grid-template-columns: 260px 1fr auto; gap: 15px; padding-inline: 30px; }
  .main-nav { justify-content: center; gap: 18px; }
  .main-nav a { font-size: 11px; }
  .header-actions .button-login { display: none; }
  .button-small { min-width: 185px; }
  .hero { padding-top: 38px; }
  .hero-copy { width: 43vw; }
  h1 { font-size: clamp(52px, 5.2vw, 70px); }
  .metric { gap: 12px; padding-inline: 17px; }
  .metric-icon { flex-basis: 52px; width: 52px; height: 52px; }
  .metric-icon svg { width: 35px; height: 35px; }
  .metric small { font-size: 11px; }
}

@media (max-width: 1180px) {
  :root { --header-height: 72px; }
  .site-header { display: flex; justify-content: space-between; padding-inline: 24px; }
  .brand-mark { width: 52px; height: 52px; flex-basis: 52px; }
  .brand-mark img { width: 52px; height: 52px; }
  .brand-copy strong { font-size: 19px; }
  .menu-toggle { display: block; order: 3; }
  .header-actions { margin-left: auto; }
  .main-nav { position: fixed; z-index: var(--z-menu); top: var(--header-height); left: 0; right: 0; height: auto; padding: 12px 24px 24px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; border-bottom: 1px solid rgba(234, 181, 62, .42); background: rgba(1, 7, 16, .98); opacity: 0; pointer-events: none; transform: translateY(-12px); transition: opacity 180ms ease-out, transform 180ms ease-out; }
  .main-nav.open { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .main-nav a { min-height: 48px; }
  .menu-toggle.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle.open span:nth-child(2) { opacity: 0; }
  .menu-toggle.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .hero { min-height: 820px; padding: 45px 35px 145px; }
  .hero-copy { width: 52%; }
  .hero-visual { right: -5%; width: 69%; height: calc(100% - 100px); }
  .hero-visual > img { width: 132%; right: -14%; bottom: 5%; }
  .globe { width: min(38vw, 520px); left: 27%; top: 6%; }
  .wallet-row { flex-direction: column; }
  .wallet-button, .contract { width: 100%; }
  .metrics { left: 3%; right: 3%; grid-template-columns: repeat(2, 1fr); }
  .metric { min-height: 75px; }
  .metric:nth-child(2) { border-right: 0; }
  .metric:nth-child(-n+2) { border-bottom: 1px solid rgba(227, 177, 70, .25); }
}

@media (max-width: 740px) {
  /* must be set here - the max-width:1180px block above also sets --header-height */
  :root { --header-height: 86px; }
  body { padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
  .site-header { padding-inline: 16px; }
  .brand-copy small { display: block; margin-top: 2px; color: #c4ad82; font-size: 8.5px; letter-spacing: .13em; white-space: nowrap; }
  .header-actions { display: none; }
  .hero { padding: 31px 18px 35px; display: flex; flex-direction: column; background: radial-gradient(circle at 50% 44%, rgba(0, 105, 220, .18), transparent 35%), linear-gradient(#01040b, #041024 70%, #010611); }
  .hero-copy { width: 100%; order: 1; text-align: center; }
  .chain-row { justify-content: center; gap: 8px; margin-bottom: 18px; }
  .chain-pill { min-height: 39px; padding-inline: 12px; font-size: 11px; }
  .eyebrow { font-size: 10px; line-height: 1.6; letter-spacing: .2em; }
  h1 { font-size: clamp(40px, 11vw, 46px); line-height: 1.07; }
  h1 em { display: block; font-size: .91em; white-space: nowrap; }
  .hero-description { margin-top: 20px; font-size: 14px; line-height: 1.6; }
  .hero-actions { justify-content: center; }
  .hero-actions { width: 100%; grid-template-columns: minmax(0, 1.25fr) minmax(0, .85fr); gap: 9px; }
  .button-large { min-width: 0; padding-inline: 10px; }
  .wallet-row { width: 100%; max-width: 500px; margin-inline: auto; grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .hero-visual { position: relative; order: 2; top: auto; left: auto; right: auto; width: 100%; max-width: 520px; height: auto; aspect-ratio: 1; margin: 16px auto -4px; }
  /* heroFloat and globeTurn both animate transform, so centre with offsets - never translateX.
     The mascot PNG's visible content sits at 28.1%-75.0% (centre 51.5%), hence left = 50 - 0.515*150 */
  .hero-visual > img { width: 150%; left: -27.25%; right: auto; bottom: 4%; }
  .globe { width: 92%; left: 4%; right: auto; top: 6%; }
  .coin-rain { z-index:5; }
  .coin-rain span:nth-child(1){--coin-x:8%;--coin-size:50px;--drift-start:-7px;--drift-end:16px;--coin-time:5.8s}
  .coin-rain span:nth-child(2){--coin-x:91%;--coin-size:42px;--drift-start:12px;--drift-end:-10px;--coin-time:5.4s}
  .coin-rain span:nth-child(3){--coin-x:13%;--coin-size:45px;--drift-start:8px;--drift-end:21px;--coin-time:6.5s}
  .coin-rain span:nth-child(4){--coin-x:91%;--coin-size:48px;--drift-start:-5px;--drift-end:-14px;--coin-time:6.2s}
  .coin-rain span:nth-child(5){--coin-x:53%;--coin-size:38px;--drift-start:0;--drift-end:12px;--coin-time:7.1s}
  .coin-halo { width: 56%; left: 22%; top: 14%; }
  .platform { width: 66%; left: 17%; right: auto; bottom: 2%; }
  .metrics { position: relative; order: 3; left: auto; right: auto; bottom: auto; grid-template-columns: repeat(2, 1fr); min-height: 0; margin-top: 0; }
  .metric { min-height: 92px; padding: 13px 9px; gap: 8px; }
  .metric-icon { flex-basis: 43px; width: 43px; height: 43px; }
  .metric-icon svg { width: 29px; height: 29px; }
  .metric strong { font-size: 26px; }
  .metric small { font-size: 8px; margin-top: 5px; white-space: normal; }
  .mobile-bottom-nav { position:fixed;z-index:var(--z-menu);left:0;right:0;bottom:0;min-height:58px;padding:2px 8px calc(3px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;border:1px solid rgba(232,178,51,.32);border-top:0;border-bottom:0;border-radius:18px 18px 0 0;background:#03111e;box-shadow:0 -9px 25px rgba(0,0,0,.48),inset 0 1px 0 rgba(74,151,220,.22); }
  .mobile-bottom-nav::before { content:"";position:absolute;inset:0;border-radius:18px 18px 0 0;background:linear-gradient(180deg,rgba(10,35,57,.86),rgba(2,9,17,.96));pointer-events:none; }
  .mobile-bottom-nav a { position:relative;z-index:2;min-width:0;min-height:38px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;color:#b9c2cd;font-size:8px;font-weight:650;text-align:center;line-height:1; }
  .mobile-bottom-nav a>svg { width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:2.15;stroke-linecap:round;stroke-linejoin:round; }
  .mobile-bottom-nav a.active,.mobile-bottom-nav a:focus-visible { color:#efb83d; }
  /* z-index 5 puts the coin above the bar's gold top line (::after, z-index 3),
     so the border passes behind it instead of cutting across the logo */
  .mobile-bottom-nav .mobile-wpp-link { position:relative;z-index:5;justify-self:center;min-height:50px;color:#efb83d;transform:translateY(-15px); }
  .mobile-bottom-nav .mobile-wpp-link::before { display:none; }
  .mobile-wpp-coin { position:relative;width:72px;height:72px;display:grid;place-items:center;background:transparent;box-shadow:none;overflow:visible; }
  /* strong halo pulse behind the coin */
  .mobile-wpp-coin::before { content:"";position:absolute;inset:3px;border:1px solid rgba(239,184,62,.7);border-radius:50%;background:radial-gradient(circle,rgba(25,133,255,.24),rgba(239,184,62,.14) 45%,transparent 70%);box-shadow:0 0 15px rgba(239,184,62,.42),0 0 26px rgba(0,132,255,.24);animation:wppCoinPulse 2s ease-in-out infinite; }
  /* second, slower ring so the pulse reads as a double beat */
  .mobile-wpp-coin::after { content:"";position:absolute;inset:3px;border:1px solid rgba(255,222,140,.5);border-radius:50%;animation:wppCoinRing 2s ease-out infinite; }
  .mobile-wpp-coin img { position:relative;z-index:2;width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 0 9px rgba(239,176,45,.55)) drop-shadow(0 5px 9px rgba(0,0,0,.38));animation:wppCoinBeat 2s ease-in-out infinite; }
  .mobile-wpp-link small { font-size:8px; }
  .mobile-wpp-link small { margin-top:1px;color:#efb83d;font-size:7px;font-weight:800; }

  /* premium gold nav icons on glowing blue platforms, gold-framed bar */
  .mobile-bottom-nav { min-height:62px; border:1px solid rgba(240,187,62,.62); border-bottom:0; }
  .mobile-bottom-nav::after { content:"";position:absolute;z-index:3;left:12%;right:12%;top:0;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,#ffe9a8,transparent);box-shadow:0 0 8px rgba(242,189,67,.6); }
  .mobile-bottom-nav a { gap:3px;font-size:9.5px;letter-spacing:.02em; }
  .nav-ico { position:relative;width:30px;height:28px;display:grid;place-items:center; }
  .nav-ico::before { content:"";position:absolute;z-index:0;bottom:-2px;width:26px;height:8px;border-radius:50%;background:radial-gradient(ellipse,rgba(80,205,255,.6),rgba(0,120,240,.18) 45%,transparent 72%); }
  .nav-ico::after { content:"";position:absolute;z-index:0;bottom:1px;width:15px;height:4px;border-radius:50%;border:1px solid rgba(150,235,255,.7);box-shadow:0 0 7px rgba(50,190,255,.6); }
  .nav-ico svg, .nav-ico img { position:relative;z-index:1;width:26px;height:26px;object-fit:contain;overflow:visible;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6)) drop-shadow(0 0 6px rgba(0,145,255,.4)); }
  /* a supplied PNG carries its own glowing platform, so drop the CSS one under it */
  .nav-ico:has(img) { width:38px;height:36px; }
  .nav-ico:has(img)::before, .nav-ico:has(img)::after { display:none; }
  .nav-ico img { width:36px;height:36px; }
  .mobile-bottom-nav a.active { color:#f3c85c; }
  .mobile-bottom-nav a.active span:last-child { position:relative; }
  .mobile-bottom-nav a.active span:last-child::after { content:"";position:absolute;left:50%;right:auto;bottom:-3px;width:18px;height:2px;transform:translateX(-50%);border-radius:2px;background:linear-gradient(90deg,transparent,#ffd875,transparent);box-shadow:0 0 6px rgba(242,189,67,.7); }
  @media (max-width:360px) { .mobile-bottom-nav a { font-size:8.5px; } .nav-ico svg { width:23px;height:23px; } .nav-ico:has(img) { width:35px;height:33px; } .nav-ico img { width:33px;height:33px; } }
  .toast { bottom:calc(82px + env(safe-area-inset-bottom)); }
  .content-section { padding: 80px 20px; }
  .feature-grid { grid-template-columns: 1fr; }
  .light-ray, .orbital { display: none; }
  #network-canvas { opacity: .42; }
}

@media (max-width: 420px) {
  .brand { gap: 9px; }
  .brand-mark { width: 50px; height: 50px; flex-basis: 50px; }
  .brand-mark img { width: 50px; height: 50px; }
  .brand-copy strong { font-size: 17px; }
  .chain-pill { font-size: 10px; }
  .hero-actions { gap: 9px; }
  .button-large { font-size: 12px; }
  .wallet-button, .contract { font-size: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Premium live activity / social proof notification */
.live-activity {
  --activity-accent: #35e6a5;
  position: fixed;
  z-index: 48;
  left: clamp(16px, 2.25vw, 34px);
  bottom: clamp(20px, 3.1vh, 34px);
  width: min(386px, calc(100vw - 32px));
  min-height: 108px;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) 28px;
  align-items: center;
  gap: 12px;
  padding: 14px 12px 14px 14px;
  overflow: hidden;
  border: 1px solid rgba(239, 183, 58, .42);
  border-radius: 16px;
  color: #f7fbff;
  background:
    radial-gradient(circle at 13% 50%, color-mix(in srgb, var(--activity-accent) 14%, transparent), transparent 32%),
    linear-gradient(118deg, rgba(7, 22, 38, .97), rgba(2, 8, 17, .985) 70%);
  box-shadow:
    0 18px 48px rgba(0, 0, 0, .52),
    0 0 0 1px rgba(26, 137, 226, .08),
    inset 0 1px 0 rgba(255, 255, 255, .055),
    inset 0 0 28px rgba(0, 101, 190, .055);
  backdrop-filter: blur(18px) saturate(120%);
  -webkit-backdrop-filter: blur(18px) saturate(120%);
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-36px, 10px, 0) scale(.97);
  transition: opacity .36s ease, transform .44s cubic-bezier(.2,.78,.2,1), border-color .3s ease;
  will-change: transform, opacity;
}
.live-activity::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(105deg, transparent 0 44%, rgba(255,255,255,.045) 52%, transparent 60%);
  transform: translateX(-110%);
}
.live-activity::after {
  content: "";
  position: absolute;
  left: 88px;
  right: 38px;
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, var(--activity-accent), rgba(242,189,67,.58), transparent);
  opacity: .65;
}
.live-activity.is-visible {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0,0,0) scale(1);
}
.live-activity.is-visible::before { animation: liveActivitySheen 5.6s 1.1s ease-in-out infinite; }
.live-activity.is-blue { --activity-accent: #22a9ff; border-color: rgba(34,169,255,.42); }
.live-activity.is-purple { --activity-accent: #b973ff; border-color: rgba(185,115,255,.4); }
.live-activity-accent {
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 3px;
  border-radius: 0 4px 4px 0;
  background: linear-gradient(180deg, transparent, var(--activity-accent) 26%, var(--activity-accent) 74%, transparent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--activity-accent) 72%, transparent);
}
.live-activity-coin {
  position: relative;
  width: 66px;
  height: 66px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(238, 186, 65, .32);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(12,67,112,.42), rgba(4,13,24,.75) 68%);
  box-shadow: inset 0 0 18px rgba(0,128,255,.12), 0 0 24px rgba(0,111,214,.08);
}
.live-activity-coin::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--activity-accent) 16%, transparent), transparent 68%);
  filter: blur(4px);
}
.live-activity-coin-ring {
  position: absolute;
  inset: -1px;
  border: 1px solid color-mix(in srgb, var(--activity-accent) 56%, transparent);
  border-radius: 50%;
  opacity: .34;
  animation: liveActivityRing 2.4s ease-out infinite;
}
.live-activity-coin img {
  position: relative;
  z-index: 2;
  width: 58px;
  height: 58px;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.45)) drop-shadow(0 0 7px rgba(240,183,56,.25));
}
.live-activity-content { min-width: 0; }
.live-activity-topline { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 7px; }
.live-activity-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #dce8f3;
  font-size: 9px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .135em;
  white-space: nowrap;
}
.live-activity-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--activity-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--activity-accent) 11%, transparent), 0 0 11px var(--activity-accent);
  animation: liveActivityDot 1.7s ease-in-out infinite;
}
.live-activity-time { color: #75889c; font-size: 9px; font-weight: 650; white-space: nowrap; }
.live-activity-place { min-width: 0; display: flex; align-items: center; gap: 7px; margin-bottom: 7px; }
.live-activity-flag { flex: 0 0 auto; font-size: 19px; line-height: 1; filter: drop-shadow(0 2px 4px rgba(0,0,0,.24)); }
.live-activity-place strong {
  overflow: hidden;
  color: #f6f9fc;
  font-size: 15px;
  line-height: 1.1;
  font-weight: 720;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.live-activity-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; }
.live-activity-wallet {
  min-width: 0;
  overflow: hidden;
  color: #7f9bb5;
  font-family: Consolas, "SFMono-Regular", monospace;
  font-size: 10px;
  font-weight: 650;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.live-activity-slot {
  flex: 0 0 auto;
  color: #8799aa;
  font-size: 9px;
  font-weight: 650;
  white-space: nowrap;
}
.live-activity-slot b { color: #efbe50; font-size: 10px; font-weight: 820; }
.live-activity-close {
  align-self: start;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  margin-top: -3px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #62778c;
  background: rgba(255,255,255,.025);
  font-size: 19px;
  font-weight: 300;
  line-height: 1;
  cursor: pointer;
  transition: color .16s ease, background .16s ease, transform .16s ease;
}
.live-activity-close:hover { color: #f5cf77; background: rgba(239,183,59,.09); transform: rotate(4deg); }

@keyframes liveActivitySheen { 0%,76% { transform: translateX(-120%); opacity: 0; } 81% { opacity: 1; } 94%,100% { transform: translateX(140%); opacity: 0; } }
@keyframes liveActivityRing { 0% { transform: scale(.78); opacity: .42; } 70%,100% { transform: scale(1.18); opacity: 0; } }
@keyframes liveActivityDot { 0%,100% { transform: scale(.85); opacity: .72; } 50% { transform: scale(1.08); opacity: 1; } }

@media (max-width: 740px) {
  .live-activity {
    left: 10px;
    /* clears the bottom nav (79px) plus the WPP coin that rises 12px above it */
    bottom: calc(108px + env(safe-area-inset-bottom));
    width: min(310px, calc(100vw - 20px));
    min-height: 76px;
    grid-template-columns: 46px minmax(0,1fr) 20px;
    gap: 8px;
    padding: 8px 7px 8px 9px;
    border-radius: 12px;
    box-shadow:
      0 13px 34px rgba(0, 0, 0, .46),
      0 0 0 1px rgba(26, 137, 226, .07),
      inset 0 1px 0 rgba(255, 255, 255, .045),
      inset 0 0 22px rgba(0, 101, 190, .045);
  }
  .live-activity-accent { top: 10px; bottom: 10px; width: 2px; }
  .live-activity-coin { width: 43px; height: 43px; }
  .live-activity-coin img { width: 38px; height: 38px; }
  .live-activity-coin::after { inset: 6px; }
  .live-activity::after { left: 59px; right: 25px; }
  .live-activity-topline { gap: 6px; margin-bottom: 4px; }
  .live-activity-label { gap: 5px; font-size: 7px; letter-spacing: .095em; }
  .live-activity-dot { width: 5px; height: 5px; flex-basis: 5px; box-shadow: 0 0 0 2px color-mix(in srgb, var(--activity-accent) 11%, transparent), 0 0 8px var(--activity-accent); }
  .live-activity-time { font-size: 7px; }
  .live-activity-place { gap: 5px; margin-bottom: 4px; }
  .live-activity-place strong { font-size: 11.5px; }
  .live-activity-flag { font-size: 14px; }
  .live-activity-meta { gap: 7px; }
  .live-activity-wallet, .live-activity-slot { font-size: 7px; }
  .live-activity-slot b { font-size: 8px; }
  .live-activity-close { width: 20px; height: 20px; margin-top: -2px; font-size: 15px; }
}

@media (max-width: 380px) {
  .live-activity {
    width: min(292px, calc(100vw - 18px));
    left: 9px;
    min-height: 72px;
    grid-template-columns: 42px minmax(0,1fr) 18px;
    gap: 7px;
    padding: 7px 6px 7px 8px;
  }
  .live-activity-coin { width: 39px; height: 39px; }
  .live-activity-coin img { width: 35px; height: 35px; }
  .live-activity::after { left: 54px; right: 22px; }
  .live-activity-place strong { font-size: 11px; }
  .live-activity-wallet, .live-activity-slot { font-size: 6.7px; }
  .live-activity-meta { gap: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  .live-activity, .live-activity::before, .live-activity-dot, .live-activity-coin-ring { animation: none !important; transition-duration: .01ms !important; }
}

/* ============================================================
   App overrides (added on integration — not part of the original design file)
   The "Smart Contract (BEP-20)" value now shows the real 42-character BEP-20
   address instead of the short "Available at launch" placeholder, so the flex
   child needs to be shrinkable; without min-width:0 it overflowed its column
   and overlapped the BscScan / Audit buttons.
   ============================================================ */
.token-contract > div { min-width: 0; }
.token-contract-value { min-width: 0; }
.token-contract-value span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;   /* safety net only — the shortened address fits */
  white-space: nowrap;
  font-size: 11px;
  letter-spacing: -.2px;
}