*{box-sizing:border-box;margin:0}
:root{color-scheme:dark;--bg:#07110b;--text:#f3f7f2;--soft:#c6d0c9;--muted:#8d9a91;--accent:#b6ef74;--line:#b6ef7426}
html{background:var(--bg)}
body{position:relative;display:grid;grid-template-rows:1fr auto;justify-items:center;align-items:center;min-height:100vh;min-height:100dvh;overflow-x:hidden;padding:5rem 1rem 1.25rem;color:var(--text);font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:radial-gradient(ellipse 52% 46% at 50% 34%,#173a24 0%,#0f2518 42%,transparent 75%),radial-gradient(ellipse at 50% 50%,#0c1b12 0%,#07110b 100%)}
.deco{position:fixed;inset:0;overflow:hidden;pointer-events:none}
.ring{position:absolute;border:1px solid #b6ef741c;border-radius:50%}
.ring--a{--d:max(35rem,min(67vw,119vh));width:var(--d);height:var(--d);left:calc(50% - var(--d)/2);top:calc(49% - var(--d)/2)}
.ring--b{--d:max(28.75rem,min(55.5vw,99vh));width:var(--d);height:var(--d);left:calc(50% - var(--d)/2);top:calc(49% - var(--d)/2);border-color:var(--line)}
.ring::after{content:"";position:absolute;top:50%;left:-.3rem;width:.6rem;height:.6rem;border-radius:50%;background:var(--accent);box-shadow:0 0 1.2rem #b6ef74aa}
.ring--a{animation:spin 60s linear infinite}.ring--b{animation:spin 42s linear infinite reverse}
.sphere{position:absolute;border-radius:50%}
.sphere--a{--d:max(32.5rem,58vw);width:var(--d);height:var(--d);left:calc(var(--d)*-.52);bottom:calc(var(--d)*-.62);background:radial-gradient(circle at 62% 22%,#74d75e 0%,#3f9a3c 18%,#1b4f26 40%,#0d2616 62%,transparent 72%)}
.sphere--b{--d:max(23.75rem,42vw);width:var(--d);height:var(--d);right:calc(var(--d)*-.38);top:calc(var(--d)*-.45);background:radial-gradient(circle at 30% 78%,#74d75e 0%,#3f9a3c 18%,#1b4f26 42%,#0d2616 64%,transparent 72%)}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.ring{animation:none}.dot{animation:none}}
.langs{position:fixed;top:1rem;right:1rem;z-index:2;display:flex;gap:.25rem;padding:.25rem;border:1px solid var(--line);border-radius:999px;background:#07110bcc;backdrop-filter:blur(8px)}
.langs button{min-width:2.75rem;min-height:2.25rem;padding:0 .7rem;border:0;border-radius:999px;color:var(--muted);font-weight:600;font-size:.8125rem;line-height:1;font-family:inherit;letter-spacing:.04em;background:none;cursor:pointer}
.langs button:hover{color:var(--text)}
.langs button[aria-pressed="true"]{color:#07110b;background:var(--accent)}
.langs button:focus-visible,.cta:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
main{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;width:min(38rem,100%);text-align:center}
.tile{position:relative;width:8.5rem;height:8.5rem}
.tile::before{content:"";position:absolute;inset:-3.5rem -3rem -2rem;border-radius:50%;background:radial-gradient(circle,#5fc24e40 0%,transparent 65%)}
.tile img{position:relative;display:block;width:100%;height:100%}
.wordmark{margin-top:1.25rem;font:700 .9375rem/1 Manrope,Inter,sans-serif;letter-spacing:.32em;text-transform:lowercase}
.badge{display:inline-flex;align-items:center;gap:.55rem;margin-top:2rem;padding:.4rem .9rem;border:1px solid var(--line);border-radius:999px;color:var(--soft);font-size:.875rem;background:#0b1a10b3}
.dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 #b6ef7480;animation:pulse 2s ease-out infinite}
@keyframes pulse{70%{box-shadow:0 0 0 .55rem #b6ef7400}100%{box-shadow:0 0 0 0 #b6ef7400}}
h1{margin-top:1.25rem;font:800 clamp(1.9rem,5vw,3.1rem)/1.12 Manrope,Inter,sans-serif;letter-spacing:-.015em;text-wrap:balance}
h1 .h1b{display:block;color:var(--accent)}
.lead{margin-top:1.1rem;color:var(--soft);font-size:1.0625rem;text-wrap:pretty}
.cta{display:inline-flex;align-items:center;gap:.6rem;margin-top:2rem;min-height:3rem;padding:0 1.4rem;border-radius:.85rem;color:#07110b;font-weight:700;text-decoration:none;background:var(--accent);box-shadow:0 .75rem 2rem -1rem #b6ef74aa;transition:transform .15s,box-shadow .15s}
.cta:hover{transform:translateY(-1px);box-shadow:0 1rem 2.4rem -1rem #b6ef74cc}
.cta svg{width:1.1rem;height:1.1rem}
.note{text-shadow:0 1px 6px #07110b;margin-top:.9rem;color:var(--muted);font-size:.875rem}
footer{text-shadow:0 1px 6px #07110b;position:relative;z-index:1;margin-top:2.5rem;color:var(--muted);font-size:.8125rem;text-align:center}
footer a{color:var(--soft);text-decoration:none}footer a:hover{color:var(--accent)}
@media (max-width:30rem){body{padding-top:4.5rem}.sphere--a{--d:26rem;left:calc(var(--d)*-.6);bottom:calc(var(--d)*-.72)}.sphere--b{--d:19rem}.tile{width:7rem;height:7rem}.lead{font-size:1rem}}
