/* terapia-si landing page — base stylesheet.
   The web-font declarations below are ported from web/static/css/app.css
   (lines 95-206), with every source path rewritten to point at
   assets/fonts/… since this is a standalone static site with its own
   asset root. The unicode-range split (latin + latin-ext per weight)
   is unchanged — it is the canonical Google Fonts split so the browser
   picks the right file per-glyph, keeping Polish diacritics on the same
   font as basic Latin glyphs. */
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/manrope-400-latin.woff2') format('woff2');
  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: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/manrope-400-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/manrope-500-latin.woff2') format('woff2');
  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: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/manrope-500-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/manrope-600-latin.woff2') format('woff2');
  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: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/manrope-600-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/manrope-700-latin.woff2') format('woff2');
  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: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/assets/fonts/manrope-700-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-600-latin.woff2') format('woff2');
  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: 'Source Serif 4';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/assets/fonts/source-serif-4-600-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/jetbrains-mono-400-latin.woff2') format('woff2');
  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';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/jetbrains-mono-400-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/jetbrains-mono-500-latin.woff2') format('woff2');
  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';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/jetbrains-mono-500-latin-ext.woff2') format('woff2');
  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-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Design tokens — light values copied verbatim from the app's
   web/static/css/app.css :root (+ --accent-strong from ui.css :root),
   so the landing page stays pixel-faithful to /styleguide. Dark tokens
   are net-new: the app has no dark mode today. */
:root{
  /* neutrals — light (from app.css :root) */
  --bg:#F6F2E8; --paper:#FFFFFF; --paper-2:#FBF8F1;
  --ink:#141310; --ink-2:#3D3831; --ink-3:#6A6359; --muted:#9A9388;
  --rule:#E4DDCD; --rule-soft:#EFEADB;
  --accent:#2E6A6B; --accent-strong:#245A5B; --accent-soft:#D9E6E4;
  /* 12-tone accents (from patient.css :root) — icon tiles */
  --c-coral:hsl(15,57%,42%); --c-coral-soft:hsl(15,79%,92%);
  --c-sage:hsl(133,19%,34%); --c-sage-soft:hsl(133,27%,83%);
  --c-sky:hsl(210,29%,41%); --c-sky-soft:hsl(211,38%,90%);
  --c-mint:hsl(165,30%,33.5%); --c-mint-soft:hsl(159,32%,87%);
  --c-plum:hsl(272,21%,43.5%); --c-plum-soft:hsl(270,33%,89%);
  --c-amber:hsl(44,48%,32.5%); --c-amber-soft:hsl(43,60%,87%);
  /* fonts */
  --sans:'Manrope',ui-sans-serif,system-ui,sans-serif;
  --serif:'Source Serif 4',Georgia,serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#14110C; --paper:#1E1A13; --paper-2:#242017;
  --ink:#F6F2E8; --ink-2:#DDD6C6; --ink-3:#A99F8C; --muted:#7B7364;
  --rule:#322B20; --rule-soft:#282218;
  --accent:#63B3AF; --accent-strong:#7CC3BF; --accent-soft:#1E322E;
  --c-coral-soft:#3a241d; --c-sage-soft:#22301f; --c-sky-soft:#1e2b38;
  --c-mint-soft:#16302b; --c-plum-soft:#2c2438; --c-amber-soft:#332a13;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--ink-2);font-family:var(--sans);font-weight:400}
body{margin:0;line-height:1.55;letter-spacing:-.003em;-webkit-font-smoothing:antialiased}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
h1,h2,h3,h4{margin:0}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}

/* ---- components ----
   Ported from mockups/landing/preview.html's Variant-1 (#v1) design —
   the approved layout — plus the atoms shared across all three preview
   variants. Selectors are stripped of their #v1 scoping prefix since
   this is now the page's one and only design, not one of three options.
   Skipped from the source: the #v2/#v3 variant styles, the .vnav
   variant-switcher chrome, and the .screen/.chrome faux-browser-frame
   chrome around the mockup's screenshots (real screenshots here don't
   sit inside a fake browser frame). Where a shared atom and a #v1
   override both existed for the same class, they are merged below into
   one rule (see .nav). */

