*, *::before, *::after { box-sizing: border-box; }
    :root {
      --navy-0: #070c18;
      --navy-1: #0b1121;
      --card: #121c30;
      --emerald: #10b981;
      --emerald-bright: #34d399;
      --slate: #95a8c1;
      --slate-light: #d3dce8;
      --white: #f6f9fc;
      --border: rgba(148, 163, 184, 0.16);
    }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      background: radial-gradient(900px 500px at 15% 0%, rgba(16,185,129,.09), transparent 60%), var(--navy-1);
      color: var(--white);
      font-family: "Inter", sans-serif;
      line-height: 1.72;
      -webkit-font-smoothing: antialiased;
    }
    h1, h2, h3, .logo { font-family: "Sora", sans-serif; }
    a { color: var(--emerald-bright); }
    .container { width: min(1100px, calc(100% - 40px)); margin: 0 auto; }.hero { padding: 86px 0 58px; border-bottom: 1px solid var(--border); }
    .eyebrow { color: var(--emerald-bright); font-size: .76rem; letter-spacing: .12em; font-weight: 700; text-transform: uppercase; }
    h1 { max-width: 850px; margin: 14px 0 18px; font-size: clamp(2.15rem, 5vw, 4.2rem); line-height: 1.08; letter-spacing: -.045em; }
    .dek { max-width: 760px; color: var(--slate-light); font-size: 1.12rem; }
    .updated { color: var(--slate); font-size: .83rem; margin-top: 24px; }
    .layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 56px; padding: 66px 0 96px; }
    article { min-width: 0; }
    article h2 { margin: 62px 0 16px; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.25; letter-spacing: -.02em; }
    article h3 { margin: 30px 0 10px; font-size: 1.12rem; }
    article p, article li { color: var(--slate-light); }
    article li { margin: 8px 0; }
    .quick-list, .audit-step, .note, .cta {
      background: var(--card);
      border: 1px solid var(--border);
      border-radius: 16px;
    }
    .quick-list { padding: 26px 30px; margin: 34px 0; }
    .quick-list h2 { margin-top: 0; font-size: 1.25rem; }
    .quick-list ol { margin-bottom: 0; padding-left: 22px; }
    .audit-step { padding: 28px 30px; margin: 20px 0; }
    .audit-step h2 { margin: 0 0 12px; font-size: 1.35rem; }
    .step-num { color: var(--emerald-bright); font-size: .76rem; letter-spacing: .1em; font-weight: 700; margin-bottom: 8px; }
    .check { list-style: none; padding: 0; }
    .check li { position: relative; padding-left: 28px; }
    .check li::before { content: "✓"; position: absolute; left: 0; color: var(--emerald-bright); font-weight: 700; }
    .note { padding: 20px 24px; border-left: 4px solid var(--emerald); color: var(--slate-light); }
    .cta { margin-top: 56px; padding: 34px; background: linear-gradient(145deg, rgba(16,185,129,.11), rgba(18,28,48,.95)); }
    .cta h2 { margin-top: 0; }
    .btn {
      display: inline-block;
      margin-top: 8px;
      padding: 13px 22px;
      border-radius: 9px;
      background: var(--emerald);
      color: #06281a;
      text-decoration: none;
      font-weight: 800;
    }
    aside { align-self: start; position: sticky; top: 92px; }
    .toc { padding: 24px; background: var(--card); border: 1px solid var(--border); border-radius: 14px; }
    .toc strong { font-family: "Sora", sans-serif; }
    .toc a { display: block; margin-top: 11px; color: var(--slate-light); text-decoration: none; font-size: .88rem; }
    .toc a:hover { color: var(--emerald-bright); }@media (max-width: 820px) {
      .layout { grid-template-columns: 1fr; padding-top: 40px; }
      aside { order: -1; position: static; }
      .hero { padding-top: 58px; }
      .audit-step, .quick-list, .cta { padding: 23px; }
    }