:root{
  --ink:#0a0a0c;
  --concrete:#17171b;
  --concrete-2:#212126;
  --chrome:#c9cdd3;
  --chrome-dim:#8a8d93;
  --laser:#00f0ff;
  --violet:#7c3aed;
  --signal:#ff2d55;
  --stencil:'Big Shoulders Stencil Display', sans-serif;
  --body:'Hanken Grotesk', sans-serif;
  --mono:'JetBrains Mono', monospace;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{overflow-x:hidden;}
body{background:var(--ink); color:var(--chrome); font-family:var(--body); line-height:1.7;}
a{color:var(--laser); text-decoration:none;}
a:hover{text-decoration:underline;}
::selection{background:var(--laser); color:var(--ink);}

.topbar{
  position:sticky; top:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 5vw; gap:14px;
  font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase;
  background:rgba(10,10,12,0.9); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--concrete-2);
}
.topbar .mark{font-family:var(--stencil); font-size:20px; letter-spacing:0.03em; color:#fff; font-weight:700;}
.topbar .mark span{color:var(--signal);}
.topbar nav{display:flex; gap:26px; flex-wrap:wrap;}
.topbar nav a{color:var(--chrome); text-decoration:none;}
.topbar nav a:hover{color:var(--laser);}
.topbar .rsvp{color:var(--ink); background:var(--laser); padding:9px 16px; font-weight:700;}
.topbar .rsvp:hover{background:#fff; text-decoration:none;}

.wrap{max-width:760px; margin:0 auto; padding:70px 6vw 100px;}
.eyebrow{font-family:var(--mono); font-size:12px; letter-spacing:0.2em; text-transform:uppercase; color:var(--laser); margin-bottom:16px;}
h1{font-family:var(--stencil); font-weight:700; font-size:clamp(32px,6vw,58px); color:#fff; text-transform:uppercase; line-height:1; margin-bottom:20px;}
h2{font-family:var(--stencil); font-weight:700; font-size:clamp(22px,3.4vw,32px); color:#fff; text-transform:uppercase; margin:44px 0 16px; line-height:1.05;}
p{font-size:16.5px; color:var(--chrome); margin-bottom:18px; max-width:680px;}
ul.post-list{list-style:none;}
ul.post-list li{border-top:1px solid var(--concrete-2); padding:26px 0;}
ul.post-list li:last-child{border-bottom:1px solid var(--concrete-2);}
ul.post-list h2{margin:0 0 8px; font-size:clamp(20px,3vw,28px);}
ul.post-list a{color:#fff;}
ul.post-list a:hover{color:var(--laser);}
ul.post-list .meta{font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--chrome-dim); margin-bottom:10px;}
.meta-line{font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--chrome-dim); margin-bottom:36px;}
.article ul{margin:0 0 18px 22px; color:var(--chrome);}
.article li{margin-bottom:8px; font-size:16px;}
blockquote{border-left:2px solid var(--laser); padding-left:18px; color:var(--chrome-dim); font-style:italic; margin:24px 0;}
.cta-box{
  margin-top:56px; padding:34px 30px; background:var(--concrete); border:1px solid var(--concrete-2);
}
.cta-box h3{font-family:var(--stencil); color:#fff; text-transform:uppercase; font-size:22px; margin-bottom:10px;}
.cta-box a.btn{
  display:inline-block; margin-top:14px; background:var(--laser); color:var(--ink); font-weight:700;
  font-family:var(--mono); font-size:13px; letter-spacing:0.08em; text-transform:uppercase;
  padding:14px 24px; text-decoration:none;
}
.cta-box a.btn:hover{background:#fff;}
.back-link{display:inline-block; margin-bottom:30px; font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--chrome-dim);}
.back-link:hover{color:var(--laser);}

footer{
  padding:44px 5vw; background:var(--ink); border-top:1px solid var(--concrete-2);
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  font-family:var(--mono); font-size:12px; color:var(--chrome-dim); letter-spacing:0.05em;
}
footer .mark{font-family:var(--stencil); font-size:18px; color:#fff; text-transform:uppercase;}
footer nav a{margin-left:20px; text-decoration:none; color:var(--chrome-dim);}
footer nav a:hover{color:var(--laser);}
@media (max-width:600px){
  .topbar nav{order:3; width:100%; justify-content:space-between; gap:10px; font-size:10.5px;}
  footer{padding:32px 6vw; justify-content:flex-start;}
  footer nav{width:100%; display:flex; gap:20px; margin-top:6px;}
  footer nav a{margin-left:0;}
}