/*
 * artorias.com's design system as plain CSS, for the static Sentinel pages (sentinel.artorias.com,
 * about.sentinel.artorias.com) and docs.artorias.com. No build step.
 *
 * Source: artorias-website-v2 origin/main 0f807f7, ported value for value from
 *   src/app/globals.css            tokens, type scale, legal and document pages
 *   src/components/ui/ui.module.css   the kit: grid, sections, eyebrow, display, buttons, columns, rows, figures
 *   src/components/chrome.module.css  nav, phone sheet, footer
 *   src/components/ctaPanel.module.css  the closing glass pane
 *   src/components/agc/agc.module.css   spec rows and the method steps
 * and matched to SENTINEL-Mk2 packages/tokens "site" theme and docs/mk2/design-r1/SPEC.md where they overlap
 * (same colours, radii, faces, focus ring and --line-control).
 *
 * Fonts are self-hosted next to this file (fonts/), the same woff2 files the site serves: Geist (display),
 * DM Sans (body), JetBrains Mono (data). No third-party font CDN. Paths are relative to this file, so the
 * folder can be served at any URL (the pages use /shared/).
 *
 * Class names follow the Sentinel web app's port of the kit (apps/web/src/theme/site/kit.css) where one
 * exists: .site-header, .nav-bar, .brand, .word, .nav-link, .btn .btn-primary, .eyebrow, .text-link.
 * Sizes come from the scale only: 96 64 48 32 24 20 16 12 (button 14).
 */

