:root { --bg:#080d10; --panel:#11171c; --text:#f5f5f4; --muted:#92969e; --border:#293036; --orange:#ff7500; --orange-soft:#3b2715; }
* { box-sizing:border-box; }
html,body { margin:0; min-height:100%; }
body { background:var(--bg); color:var(--text); font-family:"Geist",ui-sans-serif,system-ui,-apple-system,sans-serif; font-size:16px; line-height:1.5; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.site-header { height:65px; padding:0 max(calc((100vw - 1120px)/2),24px); border-bottom:1px solid #171d21; display:flex; align-items:center; justify-content:space-between; background:rgba(9,14,17,.84); }
.brand { display:flex; align-items:center; gap:8px; font-weight:600; }
.brand img { width:28px; height:28px; object-fit:contain; }
.header-actions { display:flex; align-items:center; gap:17px; }
.wallet-button { height:36px; padding:0 16px; border:1px solid var(--orange); border-radius:10px; background:var(--orange); color:#17100a; font-weight:600; cursor:pointer; transition:transform .15s ease,filter .15s ease; }
.wallet-button:hover { transform:translateY(-1px); filter:brightness(1.07); }
.icon-button { border:0; background:none; color:var(--text); padding:4px; min-width:24px; height:32px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.icon-button svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.language { gap:8px; }
.language b { font-size:14px; font-weight:500; }
.translate { font-size:13px; line-height:1; position:relative; letter-spacing:-3px; }
.translate small { font-size:10px; position:relative; top:4px; left:1px; }
.hero { height:576px; display:flex; align-items:flex-start; justify-content:center; padding-top:109px; position:relative; overflow:hidden; }
.hero::before { content:""; position:absolute; width:560px; height:220px; left:50%; top:-80px; transform:translateX(-50%); background:radial-gradient(ellipse,rgba(255,118,0,.08),transparent 70%); pointer-events:none; }
.hero-inner { position:relative; text-align:center; }
.eyebrow { margin:0 0 16px; color:var(--orange); font-size:15px; font-weight:500; letter-spacing:.04em; text-transform:uppercase; }
h1 { margin:0; font-size:60px; line-height:1; letter-spacing:-.045em; font-weight:700; }
.lede { color:var(--muted); font-size:18px; line-height:28px; margin:22px 0 0; }
.cta-row { margin-top:40px; display:flex; justify-content:center; gap:12px; }
.button { height:48px; padding:0 24px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; gap:13px; font-weight:500; border:1px solid var(--border); }
.button.primary { color:#17100a; background:var(--orange); border-color:var(--orange); min-width:157px; }
.button.primary span { font-size:22px; line-height:1; }
.button.secondary { min-width:240px; }
.button.wallet-login { min-width:170px; background:transparent; color:var(--text); cursor:pointer; }
.button.wallet-login:hover { border-color:var(--orange); }
.button:hover { transform:translateY(-1px); filter:brightness(1.07); }
.features { max-width:1152px; margin:0 auto; padding:0 16px 96px; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.feature-card { min-height:218px; padding:24px; background:var(--panel); border:1px solid var(--border); border-radius:16px; }
.feature-icon { width:40px; height:40px; display:grid; place-items:center; margin-bottom:13px; border-radius:11px; background:var(--orange-soft); color:var(--orange); }
.feature-icon svg { width:23px; height:23px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.feature-card h3 { font-size:16px; line-height:24px; margin:0 0 12px; letter-spacing:-.02em; }
.feature-card p { margin:0; color:var(--muted); font-size:14px; line-height:20px; }
footer { min-height:69px; border-top:1px solid var(--border); padding:0 max(calc((100vw - 1120px)/2),24px); display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:14px; }
body.light { --bg:#fafafa; --panel:#fff; --text:#151515; --muted:#666b72; --border:#dedede; }
body.light .site-header { background:rgba(250,250,250,.9); }
@media (max-width:850px) { .features { grid-template-columns:repeat(2,1fr); } .hero { height:auto; padding:82px 24px 90px; } h1{font-size:48px;} }
@media (max-width:560px) { .site-header{padding:0 14px}.header-actions{gap:8px}.language{display:none}.wallet-button{height:34px;padding:0 11px;font-size:13px}.hero{padding:70px 20px 70px}.eyebrow{font-size:12px}h1{font-size:42px;line-height:1.05}.lede{font-size:16px;line-height:24px}.desktop-break{display:none}.cta-row{flex-direction:column;align-items:stretch;margin-top:32px}.button{width:100%}.features{grid-template-columns:1fr;padding:0 20px 64px}.feature-card{min-height:0}footer{padding:22px 20px;gap:10px;flex-direction:column;align-items:flex-start}.brand span{font-size:15px} }
