@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');
:root{--bg:#0c0b10;--panel:#15131b;--text:#f7f4fa;--muted:#aaa4b4;--pink:#ff6eae;--purple:#a78bfa}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif}
a{color:inherit;text-decoration:none}.topbar{height:76px;padding:0 7%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff12;background:#0c0b10}
.brand{font-family:'Space Grotesk',sans-serif;font-size:21px;font-weight:700;display:flex;align-items:center;gap:10px}.brand-mark{width:31px;height:31px;border-radius:10px;background:linear-gradient(135deg,var(--pink),#a78bfa);display:grid;place-items:center;color:#151019}
nav{display:flex;gap:30px;color:var(--muted);font-size:14px}nav a:hover{color:white}.login{border:1px solid #ffffff30;padding:10px 18px;border-radius:999px;font-size:14px}
.hero{min-height:510px;padding:100px 12% 90px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 78% 45%,#65305255,transparent 36%),linear-gradient(120deg,#100d17,#0c0b10 70%)}
.eyebrow{font-size:11px;letter-spacing:2px;color:var(--pink);font-weight:700}.eyebrow span{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--pink);margin-right:8px}
h1,h2,h3{font-family:'Space Grotesk',sans-serif}h1{font-size:clamp(48px,7vw,82px);line-height:1.02;letter-spacing:-4px;margin:22px 0}h1 span,.join h2 span{color:var(--pink)}
.hero p{max-width:490px;color:var(--muted);font-size:17px;line-height:1.7}.primary{display:inline-flex;align-items:center;gap:25px;background:var(--pink);color:#1b1018;padding:14px 20px;border-radius:999px;font-weight:700;margin-top:18px}.primary span{font-size:20px}.hero-note{margin-top:22px;color:#8f8797;font-size:12px}
.orb{position:absolute;border-radius:50%;filter:blur(1px);pointer-events:none}.orb-one{width:230px;height:230px;border:1px solid #ff6eae55;right:15%;top:25%;box-shadow:0 0 90px #ff6eae22,inset 0 0 70px #a78bfa18}.orb-two{width:110px;height:110px;background:linear-gradient(135deg,#ff6eae55,#a78bfa33);right:23%;top:40%;filter:blur(25px)}
.section{padding:80px 10%}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section-heading h2,.join h2{font-size:38px;margin:10px 0 0}.section-heading p{max-width:280px;color:var(--muted);font-size:14px;line-height:1.6}.rooms{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.room{background:var(--panel);border:1px solid #ffffff12;border-radius:18px;padding:25px}.room-icon{width:43px;height:43px;border-radius:13px;display:grid;place-items:center;font-size:23px}.pink{background:#ff6eae20;color:var(--pink)}.purple{background:#a78bfa20;color:var(--purple)}.blue{background:#72b7ff20;color:#72b7ff}.room h3{margin:20px 0 7px}.room p{color:var(--muted);font-size:13px}.room span{font-size:11px;color:var(--pink);letter-spacing:.5px}
.join{margin:20px 10% 75px;padding:55px;border-radius:24px;background:linear-gradient(120deg,#251523,#191426);border:1px solid #ff6eae25}.join p,.about p{max-width:580px;color:var(--muted);line-height:1.7}.about{padding:0 10% 75px}.about h2{font-size:25px}footer{border-top:1px solid #ffffff15;padding:25px 7%;display:flex;justify-content:space-between;align-items:center}footer>span{font-size:10px;letter-spacing:1.5px;color:var(--muted)}
@media(max-width:700px){.topbar{padding:0 5%}nav{display:none}.hero{padding:80px 7%}.orb-one{right:-90px}.section{padding:60px 7%}.section-heading{display:block}.rooms{grid-template-columns:1fr}.join{margin:10px 5% 55px;padding:32px 25px}.about{padding:0 7% 55px}footer{padding:22px 5%;gap:15px;flex-wrap:wrap}h1{letter-spacing:-2px}}