
:root{
  --night:#0A0A0F; --panel:#12121A; --ink:#F4F1EA; --muted:#B9B4A8;
  --coral:#FF5C48; --coral-text:#FFA08F; --coral-site:#FF6F61; --on-coral:#1A0B08;
  --line:#26262E; --font-display:"Avenir Next","Segoe UI",system-ui,sans-serif;
  --font-text:"Avenir Next","Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--font-text);font-size:17px;line-height:1.55}
a{color:var(--coral-text)} a:focus-visible,button:focus-visible{outline:3px solid var(--coral-site);outline-offset:3px}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
header.site{border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(10,10,15,.92);backdrop-filter:blur(8px);z-index:10}
.nav{display:flex;align-items:center;gap:22px;padding:14px 0;flex-wrap:wrap}
.wordmark{font-family:var(--font-display);font-weight:800;letter-spacing:.14em;font-size:20px;color:var(--ink);text-decoration:none}
.wordmark em{font-style:normal;color:var(--coral-site)}
.nav a.item{color:var(--ink);text-decoration:none;font-size:15px}
.nav a.item:hover{color:var(--coral-text)}
.nav .spacer{flex:1}
.join{background:var(--coral);color:var(--on-coral);font-weight:700;text-decoration:none;padding:10px 18px;border-radius:3px;font-size:15px}
.hero{padding:40px 0 34px}
.hero figure{margin:0 0 28px}
.hero figure img{width:100%;height:460px;object-fit:cover;object-position:center 30%;border-radius:4px;border:1px solid var(--line);display:block}
.hero figcaption{color:var(--muted);font-size:13px;margin-top:8px}
.kicker{color:var(--coral-text);letter-spacing:.22em;font-size:13px;text-transform:uppercase;margin:0 0 10px}
h1{font-family:var(--font-display);font-size:64px;line-height:.98;margin:0 0 14px;font-weight:800;letter-spacing:.01em}
h2{font-family:var(--font-display);font-size:30px;margin:44px 0 14px;font-weight:750}
h3{font-size:19px;margin:0 0 6px}
.persona{font-size:21px;color:var(--ink);margin:0 0 8px}
.sub{color:var(--muted);margin:0 0 20px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-block;padding:13px 22px;border-radius:3px;text-decoration:none;font-weight:700;font-size:16px;border:1px solid var(--line);color:var(--ink);background:var(--panel)}
.btn.primary{background:var(--coral);color:var(--on-coral);border-color:var(--coral)}
.schedule{border:1px solid var(--line);border-radius:4px;padding:18px 20px;margin:26px 0;background:var(--panel)}
.schedule p{margin:4px 0}.schedule .t{font-variant-numeric:tabular-nums;color:var(--coral-text);font-weight:700}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.card{border:1px solid var(--line);border-radius:4px;padding:18px;background:var(--panel)}
.card .meta{color:var(--muted);font-size:14px;margin:2px 0 8px}
.card p{margin:6px 0;color:var(--muted);font-size:15px}
.links-list{display:flex;flex-direction:column;gap:12px;max-width:560px;margin:26px auto}
.linkbtn{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--ink);text-decoration:none;font-weight:650}
.linkbtn:hover{border-color:var(--coral-site)}
.linkbtn span{color:var(--muted);font-weight:400;font-size:14px}
.center{text-align:center}.center .links-list{text-align:left}
footer.site{border-top:1px solid var(--line);margin-top:60px;padding:26px 0 40px;color:var(--muted);font-size:14px}
footer.site a{color:var(--muted)}
.credit{border:1px solid var(--line);border-left:4px solid var(--coral);padding:14px 18px;background:var(--panel);border-radius:3px;color:var(--ink)}
.qr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.qr-grid figure{margin:0;text-align:center}.qr-grid img{width:150px;height:150px;background:#fff;border-radius:4px}
.qr-grid figcaption{color:var(--muted);font-size:13px;margin-top:6px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
@media (max-width:720px){.hero{padding-top:28px}.hero figure img{height:280px}h1{font-size:44px}}
@media (max-width:300px){body{font-size:15px}.nav{gap:10px}.hero figure{display:none}h1{font-size:30px}.btn,.join{padding:12px 14px}}
@media (min-width:1600px){body{font-size:20px}.wrap{max-width:1320px}h1{font-size:84px}}