.brand{display:flex;align-items:center;gap:10px}
.brand .wm{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink)}
.logo{flex-shrink:0}
.lang{font:600 12px/1 var(--mono);color:var(--ink-3);border:1px solid var(--rule);border-radius:999px;padding:7px 11px;cursor:pointer}
.lang b{color:var(--accent)}
.navlinks{display:flex;gap:22px;font-size:14px;color:var(--ink-2);font-weight:500}
.navlinks a:hover{color:var(--accent)}

.btn{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:14px;border-radius:999px;padding:11px 20px;cursor:pointer;border:1px solid transparent;transition:.15s;font-family:var(--sans)}
.btn.sm{font-size:13px;padding:9px 16px}
.btn-primary{background:var(--accent);color:#fff}
.btn-primary:hover{background:var(--accent-strong)}
.btn-ghost{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn-ghost:hover{background:var(--accent-soft)}
.btn-login{background:transparent;color:var(--ink-2);border-color:var(--rule)}
.btn-login:hover{border-color:var(--muted)}
/* Disabled CTA (new — not in the mockup, which had no pre-launch state):
   pairs with .cta-soon below for the "coming soon" affordance on the
   three CTAs that have no live destination yet. */
.btn[aria-disabled="true"]{background:var(--paper-2);color:var(--muted);border-color:var(--rule);cursor:default;pointer-events:none}
.cta-soon{display:inline-block;font:600 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-left:8px}

.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600}

.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 42px;border-bottom:1px solid var(--rule-soft)}
.nav-actions{display:flex;align-items:center;gap:12px}

.hero{max-width:1080px;margin:0 auto;padding:64px 42px 8px;text-align:center}
.hero h1{font-family:var(--serif);font-weight:600;font-size:42px;line-height:1.1;letter-spacing:-.015em;color:var(--ink);margin:16px auto 16px;max-width:720px}
.hero p{font-size:17px;color:var(--ink-3);max-width:560px;margin:0 auto 26px}
.hero .cta{display:flex;gap:12px;justify-content:center;align-items:center}
.heroshot{max-width:1000px;margin:44px auto 0;border:1px solid var(--rule);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px -40px rgba(20,19,16,.35)}

