:root{--bg:#F8F9FC;--card:#fff;--accent:#006E8A;--text:#0F1C2E;--muted:#485E7A;--border:rgba(0,0,0,.09);--font:'Inter',sans-serif;--display:'Plus Jakarta Sans','Inter',sans-serif}
    *{box-sizing:border-box;margin:0;padding:0}
    body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.65;-webkit-font-smoothing:antialiased}
    a{color:inherit;text-decoration:none}
    .c{max-width:960px;margin:0 auto;padding:0 24px}
    .nav{padding:20px 0;border-bottom:1px solid var(--border);background:rgba(248,249,252,.96);position:sticky;top:0;z-index:10}
    .nav-inner{display:flex;justify-content:space-between;align-items:center;gap:16px}
    .brand{font-size:16px;font-weight:800}.brand em{font-style:normal;color:var(--accent)}
    .nav-links{display:flex;gap:20px;font-size:13px;font-weight:700;color:var(--muted)}
    .nav-links a:hover{color:var(--accent)}
    .hero{padding:72px 0 40px}
    .narrow{max-width:760px}
    .eyebrow{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:16px}
    h1,h2{font-family:var(--display)}
    h1{font-size:clamp(32px,5vw,52px);line-height:1.08;letter-spacing:-.03em;margin-bottom:18px}
    .lead{font-size:18px;color:var(--muted);line-height:1.75}
    article{padding:10px 0 80px}
    article h2{font-size:24px;margin:36px 0 12px}
    article p,article li{font-size:16px;color:var(--muted);line-height:1.8}
    article p{margin-bottom:16px}
    .roles{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0 8px}
    .role{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px}
    .role h3{font-size:16px;margin-bottom:8px}
    .role p{font-size:14px;margin:0 0 10px}
    .meta{font-size:12.5px;color:#5C7390;line-height:1.55}
    .note{font-size:13px;color:#5C7390;margin-top:8px}
    .cta{margin-top:40px;display:flex;gap:12px;flex-wrap:wrap}
    .btn{display:inline-flex;align-items:center;min-height:44px;border-radius:999px;padding:12px 20px;font-size:14px;font-weight:800;border:1px solid var(--border);cursor:pointer;font-family:var(--font);background:var(--card);color:var(--text)}
    .primary{background:var(--accent);border-color:var(--accent);color:#fff}
    .footer{border-top:1px solid var(--border);padding:28px 0;color:#5C7390;font-size:13px}
    .footer-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
    @media(max-width:760px){.roles{grid-template-columns:1fr}.nav-links{display:none}}
    html{scroll-behavior:smooth;scroll-padding-top:88px}
    :focus-visible{outline:3px solid var(--accent);outline-offset:4px}
    .skip-link{position:absolute;top:-80px;left:16px;z-index:20;background:var(--card);padding:12px}.skip-link:focus{top:8px}
    .text-link{text-decoration:underline;text-underline-offset:3px;color:var(--accent)}
    .workflow{margin:32px 0;padding:28px;background:#EEF2F8;border:1px solid var(--border);border-radius:20px}
    .workflow figcaption{font-family:var(--display);font-size:21px;font-weight:800;margin-bottom:22px}
    .flow-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
    .flow-steps li{position:relative;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:18px}
    .flow-steps span{display:block;color:var(--accent);font-size:12px;font-weight:800;margin-bottom:8px}
    .flow-steps strong{display:block;color:var(--text);font-size:15px;line-height:1.4}
    .flow-steps p{font-size:13px;margin:8px 0 0;line-height:1.6}
    .flow-steps li:not(:last-child) span::after{content:' →';margin-left:8px}
    article .failure{font-size:14px;margin:20px 0 0;border-left:3px solid var(--accent);padding-left:16px}
    .example{margin:36px 0;padding:28px;border:1px solid var(--border);background:var(--card);border-radius:20px}
    .example h2{margin-top:0}.example-steps{padding-left:22px}.example-steps li{padding-left:6px;margin-bottom:12px}
    .role p:last-child{margin-bottom:0}
    @media(max-width:760px){.flow-steps{grid-template-columns:1fr}.workflow,.example{padding:20px}.hero{padding-top:44px}.nav-links{display:flex;font-size:12px}.nav-links a:not(:nth-child(3)){display:none}}
    @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}