@font-face {
  font-family: "Libre Franklin";
  src: url("/assets/fonts/libre-franklin-latin-wght.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: light;
  --paper: #ffffff;
  --ink: #14275c;
  --soft: #4b5878;
  --line: #cfd5e3;
  --print: "Libre Franklin", Arial, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

body {
  background: var(--paper);
  color: var(--ink);
  font: 400 1.0625rem/1.5 var(--print);
  min-height: 100vh;
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
}

a { color: inherit; font-weight: 600; text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }

.wrap { width: min(1040px, 100%); margin: 0 auto; padding-inline: clamp(16px, 4vw, 48px); }

.top { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 4px 28px; padding-block: 22px 0; }
.brand { font-weight: 700; font-size: 1.25rem; margin: 0; }
.reach { display: flex; flex-wrap: wrap; gap: 2px 24px; font-size: 1rem; }
.reach a { display: inline-block; padding-block: 3px; }

main { padding-block: clamp(36px, 6vw, 72px) clamp(36px, 5vw, 60px); }
h1, h2 { margin: 0 0 8px; font-size: 1.375rem; font-weight: 600; line-height: 1.3; }
h2 { margin-top: clamp(32px, 4vw, 48px); }

.jobs { list-style: none; margin: 0; padding: 0; }
.jobs li { display: grid; grid-template-columns: minmax(0, 17em) minmax(0, 1fr); gap: 4px 32px; padding-block: 14px; border-top: 1px solid var(--line); }
.jobs b { font-weight: 600; }
.jobs span { color: var(--soft); max-width: 58ch; }

footer { border-top: 1px solid var(--line); font-size: .9375rem; color: var(--soft); }
.legal { display: flex; flex-wrap: wrap; gap: 4px 28px; padding-block: 16px 4px; font-style: normal; }
.legal a { color: var(--ink); }
.note { margin: 0; padding-bottom: 22px; }

@media (max-width: 720px) {
  .jobs li { grid-template-columns: 1fr; }
}

@media print {
  .switch { display: none; }
}