:root{
  --white:#ffffff;
  --charcoal:#23262b;
  --ink:#0a0b0d;
  --lime:#c8f53c;
  --lime-dk:#a4cf22;
  --silver:#c9ced6;
  --silver-soft:#eef0f3;
  --shadow:6px 6px 0 var(--ink);
  --shadow-sm:4px 4px 0 var(--ink);
  --bd:3px solid var(--ink);
  --bd2:2px solid var(--ink);
  --mono:"IBM Plex Mono","SFMono-Regular",Consolas,"Courier New",monospace;
  --sans:"Helvetica Neue",Helvetica,Arial,"Segoe UI",system-ui,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);
  background:var(--silver-soft);
  color:var(--ink);
  line-height:1.6;
  font-size:16px;
  background-image:linear-gradient(var(--silver) 1px,transparent 1px),linear-gradient(90deg,var(--silver) 1px,transparent 1px);
  background-size:56px 56px;
  background-position:-1px -1px;
}
img{max-width:100%;display:block}
a{color:inherit}
.wrap{width:100%;max-width:1240px;margin:0 auto;padding:0 20px}

/* ---------- HEADER ---------- */
.site-head{background:var(--ink);border-bottom:3px solid var(--lime);position:relative;z-index:60}
.head-inner{height:60px;display:flex;align-items:center;gap:18px}
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--white);flex:0 0 auto}
.brand-mark{width:28px;height:28px;flex:0 0 auto}
.brand-name{font-family:var(--mono);font-weight:700;font-size:14px;letter-spacing:-.4px;white-space:nowrap}
.brand-name .dot{color:var(--lime)}
.nav-main{display:flex;gap:4px;margin-left:auto}
.nav-main a{
  text-decoration:none;color:var(--silver);font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.6px;padding:7px 11px;border:2px solid transparent;
}
.nav-main a:hover,.nav-main a.is-active{color:var(--ink);background:var(--lime);border-color:var(--lime)}
.head-cta{margin-left:6px}
.btn-sm{padding:7px 14px !important;font-size:12px !important}
.burger{display:none;width:42px;height:36px;background:var(--lime);border:2px solid var(--ink);cursor:pointer;padding:8px 9px}
.burger span{display:block;height:3px;background:var(--ink);margin:3px 0}

.mobile-overlay{
  display:none;position:fixed;inset:0;background:var(--ink);z-index:200;padding:22px 20px;overflow:auto;
}
.mobile-overlay.open{display:block}
.mo-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}
.mo-close{background:var(--lime);border:2px solid var(--white);font-size:20px;font-weight:800;width:42px;height:38px;cursor:pointer;font-family:var(--mono)}
.mobile-overlay nav a{
  display:block;text-decoration:none;color:var(--white);font-size:20px;font-weight:800;text-transform:uppercase;
  padding:14px 0;border-bottom:2px solid #2f333a;letter-spacing:-.3px;
}
.mobile-overlay nav a:hover{color:var(--lime)}
.mo-foot{margin-top:26px;font-family:var(--mono);font-size:12px;color:var(--silver)}

/* ---------- BUTTONS ---------- */
.btn{
  display:inline-block;text-decoration:none;font-weight:800;font-size:13px;text-transform:uppercase;
  letter-spacing:.8px;padding:11px 18px;border:var(--bd2);background:var(--white);color:var(--ink);
  box-shadow:var(--shadow-sm);cursor:pointer;font-family:var(--sans);transition:.12s ease;
}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn-lime{background:var(--lime)}
.btn-dark{background:var(--charcoal);color:var(--white);box-shadow:4px 4px 0 var(--lime)}
.btn-ghost{background:transparent;border-color:var(--ink);box-shadow:none}