/* ---------- faces: latin first, latin-ext only when a page uses it (as the site splits them) ---------- */
@font-face{font-family:"Geist";src:url(fonts/geist-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Geist";src:url(fonts/geist-latin-ext.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"DM Sans";src:url(fonts/dm-sans-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"DM Sans";src:url(fonts/dm-sans-latin-ext.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-latin.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"JetBrains Mono";src:url(fonts/jetbrains-mono-latin-ext.woff2) format("woff2");font-weight:400 600;font-style:normal;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------- tokens (globals.css :root) ---------- */
:root{
  color-scheme:dark;
  /* Colour: APC zinc */
  --bg:#09090b;                       /* zinc-950, the field */
  --bg-2:#0c0c0e;                     /* alternate band; inputs and popovers in the app */
  --surface:#18181b;                  /* zinc-900 */
  --raised:#27272a;                   /* zinc-800: secondary button */
  --rule:rgba(255,255,255,.08);       /* hairline */
  --rule-strong:rgba(255,255,255,.14);
  --line-control:rgba(255,255,255,.36);       /* input and control boundaries, 3:1 (Sentinel site theme) */
  --line-control-hover:rgba(255,255,255,.5);
  --glass:rgba(30,30,32,.35);         /* APC pane; one per view */
  --scrim:rgba(9,9,11,.6);
  --text:#fafafa;
  --text-2:#d4d4d8;                   /* zinc-300 */
  --muted:#a1a1aa;                    /* zinc-400, secondary text */
  --dim:#8b8b94;                      /* tertiary text, still AA on --bg */
  --accent:#d0e6f1;                   /* live-data marks and active states only, never a text accent */
  --on-accent:#18181b;                /* text on white or pale-blue fills */

  /* Impact colours (data only). Pill labels take the Sentinel site theme's owner-approved lift
     (design-r1 SPEC.md, packages/tokens): AA on their own pill over --bg, --bg-2, --surface and --raised. */
  --low:#22c55e;--low-text:#22c55e;
  --medium:#eab308;--medium-text:oklch(0.7 0.15 85);--medium-line:rgba(234,179,8,.35);
  --high:#ef4444;--high-text:#f87171;
  --critical:#ef4444;--critical-text:#fca5a5;--crit-fill:rgba(239,68,68,.15);--crit-line:rgba(239,68,68,.4);

  /* Radius */
  --r-sm:4px;--r:6px;--r-lg:12px;

  /* Faces */
  --display:"Geist",system-ui,sans-serif;
  --sans:"DM Sans",system-ui,sans-serif;
  --body:var(--sans);
  --mono:"JetBrains Mono",ui-monospace,monospace;

  /* Type scale: 96 64 48 32 24 20 16 12 at 1440; 40 36 32 24 20 18 16 12 at 390 */
  --t-96:clamp(40px,calc(5.3333vw + 19.2px),96px);
  --t-64:clamp(36px,calc(2.6667vw + 25.6px),64px);
  --t-48:clamp(32px,calc(1.5238vw + 26.06px),48px);
  --t-32:clamp(24px,calc(.7619vw + 21.03px),32px);
  --t-24:clamp(20px,calc(.381vw + 18.51px),24px);
  --t-20:clamp(18px,calc(.1905vw + 17.26px),20px);
  --t-16:16px;
  --t-12:12px;
  --lh-96:1;--lh-64:1.04;--lh-48:1.08;--lh-32:1.12;--lh-24:1.3;--lh-20:1.5;--lh-16:1.6;--lh-12:1.5;
  --ls-96:-.04em;--ls-64:-.04em;--ls-48:-.03em;--ls-32:-.02em;--ls-24:-.01em;--ls-20:0;--ls-16:0;--ls-12:0;
  --w-96:400;--w-64:400;--w-48:400;--w-32:500;--w-24:500;

  /* Grid: 1312 content, 64 gutters at 1440, 16 at 390 */
  --content:1312px;
  --gutter:clamp(16px,calc(4.5714vw - 1.83px),64px);
  --maxw:calc(var(--content) + 2 * var(--gutter));
  --measure:560px;
  --readw:640px;
  --section-y:clamp(64px,calc(3.0476vw + 52.11px),96px);
  --section-y-tight:clamp(48px,calc(2.2857vw + 39.09px),72px);
  --nav-h:64px;
}

/* ---------- base ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--nav-h) + 16px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img,svg{display:block}
p,li,dd,blockquote{text-wrap:pretty}
.nowrap{white-space:nowrap}
::selection{background:rgba(208,230,241,.24);color:var(--text)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Skip link: the first stop for keyboard users, out of sight until it has focus. */
.skip{position:fixed;top:12px;left:12px;z-index:100;display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:var(--r);background:var(--raised);font-family:var(--sans);font-size:14px;font-weight:500;color:var(--text);transform:translateY(calc(-100% - 16px))}
.skip:focus{transform:none}

/* ---------- type scale (use these; no other sizes) ---------- */
.t-96,.t-64,.t-48,.t-32,.t-24{font-family:var(--display);text-wrap:balance}
.t-96{font-size:var(--t-96);line-height:var(--lh-96);letter-spacing:var(--ls-96);font-weight:var(--w-96)}
.t-64{font-size:var(--t-64);line-height:var(--lh-64);letter-spacing:var(--ls-64);font-weight:var(--w-64)}
.t-48{font-size:var(--t-48);line-height:var(--lh-48);letter-spacing:var(--ls-48);font-weight:var(--w-48)}
.t-32{font-size:var(--t-32);line-height:var(--lh-32);letter-spacing:var(--ls-32);font-weight:var(--w-32)}
.t-24{font-size:var(--t-24);line-height:var(--lh-24);letter-spacing:var(--ls-24);font-weight:var(--w-24)}
.t-20{font-family:var(--sans);font-size:var(--t-20);line-height:var(--lh-20);letter-spacing:0}
.t-16{font-family:var(--sans);font-size:var(--t-16);line-height:var(--lh-16);letter-spacing:0}
.t-12{font-family:var(--sans);font-size:var(--t-12);line-height:var(--lh-12);letter-spacing:0}
/* Data, stamps, codes: JetBrains Mono 12, caps */
.mono,.stamp{font-family:var(--mono);font-size:12px;line-height:1.5;letter-spacing:.04em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.stamp{display:inline-flex;align-items:center;gap:8px;color:var(--text-2)}
.muted{color:var(--muted)}
.dim{color:var(--dim)}

/* ---------- grid and sections ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.wrap.narrow{max-width:calc(var(--readw) + 2 * var(--gutter))}
.section{padding-block:var(--section-y)}
.section.tight{padding-block:var(--section-y-tight)}
.section.ruled{padding-top:0}
.section.ruled > .wrap::before{content:"";display:block;height:1px;margin-bottom:var(--section-y-tight);background:var(--rule)}
.section.deep{background:var(--bg-2)}
.after{margin-top:clamp(40px,4.5vw,56px)}
.body-gap{margin-top:clamp(40px,4.5vw,64px)}

/* Subpage hero (company PageHero): eyebrow, one 64px display line, a 20px lead, at most one action row. */
.page-hero{padding-block:var(--section-y) var(--section-y-tight);border-bottom:1px solid var(--rule)}
.page-hero .actions{margin-top:32px}

/* Section head: eyebrow, title, lead, actions. .head-split puts a 20px line to the right of the title. */
.head{display:flex;flex-direction:column;align-items:flex-start;max-width:880px}
.head.center{align-items:center;margin-inline:auto;text-align:center}
.head .title{margin-top:20px;max-width:880px}
.head > .title:first-child{margin-top:0}
.head .lead{margin-top:24px}
.head .actions{margin-top:40px}
.head.center .lead{margin-inline:auto}
.head-split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 64px}
.head-split > .head{flex:1 1 520px;min-width:0}
.head-aside{flex:0 1 460px;min-width:0;margin:0;color:var(--muted)}
.head-aside a{color:var(--text);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px}
.head-aside a:hover{text-decoration-color:var(--text)}
.head-split + *,.head + .columns,.head + .rows,.head + .body{margin-top:48px}

/* ---------- eyebrow: 12px sentence case with a small dot ---------- */
.eyebrow{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin:0;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.5;letter-spacing:0;color:var(--muted)}
.eyebrow .dot,.dot{flex:none;width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.6}
.eyebrow.live .dot{background:var(--accent);opacity:1}
.eyebrow .sep{color:var(--dim)}
.eyebrow .trail{display:inline-flex;gap:8px;font-weight:400;color:var(--dim)}

/* ---------- display and headings: Geist 400; <em> is the quiet second tone (zinc-400), never a colour ---------- */
.display,.heading{margin:24px 0 0;color:var(--text);max-width:880px}
.display:first-child,.heading:first-child{margin-top:0}
.title-wide{max-width:1100px}
.eyebrow + .display,.eyebrow + .heading{margin-top:20px}
.display em,.heading em,.title em,.cta-h em{font-style:normal;color:var(--muted)}

.lead{margin:24px 0 0;max-width:var(--measure);color:var(--muted)}
.lead:first-child{margin-top:0}
.body{max-width:var(--measure);color:var(--muted)}
.body + .body{margin-top:16px}
.lead + .body,.display + .body,.heading + .body{margin-top:20px}
.lead + .actions,.body + .actions,.display + .actions,.heading + .actions,.note + .actions{margin-top:32px}
.lead a,.body a,.col-body a,.row-body a{color:var(--text);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px;transition:text-decoration-color .2s}
.lead a:hover,.body a:hover,.col-body a:hover,.row-body a:hover{text-decoration-color:var(--text)}
.note{margin-top:16px;max-width:var(--measure);font-size:12px;line-height:1.5;color:var(--dim)}
.note:first-child{margin-top:0}

/* ---------- buttons: APC h-10 rounded-md, DM Sans 14/500. Primary white (one per view), secondary zinc-800.
   The visual stays 40px (sm 32px); ::after keeps the touch target at 44px. Sized to the label, never full width. ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 16px;border:0;border-radius:var(--r);font-family:var(--sans);font-size:14px;font-weight:500;line-height:1;white-space:nowrap;text-decoration:none;cursor:pointer;transition:opacity .15s}
.btn-sm{height:32px;padding:0 12px}
.btn::after{content:"";position:absolute;inset:min(0px, calc((100% - 44px) / 2)) 0}
.btn-primary{background:var(--text);color:var(--on-accent)}
.btn-primary:hover{opacity:.9;color:var(--on-accent)}
.btn-secondary{background:var(--raised);color:var(--text)}
.btn-secondary:hover{opacity:.8;color:var(--text)}
.btn svg{flex:none;transition:transform .15s}
.btn:hover svg{transform:translateX(2px)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px}

/* The text link with the 16px arrow, for secondary routes ("Read the user guide"). */
.text-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-family:var(--sans);font-size:16px;font-weight:500;line-height:1.5;color:var(--text);text-decoration:none}
.text-link span{text-decoration:underline;text-decoration-color:transparent;text-underline-offset:5px;text-decoration-thickness:1px;transition:text-decoration-color .15s}
.text-link:hover span{text-decoration-color:var(--rule-strong)}
.text-link svg{flex:none;transition:transform .15s}
.text-link:hover svg{transform:translateX(3px)}
/* An inline link in running text. */
.link{color:var(--text);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px;transition:text-decoration-color .2s}
.link:hover{text-decoration-color:var(--text)}

/* ---------- columns on hairlines (no cards) ---------- */
.columns{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:48px 32px}
.columns[data-cols="2"]{--cols:2}
.columns[data-cols="3"]{--cols:3}
.columns[data-cols="4"]{--cols:4}
.column{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-top:24px;border-top:1px solid var(--rule)}
.column .eyebrow{margin-bottom:4px}
.col-title{margin:0;color:var(--text)}
.col-body{max-width:var(--measure);color:var(--muted)}
.col-body p + p{margin-top:12px}
.column .text-link{margin-top:4px}
@media (max-width:1024px){.columns[data-cols="4"]{--cols:2}}
@media (max-width:860px){.columns[data-cols="3"],.columns[data-cols="2"]{--cols:1}.columns{gap:32px}}
@media (max-width:560px){.columns[data-cols="4"]{--cols:1}}

/* ---------- rows: title left, text right, on hairlines ---------- */
.rows{border-bottom:1px solid var(--rule)}
.row{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:16px var(--gutter);padding:40px 0;border-top:1px solid var(--rule);color:inherit}
.row-head{display:flex;flex-direction:column;gap:12px}
.row-meta{color:var(--dim)}
.row-title{margin:0;color:var(--text)}
.row-body{max-width:var(--measure);color:var(--muted)}
.row-body p + p{margin-top:12px}
a.row{padding-right:48px;transition:background .2s}
.row-go{position:absolute;top:44px;right:0;color:var(--muted);transition:transform .2s,color .2s}
a.row:hover .row-go{transform:translateX(4px);color:var(--text)}
a.row:focus-visible{outline-offset:-2px}
@media (max-width:860px){.row{grid-template-columns:minmax(0,1fr);padding:28px 0}}

/* ---------- spec rows: a label left, the value right (AGC deployment) ---------- */
.spec{border-top:1px solid var(--rule-strong)}
.spec-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px var(--gutter);padding:20px 0;border-bottom:1px solid var(--rule)}
.spec-row dt{color:var(--text)}
.spec-row dd{margin:0;max-width:640px;color:var(--muted)}
@media (max-width:760px){.spec-row{grid-template-columns:minmax(0,1fr)}}

