/* LANDMARK — sistema visual compartido ("brutalist terminal", design_handoff_landmark_index/) */
:root{
  --bg:#0c0c0a; --bg2:#080807; --panel:#101010;
  --line:#2c2c27; --line2:#1d1d19; --line3:#181815;
  --ink:#eeede8; --ink2:#c8c3b7; --dim:#9a958a; --dim2:#7d7869; --dim3:#6f6b61;
  --lime:#d4ff3a; --orange:#ff7a4d;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:'IBM Plex Mono',ui-monospace,monospace;
  background:var(--bg); color:var(--ink);
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,0.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.02) 1px,transparent 1px);
  background-size:28px 28px;
}
a{ color:inherit; }
::-webkit-scrollbar{ width:8px; height:8px; }
::-webkit-scrollbar-track{ background:var(--bg2); }
::-webkit-scrollbar-thumb{ background:var(--line); }
::-webkit-scrollbar-thumb:hover{ background:#3a3a33; }
::selection{ background:rgba(212,255,58,.3); color:#0c0c0a; }

/* ── PAGE SHELL ── */
.pagewrap{ position:relative; z-index:1; max-width:880px; margin:0 auto; min-height:100vh; border-left:1px solid var(--line); border-right:1px solid var(--line); }
.pagewrap.wide{ max-width:1180px; }

.pagehead{ border-bottom:1px solid var(--line); padding:18px 32px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.pagehead .brand{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.pagehead .brand .dot{ width:7px; height:7px; background:var(--lime); border-radius:50%; flex-shrink:0; }
.pagehead .brand .nm{ font-size:12px; letter-spacing:0.28em; text-transform:uppercase; color:var(--dim); }
.pagehead .brand:hover .nm{ color:var(--lime); }
.pagehead nav{ display:flex; gap:18px; }
.pagehead a.nav-link,.pagehead a.back{ font-size:12px; color:var(--dim2); text-decoration:none; letter-spacing:0.04em; }
.pagehead a.nav-link:hover,.pagehead a.back:hover{ color:var(--lime); }

.pagehero{ padding:48px 32px 36px; border-bottom:1px solid var(--line); text-align:center; }
.pagehero .pk{ font-size:11px; letter-spacing:0.3em; text-transform:uppercase; color:var(--dim); margin-bottom:14px; }
.pagehero h1{ font-size:clamp(30px,5vw,46px); font-weight:700; letter-spacing:-0.03em; line-height:1.05; margin:0 0 12px; }
.pagehero p{ font-size:13px; color:var(--dim); max-width:540px; margin:0 auto; line-height:1.65; }
.pagehero p.lime{ color:var(--lime); font-weight:600; font-size:13px; }

.prose{ padding:40px 32px 80px; display:flex; flex-direction:column; gap:40px; font-size:13px; line-height:1.65; color:var(--dim); }
.prose section{ display:flex; flex-direction:column; gap:14px; }
.prose h2{ font-size:18px; font-weight:600; letter-spacing:-0.01em; color:var(--ink); margin:0 0 4px; }
.prose p{ margin:0; }
.prose p.lead{ color:var(--ink2); font-size:14px; }
.prose a{ color:var(--dim2); text-decoration:underline; text-decoration-color:var(--line); }
.prose a:hover{ color:var(--lime); }
.prose ul{ margin:0; padding-left:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.prose ul li{ padding-left:16px; position:relative; }
.prose .lastupdated{ font-size:11px; color:var(--dim3); margin-top:-28px; }

/* section label: kicker + horizontal rule */
.seclabel{ display:flex; align-items:center; gap:16px; }
.seclabel span{ font-size:11px; letter-spacing:0.22em; text-transform:uppercase; color:var(--dim); white-space:nowrap; }
.seclabel .rule{ flex:1; height:1px; background:var(--line2); }

/* generic card */
.card{ border:1px solid var(--line); padding:20px 22px; }
.card .kicker{ font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--lime); margin-bottom:8px; display:block; }
.card h3{ font-size:16px; font-weight:600; letter-spacing:-0.01em; color:var(--ink); margin:0 0 10px; }
.card p{ font-size:12.5px; color:var(--dim); line-height:1.6; margin:0; }
.card.dim .kicker{ color:var(--dim2); }

.gridcards{ display:grid; gap:14px; }
.gridcards.c2{ grid-template-columns:1fr 1fr; }
.gridcards.c3{ grid-template-columns:1fr 1fr 1fr; }
@media (max-width:700px){ .gridcards.c2,.gridcards.c3{ grid-template-columns:1fr; } }

/* trust quote box */
.quotebox{ border:1px solid var(--line); padding:32px; text-align:center; }
.quotebox .kicker{ font-size:11px; letter-spacing:0.25em; text-transform:uppercase; color:var(--lime); margin-bottom:14px; display:block; }
.quotebox blockquote{ font-size:22px; font-weight:600; letter-spacing:-0.01em; line-height:1.4; margin:0; font-style:italic; color:var(--ink); }
.quotebox .note{ font-size:12px; color:var(--dim); margin:14px auto 0; max-width:480px; line-height:1.6; }
.quotebox .note.dim2{ color:var(--dim3); margin-top:6px; }

/* table */
.tbl{ width:100%; border-collapse:collapse; font-size:12.5px; }
.tbl th{ text-align:left; font-size:10px; letter-spacing:0.14em; text-transform:uppercase; color:var(--dim2); padding:10px 14px; border-bottom:1px solid var(--line); font-weight:500; }
.tbl td{ padding:10px 14px; border-bottom:1px solid var(--line2); color:var(--ink2); }
.tbl tr:last-child td{ border-bottom:none; }
.tbl tr:hover td{ background:#121210; }
.tbl .num{ text-align:right; font-variant-numeric:tabular-nums; }
.tbl .acc{ color:var(--lime); }

/* pipeline steps */
.pipeline{ display:flex; flex-direction:column; gap:12px; max-width:540px; margin:0 auto; }
.pipeline .step{ border:1px solid var(--line); padding:16px 18px; display:flex; gap:16px; align-items:flex-start; }
.pipeline .step .n{ font-size:13px; font-weight:700; color:var(--lime); flex-shrink:0; }
.pipeline .step .t{ font-size:14px; font-weight:600; margin:0 0 4px; color:var(--ink); }
.pipeline .step .d{ font-size:12px; color:var(--dim); line-height:1.5; margin:0; }

/* tier list */
.tierlist{ border:1px solid var(--line); }
.tierrow{ display:flex; align-items:center; gap:16px; padding:14px 18px; border-bottom:1px solid var(--line2); font-size:13px; flex-wrap:wrap; }
.tierrow:last-child{ border-bottom:none; }
.tierrow .name{ width:100px; font-weight:600; color:var(--ink); }
.tierrow .pct{ width:100px; color:var(--lime); font-size:11px; }
.tierrow .desc{ color:var(--dim); font-size:11.5px; }

/* callout (e.g. anti-spike rule) */
.callout{ font-family:inherit; text-align:center; font-size:13px; background:var(--bg2); border:1px solid var(--line); padding:14px; margin-bottom:18px; color:var(--lime); }
.callout b{ color:var(--ink); }

/* buttons */
.btn{ display:inline-block; padding:12px 22px; font-size:12px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; cursor:pointer; border:1px solid var(--line); background:none; color:var(--ink2); font-family:inherit; text-decoration:none; transition:all .12s; }
.btn:hover{ border-color:var(--ink); color:var(--ink); }
.btn.primary{ background:var(--lime); border-color:var(--lime); color:var(--bg); }
.btn.primary:hover{ background:#e4ff6a; }
.btn.block{ display:block; width:100%; text-align:center; }

/* forms */
.field{ margin-bottom:16px; }
.field label{ display:block; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--dim); margin-bottom:7px; }
.field input,.field textarea{ width:100%; background:var(--bg); border:1px solid var(--line); color:var(--ink); font:inherit; font-size:13px; padding:11px 13px; outline:none; transition:border-color .12s; }
.field input::placeholder,.field textarea::placeholder{ color:var(--dim3); }
.field input:focus,.field textarea:focus{ border-color:var(--lime); }
.field textarea{ resize:vertical; }
.field-row{ display:flex; gap:10px; }
.field-row input{ flex:1; min-width:0; }
.formcard{ border:1px solid var(--line); padding:24px; }

.statusmsg{ font-size:12px; text-align:center; margin-top:12px; display:none; }
.statusmsg.show{ display:block; }
.statusmsg.ok{ color:var(--lime); }
.statusmsg.err{ color:var(--orange); }
.statusmsg.info{ color:var(--dim); }

/* ── SITE FOOTER ── */
.sitefoot{ border-top:1px solid var(--line); padding:24px 32px 32px; text-align:center; }
.sitefoot .links{ display:flex; flex-wrap:wrap; justify-content:center; gap:18px; margin-bottom:16px; font-size:12px; }
.sitefoot .links a{ color:var(--dim); text-decoration:none; letter-spacing:0.04em; }
.sitefoot .links a:hover{ color:var(--lime); }
.sitefoot .links a.on{ color:var(--lime); }
.sitefoot p{ font-size:11px; color:var(--dim3); margin:3px 0; letter-spacing:0.04em; }

/* ── CONTROLS / SEARCH / FILTERS (index + full-index) ── */
.controls{ display:flex; align-items:center; gap:14px; padding:14px 32px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.h2{ display:flex; align-items:baseline; gap:13px; margin-right:auto; flex-wrap:wrap; }
.h2 b{ font-size:16px; font-weight:500; letter-spacing:0.02em; }
.h2 span{ font-size:12px; color:var(--dim3); letter-spacing:0.1em; text-transform:uppercase; }
.search{ display:flex; align-items:center; gap:9px; font-size:13px; color:var(--dim3); border:1px solid var(--line); padding:8px 12px; min-width:260px; transition:border-color .15s; }
.search:focus-within{ border-color:var(--lime); }
.search input{ background:transparent; border:none; color:var(--ink); outline:none; font:inherit; flex:1; font-size:13px; }
.search input::placeholder{ color:var(--dim3); }
.search .kbd{ color:var(--dim3); border:1px solid var(--line); padding:1px 6px; font-size:11px; }
.filters{ display:flex; gap:0; border-bottom:1px solid var(--line); overflow-x:auto; flex-wrap:wrap; }
.filter{ padding:11px 20px; border-right:1px solid var(--line); display:flex; align-items:center; gap:9px; font-size:11px; letter-spacing:0.15em; text-transform:uppercase; cursor:pointer; color:var(--dim3); white-space:nowrap; transition:background .12s,color .12s; user-select:none; background:none; border-top:none; border-bottom:none; border-left:none; font-family:inherit; }
.filter .n{ color:var(--dim); font-weight:500; }
.filter:hover{ color:var(--ink2); }
.filter.on{ background:#15160d; color:var(--ink); }
.filter.on .n{ color:var(--lime); }

@media (max-width:700px){
  .pagehead, .pagehero, .prose, .controls{ padding-left:18px; padding-right:18px; }
}