@font-face{font-family:p;src:url('../../assets/fonts/Roboto/Roboto-Regular.woff2')}@font-face{font-family:p;src:url('../../assets/fonts/Roboto/Roboto-Bold.woff2');font-weight:700}:root{--p:#6255dc;--ink:#17203b;--muted:#69718a;--line:#e7e8f2;--soft:#f7f7fc}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;color:var(--ink);font:16px/1.65 p,system-ui,sans-serif}a{color:inherit;text-decoration:none}h1,h2,h3{line-height:1.12;letter-spacing:-.035em}.container{width:min(1140px,calc(100% - 40px));margin:auto}.skip{position:fixed;top:-60px;z-index:99;background:#111;color:#fff;padding:10px}.skip:focus{top:5px}a:focus-visible,summary:focus-visible{outline:3px solid #ff9e5b;outline-offset:4px}header{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:#fffc;backdrop-filter:blur(14px)}.nav{height:80px;display:flex;align-items:center;gap:32px}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:700}.brand b,.center>b{display:grid;width:38px;height:38px;place-items:center;border-radius:12px;color:#fff;background:linear-gradient(135deg,#7d70ed,#4b3dc5)}.links{margin-left:auto;display:flex;gap:28px;color:#515a73}.actions,.buttons{display:flex;gap:11px}.btn{display:inline-flex;min-height:48px;align-items:center;justify-content:center;padding:11px 21px;border:1px solid var(--line);border-radius:14px;font-weight:700;transition:.2s}.btn:hover{transform:translateY(-2px)}.primary{color:#fff;background:linear-gradient(135deg,#7769ed,#4d40ca);box-shadow:0 12px 25px #6255dc33}.secondary{background:#fff}.nav details{display:none;margin-left:auto}.nav summary{font-size:25px;list-style:none;cursor:pointer}.nav details nav{position:absolute;right:20px;top:68px;display:grid;padding:15px;gap:10px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 20px 50px #25294722}.hero{overflow:hidden;padding:90px 0 110px;background:linear-gradient(145deg,#fbfbff,#f2efff 65%,#fff7f1)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:70px}.tag{color:var(--p);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.hero h1{font-size:clamp(52px,6vw,78px);margin:15px 0 23px}.hero h1 em{color:var(--p);font-style:normal}.lead,.heading>p:last-child{color:var(--muted);font-size:18px}.hero small{display:block;margin-top:18px;color:var(--muted)}.beta-promise{display:flex;align-items:flex-start;gap:8px;max-width:570px;margin:18px 0 0;color:#514a72;font-size:14px;font-weight:700}.beta-promise span{flex:none}.mock{position:relative;padding:24px;border:1px solid #fff;border-radius:30px;background:#fffffff2;box-shadow:0 35px 80px #332c732f;animation:float 6s ease-in-out infinite}.mocktop{display:flex;justify-content:space-between;align-items:center}.mocktop i{display:grid;width:36px;height:36px;place-items:center;border-radius:50%;background:#ffd7b9;font-style:normal;font-weight:bold}.balance{display:flex;justify-content:space-between;align-items:center;padding:22px;border-radius:20px;color:#fff;background:linear-gradient(135deg,#675ae4,#4640ae)}.balance>span:first-child{display:grid}.balance strong{font-size:30px}.card{width:145px;padding:12px;border-radius:13px;background:#ffffff22}.panel{display:flex;align-items:center;gap:12px;margin-top:13px;padding:15px;border:1px solid var(--line);border-radius:16px}.panel>div{flex:1}.emoji,.icon{display:grid;width:48px;height:48px;flex:none;place-items:center;border-radius:14px;background:#fff0e5}.percent{float:right;color:var(--p)}.progress{height:7px;margin:8px 0;background:#ebe9fa;border-radius:9px}.progress i{display:block;width:68%;height:100%;background:var(--p);border-radius:9px}.panel small{display:block;color:var(--muted)}.activity>strong{color:#1a9e78}.mock aside{position:absolute;right:-35px;bottom:45px;padding:11px;border-radius:14px;background:#fff;box-shadow:0 15px 35px #2225}.mock aside small{display:block;margin:0}@keyframes float{50%{transform:translateY(-8px)}}section{padding:105px 0}.heading{max-width:680px;margin:0 auto 50px;text-align:center}.heading h2,section h2{font-size:clamp(36px,4vw,52px);margin:10px 0 15px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.cards article {
    padding: 32px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(37, 41, 71, .07);
}
.cards article h3 { margin: 20px 0 9px; font-size: 21px; }
.cards article p { margin: 0; color: var(--muted); }
.soft { background: var(--soft); }
.family { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 80px; }
.family-art { position: relative; height: 480px; }
.bubble, .center { position: absolute; display: flex; align-items: center; justify-content: center; flex-direction: column; border: 1px solid #fff; text-align: center; box-shadow: 0 24px 55px rgba(47, 42, 88, .12); }
.bubble { width: 190px; min-height: 145px; padding: 20px; border-radius: 25px; background: #fff; font-size: 30px; }
.bubble b { margin-top: 6px; font-size: 16px; }
.bubble small { color: var(--muted); font-size: 12px; line-height: 1.35; }
.bubble.parent { top: 32px; left: 4%; }
.bubble.child { right: 3%; bottom: 36px; }
.center { width: 155px; height: 155px; top: 50%; left: 50%; border-radius: 50%; color: #70421f; background: #fff3e7; transform: translate(-50%, -50%); }
.center small { margin-top: 5px; font-size: 12px; line-height: 1.35; }
.points { display: grid; gap: 16px; margin-top: 30px; }
.points article { display: flex; align-items: flex-start; gap: 14px; }
.points article > span { display: grid; width: 44px; height: 44px; flex: 0 0 44px; place-items: center; border-radius: 13px; font-size: 20px; }
.points h3 { margin: 0 0 4px; font-size: 18px; }
.points p { margin: 0; color: var(--muted); }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.steps li { position: relative; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: #fff; text-align: center; }
.steps li > span { position: absolute; width: 31px; height: 31px; top: 14px; right: 14px; display: grid; place-items: center; border-radius: 10px; color: #fff; font-weight: 700; }
.steps i { display: grid; width: 66px; height: 66px; margin: 0 auto 18px; place-items: center; border-radius: 20px; font-size: 28px; font-style: normal; }
.steps h3 { margin: 0 0 8px; font-size: 20px; }
.steps p { margin: 0; color: var(--muted); }
.currency-section { overflow: hidden; background: linear-gradient(145deg, #fffaf5, #f5f2ff); }
.currency-story { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 74px; }
.currency-story-copy h2 { margin-top: 10px; }
.currency-benefits { display: grid; margin: 30px 0 0; padding: 0; gap: 16px; list-style: none; }
.currency-benefits li { display: flex; align-items: flex-start; gap: 12px; }
.currency-benefits li > span { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; border-radius: 10px; color: #fff; background: #6255dc; font-weight: 700; }
.currency-benefits div { display: grid; }
.currency-benefits strong { font-size: 16px; }
.currency-benefits small { margin-top: 2px; color: var(--muted); font-size: 13px; }
.currency-showcase { position: relative; padding: 28px; border: 1px solid #fff; border-radius: 28px; background: rgba(255, 255, 255, .9); box-shadow: 0 28px 65px rgba(57, 45, 104, .13); }
.currency-showcase-label { display: block; margin-bottom: 14px; color: #837d99; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.currency-options { display: grid; gap: 10px; }
.currency-options article { display: flex; min-width: 0; padding: 13px; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 16px; background: #fff; }
.currency-options article.selected { border-color: #c9c2ff; background: #f6f4ff; box-shadow: 0 7px 17px rgba(98, 85, 220, .1); }
.currency-options article > i { display: grid; width: 45px; height: 45px; flex: 0 0 45px; place-items: center; border-radius: 14px; background: #fff0e5; font-size: 24px; font-style: normal; }
.currency-options article > div { display: grid; min-width: 0; flex: 1; }
.currency-options article strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.currency-options article small { color: var(--muted); font-size: 11px; }
.currency-options article > b { color: #6255dc; font-size: 18px; }
.currency-journey { display: grid; margin-top: 20px; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; }
.currency-journey > div { display: grid; min-height: 104px; padding: 13px; align-content: center; border-radius: 16px; background: #fff9f3; text-align: center; }
.currency-journey > div > span { font-size: 22px; }
.currency-journey small { color: var(--muted); font-size: 11px; }
.currency-journey strong { color: #3e355e; font-size: 15px; }
.currency-journey > i { color: #6255dc; font-size: 22px; font-style: normal; }
.currency-showcase > p { margin: 17px 0 0; color: var(--muted); font-size: 12px; text-align: center; }
.cta { padding: 15px 0 105px; }
.cta > .container > div { padding: 64px; overflow: hidden; border-radius: 30px; color: #fff; text-align: center; box-shadow: 0 28px 65px rgba(216, 91, 0, .24); }
.cta .tag { color: rgba(255, 255, 255, .82); }
.cta h2 { max-width: 760px; margin: 10px auto 15px; }
.cta p:not(.tag) { max-width: 660px; margin: 0 auto; color: rgba(255, 255, 255, .9); }
.cta .buttons { margin-top: 28px; justify-content: center; }
.cta .white { border-color: #fff; background: #fff; }
.cta .ghost { border-color: rgba(255, 255, 255, .7); color: #fff; background: rgba(255, 255, 255, .08); }
footer { padding: 58px 0 25px; border-top: 1px solid var(--line); background: #fff; }
.foot { display: grid; grid-template-columns: 1fr auto; align-items: start; gap: 45px; }
.foot > div > p { max-width: 450px; margin: 14px 0 0; color: var(--muted); }
.foot nav { display: flex; align-items: center; justify-content: flex-end; gap: 22px; color: #515a73; }
.legal { display: flex; margin-top: 40px; padding-top: 20px; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }
@media (max-width: 900px) {
    .links, .actions { display: none; }
    .nav details { display: block; }
    .hero-grid, .family, .currency-story { grid-template-columns: 1fr; }
    .hero-grid { gap: 54px; }
    .hero-grid > div:first-child { text-align: center; }
    .hero .buttons { justify-content: center; }
    .beta-promise { margin-left: auto; margin-right: auto; text-align: left; }
    .cards, .steps { grid-template-columns: 1fr; }
    .family { gap: 45px; }
    .currency-story { gap: 45px; }
    .family-art { width: min(500px, 100%); margin: auto; }
    .foot { grid-template-columns: 1fr; }
    .foot nav { justify-content: flex-start; }
}
@media (max-width: 600px) {
    .container { width: calc(100% - 28px); }
    .nav { height: 70px; }
    .nav details nav { width: min(280px, calc(100vw - 28px)); right: 14px; top: 61px; }
    .nav details nav a { padding: 9px 11px; border-radius: 9px; }
    .hero { padding: 48px 0 70px; }
    .hero h1 { font-size: clamp(37px, 11vw, 46px); }
    .lead, .heading > p:last-child { font-size: 16px; }
    .buttons { display: grid; grid-template-columns: 1fr; width: 100%; }
    .buttons .btn { width: 100%; }
    .mock { padding: 15px; border-radius: 22px; }
    .balance { padding: 18px; }
    .balance strong { font-size: 25px; }
    .card, .mock aside { display: none; }
    .panel { align-items: flex-start; padding: 13px; }
    section { padding: 72px 0; }
    .heading { margin-bottom: 34px; }
    .heading h2, section h2 { font-size: clamp(32px, 9vw, 40px); }
    .cards article { padding: 24px; }
    .family-art { height: auto; display: grid; gap: 14px; }
    .bubble, .center { position: static; width: 100%; min-height: 0; height: auto; transform: none; }
    .bubble { padding: 18px; }
    .center { padding: 20px; border-radius: 24px; }
    .points article { gap: 11px; }
    .steps li { padding: 26px 20px; }
    .currency-showcase { padding: 18px; border-radius: 22px; }
    .currency-journey { gap: 7px; }
    .currency-journey > div { min-height: 96px; padding: 9px 6px; }
    .cta { padding: 0 0 72px; }
    .cta > .container > div { padding: 42px 20px; border-radius: 23px; }
    .cta .buttons { display: grid; grid-template-columns: 1fr; }
    .foot nav { align-items: flex-start; flex-direction: column; gap: 12px; }
    .legal { display: grid; gap: 8px; }
}
@media (max-width: 420px) {
    .brand-logo-image { max-width: 145px; height: auto; }
    .hero h1 { font-size: 36px; }
    .panel.activity { align-items: flex-start; flex-wrap: wrap; }
    .panel.activity > strong { width: 100%; padding-left: 60px; }
    .cta > .container > div { padding: 36px 17px; }
}
@media (prefers-reduced-motion: reduce) {
    * { animation: none !important; scroll-behavior: auto !important; }
}