/* ---------- method steps (AGC's intelligence cycle) ---------- */
.cycle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 32px;padding:0;list-style:none}
.step{padding:24px 0 28px;border-top:1px solid var(--rule)}
.step:nth-child(-n+3){border-top-color:var(--rule-strong)}
.step-k{display:flex;align-items:center;gap:10px;color:var(--dim)}
.step-t{margin-top:12px;color:var(--text)}
.step-b{margin-top:8px;max-width:var(--measure);color:var(--muted)}
.num{font-family:var(--mono);font-size:var(--t-12);line-height:1;letter-spacing:.04em;color:var(--dim)}
@media (max-width:960px){.cycle{grid-template-columns:repeat(2,minmax(0,1fr))}.step:nth-child(3){border-top-color:var(--rule)}}
@media (max-width:600px){.cycle{grid-template-columns:minmax(0,1fr)}.step:nth-child(2){border-top-color:var(--rule)}}

/* ---------- measured figures (always dated) ---------- */
.figures-block{display:flex;flex-direction:column;gap:20px}
.figures{display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:32px}
.figures[data-n="1"]{--n:1}
.figures[data-n="2"]{--n:2}
.figures[data-n="3"]{--n:3}
.figures[data-n="4"]{--n:4}
.figure{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;padding-top:24px;border-top:1px solid var(--rule)}
.figure-value{margin:0;color:var(--text);font-variant-numeric:tabular-nums;white-space:nowrap}
.figure-label{max-width:32ch;color:var(--muted)}
.figures-note{color:var(--dim)}
@media (max-width:860px){.figures[data-n="4"],.figures[data-n="2"]{--n:2}.figures[data-n="3"]{--n:1}}
@media (max-width:480px){.figures[data-n="4"],.figures[data-n="2"]{--n:1}}

