@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600;1,700&display=swap');

:root { --ink:#10262b; --muted:#60767a; --wash:#f4f7f5; --line:#dce7e3; --mint:#26cda5; --mint-dark:#0b9677; --blue:#6776fb; --coral:#ff816d; --white:#fff; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--wash); font:500 16px/1.6 Manrope,system-ui,sans-serif; }
.shell { width:min(1140px, calc(100% - 48px)); margin-inline:auto; }
.nav { height:94px; display:flex; align-items:center; justify-content:space-between; }
.brand { display:inline-flex; gap:10px; align-items:center; color:var(--ink); font-size:12px; line-height:1.08; letter-spacing:.01em; text-decoration:none; }
.brand img { border-radius:11px; box-shadow:0 7px 18px #26cda533; }.brand strong { font-size:15px; }
.nav-links { display:flex; gap:28px; align-items:center; }.nav-links > a { color:#426065; text-decoration:none; font-size:13px; }.small-cta { border:1px solid #bdd5cf; border-radius:99px; padding:8px 15px; color:var(--ink)!important; font-weight:700; }
.hero { min-height:650px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:48px; padding-block:65px 88px; }
.eyebrow { display:flex; align-items:center; gap:9px; margin:0 0 15px; color:var(--mint-dark); font:500 11px/1.2 "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; }.eyebrow span { width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 0 5px #26cda522; }
h1,h2,h3,p { margin-top:0; } h1 { margin-bottom:22px; max-width:610px; font-size:clamp(49px,6.2vw,79px); line-height:1.03; letter-spacing:-.061em; font-weight:800; } h1 em,h2 em { color:#2d9983; font-family:"Playfair Display",serif; font-weight:600; letter-spacing:-.04em; }
.intro { max-width:500px; margin-bottom:28px; color:var(--muted); font-size:17px; line-height:1.7; }.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }.button { display:inline-flex; justify-content:center; align-items:center; gap:20px; border:0; border-radius:13px; padding:16px 20px; color:white; background:var(--ink); box-shadow:0 11px 25px #10262b26; font:800 14px/1 Manrope,sans-serif; text-decoration:none; cursor:pointer; transition:transform .2s,box-shadow .2s,background .2s; }.button:hover { transform:translateY(-2px); box-shadow:0 14px 30px #10262b32; }.button.primary { background:var(--ink); }.button.primary span { color:var(--mint); font-size:19px; }.text-link { color:var(--ink); font-size:13px; font-weight:800; text-decoration:none; }.text-link span { color:var(--mint-dark); margin-left:5px; }
.interest-card { display:flex; align-items:center; gap:13px; width:max-content; max-width:100%; margin-top:45px; border-top:1px solid #d7e3df; padding-top:17px; color:#60767a; font-size:12px; }.interest-card strong { color:var(--ink); }.pulse { position:relative; width:38px; height:20px; }.pulse i { position:absolute; top:7px; width:7px; height:7px; border-radius:50%; background:var(--mint); }.pulse i:nth-child(1){left:3px;opacity:.55}.pulse i:nth-child(2){left:13px;opacity:.76}.pulse i:nth-child(3){left:23px}
.visual { position:relative; height:495px; display:grid; place-items:center; }.phone { position:relative; z-index:2; width:267px; height:483px; overflow:hidden; border:9px solid #183238; border-radius:35px; background:#183238; box-shadow:0 34px 45px #1c5a5330; color:#ecfffa; transform:rotate(5deg); }.phone:before { content:""; position:absolute; top:0; left:50%; z-index:3; width:90px; height:21px; border-radius:0 0 14px 14px; background:#183238; transform:translateX(-50%); }.phone-top { position:relative; z-index:1; display:flex; justify-content:space-between; padding:8px 15px 0; font:9px/1 DM Mono,monospace; }.phone-top i { width:55px; }.ui-label { position:relative; z-index:1; display:flex; justify-content:space-between; margin:22px 18px 0; font-size:12px; font-weight:800; }.ui-label span { color:#64e2c3; font:8px/1 DM Mono,monospace; }.map-grid { position:absolute; inset:60px -20px 48px; opacity:.55; background-image:linear-gradient(#59817b33 1px,transparent 1px),linear-gradient(90deg,#59817b33 1px,transparent 1px); background-size:24px 24px; transform:perspective(160px) rotateX(44deg); }.map-line { position:absolute; z-index:1; height:1px; transform-origin:left; background:linear-gradient(90deg,#54e6c4,#6b79ff00); }.line-a { top:188px; left:85px; width:126px; transform:rotate(19deg); }.line-b { top:286px; left:50px; width:140px; transform:rotate(-36deg); }.line-c { top:298px; left:143px; width:96px; transform:rotate(-78deg); }.node { position:absolute; z-index:2; display:flex; flex-direction:column; min-width:62px; padding:5px 7px; border:1px solid #64e2c366; border-radius:6px; background:#203d43db; box-shadow:0 0 0 5px #64e2c314; font-size:7px; line-height:1.4; }.node:before { content:""; position:absolute; top:-5px; left:10px; width:8px; height:8px; border:2px solid #d5fff5; border-radius:50%; background:#2fcfa9; }.node b { font-weight:800; }.node small { color:#8fc5bb; font-size:6px; }.n1{top:149px;left:31px}.n2{top:254px;right:29px}.n3{bottom:91px;left:52px;border-color:#8a96ff77}.n3:before{background:#7f8cfb}.map-footer { position:absolute; z-index:1; bottom:16px; left:13px; right:13px; display:flex; justify-content:space-between; padding:10px; border-radius:9px; background:#24464b; color:#8fc5bb; font:7px/1 DM Mono,monospace; }.map-footer strong { color:#79e7cb; font-weight:500; }.orb { position:absolute; border-radius:50%; filter:blur(.2px); }.orb-one { top:14px; right:30px; width:152px; height:152px; background:#c6f7e855; }.orb-two { bottom:14px; left:25px; width:105px; height:105px; background:#7585ff1a; }.dot { position:absolute; z-index:3; width:10px; height:10px; border-radius:50%; background:var(--coral); box-shadow:0 0 0 8px #ff816d22; }.dot-one { top:98px; left:40px; }.dot-two { right:30px; bottom:97px; background:var(--blue); box-shadow:0 0 0 8px #6776fb20; }
.features { padding-block:105px; }.section-heading { display:flex; align-items:end; justify-content:space-between; margin-bottom:38px; }.section-heading h2,.how h2,.licence h2 { margin:0; font-size:clamp(31px,4vw,48px); line-height:1.09; letter-spacing:-.05em; }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:17px; }.feature-grid article { min-height:235px; padding:29px; border:1px solid #dce8e4; border-radius:17px; background:#fbfdfc; transition:transform .2s,border .2s; }.feature-grid article:hover { border-color:#a6d8cd; transform:translateY(-3px); }.icon-mark { display:grid; place-items:center; width:41px; height:41px; margin-bottom:29px; border-radius:12px; background:#dffaf1; color:#099d7e; font-size:27px; line-height:1; }.icon-mark.points { background:#e8ebff; color:#6372ed; }.icon-mark.lock { background:#fff0e9; color:#e07159; }.feature-grid h3,.how h3 { margin-bottom:9px; font-size:16px; letter-spacing:-.03em; }.feature-grid p { margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.how { display:grid; grid-template-columns:.9fr 1.1fr; gap:70px; padding-block:86px; border-top:1px solid var(--line); }.how ol { display:grid; gap:25px; margin:0; padding:0; list-style:none; }.how li { display:flex; gap:21px; border-bottom:1px solid var(--line); padding-bottom:24px; }.how li:last-child { border:0; }.how li>b { color:#47bfa3; font:500 12px DM Mono,monospace; }.how li h3 { margin-top:-3px; }.how li p { max-width:400px; margin:0; color:var(--muted); font-size:13px; }
.releases { padding-block:96px; }.releases-heading { margin-bottom:26px; }.tag { border:1px solid #bde1d7; border-radius:99px; padding:6px 11px; color:#218a74; background:#e9fbf5; font:500 10px DM Mono,monospace; }.release-list { border-top:1px solid #ceded9; }.release { display:grid; grid-template-columns:1.3fr .55fr .8fr .8fr; gap:16px; align-items:center; padding:20px 8px; border-bottom:1px solid #dbe6e3; }.release-main { display:flex; align-items:center; gap:13px; }.release-badge { display:grid; place-items:center; flex:0 0 40px; height:40px; border-radius:10px; background:#e1f9f0; color:#168c72; font:700 10px DM Mono,monospace; }.release-main strong { display:block; font-size:14px; }.release-main small { display:block; color:#74898c; font:11px DM Mono,monospace; }.release-meta { color:#6b8285; font:11px DM Mono,monospace; }.release-state { color:#239477; font-size:11px; font-weight:800; }.archive-note { margin:22px 0 0; color:#6d8185; font-size:11px; }
.licence { display:grid; grid-template-columns:1fr .88fr; gap:84px; align-items:center; margin-bottom:88px; padding:71px 72px; border-radius:22px; background:var(--ink); color:#f3fffb; }.licence .eyebrow { color:#6ce1c5; }.licence h2 { font-size:clamp(38px,4vw,54px); }.licence-copy>p:not(.eyebrow) { max-width:490px; margin:23px 0; color:#b8cecb; font-size:14px; }.licence-copy>p strong { color:#fff; }.licence ul { display:grid; gap:9px; margin:0; padding:0; list-style:none; color:#d8e8e5; font-size:12px; }.licence li span { margin-right:8px; color:#6ce1c5; }.checkout-card { display:flex; flex-direction:column; padding:23px; border-radius:15px; background:#f8fcfa; color:var(--ink); box-shadow:0 18px 40px #00000025; }.price { display:flex; justify-content:space-between; align-items:center; padding-bottom:18px; border-bottom:1px solid #d9e6e1; font-size:12px; }.price span { color:#60767a; }.price strong { font-size:20px; letter-spacing:-.04em; }.checkout-card label { margin:19px 0 6px; font-size:11px; font-weight:800; }.checkout-card select { width:100%; margin-bottom:15px; border:1px solid #cbded7; border-radius:9px; padding:12px; color:var(--ink); background:#fff; font:500 12px Manrope,sans-serif; }.checkout { width:100%; border-radius:9px; }.checkout:disabled { cursor:wait; opacity:.68; transform:none; }.checkout-help { margin:15px 0 0; color:#6f8585; font-size:10px; text-align:center; }.checkout-message { min-height:18px; margin:9px 0 0; color:#bd473d; font-size:11px; text-align:center; }.checkout-message.ok { color:#168c72; }
.footer { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:25px 38px; border-top:1px solid #dbe6e2; color:#6e8385; font-size:11px; }.footer p { margin:0; }.footer>a:last-child { color:var(--ink); font-size:11px; font-weight:800; text-decoration:none; }
.documentation { max-width:820px; padding-block:55px 90px; }.doc-header h1 { margin-bottom:18px; font-size:clamp(46px,6.2vw,68px); }.doc-header .intro { max-width:660px; }.doc-notice { margin:40px 0 48px; border:1px solid #f1c8ba; border-radius:13px; padding:17px 19px; background:#fff6f1; color:#784b42; font-size:13px; line-height:1.65; }.doc-content { max-width:720px; }.doc-content h2 { margin:45px 0 14px; font-size:27px; line-height:1.15; letter-spacing:-.045em; }.doc-content p,.doc-content li { color:#4d686b; font-size:14px; line-height:1.85; }.doc-content ol { display:grid; gap:13px; padding-left:22px; }.doc-content code { padding:2px 5px; border-radius:4px; background:#e8f1ee; color:#286a5c; font:12px "DM Mono",monospace; }.doc-back { margin-top:47px; }
.checkout:disabled { cursor:not-allowed; color:#63807b; background:#e3eeea; box-shadow:none; opacity:1; transform:none; }
.checkout-message.unavailable { color:#8c6f36; }.checkout-message.error { color:#bd473d; }
@media (max-width:760px) { .shell{width:min(100% - 34px,550px)}.nav{height:76px}.nav-links>a:not(.small-cta){display:none}.nav-links{gap:0}.hero{grid-template-columns:1fr;gap:15px;padding-block:48px 69px}.visual{order:-1;height:420px;transform:scale(.82);margin:-45px -44px -10px}.hero h1{font-size:51px}.intro{font-size:15px}.interest-card{margin-top:30px}.features,.releases{padding-block:65px}.feature-grid,.licence{grid-template-columns:1fr}.feature-grid{gap:11px}.feature-grid article{min-height:auto;padding:23px}.icon-mark{margin-bottom:18px}.how{grid-template-columns:1fr;gap:32px;padding-block:64px}.release{grid-template-columns:1fr auto;gap:6px;padding-block:15px}.release-meta{display:none}.release-state{grid-column:2;grid-row:1}.licence{gap:38px;margin-bottom:55px;padding:42px 23px}.footer{align-items:flex-start;flex-direction:column;gap:12px}.footer p{max-width:260px}.section-heading h2{font-size:33px} }