/* ---------- HERO / DASHBOARD ---------- */
.hero{background:var(--charcoal);border-bottom:var(--bd);color:var(--white);padding:44px 0 0}
.hero-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:start}
.eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;
  color:var(--ink);background:var(--lime);display:inline-block;padding:4px 10px;border:2px solid var(--ink);
}
.hero h1{font-size:clamp(30px,5.2vw,58px);line-height:1.02;letter-spacing:-1.8px;margin:16px 0 14px;text-transform:uppercase}
.hero h1 em{font-style:normal;color:var(--lime)}
.hero p.lede{color:var(--silver);font-size:17px;max-width:56ch}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 30px}
.scoreboard{background:var(--ink);border:3px solid var(--lime);padding:16px;box-shadow:8px 8px 0 rgba(0,0,0,.45)}
.scoreboard h3{font-family:var(--mono);font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--lime);margin-bottom:12px}
.sb-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px dashed #3a3f47}
.sb-row:first-of-type{border-top:0}
.sb-rank{font-family:var(--mono);font-size:12px;color:var(--ink);background:var(--silver);width:24px;height:24px;display:grid;place-items:center;font-weight:700;flex:0 0 auto}
.sb-row:nth-child(2) .sb-rank{background:var(--lime)}
.sb-name{font-size:13px;font-weight:700;flex:1;color:var(--white)}
.sb-val{font-family:var(--mono);font-size:13px;color:var(--lime)}
.meter{height:9px;background:#3a3f47;border:1px solid #555c66;width:100%;margin-top:5px}
.meter span{display:block;height:100%;background:var(--lime)}
.hero-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:var(--bd);margin-top:36px}
.hero-strip div{padding:16px 18px;border-right:2px solid #3a3f47}
.hero-strip div:last-child{border-right:0}
.hero-strip b{display:block;font-family:var(--mono);font-size:26px;color:var(--lime);line-height:1}
.hero-strip span{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--silver)}