/* ---------- glass pane (one per view) ---------- */
.glass{border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}

/* ---------- closing call to action (CtaPanel): one glass pane, a 48px claim, one line, one white primary ---------- */
.cta{padding:var(--section-y) var(--gutter)}
.cta-panel{display:flex;flex-direction:column;align-items:center;gap:24px;max-width:880px;margin:0 auto;padding:clamp(40px,5vw,72px) clamp(20px,4vw,64px);border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);text-align:center}
.cta-mark{width:auto;height:40px}
.cta-h{margin:0;max-width:20ch;font-family:var(--display);font-size:var(--t-48);font-weight:var(--w-48);line-height:var(--lh-48);letter-spacing:var(--ls-48);color:var(--text);text-wrap:balance}
.cta-p{margin:0;max-width:var(--measure);font-size:var(--t-20);line-height:var(--lh-20);color:var(--muted)}
.cta-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:8px}
.cta-mail{display:inline-flex;align-items:center;min-height:44px;margin:-10px 0;font-family:var(--sans);font-size:var(--t-16);line-height:var(--lh-16);color:var(--muted);text-decoration:none}
.cta-mail:hover{color:var(--text)}

/* ---------- chips and impact pills (data only) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.chip{display:inline-flex;align-items:center;height:28px;padding:0 10px;border:1px solid var(--rule);border-radius:var(--r-sm);background:rgba(255,255,255,.03);font-family:var(--sans);font-size:12px;font-weight:500;line-height:1;color:var(--text-2)}
.impact{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border:1px solid;border-radius:999px;font-family:var(--mono);font-size:12px;font-weight:600;line-height:1;letter-spacing:.04em;text-transform:uppercase}
.impact::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor}
.impact.low{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.1);color:var(--low-text)}
.impact.medium{border-color:rgba(234,179,8,.3);background:rgba(234,179,8,.1);color:var(--medium-text)}
.impact.high{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.1);color:var(--high-text)}
.impact.critical{border-color:var(--crit-line);background:var(--crit-fill);color:var(--critical-text)}
.impact.critical::before{box-sizing:border-box;width:6px;height:6px;border:1.5px solid currentColor;background:transparent}

/* ===================================================================== site chrome ===================== */

