@font-face{font-family:Outfit;src:url('/fonts/outfit-v4-latin-regular.woff2')}
@font-face{font-family:Paytone;src:url('/fonts/paytone-one-v16-latin-regular.woff2')}
*{box-sizing:border-box}
body{margin:0;background:#0d0b0c;color:#f9f4da;font-family:Outfit,sans-serif;background-image:linear-gradient(rgba(249,244,218,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(249,244,218,.04) 1px,transparent 1px);background-size:32px 32px}
nav,main{max-width:1180px;margin:auto}
nav{padding:28px 24px;display:flex;justify-content:space-between;align-items:center}
nav a{color:#f9f4da;text-decoration:none}
.brand{font-size:32px}.brand:not(:has(.kv-wordmark)){color:transparent}
.hero{padding:70px 24px 45px;max-width:900px}
.count{text-transform:uppercase;letter-spacing:.15em;color:#ffbf00;font-weight:900}
.hero h1{font:clamp(4rem,10vw,8.5rem)/.78 Paytone;text-transform:uppercase;margin:24px 0 38px}
.hero h1 em{font-style:normal;color:#3aaee0}
.hero>p:not(.count,.tip){font-size:clamp(1.2rem,2.3vw,1.6rem);line-height:1.5;max-width:690px}
.search{margin-top:34px;display:flex;align-items:center;max-width:680px;background:#f9f4da;color:#171515;border:3px solid #171515;border-radius:14px;box-shadow:8px 8px #7d5bb0;padding:0 18px}
.search span{font-size:30px}
.search input{width:100%;padding:19px 12px;border:0;outline:0;background:transparent;font:18px Outfit}
.tip{margin-top:25px;color:#c9c1ad}
.filters{display:flex;gap:10px;overflow:auto;padding:20px 24px 34px;scrollbar-width:thin}
.filter{white-space:nowrap;border:1px solid #5c5652;background:#191718;color:#f9f4da;border-radius:999px;padding:10px 14px;font:700 14px Outfit;cursor:pointer}
.filter span{margin-left:7px;color:#a9a196}
.filter.active,.filter:hover{background:#ffbf00;color:#171515;border-color:#ffbf00}
.filter.active span,.filter:hover span{color:#171515}
.roadmap-group{padding:35px 24px 60px}
.roadmap-group>header{display:flex;align-items:end;justify-content:space-between;border-bottom:1px solid #373334;margin-bottom:24px}
.roadmap-group h2{font:clamp(2rem,4vw,3.4rem) Paytone;text-transform:uppercase;margin:0 0 16px}
.roadmap-group header span{color:#a9a196;margin-bottom:20px}
.roadmap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.roadmap-card{min-height:150px;background:#1b191a;color:#f9f4da;border:1px solid #413c3d;border-radius:15px;padding:20px;display:grid;grid-template-columns:auto 1fr auto;gap:17px;align-items:start;text-decoration:none;transition:.2s ease}
.roadmap-card:hover{transform:translateY(-4px);border-color:var(--card);box-shadow:7px 7px var(--card)}
.roadmap-icon{width:52px;height:52px;border-radius:10px;background:var(--card);color:#171515;display:grid;place-items:center;font:19px Paytone}
.roadmap-icon img{width:31px;height:31px;display:block;object-fit:contain}
.roadmap-card h3{display:block;font:20px Paytone;text-transform:uppercase;margin:3px 0 8px}
.roadmap-card small{display:block;color:#c9c1ad;font-size:15px;line-height:1.4}
.roadmap-card i{color:var(--card);font-style:normal;font-size:24px}
.roadmap-card[hidden],.roadmap-group[hidden]{display:none}
#empty{text-align:center;padding:80px 24px;font-size:22px;color:#f088a0}
@media(max-width:900px){.roadmap-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){.hero{padding-top:40px}
.hero h1{font-size:clamp(3rem,13vw,4rem)}
.roadmap-grid{grid-template-columns:1fr}
.roadmap-group{padding-left:18px;padding-right:18px}
.roadmap-group>header{align-items:center}
.roadmap-card{min-height:132px}
.filters{padding-left:18px;max-width:100vw}
.tip{line-height:1.5}
}
@media(max-width:520px){nav .kv-wordmark{font-size:.88em}}
/* roadmap-architecture:start */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.search:focus-within{outline:3px solid #ffbf00;outline-offset:4px}
.roadmap-site-footer{max-width:1180px;margin:2rem auto 0;padding:2.2rem 24px 3rem;border-top:1px solid #373334;display:flex;justify-content:space-between;gap:2rem;color:#c9c1ad}
.roadmap-site-footer p{margin:.6rem 0 0}
.roadmap-footer-brand{text-decoration:none}
.roadmap-footer-links{display:flex;align-items:flex-start;flex-wrap:wrap;gap:1rem}
.roadmap-footer-links a{color:#f9f4da;text-decoration:none;border-bottom:1px solid transparent}
.roadmap-footer-links a:hover,.roadmap-footer-links a:focus-visible{border-color:currentColor}
@media(max-width:620px){.roadmap-site-footer{display:block}.roadmap-footer-links{margin-top:1.5rem}}
/* roadmap-architecture:end */