/* ---------- SECTIONS ---------- */
section{padding:56px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:28px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(24px,3.4vw,36px);text-transform:uppercase;letter-spacing:-1px;line-height:1.05}
.sec-head h2 .idx{font-family:var(--mono);font-size:13px;color:var(--charcoal);background:var(--lime);border:var(--bd2);padding:2px 8px;vertical-align:middle;margin-right:10px}
.sec-head p{color:#4c525b;max-width:52ch;font-size:15px}

/* ---------- MODULAR DATA-GRID CARD ---------- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:26px}
.dcard{background:var(--white);border:var(--bd);box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.15s ease}
.dcard:hover{transform:translate(-4px,-4px);box-shadow:10px 10px 0 var(--ink)}
.dcard__stats{display:grid;grid-template-columns:repeat(3,1fr);background:var(--charcoal);border-bottom:var(--bd)}
.dcard__stats div{padding:9px 8px;text-align:center;border-right:2px solid #3d434b}
.dcard__stats div:last-child{border-right:0}
.dcard__stats b{display:block;font-family:var(--mono);font-size:16px;color:var(--lime);line-height:1.15}
.dcard__stats span{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--silver)}
.dcard__media{position:relative;border-bottom:var(--bd);overflow:hidden}
.dcard__media img{height:184px;width:100%;object-fit:cover;filter:grayscale(.18) contrast(1.05)}
.dcard:hover .dcard__media img{filter:none}
.dcard__tag{position:absolute;left:0;bottom:0;background:var(--lime);border-top:var(--bd2);border-right:var(--bd2);font-family:var(--mono);font-size:10px;letter-spacing:1.2px;text-transform:uppercase;padding:4px 10px;font-weight:700}
.dcard__body{padding:16px 17px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.dcard__body h3{font-size:19px;line-height:1.2;letter-spacing:-.5px}
.dcard__body p{font-size:14px;color:#4c525b}
.pills{display:flex;flex-wrap:wrap;gap:6px}
.pill{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.8px;border:2px solid var(--ink);padding:3px 8px;background:var(--silver-soft)}
.pill.lime{background:var(--lime)}
.dcard__foot{margin-top:auto;padding-top:12px;border-top:2px dashed var(--silver);display:flex;justify-content:space-between;align-items:center;gap:10px}
.dcard__foot .meta{font-family:var(--mono);font-size:11px;color:#6b7280}

/* ---------- PANELS / TABLES ---------- */
.panel{background:var(--white);border:var(--bd);box-shadow:var(--shadow);padding:22px}
.panel h3{text-transform:uppercase;letter-spacing:-.4px;margin-bottom:12px;font-size:20px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.split-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
table{width:100%;border-collapse:collapse;font-size:14px;background:var(--white)}
th,td{border:2px solid var(--ink);padding:10px 12px;text-align:left;vertical-align:top}
th{background:var(--charcoal);color:var(--white);font-family:var(--mono);font-size:11px;letter-spacing:1px;text-transform:uppercase}
tbody tr:nth-child(even) td{background:var(--silver-soft)}
.table-scroll{overflow-x:auto;border:var(--bd);box-shadow:var(--shadow)}
.table-scroll table{border:0}
.table-scroll th,.table-scroll td{border-left:0;border-right:0;border-top:0}

/* ---------- TIMELINE ---------- */
.timeline{border-left:4px solid var(--ink);margin-left:12px;padding-left:22px;display:grid;gap:20px}
.tl-item{background:var(--white);border:var(--bd2);box-shadow:var(--shadow-sm);padding:14px 16px;position:relative}
.tl-item:before{content:"";position:absolute;left:-30px;top:18px;width:14px;height:14px;background:var(--lime);border:3px solid var(--ink)}
.tl-year{font-family:var(--mono);font-size:12px;background:var(--ink);color:var(--lime);padding:2px 8px;display:inline-block;margin-bottom:6px}

/* ---------- ARTICLE ---------- */
.page-head{background:var(--charcoal);color:var(--white);border-bottom:var(--bd);padding:40px 0}
.page-head h1{font-size:clamp(26px,4.4vw,46px);text-transform:uppercase;letter-spacing:-1.3px;line-height:1.05;margin:14px 0 12px}
.page-head p{color:var(--silver);max-width:66ch}
.crumbs{font-family:var(--mono);font-size:11px;color:var(--silver);letter-spacing:1px;text-transform:uppercase}
.crumbs a{color:var(--lime);text-decoration:none}
.article-hero{border:var(--bd);box-shadow:var(--shadow);margin:34px 0}
.article-hero img{width:100%;height:clamp(200px,38vw,400px);object-fit:cover}
.article-layout{display:grid;grid-template-columns:1fr 320px;gap:34px;align-items:start}
.prose{background:var(--white);border:var(--bd);box-shadow:var(--shadow);padding:clamp(20px,3.4vw,38px)}
.prose h2{font-size:26px;text-transform:uppercase;letter-spacing:-.8px;margin:32px 0 12px;padding-left:12px;border-left:8px solid var(--lime)}
.prose h3{font-size:19px;margin:24px 0 8px;letter-spacing:-.3px}
.prose p{margin-bottom:14px;font-size:16px}
.prose ul,.prose ol{margin:0 0 16px 22px}
.prose li{margin-bottom:7px}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--lime-dk);text-decoration-thickness:3px}
.prose blockquote{border-left:8px solid var(--ink);background:var(--lime);padding:14px 18px;margin:20px 0;font-weight:700}
.side{display:grid;gap:20px;position:relative}
.side .panel{padding:18px}
.side h4{font-family:var(--mono);font-size:11px;letter-spacing:1.4px;text-transform:uppercase;background:var(--ink);color:var(--lime);padding:5px 9px;display:inline-block;margin-bottom:12px}
.side ul{list-style:none;display:grid;gap:8px}
.side ul a{font-size:14px;font-weight:700;text-decoration:none;border-bottom:2px solid var(--lime)}
.kv{display:grid;grid-template-columns:1fr auto;gap:6px 10px;font-size:13px;font-family:var(--mono)}
.kv b{font-weight:700}
.proscons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}
.proscons>div{border:var(--bd2);padding:14px;box-shadow:var(--shadow-sm)}
.proscons .pro{background:#f4ffd9}
.proscons .con{background:#fff}
.proscons h4{font-family:var(--mono);font-size:12px;text-transform:uppercase;letter-spacing:1.2px;margin-bottom:8px}
.proscons ul{margin-left:18px;font-size:14px}
.callout{background:var(--charcoal);color:var(--white);border:var(--bd);box-shadow:var(--shadow);padding:24px;display:flex;gap:20px;justify-content:space-between;align-items:center;flex-wrap:wrap;margin:40px 0 0}
.callout h3{text-transform:uppercase;letter-spacing:-.6px;font-size:22px}
.callout p{color:var(--silver);max-width:52ch;font-size:15px}

/* ---------- FORM ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
label{font-family:var(--mono);font-size:11px;letter-spacing:1.2px;text-transform:uppercase;font-weight:700}
input,select,textarea{
  font-family:var(--sans);font-size:15px;padding:11px 12px;border:var(--bd2);background:var(--white);
  box-shadow:inset 0 -3px 0 var(--silver-soft);width:100%;
}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--lime-dk);box-shadow:inset 0 -3px 0 var(--lime)}
textarea{min-height:150px;resize:vertical}
.form-note{font-size:12px;color:#5b616a}
.form-msg{display:none;margin-top:14px;border:var(--bd2);background:var(--lime);padding:12px;font-weight:700;font-size:14px}
.form-msg.show{display:block}
.map-frame{border:var(--bd);box-shadow:var(--shadow);overflow:hidden;background:var(--silver)}
.map-frame iframe{width:100%;height:320px;border:0;display:block;filter:grayscale(.35)}

/* ---------- FOOTER ---------- */
.site-foot{background:var(--ink);color:var(--silver);border-top:4px solid var(--lime);margin-top:20px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;gap:28px;padding-top:44px;padding-bottom:34px}
.foot-col h4{color:var(--white);font-size:12px;font-family:var(--mono);letter-spacing:1.4px;text-transform:uppercase;margin-bottom:12px;border-bottom:2px solid #34383f;padding-bottom:7px}
.foot-col ul{list-style:none;display:grid;gap:8px}
.foot-col a{color:var(--silver);text-decoration:none;font-size:14px}
.foot-col a:hover{color:var(--lime)}
.foot-brand p{font-size:14px;margin:12px 0}
.foot-mini{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid #34383f;margin-top:14px}
.foot-mini div{padding:8px;text-align:center;border-right:2px solid #34383f}
.foot-mini div:last-child{border-right:0}
.foot-mini b{display:block;font-family:var(--mono);color:var(--lime);font-size:15px}
.foot-mini span{font-size:9px;letter-spacing:1px;text-transform:uppercase}
address{font-style:normal;font-size:14px;line-height:1.7}
.foot-bar{border-top:2px solid #34383f;padding-top:18px;padding-bottom:26px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12px;font-family:var(--mono);color:#8b929c}

/* ---------- COOKIE BANNER ---------- */
.cookie{
  position:fixed;left:0;right:0;bottom:0;z-index:300;background:var(--white);border-top:4px solid var(--ink);
  box-shadow:0 -8px 0 rgba(10,11,13,.12);padding:16px 0;display:none;
}
.cookie.show{display:block}
.cookie-inner{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cookie p{font-size:13.5px;max-width:64ch}
.cookie strong{font-family:var(--mono);text-transform:uppercase;letter-spacing:1px;font-size:12px;background:var(--lime);border:2px solid var(--ink);padding:2px 8px;display:inline-block;margin-bottom:6px}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap}
.cookie-prefs{display:none;margin-top:14px;border-top:2px dashed var(--silver);padding-top:14px;gap:14px;grid-template-columns:repeat(3,1fr)}
.cookie-prefs.show{display:grid}
.cookie-prefs label{display:flex;gap:8px;align-items:flex-start;font-family:var(--sans);font-size:13px;text-transform:none;letter-spacing:0}
.cookie-prefs input{width:auto;box-shadow:none;border-width:2px;margin-top:3px}

/* ---------- RESPONSIVE ---------- */
@media(max-width:980px){
  .hero-grid,.split,.article-layout{grid-template-columns:1fr}
  .split-3{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr}
  .hero-strip{grid-template-columns:1fr 1fr}
  .hero-strip div{border-bottom:2px solid #3a3f47}
}
@media(max-width:760px){
  .head-inner{height:50px}
  .nav-main,.head-cta{display:none}
  .burger{display:block;margin-left:auto}
  .proscons,.form-grid{grid-template-columns:1fr}
  .cookie-prefs.show{grid-template-columns:1fr}
  section{padding:40px 0}
}
@media(max-width:420px){
  .brand-name{font-size:12px}
  .card-grid{grid-template-columns:1fr;gap:20px}
  .foot-grid{grid-template-columns:1fr}
}