/* ---------- bar: 64px, sword + word on the left, links centred, actions right ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg);border-bottom:1px solid var(--rule)}
.nav-bar{position:relative;z-index:2;display:flex;align-items:center;gap:24px;max-width:var(--maxw);height:var(--nav-h);margin:0 auto;padding:0 var(--gutter);background:var(--bg)}
.brand{display:inline-flex;flex:none;align-items:center;gap:10px;height:44px;color:var(--text);text-decoration:none}
.brand img{display:block;width:auto;height:26px}
.word{font-family:var(--display);font-size:20px;font-weight:500;line-height:1;letter-spacing:-.02em}
.nav-primary{display:flex;flex:1;justify-content:center;height:100%}
.nav-links{display:flex;align-items:stretch;gap:4px;height:100%;margin:0;padding:0;list-style:none}
.nav-links > li{display:flex}
.nav-link{position:relative;display:inline-flex;align-items:center;gap:6px;padding:0 14px;border:0;background:none;font-family:var(--sans);font-size:16px;font-weight:400;line-height:1;color:var(--muted);text-decoration:none;cursor:pointer;transition:color .15s}
.nav-link:hover,.nav-link[aria-current="page"],.nav-link[aria-current="true"]{color:var(--text)}
.nav-link::after{content:"";position:absolute;right:14px;bottom:-1px;left:14px;height:1px;background:var(--accent);transform:scaleX(0);transition:transform .2s}
.nav-link[aria-current="page"]::after,.nav-link[aria-current="true"]::after{transform:scaleX(1)}
.nav-link:focus-visible{outline-offset:-6px;border-radius:var(--r)}
.nav-actions{display:flex;flex:none;align-items:center;gap:8px;margin-left:auto}
.signin{display:inline-flex;align-items:center;height:40px;padding:0 12px;border-radius:var(--r);font-size:16px;color:var(--muted);text-decoration:none;transition:color .15s}
.signin:hover{color:var(--text)}
/* The phone menu button; site.js shows it (no script: the footer carries every link). */
.burger{position:relative;display:none;flex:none;align-items:center;justify-content:center;width:32px;height:32px;padding:0;border:1px solid var(--rule-strong);border-radius:var(--r);background:none;color:var(--text);cursor:pointer}
.burger::after{content:"";position:absolute;inset:-6px}
.burger .close-icon{display:none}
.burger[aria-expanded="true"] .open-icon{display:none}
.burger[aria-expanded="true"] .close-icon{display:block}

