/* ============================================================
   Field Guide, buy-guide archetype. Design locked in
   DESIGN-SPECS.md section B and not reinterpreted here.
   Palette: page #FFFFFF, panel #F2F5F7, ink #10161C,
   accent #16607A, rule #D3DCE3, muted #55636E.
   Type: Inter sans for prose, ui-monospace for data and
   metadata. Class prefix fg-. :root custom properties + var(),
   CSS grid for page layout, logical properties throughout.
   ============================================================ */
:root{
  color-scheme: light;
  --fg-page:#FFFFFF;
  --fg-panel:#F2F5F7;
  --fg-ink:#10161C;
  --fg-accent:#16607A;
  --fg-rule:#D3DCE3;
  --fg-muted:#55636E;
  --fg-sans:Inter,"Helvetica Neue",Arial,sans-serif;
  --fg-mono:ui-monospace,"SF Mono",Menlo,monospace;
  --fg-shell:76rem;
  --fg-measure:70ch;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

body{
  margin-block:0;
  margin-inline:0;
  background-color:var(--fg-page);
  color:var(--fg-ink);
  font-family:var(--fg-sans);
  font-size:1.0625rem;
  line-height:1.62;
}

h1,h2,h3,h4{font-family:var(--fg-sans);line-height:1.22;letter-spacing:-0.01em;margin-block:0 0.6rem}
h1{font-size:1.8rem;font-weight:700}
h2{
  font-size:1.32rem;font-weight:600;
  margin-block-start:2.5rem;
  padding-block-end:0.45rem;
  border-block-end:1px solid var(--fg-rule);
}
h3{font-size:1.04rem;font-weight:600;margin-block-start:1.6rem}
h4{font-size:0.95rem;font-weight:600;margin-block-start:1.2rem}
p{margin-block:0 1rem;max-inline-size:var(--fg-measure)}
ul,ol{margin-block:0 1rem;padding-inline-start:1.15rem;max-inline-size:var(--fg-measure)}
li{margin-block-end:0.35rem}

a{color:var(--fg-accent);text-decoration:underline;text-underline-offset:0.16em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a:focus-visible,[tabindex]:focus-visible{
  outline:3px solid var(--fg-accent);
  outline-offset:2px;
  border-radius:2px;
}

.fg-visually-hidden{
  position:absolute;
  inline-size:1px;block-size:1px;
  overflow:hidden;clip-path:inset(50%);white-space:nowrap;
}

.fg-skip{
  position:absolute;inset-block-start:-3rem;inset-inline-start:0.75rem;
  background-color:var(--fg-panel);color:var(--fg-ink);
  padding-block:0.5rem;padding-inline:0.75rem;
  font-family:var(--fg-mono);font-size:0.8rem;
  z-index:5;
}
.fg-skip:focus-visible{inset-block-start:0.5rem}

/* ---- nav: left wordmark, right link row, thin bottom rule, not sticky ---- */
.fg-nav{border-block-end:1px solid var(--fg-rule);background-color:var(--fg-page)}
.fg-nav__inner{
  max-inline-size:var(--fg-shell);
  margin-inline:auto;
  padding-inline:1.25rem;padding-block:0.9rem;
  display:grid;gap:0.65rem;
}
.fg-nav__mark{
  font-family:var(--fg-mono);font-size:0.9rem;
  text-transform:uppercase;letter-spacing:0.09em;
  color:var(--fg-ink);text-decoration:none;
  justify-self:start;
}
.fg-nav__mark:hover{color:var(--fg-accent)}
.fg-nav__links{
  display:grid;grid-template-columns:repeat(3,auto);
  gap:0.4rem 1.2rem;justify-content:start;
  list-style:none;margin-block:0;padding-inline-start:0;
}
.fg-nav__links a{
  font-family:var(--fg-mono);font-size:0.78rem;
  text-transform:uppercase;letter-spacing:0.07em;
  text-decoration:none;color:var(--fg-muted);
}
.fg-nav__links a:hover{color:var(--fg-accent);text-decoration:underline}

/* ---- page shell: two column grid on desktop, article left, rail right ---- */
.fg-shell{
  max-inline-size:var(--fg-shell);
  margin-inline:auto;
  padding-inline:1.25rem;padding-block:2rem 3rem;
  display:grid;gap:2rem;
}
.fg-head{max-inline-size:var(--fg-measure)}
.fg-deck{color:var(--fg-muted);font-size:1.08rem}

.fg-meta{
  font-family:var(--fg-mono);font-size:0.72rem;
  text-transform:uppercase;letter-spacing:0.06em;
  color:var(--fg-muted);
  border-block:1px solid var(--fg-rule);
  padding-block:0.6rem;
  margin-block:1.25rem;
  max-inline-size:none;
}
.fg-meta span{margin-inline-end:0.9rem;white-space:nowrap;display:inline-block}
.fg-meta .fg-meta__dir{color:var(--fg-ink)}

/* ---- panels ---- */
.fg-panel{
  background-color:var(--fg-panel);
  border-inline-start:3px solid var(--fg-accent);
  padding-block:1rem;padding-inline:1.1rem;
  margin-block:1.5rem;
}
.fg-panel h2{margin-block-start:0;border-block-end:0;padding-block-end:0;font-size:1.05rem}
.fg-panel p:last-child{margin-block-end:0}

/* the two-sentence establishes/does-not block above prose on paths 2 to 6 */
.fg-establishes{
  border-inline-start:3px solid var(--fg-muted);
  background-color:var(--fg-panel);
  padding-block:0.85rem;padding-inline:1.05rem;
  margin-block:1.3rem;
  font-size:0.98rem;
}
.fg-establishes p{margin-block:0}
.fg-establishes p + p{margin-block-start:0.5rem}

/* the paid reference block, marked as paid in its own heading */
.fg-paid{
  border:1px solid var(--fg-rule);
  border-block-start:3px solid var(--fg-accent);
  padding-block:1.1rem;padding-inline:1.1rem;
  margin-block:1.5rem;
}
.fg-paid h2,.fg-paid h3{margin-block-start:0}
.fg-paid__tag{
  display:inline-block;
  font-family:var(--fg-mono);font-size:0.68rem;
  text-transform:uppercase;letter-spacing:0.09em;
  color:var(--fg-muted);
  background-color:var(--fg-panel);
  padding-block:0.15rem;padding-inline:0.45rem;
  margin-block-end:0.5rem;
}

/* the supplier entity layer, a disclosed compliance block */
.fg-entity{
  border-block:1px solid var(--fg-rule);
  padding-block:1rem 0.4rem;
  margin-block:2rem;
}
.fg-entity__q{margin-block:0.9rem 0.25rem}
.fg-entity__q strong{color:var(--fg-ink)}

/* the harm sentence and the refusals, plainly set */
.fg-flat{
  border-inline-start:3px solid var(--fg-muted);
  padding-inline-start:1rem;
  margin-block:1.3rem;
}

/* ---- rail ---- */
.fg-rail{
  background-color:var(--fg-panel);
  padding-block:1rem;padding-inline:1rem;
  font-size:0.9rem;
}
.fg-rail h2{
  font-family:var(--fg-mono);font-size:0.72rem;font-weight:600;
  text-transform:uppercase;letter-spacing:0.09em;color:var(--fg-muted);
  margin-block:0 0.6rem;padding-block-end:0.4rem;
  border-block-end:1px solid var(--fg-rule);
}
.fg-rail ul{list-style:none;margin-block:0;padding-inline-start:0;max-inline-size:none}
.fg-rail li{margin-block-end:0.45rem}
.fg-rail a{text-decoration:none}
.fg-rail a:hover{text-decoration:underline}
.fg-rail__note{
  font-family:var(--fg-mono);font-size:0.68rem;line-height:1.5;
  color:var(--fg-muted);
  margin-block:0.9rem 0;padding-block-start:0.6rem;
  border-block-start:1px solid var(--fg-rule);
  max-inline-size:none;
}

/* ---- comparison table, horizontally scrollable wrapper ---- */
.fg-scrollnote{
  font-family:var(--fg-mono);font-size:0.7rem;
  text-transform:uppercase;letter-spacing:0.08em;
  color:var(--fg-muted);
  margin-block:0 0.4rem;max-inline-size:none;
}
.fg-tablewrap{
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  border-block:1px solid var(--fg-rule);
  border-inline:1px solid var(--fg-rule);
  scrollbar-color:var(--fg-muted) var(--fg-panel);
  scrollbar-width:thin;
}
.fg-tablewrap::-webkit-scrollbar{block-size:12px}
.fg-tablewrap::-webkit-scrollbar-track{background-color:var(--fg-panel)}
.fg-tablewrap::-webkit-scrollbar-thumb{background-color:var(--fg-muted)}
.fg-table{
  border-collapse:collapse;
  inline-size:100%;min-inline-size:60rem;
  font-size:0.92rem;
}
.fg-table caption{
  caption-side:top;text-align:start;
  font-family:var(--fg-mono);font-size:0.72rem;line-height:1.55;
  color:var(--fg-muted);
  background-color:var(--fg-panel);
  padding-block:0.6rem;padding-inline:0.85rem;
  border-block-end:1px solid var(--fg-rule);
}
.fg-table th,.fg-table td{
  text-align:start;vertical-align:top;
  padding-block:0.7rem;padding-inline:0.85rem;
  border-block-end:1px solid var(--fg-rule);
}
.fg-table thead th{
  font-family:var(--fg-mono);font-size:0.68rem;font-weight:600;
  text-transform:uppercase;letter-spacing:0.08em;
  color:var(--fg-muted);
  background-color:var(--fg-panel);
  border-block-end:2px solid var(--fg-rule);
  white-space:nowrap;
}
.fg-table tbody th{font-weight:600;color:var(--fg-ink)}
.fg-table tbody tr:last-child th,.fg-table tbody tr:last-child td{border-block-end:0}
.fg-dir{
  font-family:var(--fg-mono);font-size:0.74rem;
  text-transform:uppercase;letter-spacing:0.05em;
  color:var(--fg-ink);
  white-space:normal;
}
/* direction words in running prose: the monospace metadata face, kept legible */
.fg-t{font-family:var(--fg-mono);font-size:0.9em;color:var(--fg-ink)}
.fg-tablefoot{
  font-family:var(--fg-mono);font-size:0.7rem;line-height:1.6;
  color:var(--fg-muted);
  margin-block:0.55rem 0;max-inline-size:none;
}
/* the specification table with zero rows */
.fg-empty caption{background-color:var(--fg-panel)}
.fg-empty tbody td{color:var(--fg-muted);font-family:var(--fg-mono);font-size:0.72rem}
.fg-condition{
  border:2px solid var(--fg-accent);
  background-color:var(--fg-panel);
  padding-block:0.9rem;padding-inline:1rem;
  margin-block:0.9rem 1.5rem;
  font-weight:600;
  max-inline-size:none;
}

/* ---- faq ---- */
.fg-faq h3{
  padding-block-start:0.9rem;
  border-block-start:1px solid var(--fg-rule);
}
.fg-faq p{max-inline-size:var(--fg-measure)}

/* ---- footer: one centred row of small text, no columns ---- */
.fg-foot{
  border-block-start:1px solid var(--fg-rule);
  background-color:var(--fg-panel);
  padding-block:1.6rem;padding-inline:1.25rem;
}
.fg-foot__row{
  max-inline-size:64rem;margin-inline:auto;
  text-align:center;
  font-size:0.82rem;line-height:1.65;color:var(--fg-muted);
}
.fg-foot__row p{max-inline-size:none;margin-inline:auto}
.fg-foot__row a{color:var(--fg-accent)}
.fg-foot__stamp{
  font-family:var(--fg-mono);font-size:0.7rem;
  text-transform:uppercase;letter-spacing:0.07em;
  margin-block-end:0;
}

@media (min-width:640px){
  .fg-nav__inner{grid-template-columns:auto 1fr;align-items:center}
  .fg-nav__links{grid-auto-flow:column;grid-template-columns:none;justify-content:end}
  h1{font-size:2.15rem}
}

@media (min-width:900px){
  .fg-shell{grid-template-columns:minmax(0,1fr) 16rem;gap:3rem;align-items:start}
  .fg-head{grid-column:1 / -1}
  .fg-main{grid-column:1;grid-row:2}
  .fg-rail{grid-column:2;grid-row:2;position:sticky;inset-block-start:1.5rem;align-self:start}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:0.01ms;transition-duration:0.01ms}
}