.page-hero { padding:180px 56px 44px; position:relative; overflow:hidden; max-width:1100px; margin:0 auto; }
.page-hero h1 { font-family:var(--font-display); font-size:clamp(34px, 5.6vw, 58px); font-weight:500; color:var(--cream); line-height:1.1; max-width:820px; }
.page-hero h1 em { font-style:italic; color:var(--purple-light); }
.page-hero p { font-size:16px; color:var(--text-muted); max-width:640px; margin:18px 0 0; line-height:1.8; }
.crumb { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); margin-bottom:20px; }
.crumb a { color:var(--purple); text-decoration:none; }
.crumb a:hover { text-decoration:underline; }

.sec { max-width:1100px; margin:0 auto; padding:0 56px; }
.sec + .sec { margin-top:76px; }
.sec > .section-label { margin-bottom:12px; }
.sec > h2 { font-family:var(--font-display); font-size:clamp(24px,2.8vw,36px); font-weight:600; color:var(--cream); margin-bottom:10px; }
.sec > .sec-intro { font-size:15px; line-height:1.85; color:var(--text-muted); max-width:660px; margin-bottom:30px; }

.board-grid {
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px;
}
.board-card {
  display:flex; flex-direction:column;
  background:var(--dark2); border:1px solid var(--border); border-radius:var(--radius);
  padding:30px 28px 26px; text-decoration:none; position:relative; overflow:hidden;
  transition:border-color .2s, transform .2s, box-shadow .2s;
}

.board-card.is-quiet { background:transparent; }
.board-card.is-quiet .board-card-name { color:var(--text-muted); }
.board-card.is-quiet .board-card-facts dd { color:var(--text-muted); font-size:17px; }

.board-card:hover {
  border-color:var(--purple); transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(85,52,165,.10);
}
.board-card-code {
  font-family:var(--font-mono); font-size:11px; letter-spacing:.14em;
  color:var(--purple); background:rgba(85,52,165,.10);
  border-radius:999px; padding:5px 12px; align-self:flex-start;
}
.board-card-name {
  font-family:var(--font-display); font-size:30px; font-weight:600;
  color:var(--cream); margin:16px 0 0; line-height:1.1;
}
.board-card-desc {
  font-size:14px; line-height:1.75; color:var(--text-muted); margin:10px 0 0;
}

.board-card-facts {
  display:flex; gap:28px; margin:20px 0 0; padding:16px 0 0;
  border-top:1px solid var(--border);
}
.board-card-facts div { margin:0; }
.board-card-facts dt {
  font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--text-muted); margin:0;
}
.board-card-facts dd {
  font-family:var(--font-display); font-size:21px; color:var(--cream);
  margin:3px 0 0; font-variant-numeric:lining-nums;
}
.board-card-go {
  margin-top:22px; font-size:13px; color:var(--purple);
  display:inline-flex; align-items:center; gap:7px;
}
.board-card-go::after { content:'\2192'; transition:transform .2s; }
.board-card:hover .board-card-go::after { transform:translateX(4px); }

.board-grid-foot {
  margin:22px 0 0; font-size:13.5px; line-height:1.8; color:var(--text-muted);
}
.board-grid-foot a { color:var(--purple); text-decoration:none; }
.board-grid-foot a:hover { text-decoration:underline; }

@media(max-width:880px){
  .board-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
  .board-card { padding:24px 22px 22px; }
  .board-card-name { font-size:26px; }
}

.board-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:26px; }
.board-tab {
  padding:11px 20px; border:1px solid var(--border); border-radius:999px;
  font-size:13.5px; color:var(--text-muted); cursor:pointer; background:transparent;
  text-decoration:none;
  transition:border-color .15s, color .15s, background .15s;
}
.board-tab:hover { color:var(--cream); border-color:var(--purple); }
.board-tab.active { background:var(--purple); border-color:var(--purple); color:#FBF8F3; }
.board-panel { display:none; }
.board-panel.active { display:block; }

.board-head {
  display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  flex-wrap:wrap; padding-bottom:14px; border-bottom:1px solid var(--border); margin-bottom:4px;
}
.board-code { font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--purple); }
.board-note { font-size:13px; color:var(--text-muted); line-height:1.7; margin:16px 0 0; max-width:620px; }

.paper-row {
  display:grid; grid-template-columns:1fr auto; gap:20px; align-items:center;
  padding:18px 0; border-bottom:1px solid var(--border);
}
.paper-name { font-size:15px; color:var(--cream); }
.paper-meta { font-size:12.5px; color:var(--text-muted); margin-top:4px; line-height:1.55; }
.paper-link {
  font-size:12.5px; color:var(--purple); text-decoration:none; white-space:nowrap;
  border:1px solid var(--border); border-radius:999px; padding:9px 18px;
  transition:border-color .15s, background .15s;
}
.paper-link:hover { border-color:var(--purple); background:rgba(85,52,165,.08); }

.note-list { border-top:1px solid var(--border); }
.note-item { padding:30px 0; border-bottom:1px solid var(--border); }
.note-item h3 { font-family:var(--font-display); font-size:22px; font-weight:600; color:var(--cream); margin-bottom:10px; }
.note-item p { font-size:15px; line-height:1.85; color:var(--text-muted); max-width:680px; margin-bottom:12px; }
.note-item p:last-child { margin-bottom:0; }
.note-item strong { color:var(--cream); font-weight:600; }
.note-item code {
  font-family:var(--font-mono); font-size:13.5px; color:var(--purple-light);
  background:rgba(85,52,165,.10); padding:2px 6px; border-radius:3px;
}

.cta { max-width:1100px; margin:0 auto; padding:80px 56px 110px; }
.cta-inner { background:var(--dark2); border:1px solid var(--border); border-radius:var(--radius); padding:48px 44px; text-align:center; }
.cta-inner h2 { font-family:var(--font-display); font-size:clamp(24px,2.8vw,34px); font-weight:600; color:var(--cream); margin-bottom:14px; }
.cta-inner p { font-size:15px; color:var(--text-muted); line-height:1.8; max-width:540px; margin:0 auto 28px; }

@media(max-width:860px){
  .page-hero { padding:130px 20px 24px; }
  .sec { padding:0 20px; }
  .sec + .sec { margin-top:56px; }
  .cta { padding:56px 20px 80px; }
  .cta-inner { padding:34px 24px; }
  .paper-row { grid-template-columns:1fr; gap:12px; }
  .paper-link { justify-self:start; }
}