/*
 * Graxe type, spacing and access layer (website_index_021, 2026-10-17).
 *
 * Loaded LAST on every page, after the page's own styles, so it sets the
 * floor the whole site shares. Founder, 2026-10-17: "make the fonts legible to
 * the eye, remember our audience is older". The floor:
 *   reading text  19px Plus Jakarta Sans, line height 1.6, no italic
 *   small text    16px, never below
 *   labels        14px Josefin Sans 600, tracked capitals
 *   buttons       17px, 48px tall
 *   focus         a 3px gold ring on a dark halo, visible on noir and on bone
 * One spacing scale, below. Page styles should use it rather than new values.
 */
:root{
  --ff-read:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-display:"Josefin Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ff-mark:"Poiret One",sans-serif;
  --fs-label:14px; --fs-small:16px; --fs-body:19px; --fs-lede:clamp(21px,1.1vw + 16px,24px);
  --lh-body:1.6;
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px;
  --focus-ring:#E8C77A; --focus-halo:#0A0807;
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-family:var(--ff-read);font-size:var(--fs-body);line-height:var(--lh-body);
  font-weight:400;font-synthesis:none}
/* emphasis without italic: older eyes read slanted text slower */
em,cite,address,dfn,var{font-style:normal}
em{font-weight:600}
b,strong{font-weight:600}
input,select,textarea,button{font-family:var(--ff-read)}
input,select,textarea{font-size:max(1em,17px)}
::placeholder{opacity:1}

/* Focus: always visible, never painted over by the custom cursor */
:focus-visible{outline:3px solid var(--focus-ring) !important;outline-offset:3px !important;
  box-shadow:0 0 0 3px var(--focus-halo) !important;border-radius:2px}
.skip-link{font-family:var(--ff-read) !important;font-size:17px !important}
.skip-link:focus,.skip-link:focus-visible{z-index:100001}

/* WCAG 2.5.8 and the founder's 48px: buttons are easy to hit */
button,[type=submit],[type=button],.btn,.nav-cta{min-height:48px}

/* Motion: honour the setting everywhere, not page by page */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    animation-delay:0s !important;transition-duration:.001ms !important;transition-delay:0s !important;
    scroll-behavior:auto !important}
  html{scroll-behavior:auto !important}
}

/* Phone bar. At 14px the six links need two rows, and a fixed bar that tall
   would cover a fifth of a phone screen (and most of it at 200% zoom, WCAG
   1.4.10). On phones the bar sits at the top of the page and scrolls away;
   every page also carries the same links in its footer. */
/* Desktop bar: Josefin capitals are wider than Poiret's hairlines, so the
   links are 16px with less tracking, and the whole bar fits one row above 1340px; narrower, it wraps and scrolls with the page */
html body [data-sitebar] .nav-link,html body [data-sitebar] .nav-links a:not(.nav-cta),html body [data-sitebar] .nav-right a:not(.nav-cta),html body [data-sitebar] .links a{
  font-size:16px !important;letter-spacing:.14em !important}
html body [data-sitebar] .nav-cta{font-size:17px !important;letter-spacing:.14em !important}
@media (max-width:1340px){
  html body [data-sitebar]{position:relative !important;top:auto !important;transform:none !important;height:auto !important;
    min-height:0 !important;flex-wrap:wrap !important;row-gap:8px !important;padding-top:12px !important;padding-bottom:12px !important}
  html body [data-sitebar] .nav-links,html body [data-sitebar] .nav-right{flex-wrap:wrap !important;justify-content:flex-end !important;row-gap:4px !important}
}
@media (max-width:720px){
  html body [data-sitebar] .nav-link,html body [data-sitebar] .nav-links a:not(.nav-cta),html body [data-sitebar] .nav-right a:not(.nav-cta),html body [data-sitebar] .links a{
    font-size:14px !important;letter-spacing:.1em !important;padding:9px 3px !important;line-height:1.2 !important}
  html body [data-sitebar] .nav-cta{font-size:17px !important;letter-spacing:.1em !important;padding:0 14px !important;
    min-height:48px !important;display:inline-flex !important;align-items:center !important}
}
@media (max-width:720px){
  html body [data-sitebar] .links{display:flex !important;flex-wrap:wrap !important;justify-content:flex-end !important;gap:4px 12px !important}
}

/* Text for screen readers only (e.g. "opens in a new tab") */
.gx-sr{position:absolute !important;width:1px !important;height:1px !important;margin:-1px !important;padding:0 !important;
  overflow:hidden !important;clip:rect(0 0 0 0) !important;clip-path:inset(50%) !important;white-space:nowrap !important;border:0 !important}