.features{max-width:1000px;margin:0 auto;padding:66px 42px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px 34px}
.feature h3{font-family:var(--serif);font-size:18px;font-weight:600;color:var(--ink);margin:14px 0 5px}
.feature p{font-size:14px;color:var(--ink-3);margin:0}
.feat-ico{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;flex-shrink:0}
.feat-ico svg{width:21px;height:21px;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Feature-icon tone tiles. The mockup applied these per-tile via inline
   style="background:var(--X-soft);color:var(--X)"; inline styles are
   forbidden under the production CSP (Task 9, no unsafe-inline), so the
   six 12-tone variants live here as modifier classes. Values map to the
   --c-* tokens at :root (soft = tile background, base = icon stroke). */
.feat-ico.tone-coral{background:var(--c-coral-soft);color:var(--c-coral)}
.feat-ico.tone-sage{background:var(--c-sage-soft);color:var(--c-sage)}
.feat-ico.tone-sky{background:var(--c-sky-soft);color:var(--c-sky)}
.feat-ico.tone-mint{background:var(--c-mint-soft);color:var(--c-mint)}
.feat-ico.tone-plum{background:var(--c-plum-soft);color:var(--c-plum)}
.feat-ico.tone-amber{background:var(--c-amber-soft);color:var(--c-amber)}

.split{max-width:1000px;margin:0 auto;padding:8px 42px 72px;display:grid;grid-template-columns:1fr 360px;gap:44px;align-items:center}
.split .eyebrow{margin-bottom:10px;display:block}
.split h2{font-family:var(--serif);font-size:28px;font-weight:600;color:var(--ink);margin:0 0 12px;line-height:1.15}
.split p{font-size:15px;color:var(--ink-3);margin:0 0 10px}
.split .peekwrap{border:1px solid var(--rule);border-radius:16px;overflow:hidden;box-shadow:0 26px 50px -34px rgba(20,19,16,.4)}

.spotlight{padding:66px 42px;text-align:center}
.spotlight .eyebrow{display:inline-block;margin-bottom:10px}
.spotlight h2{font-family:var(--serif);font-size:30px;font-weight:600;color:var(--ink);margin:0 auto 10px;max-width:640px}
.spotlight p{font-size:15px;color:var(--ink-3);max-width:580px;margin:0 auto 30px}
.spotlight .sframe{border:1px solid var(--rule);border-radius:16px;overflow:hidden;box-shadow:0 34px 64px -40px rgba(20,19,16,.42);max-width:840px;margin:0 auto;background:var(--paper)}

.trust{background:var(--accent);color:#dbeae7;text-align:center;padding:58px 24px}
.trust .eyebrow{color:#a9d0cc}
.trust h2{font-family:var(--serif);font-size:30px;font-weight:600;color:#fff;margin:12px auto;max-width:620px;line-height:1.15}
.trust p{max-width:540px;margin:0 auto;font-size:15px;color:#cfe3e0}
/* Dark-mode override: --accent is deliberately lighter in dark mode
   (#63B3AF, so it still pops against the dark --bg elsewhere), but that
   makes it too light a background for this section's hardcoded light
   text colors above — white-on-light-teal drops to ~2.4:1 for the h2
   and as low as ~1.5:1 for the eyebrow, both well under AA. Swap the
   background to --accent-soft (an existing token, not a new color)
   rather than changing --accent globally, since --accent is consumed
   by other components (buttons, links, icon tiles) that already pass
   AA against --bg. Measured via landing/verify/verify-dark.mjs. */
:root[data-theme="dark"] .trust{background:var(--accent-soft)}

.foot{border-top:1px solid var(--rule);padding:36px 42px 30px;display:flex;flex-wrap:wrap;gap:30px;justify-content:space-between;background:var(--paper-2)}
.foot .fcol h5{font:600 11.5px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 11px}
.foot .fcol a{display:block;font-size:13.5px;color:var(--ink-2);padding:3px 0}
.foot .fcol a:hover{color:var(--accent)}
.foot .legal a{color:var(--accent);font-weight:500}
.foot-brand{max-width:240px}
.foot-brand p{font-size:13px;color:var(--ink-3);margin:9px 0 0}
/* Footer wordmark is 16px (nav wordmark is 18px). The mockup set this
   inline (style="font-size:16px"); expressed as a class here so the page
   stays free of inline styles for the production CSP. */
.foot-brand .wm{font-size:16px}
.copy{width:100%;border-top:1px solid var(--rule);margin-top:6px;padding-top:16px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}

@media(max-width:860px){
  .features{grid-template-columns:1fr 1fr}
  .split{grid-template-columns:1fr}
  .nav{padding:16px 22px}
}

/* ---- chrome + accessibility affordances ----
   New — not in the mockup. Theme toggle button (consumed by Task 5),
   and the focus-ring / skip-link affordances the mockup's throwaway
   preview harness didn't need but a real published site does. */
.theme-toggle{background:transparent;border:1px solid var(--rule);border-radius:999px;width:34px;height:34px;display:grid;place-items:center;cursor:pointer;color:var(--ink-2)}
.theme-toggle:hover{border-color:var(--muted)}
.focus-ring:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.skip-link{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:12px;background:var(--paper);padding:8px 14px;border:1px solid var(--rule);border-radius:8px;z-index:100}

/* ---- legal prose ----
   Reading column for the two legal pages (privacy policy + terms of
   use, PL and EN, Task 7). A centered, generously-spaced prose layout
   built from the same tokens as the rest of the site (--serif
   headings, --ink-2 body copy) so it reads as part of the same
   product rather than a bolted-on legal template.

   Selectors are scoped as `main.legal` (element+class), NOT a bare
   `.legal`, because `.foot .legal a{...}` above already uses the class
   name "legal" on the footer's Prawne/Legal column (`.fcol.legal`,
   see index.html/en/index.html). A bare `.legal{max-width:...;
   margin:0 auto;padding:...}` would leak into that unrelated footer
   div and break its layout. `main.legal` only ever matches the new
   `<main id="main" class="legal">` wrapper on the legal pages. */
main.legal{max-width:720px;margin:0 auto;padding:56px 42px 90px}
main.legal h1{font-family:var(--serif);font-weight:600;font-size:32px;line-height:1.15;letter-spacing:-.01em;color:var(--ink);margin:0 0 30px}
main.legal h2{font-family:var(--serif);font-weight:600;font-size:20px;line-height:1.3;color:var(--ink);margin:38px 0 12px}
main.legal h2:first-of-type{margin-top:0}
main.legal p{font-size:15px;color:var(--ink-2);margin:0 0 14px}
main.legal ul,main.legal ol{margin:0 0 14px;padding-left:22px;color:var(--ink-2);font-size:15px}
main.legal li{margin:0 0 8px;line-height:1.55}
main.legal li:last-child{margin-bottom:0}
main.legal a{color:var(--accent);text-decoration:underline}
main.legal a:hover{color:var(--accent-strong)}
main.legal strong{color:var(--ink);font-weight:600}

/* Placeholder marker for every [[...]] token the operator must fill
   in before publishing. Reuses the amber tokens already in :root
   (same tone as the RODO feature tile on the homepage) so it reads
   as "needs attention" without inventing a new color. */
main.legal .legal-fill{font-family:var(--mono);font-size:.92em;background:var(--c-amber-soft);color:var(--ink);padding:1px 5px;border-radius:4px}

/* Draft banner — one element, trivially removable, paired with an
   HTML comment carrying the same notice directly above it in each
   page. Text color is --ink, not --c-amber: measured contrast of
   --c-amber on --c-amber-soft is 4.53:1 in light mode (barely AA) but
   only 2.52:1 in dark mode (fails AA) because --c-amber itself is not
   redefined under :root[data-theme="dark"], only the -soft backdrop
   is. --ink on --c-amber-soft measures 14.99:1 (light) / 12.68:1
   (dark) — comfortably AA/AAA in both themes without a per-theme
   override. Borders have no contrast requirement, so --c-amber is
   fine there in both themes. */
.legal-draft{display:flex;align-items:flex-start;gap:10px;background:var(--c-amber-soft);border:1px solid var(--c-amber);border-radius:10px;padding:13px 16px;margin:0 0 32px;font-size:13.5px;font-weight:600;line-height:1.5;color:var(--ink)}

@media(max-width:860px){
  main.legal{padding:40px 22px 64px}
}

/* 404 page (landing/404.html) — served by Cloudflare Workers Static
   Assets when not_found_handling="404-page" (see landing/wrangler.toml).
   ONE file serves both locales (PL + EN not-found paths), so the hero
   carries a PL heading, an EN sub-line, and PL/EN "home" buttons.
   Scoped as main.notfound (element+class, same reasoning as main.legal
   above: never leak into a bare .notfound). Layout only — the paint
   comes from the shared .hero / .eyebrow / .btn primitives. min-height
   vertically centers the short page so the footer doesn't float up into
   the middle of a tall viewport; the EN sub-line is muted + smaller to
   read as a translation under the PL-primary copy. */
main.notfound{min-height:64vh;display:flex;align-items:center;justify-content:center}
main.notfound .hero{padding-top:24px;padding-bottom:24px}
main.notfound .hero p[lang="en"]{font-size:14.5px;color:var(--muted)}

/* ---- accessibility utility ----
   Visually-hidden-but-accessible text (Task 10 a11y fix). Both
   homepages' features section had no heading of its own: its <h3>
   tile headings directly followed the hero's <h1>, skipping the <h2>
   level in the document outline. Rather than add a VISIBLE
   "Funkcje"/"Features" heading (a design change outside this task's
   scope), index.html/en/index.html insert a <h2 class="sr-only"> as
   the section's first child so the outline reads h1 -> h2 -> h3
   without changing anything visible. Standard "visually hidden"
   recipe (WebAIM) — not display:none, which screen readers skip
   entirely. position:absolute also removes it from grid flow, so it
   does not consume one of .features' repeat(3,1fr) auto-placed cells.
   font-weight:inherit is NOT part of the standard recipe but is added
   here deliberately: verified via landing/verify/verify-final.mjs's
   request-count check that a bare <h2> with no other matching rule
   inherits the browser UA stylesheet's bold (700) default, which made
   Chromium fetch manrope-700-latin(-ext).woff2 — a font file nothing
   else on either homepage uses — purely to shape text no one can see.
   Every other heading in this file sets its own explicit font-weight
   (600); this line makes .sr-only do the same by falling back to
   whatever weight its parent already resolved to (400, already
   loaded), so applying this utility never triggers a new font
   request no matter which tag it is later put on. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;font-weight:inherit}