@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;600;700;800&family=Unbounded:wght@600;700;800&display=swap');
:root { color:#eff6ed; background:#111c20; font-family:Manrope,Arial,sans-serif; } * { box-sizing:border-box; } body { margin:0; background:radial-gradient(circle at 88% 8%,#315d51 0,transparent 34%),#111c20; } main { max-width:1120px; margin:auto; padding:30px 34px 80px; }.hero { display:grid; grid-template-columns:1fr .9fr; align-items:center; min-height:610px; gap:36px; }.eyebrow { margin:0 0 17px; color:#c8f157; font-size:12px; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }.hero h1,.downloads h2 { margin:0; font-family:Unbounded,Manrope,sans-serif; font-size:clamp(46px,7vw,88px); line-height:.96; letter-spacing:-.08em; }.hero h1 em { color:#c8f157; font-style:normal; }.lead { max-width:460px; margin:26px 0 30px; color:#b1c7c0; font-size:17px; line-height:1.65; }.actions { display:flex; flex-wrap:wrap; gap:10px; }.button { display:inline-flex; align-items:center; gap:17px; border:1px solid #65817a; border-radius:10px; padding:14px 17px; color:#eff6ed; font-size:14px; font-weight:800; text-decoration:none; }.button.primary { color:#142018; border-color:#c8f157; background:#c8f157; }.button span { font-size:20px; line-height:1; }.art { position:relative; justify-self:center; }.art::before { content:""; position:absolute; inset:10% 3% 4% 6%; border-radius:50%; background:#c8f157; filter:blur(50px); opacity:.22; }.art img { position:relative; display:block; width:min(390px,75vw); border:1px solid #477067; border-radius:42px; box-shadow:20px 26px 0 #0a1315,0 30px 100px #0008; transform:rotate(3deg); }.downloads { display:grid; grid-template-columns:.65fr 1fr; gap:46px; padding:50px 0 0; border-top:1px solid #36534d; }.downloads h2 { font-size:clamp(29px,4vw,47px); }.cards { display:grid; gap:12px; }.download-card { position:relative; display:grid; grid-template-columns:1fr auto; gap:3px; border:1px solid #42635c; border-radius:16px; padding:22px; color:#eff6ed; text-decoration:none; background:#182b2e; transition:transform .15s,background .15s; }.download-card:hover { transform:translateY(-3px); background:#234039; }.platform,.download-card small { color:#9cb7b0; font-size:12px; }.download-card strong { font-size:18px; }.download-card b { grid-row:1/4; grid-column:2; align-self:center; display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:#17251c; background:#c8f157; font-size:20px; } footer { display:flex; justify-content:space-between; max-width:1120px; margin:auto; padding:22px 34px; border-top:1px solid #36534d; color:#91aaa3; font-size:13px; } footer span { font-weight:800; color:#dce9df; } footer a { color:#c8f157; text-decoration:none; } @media(max-width:700px) { main { padding:20px 20px 50px; }.hero,.downloads { grid-template-columns:1fr; }.hero { min-height:auto; padding:54px 0 60px; }.art { grid-row:1; }.art img { width:min(280px,70vw); border-radius:30px; }.downloads { gap:28px; }.lead { font-size:15px; } footer { padding:20px; } }
dialog { width:min(94vw,420px); border:1px solid #4d746a; border-radius:20px; padding:26px; color:#edf6ef; background:#172a2d; box-shadow:0 30px 100px #000a; } dialog::backdrop { background:#071011bb; backdrop-filter:blur(4px); }.close { position:absolute; top:15px; right:15px; width:30px; height:30px; border:0; border-radius:50%; color:#dcebe6; background:#29443f; font-size:22px; }.dialog-brand { display:flex; align-items:center; gap:9px; margin-bottom:28px; font-weight:800; }.dialog-brand img { width:35px; height:35px; border-radius:9px; }.dialog-brand+section h2 { margin:0 0 19px; font-family:Unbounded,Manrope,sans-serif; font-size:25px; letter-spacing:-.06em; }.dialog-copy { margin:-8px 0 18px; color:#a9c1ba; font-size:14px; line-height:1.5; }dialog label { display:grid; gap:6px; color:#c5d7d1; font-size:12px; font-weight:800; } dialog form { display:grid; gap:13px; } dialog input { border:1px solid #476961; border-radius:9px; padding:12px; color:#eff6ed; background:#0e1f22; font:inherit; outline:none; }dialog input:focus { border-color:#c8f157; }.submit { border:0; border-radius:9px; padding:13px; color:#162119; background:#c8f157; font-weight:800; }.switch { border:0; padding:18px 0 0; color:#c8f157; background:transparent; font:inherit; font-size:13px; }.form-status { min-height:18px; margin:0; color:#c8f157; font-size:12px; line-height:1.4; }.form-status.error { color:#ffaaa2; }