/* ---------- phone sheet ---------- */
.sheet{position:fixed;inset:var(--nav-h) 0 0;z-index:49;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;background:var(--bg)}
.sheet[hidden]{display:none}
.sheet:not([hidden]){animation:drop .18s ease-out}
@keyframes drop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.sheet-nav{flex:1;padding:0 var(--gutter)}
.s-group{padding:24px 0;border-bottom:1px solid var(--rule)}
.s-group:last-child{border-bottom:0}
.s-label{margin:0 0 4px;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.5;color:var(--muted)}
.s-big{display:flex;align-items:center;min-height:52px;font-family:var(--display);font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.01em;color:var(--text);text-decoration:none}
.s-big[aria-current="page"]{color:var(--text-2)}
.s-small{display:flex;align-items:center;min-height:44px;font-size:16px;line-height:1.5;color:var(--text-2);text-decoration:none}
.s-small:hover{color:var(--text)}
.s-actions{position:sticky;bottom:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;padding:16px var(--gutter) calc(16px + env(safe-area-inset-bottom));border-top:1px solid var(--rule);background:var(--bg)}
@media (min-width:600px){
  .sheet-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gutter);align-content:start}
  .s-group{border-bottom:0}
}
@media (max-width:960px){
  .nav-primary,.signin{display:none}
  .js .burger{display:inline-flex}
  .nav-bar{gap:12px}
}
@media (min-width:961px){.sheet{display:none}}
@media (max-width:359px){.nav-actions .bar-cta{display:none}}
.site-header[data-sheet] .bar-cta{display:none}
@media (max-width:960px),(pointer:coarse){.signin{height:44px}}
@media (prefers-reduced-motion:reduce){.sheet:not([hidden]){animation:none}.nav-link::after{transition:none}html{scroll-behavior:auto}}

