/* MCK Horizons — shared stylesheet for resource/detail pages */
:root {
  --bg: #F4F6F9; --bg-alt: #E7F0FA; --surface: #FFFFFF;
  --ink: #1E3A5F; --ink-soft: #1A1A1A; --muted: #64748B; --faint: #94A3B8;
  --line: #D6E4F0; --line-strong: #C2D5E8;
  --navy: #1E3A5F; --navy-deep: #16293F;
  --accent: #2E6DA4; --accent-deep: #21557F; --accent-tint: #E8F1FA;
  --gold: #F5A623; --gold-deep: #BE7C10; --gold-tint: #FAF1DB;
  --green: #2E7D53; --green-tint: #E4F1EA; --red: #B4462F;
  --shadow-sm: 0 1px 2px rgba(13,33,56,.06), 0 1px 3px rgba(13,33,56,.05);
  --shadow-md: 0 6px 20px rgba(13,33,56,.09), 0 2px 6px rgba(13,33,56,.05);
  --serif: "Source Serif 4", Georgia, "Times New Roman", serif;
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --maxw: 1140px; --readw: 760px; --radius: 12px; --radius-sm: 8px;
}
:root:not([data-theme="light"]) { color-scheme: light; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg:#0A1622; --bg-alt:#0E1F31; --surface:#132A42;
    --ink:#E9EFF5; --ink-soft:#C7D5E1; --muted:#93A5B6; --faint:#6B7E90;
    --line:#21405C; --line-strong:#2D4E6E;
    --accent:#5C99CB; --accent-deep:#4680B2; --accent-tint:#123049;
    --gold:#F2AE33; --gold-deep:#D19A2E; --gold-tint:#2A2412;
    --green:#4CB07A; --green-tint:#12281D; --red:#E0765A;
    --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 6px 20px rgba(0,0,0,.45);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg:#0A1622; --bg-alt:#0E1F31; --surface:#132A42;
  --ink:#E9EFF5; --ink-soft:#C7D5E1; --muted:#93A5B6; --faint:#6B7E90;
  --line:#21405C; --line-strong:#2D4E6E;
  --accent:#5C99CB; --accent-deep:#4680B2; --accent-tint:#123049;
  --gold:#F2AE33; --gold-deep:#D19A2E; --gold-tint:#2A2412;
  --green:#4CB07A; --green-tint:#12281D; --red:#E0765A;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4); --shadow-md:0 6px 20px rgba(0,0,0,.45);
}
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--ink-soft); font-family:var(--sans); font-size:17px; line-height:1.68; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
h1,h2,h3,h4 { font-family:var(--serif); color:var(--ink); line-height:1.16; text-wrap:balance; margin:0; font-weight:600; }
p { margin:0; }
a { color:inherit; }
.wrap { width:100%; max-width:var(--maxw); margin:0 auto; padding:0 24px; }
.read { width:100%; max-width:var(--readw); margin:0 auto; padding:0 24px; }
.eyebrow { font-family:var(--mono); font-size:12px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); display:inline-flex; align-items:center; gap:10px; }
.eyebrow::before { content:""; width:24px; height:2px; background:var(--gold); display:inline-block; }
.eyebrow.on-navy { color:var(--gold); }
.btn { display:inline-flex; align-items:center; gap:9px; font-family:var(--sans); font-size:15px; font-weight:600; padding:12px 22px; border-radius:var(--radius-sm); border:1px solid transparent; cursor:pointer; text-decoration:none; transition:transform .15s, background .2s, border-color .2s, color .2s; }
.btn:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.btn-primary { background:var(--gold); color:#21170a; }
.btn-primary:hover { background:var(--gold-deep); color:#fff; transform:translateY(-1px); }
.btn-navy { background:var(--accent); color:#fff; }
.btn-navy:hover { background:var(--accent-deep); transform:translateY(-1px); }
.btn-ghost { background:transparent; color:var(--ink); border-color:var(--line-strong); }
.btn-ghost:hover { border-color:var(--accent); color:var(--accent); }
.btn-ghost.on-navy { color:#fff; border-color:rgba(255,255,255,.35); }
.btn-ghost.on-navy:hover { border-color:var(--gold); color:var(--gold); }

/* Header */
header.site { position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid var(--line); }
.nav { display:flex; align-items:center; justify-content:space-between; height:68px; gap:16px; }
.brand { display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); flex:none; }
.brand .name { font-family:var(--serif); font-weight:600; font-size:19px; letter-spacing:.04em; text-transform:uppercase; line-height:1; }
.brand .name b { color:var(--gold); font-weight:600; }
.nav-links { display:flex; align-items:center; gap:22px; }
.nav-links a.link { text-decoration:none; color:var(--muted); font-size:14px; font-weight:500; transition:color .18s; white-space:nowrap; }
.nav-links a.link:hover, .nav-links a.link[aria-current="page"] { color:var(--ink); }
.nav-links a.link[aria-current="page"] { color:var(--accent); }
@media (max-width:820px){ .nav-links{ display:none; } }

/* Page hero */
.page-hero { background:var(--navy-deep); color:#E8EEF4; position:relative; }
.page-hero::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4px; background:linear-gradient(90deg, var(--accent), var(--gold)); }
.page-hero .inner { padding:64px 0 56px; }
.page-hero h1 { color:#fff; font-size:clamp(2rem,4vw,3rem); letter-spacing:-.015em; max-width:24ch; margin-top:18px; }
.page-hero .sub { color:#B9C6D4; font-size:1.15rem; max-width:62ch; margin-top:18px; }
.page-hero .meta { font-family:var(--mono); font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:#8FA1B2; margin-top:22px; }
.crumb { font-family:var(--mono); font-size:11.5px; letter-spacing:.08em; text-transform:uppercase; }
.crumb a { color:#8FA1B2; text-decoration:none; }
.crumb a:hover { color:var(--gold); }

/* Stat row */
.statrow { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:40px; padding-top:30px; border-top:1px solid rgba(255,255,255,.14); }
.statrow .st .k { font-family:var(--serif); font-size:clamp(1.7rem,3vw,2.3rem); font-weight:700; color:var(--gold); display:block; line-height:1; }
.statrow .st .v { font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:#9FB0C0; margin-top:8px; }
@media (max-width:680px){ .statrow{ grid-template-columns:1fr 1fr; gap:22px; } }

/* Article */
.article { padding:64px 0 24px; }
.article h2 { font-size:clamp(1.5rem,2.6vw,2rem); letter-spacing:-.01em; margin:44px 0 6px; padding-top:8px; }
.article h2:first-child { margin-top:0; }
.article .kicker { font-family:var(--mono); font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:8px; }
.article h3 { font-size:1.2rem; margin:28px 0 8px; color:var(--ink); }
.article p { margin:14px 0; color:var(--ink-soft); }
.article .lead { font-size:1.2rem; color:var(--ink); font-family:var(--serif); line-height:1.5; }
.article ul, .article ol { margin:14px 0; padding-left:0; list-style:none; display:grid; gap:10px; }
.article ul li { position:relative; padding-left:26px; color:var(--ink-soft); }
.article ul li::before { content:""; position:absolute; left:2px; top:9px; width:8px; height:8px; border-radius:2px; background:var(--gold); }
.article ol { counter-reset:oli; }
.article ol li { position:relative; padding-left:34px; color:var(--ink-soft); counter-increment:oli; }
.article ol li::before { content:counter(oli); position:absolute; left:0; top:0; width:22px; height:22px; border-radius:50%; background:var(--accent-tint); color:var(--accent); font-family:var(--mono); font-size:11px; font-weight:600; display:grid; place-items:center; }
.article strong { color:var(--ink); }
.divider { height:1px; background:var(--line); margin:8px 0; }

/* Callouts / cards */
.callout { background:var(--gold-tint); border-left:3px solid var(--gold); border-radius:0 var(--radius-sm) var(--radius-sm) 0; padding:20px 24px; margin:24px 0; }
.callout .lbl { font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-deep); }
.callout p { margin:8px 0 0; color:var(--ink); }
.panel { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px 24px; margin:18px 0; box-shadow:var(--shadow-sm); }
.panel.accent { border-left:3px solid var(--accent); }
.panel .tag { font-family:var(--mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--accent); font-weight:600; }
.panel.warn { border-left:3px solid var(--red); }
.panel.warn .tag { color:var(--red); }
.panel h3 { margin:6px 0 8px; font-family:var(--sans); font-size:1.1rem; }
.panel p { margin:4px 0; }
.grid2 { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:20px 0; }
@media (max-width:640px){ .grid2{ grid-template-columns:1fr; } }

/* Mini stat tiles inside article */
.tiles { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:22px 0; }
.tile { background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:var(--radius-sm); padding:18px 16px; text-align:center; box-shadow:var(--shadow-sm); }
.tile .k { font-family:var(--serif); font-size:1.7rem; font-weight:700; color:var(--ink); line-height:1; }
.tile .v { font-size:.82rem; color:var(--muted); margin-top:8px; }
@media (max-width:680px){ .tiles{ grid-template-columns:1fr 1fr; } }

/* Tables */
.tablewrap { overflow-x:auto; margin:22px 0; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
table.data { width:100%; border-collapse:collapse; font-size:.95rem; min-width:520px; }
table.data thead th { background:var(--navy); color:#fff; text-align:left; padding:13px 18px; font-family:var(--mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:500; }
table.data td, table.data th { padding:12px 18px; border-bottom:1px solid var(--line); text-align:left; }
table.data tbody tr:nth-child(even){ background:var(--bg-alt); }
table.data td.num { font-variant-numeric:tabular-nums; }
table.data td.pos { color:var(--green); font-weight:700; font-variant-numeric:tabular-nums; }
table.data td:first-child { font-weight:600; color:var(--ink); }
table.data tbody tr:last-child td { border-bottom:none; }

/* Checklist */
.checklist { list-style:none; padding:0; margin:16px 0; display:grid; gap:9px; }
.checklist li { position:relative; padding-left:30px; color:var(--ink-soft); font-size:.98rem; }
.checklist li::before { content:""; position:absolute; left:0; top:3px; width:16px; height:16px; border:2px solid var(--line-strong); border-radius:4px; }

/* Timeline */
.phase { border-left:2px solid var(--line-strong); padding:2px 0 2px 22px; margin:0 0 4px; position:relative; }
.phase::before { content:""; position:absolute; left:-7px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--accent); border:2px solid var(--bg); }
.phase h3 { margin:0 0 6px; }

/* CTA band */
.cta { background:var(--navy); color:#E8EEF4; margin-top:48px; }
.cta .inner { padding:56px 0; text-align:center; }
.cta h2 { color:#fff; font-size:clamp(1.6rem,3vw,2.2rem); }
.cta p { color:#B9C6D4; max-width:52ch; margin:16px auto 26px; }
.cta .row { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.cta .contactline { font-family:var(--mono); font-size:12.5px; letter-spacing:.04em; color:#9FB0C0; margin-top:24px; }
.cta .contactline a { color:#E8EEF4; text-decoration:none; }
.cta .contactline a:hover { color:var(--gold); }

/* Footer */
footer.site { background:var(--navy-deep); color:#B9C6D4; padding:44px 0 36px; }
.foot { display:flex; justify-content:space-between; gap:30px; flex-wrap:wrap; align-items:flex-start; }
.foot .fname { font-family:var(--serif); font-weight:600; font-size:19px; letter-spacing:.04em; text-transform:uppercase; color:#fff; }
.foot .fname b { color:var(--gold); }
.foot p { color:#93A5B6; font-size:.92rem; margin-top:10px; max-width:34ch; }
.foot-links { display:flex; gap:44px; flex-wrap:wrap; }
.foot-col h5 { font-family:var(--mono); font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); margin:0 0 12px; font-weight:500; }
.foot-col a { display:block; text-decoration:none; color:#B9C6D4; font-size:14px; margin-bottom:8px; }
.foot-col a:hover { color:#fff; }
.foot-bottom { margin-top:36px; padding-top:20px; border-top:1px solid rgba(255,255,255,.12); font-size:12.5px; color:#7E90A2; display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; }
@media (prefers-reduced-motion: reduce){ *{ transition:none !important; } }