:root { --ink:#0b0b0b; --paper:#f4f2ea; --white:#fff; --blue:#1747e8; --red:#ef3a2d; --yellow:#f4ca28; --mint:#b9e5d1; --line:1.5px solid var(--ink); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--paper); font-family:Arial,Helvetica,sans-serif; letter-spacing:0; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
.topbar { height:72px; padding:0 3vw; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:20; background:var(--white); border-bottom:var(--line); }
.brand { display:flex; align-items:center; gap:14px; }
.brand span { width:44px; height:44px; display:grid; place-items:center; color:white; background:var(--blue); border:var(--line); font-weight:900; }
.brand strong { font-size:14px; }
nav { display:flex; gap:24px; font-size:12px; font-weight:800; text-transform:uppercase; }
nav a:hover { color:var(--blue); }
.hero { min-height:calc(100vh - 72px); display:grid; grid-template-columns:.75fr 1.25fr; border-bottom:var(--line); }
.hero-copy { padding:6vw 4vw 4vw; display:flex; flex-direction:column; justify-content:space-between; background:var(--mint); border-right:var(--line); }
.eyebrow { margin:0; font-size:12px; font-weight:900; text-transform:uppercase; }
h1 { margin:2rem 0; font-size:clamp(58px,7.2vw,116px); line-height:.84; }
.lede { max-width:620px; font-size:clamp(18px,1.7vw,25px); line-height:1.28; }
.hero-action { padding:18px 0; display:flex; justify-content:space-between; border-top:var(--line); border-bottom:var(--line); font-size:12px; font-weight:900; text-transform:uppercase; }
.hero figure { min-width:0; margin:0; position:relative; overflow:hidden; background:var(--ink); }
.hero img { width:100%; height:100%; display:block; object-fit:cover; }
.hero figcaption { position:absolute; right:0; bottom:0; padding:16px 22px; color:white; background:var(--red); border-top:var(--line); border-left:var(--line); font-size:12px; font-weight:900; text-transform:uppercase; }
.ticker { display:grid; grid-template-columns:repeat(4,1fr); color:white; background:var(--blue); border-bottom:var(--line); }
.ticker span { min-height:86px; padding:18px; display:flex; align-items:end; border-right:1px solid white; font-size:12px; font-weight:900; text-transform:uppercase; }
.ticker span:last-child { border:0; }
.split { display:grid; grid-template-columns:minmax(170px,.25fr) 1fr; border-bottom:var(--line); }
.section-label { padding:32px 3vw; border-right:var(--line); font-size:12px; font-weight:900; text-transform:uppercase; }
.content { min-width:0; padding:64px 4vw 80px; }
h2 { max-width:1050px; margin:18px 0 48px; font-size:clamp(44px,6vw,86px); line-height:.92; }
.role-grid { display:grid; grid-template-columns:repeat(2,1fr); border:var(--line); }
.role-grid article { min-height:260px; padding:24px; border-right:var(--line); border-bottom:var(--line); background:white; }
.role-grid article:nth-child(2n) { border-right:0; }
.role-grid article:nth-child(n+3) { border-bottom:0; }
.role-grid article:nth-child(2) { background:var(--yellow); }
.role-grid article:nth-child(4) { color:white; background:var(--blue); }
.role-grid span { font-size:12px; font-weight:900; text-transform:uppercase; }
.role-grid h3 { margin:70px 0 12px; font-size:29px; }
.role-grid p { margin:0; line-height:1.5; }
.lifecycle { color:white; background:var(--ink); }
.lifecycle .section-label { border-color:white; }
.lifecycle .eyebrow { color:var(--yellow); }
.steps { margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); border:1.5px solid white; list-style:none; }
.steps li { min-height:235px; padding:20px; border-right:1.5px solid white; border-bottom:1.5px solid white; }
.steps li:nth-child(4n) { border-right:0; }
.steps li:nth-child(n+5) { border-bottom:0; }
.steps span { color:var(--yellow); font-size:12px; font-weight:900; }
.steps strong { display:block; margin:64px 0 10px; font-size:24px; }
.steps p { margin:0; color:#c9c9c9; line-height:1.45; font-size:14px; }
.capabilities { background:var(--yellow); }
.filters { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px; }
.filters button { padding:10px 15px; border:var(--line); background:white; cursor:pointer; font-weight:800; }
.filters button[aria-pressed="true"] { color:white; background:var(--blue); }
.capability-grid { display:grid; grid-template-columns:repeat(4,1fr); border:var(--line); }
.capability-grid article { min-height:200px; padding:19px; border-right:var(--line); border-bottom:var(--line); background:white; }
.capability-grid article:nth-child(4n) { border-right:0; }
.capability-grid article:nth-child(n+9) { border-bottom:0; }
.capability-grid article[hidden] { display:none; }
.capability-grid b { color:var(--red); }
.capability-grid h3 { margin:55px 0 9px; font-size:23px; }
.capability-grid p { margin:0; line-height:1.45; font-size:14px; }
.state { background:white; }
.state-flow { display:grid; grid-template-columns:repeat(6,1fr); border:var(--line); color:white; background:var(--ink); }
.state-flow span { min-height:120px; padding:16px; display:flex; align-items:end; border-right:1px solid white; font-size:12px; font-weight:900; text-transform:uppercase; }
.state-flow span:last-child { color:var(--ink); background:var(--mint); border:0; }
.authority { margin-top:30px; display:grid; grid-template-columns:repeat(3,1fr); border:var(--line); }
.authority div { min-height:240px; padding:22px; border-right:var(--line); }
.authority div:last-child { border:0; color:white; background:var(--red); }
.authority b { font-size:12px; }
.authority h3 { margin:62px 0 10px; font-size:25px; }
.authority p { margin:0; line-height:1.5; }
.reference { background:var(--mint); }
.reference-grid { display:grid; grid-template-columns:1fr 1fr; border:var(--line); }
.reference-grid article { min-height:300px; padding:26px; border-right:var(--line); background:white; }
.reference-grid article:last-child { border:0; color:white; background:var(--blue); }
.reference-grid span { font-size:12px; font-weight:900; text-transform:uppercase; }
.reference-grid h3 { margin:75px 0 14px; font-size:32px; line-height:1.05; }
.reference-grid p { line-height:1.5; }
.reference-grid small { display:block; margin-top:28px; padding-top:14px; border-top:1px solid currentColor; line-height:1.4; }
.contract { margin-top:30px; padding:24px; display:grid; grid-template-columns:180px 1fr; gap:24px; color:white; background:var(--red); border:var(--line); }
.contract span { font-size:12px; font-weight:900; text-transform:uppercase; }
.contract strong { line-height:1.5; }
footer { padding:30px 3vw; display:flex; justify-content:space-between; font-size:12px; font-weight:800; }
button:focus-visible,a:focus-visible { outline:3px solid var(--red); outline-offset:3px; }
@media (max-width:980px) {
  nav { display:none; }
  .hero { grid-template-columns:1fr; }
  .hero-copy { min-height:70vh; border-right:0; border-bottom:var(--line); }
  .hero figure { min-height:50vh; }
  .split { grid-template-columns:1fr; }
  .section-label { border-right:0; border-bottom:var(--line); }
  .steps,.capability-grid { grid-template-columns:repeat(2,1fr); }
  .steps li:nth-child(4n),.capability-grid article:nth-child(4n) { border-right:var(--line); }
  .steps li:nth-child(2n),.capability-grid article:nth-child(2n) { border-right:0; }
  .steps li:nth-child(n+5),.capability-grid article:nth-child(n+9) { border-bottom:var(--line); }
  .steps li:nth-last-child(-n+2),.capability-grid article:nth-last-child(-n+2) { border-bottom:0; }
  .state-flow { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
  .topbar { padding:0 1rem; }
  .brand strong { display:none; }
  .hero-copy { padding:4rem 1rem 2rem; }
  h1 { font-size:clamp(56px,18vw,82px); }
  .ticker,.role-grid,.steps,.capability-grid,.authority,.reference-grid { grid-template-columns:1fr; }
  .ticker span,.role-grid article,.steps li,.capability-grid article,.authority div,.reference-grid article { border-right:0; border-bottom:var(--line); }
  .ticker span:last-child,.role-grid article:last-child,.steps li:last-child,.capability-grid article:last-child,.authority div:last-child,.reference-grid article:last-child { border-bottom:0; }
  .section-label,.content { padding-left:1rem; padding-right:1rem; }
  .contract { grid-template-columns:1fr; }
  footer { flex-direction:column; gap:1rem; }
}