/* Buzz Streamer — marketing site
   Layout: dark broadcast-control look, 1040px column, faint grid ground, glass cards. */
:root{
  --bg:#060b14; --bg-2:#08101c; --band:#0a1424;
  --panel:#0c1525; --panel-2:#0f1a2c; --field:#070d18;
  --line:rgba(125,170,220,.13); --line-2:rgba(64,224,238,.28);
  --text:#eef3fa; --muted:#94a3b8; --dim:#5f6f86;
  --cyan:#40e0ee; --blue:#2aa4ff; --violet:#7a5cff; --ok:#3ee0a0;
  --grad:linear-gradient(90deg,#24a2ff 0%,#7a5cff 100%);
  --f-body:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --f-display:"Inter Tight","Inter",Arial,Helvetica,sans-serif;
  --f-serif:"Tinos","Times New Roman",Times,serif;
  --f-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --r:14px; --r-sm:8px; --wrap:1040px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font:15px/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%}
button{font:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--cyan);outline-offset:2px;border-radius:6px}
.wrap{max-width:calc(var(--wrap) + 32px);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.grid-bg{background-image:linear-gradient(rgba(120,170,220,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,220,.045) 1px,transparent 1px);background-size:44px 44px}
.hl{color:var(--cyan)}
.eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan)}
.eyebrow.line{display:inline-flex;align-items:center;gap:10px}
.eyebrow.line::before{content:"";width:22px;height:1px;background:var(--cyan)}
h1,h2,h3{font-family:var(--f-display);font-weight:700;letter-spacing:-.035em;line-height:1.02;margin:0;text-wrap:balance}
.serif{font-family:var(--f-serif);font-weight:700;letter-spacing:-.01em}
.lead{color:var(--muted);font-size:17px;line-height:1.65}
.center{text-align:center}
.mono{font-family:var(--f-mono)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:8px;font-size:14px;font-weight:600;border:1px solid var(--line);background:rgba(13,22,38,.7);transition:transform .15s,box-shadow .2s,border-color .2s}
.btn:hover{border-color:var(--line-2)}
.btn-grad{background:var(--grad);border:0;color:#fff;box-shadow:0 8px 28px -8px rgba(60,140,255,.7)}
.btn-grad:hover{transform:translateY(-1px);box-shadow:0 12px 32px -8px rgba(60,140,255,.85)}
.btn-ghost{background:transparent}
.btn-sm{height:32px;padding:0 12px;font-size:13px}
.btn-block{width:100%}
.link-arrow{color:var(--cyan);font-weight:600;font-size:13px;display:inline-flex;gap:6px;align-items:center}
.link-arrow:hover{text-decoration:underline}

/* Logo */
.logo{display:inline-flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:800;font-size:18px;letter-spacing:-.03em}
.logo .mark{width:30px;height:30px;flex:none}
.logo b{color:#fff;font-weight:800}
.logo span{color:var(--blue)}

/* Announcement + nav */
.announce{background:#09111d;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted);text-align:center;padding:7px 16px;letter-spacing:.02em}
.announce .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);margin-right:6px;vertical-align:middle}
.announce a{color:var(--cyan);font-weight:700;margin-left:14px}
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:rgba(6,11,20,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:#060b14}
.nav .wrap{display:flex;align-items:center;gap:22px;height:64px}
.nav .links{display:flex;align-items:center;gap:22px;margin-left:auto;font-size:13.5px;font-weight:500;color:#cbd5e1}
.nav .links a:hover,.nav .links a.on{color:#fff}
.nav .links a.on{font-weight:700}
.nav .member{display:inline-flex;align-items:center;gap:6px}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:8px;width:40px;height:36px}
@media (max-width:980px){
  .nav-toggle{display:inline-grid;place-items:center}
  .nav .links{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:#070d18;border-bottom:1px solid var(--line);padding:8px max(16px,env(safe-area-inset-left,0px)) 16px}
  .nav .links a{padding:11px 0;border-bottom:1px solid var(--line)}
  .nav .links .btn{margin-top:12px;border:0}
  .nav.open .links{display:flex}
}

/* Sections */
.section{padding-block:96px}
.section.band{background:var(--bg-2);border-block:1px solid var(--line)}
.section-head{max-width:640px;margin:0 auto 48px;display:grid;gap:14px;justify-items:center;text-align:center}
.section-head h2{font-size:clamp(34px,5vw,46px)}
.section-head.left{margin-left:0;justify-items:start;text-align:left}

/* Cards */
.card{position:relative;background:linear-gradient(180deg,rgba(18,30,50,.75),rgba(10,18,32,.75));border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.card.glow::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(500px 220px at 85% 0%,rgba(42,164,255,.10),transparent 70%)}
.icon-tile{width:32px;height:32px;border-radius:8px;border:1px solid var(--line-2);background:rgba(64,224,238,.06);display:grid;place-items:center;color:var(--cyan)}
.icon-tile svg{width:16px;height:16px}
.tag{display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:6px;border:1px solid var(--line);font-size:11px;color:#cbd5e1;font-weight:500}
.kicker{font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:600}
ul.dots{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:7px 20px;font-size:12px;color:#cbd5e1}
ul.dots li{position:relative;padding-left:12px;line-height:1.45}
ul.dots li::before{content:"";position:absolute;left:0;top:.55em;width:4px;height:4px;border-radius:50%;background:var(--blue)}
ul.checks{list-style:none;margin:0;padding:0;display:grid;gap:11px;font-size:13.5px;color:#cbd5e1}
ul.checks li{display:flex;gap:9px;align-items:flex-start}
ul.checks li::before{content:"";flex:none;width:12px;height:12px;margin-top:4px;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.3 4.8 9 10 3' fill='none' stroke='%2340e0ee' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* Accordion */
.acc{border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.acc+.acc{margin-top:8px}
.acc>button{all:unset;box-sizing:border-box;cursor:pointer;display:flex;align-items:center;gap:16px;width:100%;padding:16px 18px}
.acc>button:focus-visible{outline:2px solid var(--cyan);border-radius:10px}
.acc .chev{margin-left:auto;color:var(--dim);transition:transform .2s;flex:none}
.acc.open .chev{transform:rotate(180deg)}
.acc .body{display:none;padding:0 18px 18px 66px;color:#cbd5e1;font-size:14px}
.acc.open .body{display:block}
.acc .body p{margin:0 0 10px}
.acc .body ol,.acc .body ul{margin:0 0 10px;padding-left:18px}
.acc .body li{margin:4px 0}
pre.code{margin:8px 0 12px;background:#050a12;border:1px solid var(--line);border-radius:8px;padding:12px 14px;font:12px/1.7 var(--f-mono);color:#7ee8f2;overflow-x:auto;white-space:pre}
code{font-family:var(--f-mono);font-size:.9em;color:#9be9f2;background:rgba(64,224,238,.07);padding:1px 5px;border-radius:4px}

/* CTA strip + footer */
.assist{background:#0a1220;border-top:1px solid var(--line)}
.assist .wrap{display:flex;align-items:center;gap:16px;padding-block:28px;flex-wrap:wrap}
.assist h3{font-family:var(--f-serif);font-size:18px;letter-spacing:0}
.assist p{margin:2px 0 0;color:var(--muted);font-size:13.5px}
.assist .btn{margin-left:auto}
.footer{background:#05090f;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
.footer .top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:32px;padding-block:52px 40px}
.footer h4{margin:0 0 16px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);font-weight:600}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.footer ul a:hover{color:#fff}
.footer .about p{margin:16px 0 14px;max-width:290px;line-height:1.7}
.footer .status{font-size:11px;letter-spacing:.06em;color:var(--dim)}
.footer .status::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 8px var(--cyan);margin-right:6px;vertical-align:middle}
.footer .bottom{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-block:22px;font-size:11px;color:#45546a;letter-spacing:.04em}
@media (max-width:760px){.footer .top{grid-template-columns:1fr 1fr}.footer .about{grid-column:1/-1}}

/* Toast */
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);opacity:0;background:#0f1a2c;border:1px solid var(--line-2);color:#fff;padding:10px 16px;border-radius:10px;font-size:13px;transition:.25s;z-index:100;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
