*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:Manrope,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:#05060b;color:#e4ebf6}
img{max-width:100%;display:block}a{text-decoration:none;color:inherit}
.container{max-width:1180px;margin:0 auto;padding:0 20px}
.header{position:sticky;top:0;z-index:90;background:rgba(5,6,11,.85);backdrop-filter:blur(22px);border-bottom:1px solid rgba(255,255,255,.06)}
.header .container{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}
.logo{font-weight:800;font-size:20px}
.menu-toggle{display:none;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:linear-gradient(135deg,#38bdf8,#0ea5e9);position:relative}
.menu-toggle::before,.menu-toggle::after{content:"";position:absolute;left:12px;right:12px;height:2px;background:#fff;transition:.3s}
.menu-toggle::before{top:14px}.menu-toggle::after{bottom:14px}
.menu-toggle[aria-expanded="true"]::before{transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"]::after{transform:translateY(-7px) rotate(-45deg)}
.nav ul{display:flex;gap:22px;align-items:center;margin:0;padding:0;list-style:none}
.cta{background:#38bdf8;color:#01111d;border-radius:12px;padding:12px 20px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.ghost{border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:12px 20px;font-weight:700;color:#e4ebf6}
.hero{padding:64px 0;background:radial-gradient(960px 360px at 8% -18%,rgba(56,189,248,.18),transparent),radial-gradient(960px 360px at 92% -20%,rgba(59,130,246,.16),transparent)}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}
.eyebrow{text-transform:uppercase;font-size:14px;letter-spacing:.1em;color:#7dd3fc;margin:0 0 12px}
.hero h1{font-size:48px;line-height:1.05;margin:0 0 16px}
.hero p{opacity:.9;margin:0 0 18px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.badges{display:flex;gap:14px;flex-wrap:wrap;padding:0;margin:0;list-style:none;font-size:14px}
.badges li{border:1px solid rgba(255,255,255,.1);border-radius:999px;padding:8px 16px}
.hero-media img{border-radius:18px;border:1px solid rgba(255,255,255,.08)}
section{padding:40px 0}
.features h2,.rates h2,.ai h2,.faq h2,.swap h2{font-size:34px;margin:0 0 18px}
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.feature-grid article{background:#090c15;border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:20px}
.rates-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:flex-start}
.swap-demo{background:#090c15;border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:14px}
.swap-demo label{font-weight:600;margin-bottom:6px;display:block}
.swap-demo input,.swap-demo select{width:100%;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#04050a;color:#e4ebf6;font-size:15px}
.field-row{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.quote-row{display:flex;border:1px solid rgba(255,255,255,.12);border-radius:12px;overflow:hidden}
.mode{flex:1;padding:10px;font-weight:700;border:0;background:transparent;color:#e4ebf6;cursor:pointer}
.mode.active{background:#38bdf8;color:#01111d}
.quote{font-size:18px;font-weight:700;margin:0}
.card{background:linear-gradient(180deg,#0c111c,#080b12);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:24px}
.card ul{list-style:none;margin:0;padding:0}
.card li{margin:10px 0;opacity:.88}
.ai-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:flex-start}
.signal-list{list-style:none;padding:0;margin:18px 0 0}
.signal-list li{display:flex;gap:12px;margin:10px 0}
.signal-list span{font-weight:700;color:#38bdf8}
.ai-card{background:#090c15;border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:24px}
.ai-card img{margin-top:16px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}
.faq-wrap details{background:#090c15;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:16px;margin:12px 0}
.swap-card{background:linear-gradient(180deg,#0c1722,#070910);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:30px}
.swap-form{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}
.swap-form input,.swap-form select,.swap-form textarea{width:100%;padding:14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#04050a;color:#e4ebf6;font-size:15px}
.swap-form textarea{grid-column:1/-1;resize:vertical}
.cta.full{width:100%;border:0;cursor:pointer}
.footer{border-top:1px solid rgba(255,255,255,.05);padding:32px 0;background:#05060b}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px}
.footer ul{list-style:none;margin:0;padding:0}
.footer-base{display:flex;align-items:center;justify-content:space-between;opacity:.8;margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.05)}
@media(max-width:1100px){.feature-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:920px){.hero-grid,.rates-grid,.ai-grid,.footer-grid{grid-template-columns:1fr}.swap-form{grid-template-columns:1fr}}
@media(max-width:760px){.menu-toggle{display:block}.nav{position:absolute;top:72px;right:20px;background:#05060b;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px;display:none}
.nav.open{display:block}
.nav ul{flex-direction:column;align-items:flex-start}
.badges{flex-direction:column}
.field-row{grid-template-columns:1fr}}