/* ---------- footer: an index ---------- */
.site-footer{border-top:1px solid var(--rule);background:var(--bg)}
.fwrap{max-width:var(--maxw);margin:0 auto;padding:72px var(--gutter) 0}
.ftop{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:32px 64px;padding-bottom:56px}
.fbrand{display:inline-flex;align-items:center;gap:12px;color:var(--text);text-decoration:none}
.fbrand img{display:block;width:auto;height:32px}
.fbrand .word{font-size:24px}
.fmail{display:flex;flex-wrap:wrap;gap:24px 48px;margin:0}
.fmail div{display:flex;flex-direction:column;gap:2px}
.fmail dt{font-size:12px;font-weight:500;line-height:1.5;color:var(--muted)}
.fmail dd{margin:0}
.fmail a{font-size:16px;line-height:1.5;color:var(--text);text-decoration:none}
.fmail a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--rule-strong)}
.findex{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:40px 32px;padding:40px 0 64px;border-top:1px solid var(--rule)}
.fcol{min-width:0}
.fcol h2{margin:0 0 12px;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.5;color:var(--muted)}
.fcol ul{margin:0;padding:0;list-style:none}
.fcol li a,.fname{display:inline-flex;align-items:flex-start;gap:10px;min-height:32px;padding-block:5px;font-size:16px;line-height:1.4;color:var(--text-2);text-decoration:none;transition:color .15s}
.fcol li a:hover,.fname:hover{color:var(--text)}
.fname{font-weight:500;color:var(--text)}
.fcol address{font-style:normal;font-size:16px;line-height:1.6;color:var(--text-2)}
.fcol .hook{flex:none;margin-top:5px;color:var(--dim)}
/* The office closes the index on the right edge, as on the site. */
.fcol.office{grid-column:-2 / -1}
.fbase{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding:24px 0 40px;border-top:1px solid var(--rule);font-size:12px;line-height:1.5;color:var(--dim)}
.fbase ul{display:flex;flex-wrap:wrap;gap:4px 24px;margin:0;padding:0;list-style:none}
.fbase a{display:inline-flex;align-items:center;min-height:32px;color:var(--muted);text-decoration:none}
.fbase a:hover{color:var(--text)}
@media (max-width:1100px){.findex{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:640px){
  .fwrap{padding-top:48px}
  .ftop{padding-bottom:40px}
  .findex{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 16px;padding:32px 0 40px}
  .fcol.wide,.fcol.office{grid-column:1 / -1}
}
@media (max-width:960px),(pointer:coarse){
  .fbrand,.fmail a,.fbase a{display:inline-flex;align-items:center;min-height:44px}
  .fcol li a,.fname{min-height:44px;padding-block:11px}
}

/* ===================================================================== documents ===================== */
/* Legal and long-form pages (globals.css: privacy, terms, SITREP legal). The wording is the owner's; only
   the styling follows the system. */
.doc-hero{padding:var(--section-y-tight) 0 48px;border-bottom:1px solid var(--rule)}
.doc-hero .kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:24px;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.5;letter-spacing:0;text-transform:none;color:var(--muted)}
.doc-hero .kicker::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.6}
.doc-hero h1{font-family:var(--display);font-weight:400;font-size:var(--t-64);line-height:1.04;letter-spacing:-.04em;text-wrap:balance}
.doc-hero .rev{margin-top:24px;font-family:var(--mono);font-size:12px;line-height:1.5;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
.doc-hero .doc-actions{margin-top:24px}
.legal{padding:48px 0 var(--section-y)}
.legal h2{margin:64px 0 16px;padding-top:24px;border-top:1px solid var(--rule);font-family:var(--display);font-weight:500;font-size:var(--t-24);line-height:1.3;letter-spacing:-.01em;scroll-margin-top:calc(var(--nav-h) + 24px)}
.legal > h2:first-child,.legal > .callout + h2,.legal > .lead + h2{margin-top:48px}
.legal h2 .n{margin-right:12px;font-family:var(--mono);font-size:16px;font-weight:400;letter-spacing:0;color:var(--muted)}
.legal h3{margin:32px 0 12px;font-family:var(--sans);font-weight:500;font-size:var(--t-20);line-height:1.5;color:var(--text)}
.legal p{margin:0 0 16px;font-size:16px;line-height:1.6;color:var(--muted)}
.legal ul,.legal ol{margin:0 0 20px;padding-left:22px;font-size:16px;line-height:1.6;color:var(--muted)}
.legal ul{list-style:disc}
.legal li{margin-bottom:8px}
.legal li::marker{color:var(--dim)}
.legal .lead{max-width:none;margin:0 0 16px;font-size:16px;color:var(--text)}
.legal a{color:var(--text);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px;overflow-wrap:anywhere}
.legal a:hover{text-decoration-color:var(--text)}
.legal strong,.legal b{color:var(--text);font-weight:600}
.legal em{font-style:italic;color:inherit}
.legal code{padding:1px 6px;border:1px solid var(--rule);border-radius:var(--r-sm);background:var(--raised);font-family:var(--mono);font-size:12px;color:var(--text)}
.legal hr{height:0;margin:48px 0 24px;border:0;border-top:1px solid var(--rule)}
.legal .small{font-size:12px;line-height:1.5;color:var(--dim)}
.inshort,.callout{margin:0 0 20px;padding:16px 20px;border:1px solid var(--rule);border-left:2px solid var(--text-2);border-radius:var(--r);background:var(--surface);font-size:16px;line-height:1.6}
.inshort{color:var(--muted)}
.callout{font-weight:500;color:var(--text)}
.callout a{color:var(--text)}
.toc{margin:40px 0;padding:28px 32px;border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--surface)}
.toc h2,.legal .toc h2{margin:0 0 16px;padding:0;border:0;font-family:var(--sans);font-size:12px;font-weight:500;line-height:1.6;letter-spacing:0;color:var(--muted)}
.toc ol{padding-left:20px;columns:2;column-gap:40px;font-size:16px;color:var(--muted)}
.toc li{margin-bottom:8px;break-inside:avoid}
.toc a{color:var(--muted);text-decoration:none}
.toc a:hover{color:var(--text)}
@media (max-width:640px){.toc ol{columns:1}.toc{padding:22px 20px}}
table.tbl{width:100%;margin:8px 0 24px;border-collapse:collapse;border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;font-size:16px;line-height:1.5}
table.tbl th,table.tbl td{padding:12px 14px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;color:var(--muted)}
table.tbl thead th{background:var(--surface);font-family:var(--mono);font-size:12px;font-weight:400;letter-spacing:.04em;text-transform:uppercase;color:var(--dim)}
/* Code blocks (docs): the AGC page's code frame. */
pre.code{margin:0 0 20px;padding:16px;overflow-x:auto;border:1px solid var(--rule-strong);border-radius:var(--r-lg);background:#060608;font-family:var(--mono);font-size:12px;line-height:1.7;color:var(--text-2)}
pre.code code{padding:0;border:0;background:none;font:inherit;color:inherit}

/* Questions and answers: one question per hairline row; the caret turns when open. */
.faq{border-bottom:1px solid var(--rule)}
.faq details{border-top:1px solid var(--rule)}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px;padding:16px 0;font-family:var(--sans);font-size:var(--t-20);font-weight:500;line-height:1.5;color:var(--text);list-style:none;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:10px;height:10px;margin-right:4px;border-right:1.3px solid var(--muted);border-bottom:1.3px solid var(--muted);transform:translateY(-3px) rotate(45deg);transition:transform .2s}
.faq details[open] > summary::after{transform:translateY(2px) rotate(225deg)}
.faq summary:hover::after{border-color:var(--text)}
.faq summary:focus-visible{outline-offset:2px;border-radius:var(--r)}
.faq .answer{padding:0 0 24px;max-width:var(--readw)}
.faq .answer > :last-child{margin-bottom:0}
.legal .faq{margin:0 0 24px}
.legal .faq + h2{margin-top:48px}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none}}

