/* Viager for All — shared styles: self-hosted fonts, site header and navigation.
   Each page keeps its own colour tokens (same values) and page-specific styles. */

/* Fonts (SIL Open Font License, see /assets/fonts/LICENSE.txt). Hosted here, so no request goes to Google. */
@font-face {
  font-family: 'Bricolage Grotesque'; font-style: normal; font-display: swap; font-weight: 200 800;
  src: url(/assets/fonts/bricolage-grotesque-latin-opsz-normal.woff2) format('woff2-variations'), url(/assets/fonts/bricolage-grotesque-latin-opsz-normal.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: 'Bricolage Grotesque'; font-style: normal; font-display: swap; font-weight: 200 800;
  src: url(/assets/fonts/bricolage-grotesque-latin-ext-opsz-normal.woff2) format('woff2-variations'), url(/assets/fonts/bricolage-grotesque-latin-ext-opsz-normal.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: 'Figtree'; font-style: normal; font-display: swap; font-weight: 300 900;
  src: url(/assets/fonts/figtree-latin-wght-normal.woff2) format('woff2-variations'), url(/assets/fonts/figtree-latin-wght-normal.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: 'Figtree'; font-style: normal; font-display: swap; font-weight: 300 900;
  src: url(/assets/fonts/figtree-latin-ext-wght-normal.woff2) format('woff2-variations'), url(/assets/fonts/figtree-latin-ext-wght-normal.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: 'IBM Plex Mono'; font-style: normal; font-display: swap; font-weight: 500;
  src: url(/assets/fonts/ibm-plex-mono-latin-500-normal.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: 'IBM Plex Mono'; font-style: normal; font-display: swap; font-weight: 500;
  src: url(/assets/fonts/ibm-plex-mono-latin-ext-500-normal.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;
}

/* Site header: brand, main navigation, language switch. On phones the navigation becomes a scrollable row. */
.site-top { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; padding-block: 24px 8px; }
.site-top .brand { display: flex; align-items: center; gap: 10px; font-family: 'Bricolage Grotesque', 'Segoe UI', system-ui, sans-serif; font-weight: 800; font-size: 20px; color: var(--ink); text-decoration: none; letter-spacing: -0.015em; flex-shrink: 0; }
.site-top .brand svg { flex-shrink: 0; }
.site-nav { display: flex; align-items: center; gap: 2px; margin-left: auto; min-width: 0; }
.site-nav a { color: var(--ink-2); font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap; padding: 8px 10px; border-radius: 8px; }
.site-nav a:hover { color: var(--ink); background: var(--accent-soft); }
.site-nav a[aria-current="page"] { color: var(--ink); background: var(--accent-soft); }
.site-nav a.nav-cta { color: var(--accent); }
.site-top .lang { flex-shrink: 0; }
/* Language switch made of links (pages rendered by the Worker, legal notice). Pages with buttons style their own. */
.lang { display: flex; border: 1px solid var(--line); border-radius: 999px; padding: 3px; background: var(--surface); }
.lang a { border-radius: 999px; padding: 7px 14px; min-height: 36px; display: inline-flex; align-items: center; font-weight: 600; font-size: 14px; color: var(--ink-2); text-decoration: none; }
.lang a[aria-current="true"] { background: var(--ink); color: var(--bg); }
@media (max-width: 900px) {
  .site-top { padding-block: 18px 4px; }
  .site-top .lang { margin-left: auto; }
  .site-nav { order: 3; flex: 1 0 100%; margin: 0 -16px; padding: 0 16px 4px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent); -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 28px), transparent); }
  .site-nav::-webkit-scrollbar { display: none; }
  .site-nav a { padding: 8px 12px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; }
  .site-nav a[aria-current="page"] { background: var(--ink); color: var(--bg); border-color: var(--ink); }
  .site-nav { gap: 6px; }
}

/* Shared footer links. */
.site-links { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14px; }
.site-links a { color: var(--accent); font-weight: 600; }

@media print {
  .site-nav, .site-top .lang { display: none !important; }
}