/* ---------- page helpers ---------- */
.split-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px var(--gutter);align-items:start}
@media (max-width:860px){.split-2{grid-template-columns:minmax(0,1fr)}}
.sub-h{margin:0 0 20px;color:var(--text)}
.chips-gap{margin-top:20px}
.more{margin-top:24px}
/* Group headings on a page of questions: the rows below carry the hairlines. */
.legal h2.group{margin:56px 0 8px;padding-top:0;border-top:0}
.legal > h2.group:first-child{margin-top:8px}
.legal .columns{margin-top:24px}
.legal .column h3,.legal .column p{margin:0}
.legal a.text-link{text-decoration:none}

/* ---------- print: white page, black text, #999 lines; no chrome ---------- */
@media print{
  html,body{background:#fff !important;color:#000 !important}
  .site-header,.site-footer,.skip,.doc-actions,.cta,.burger,.sheet{display:none !important}
  .wrap,.wrap.narrow{max-width:none;padding:0}
  .doc-hero{padding:0 0 14pt;border-bottom:1px solid #000}
  .doc-hero h1{font-size:24pt;color:#000}
  .doc-hero .kicker,.doc-hero .rev{color:#000}
  .legal{padding:14pt 0 0}
  .legal p,.legal li,.legal ol,.legal ul,.legal h2,.legal h3,.legal strong,.legal b,.legal td,.legal th,.legal .n,.legal .lead,.legal .small,.faq summary{color:#000 !important}
  .legal p,.legal ul,.legal ol{font-size:10.5pt;line-height:1.5}
  .legal h2{font-size:14pt;margin:18pt 0 8pt;border-top:1px solid #999;break-after:avoid}
  .legal h3{font-size:11.5pt;break-after:avoid}
  .legal a{color:#000 !important;text-decoration:underline}
  .legal a[href^="http"]::after,.legal a[href^="mailto"]::after{content:" (" attr(href) ")";font-size:9pt}
  .toc,.callout,.inshort,.legal code,pre.code{background:none !important;border-color:#999 !important;color:#000 !important}
  .faq details{break-inside:avoid;border-color:#999}
  .faq summary::after{display:none}
  table.tbl{border-color:#999}
  table.tbl th,table.tbl td{border-color:#999;background:none !important;color:#000 !important}
  tr{break-inside:avoid}
  @page{margin:18mm}
}
