/* ==========================================================================
   base.css: fonts, reset and basic element styles
   ----------------------------------------------------------------------------
   Loaded on every page, after tokens.css. Contains no layout or components:
   only things that apply to plain HTML elements.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Fonts (self-hosted WOFF2, SIL Open Font Licence; see assets/fonts/)
   Each family is a variable font: one file covers every weight.
   The browser only downloads a file when the page uses its characters.
   Upright only: nothing on the site is set in italics, so the italic files
   were removed (23 October 2026). If italics are ever needed, add them back
   from the same source rather than letting the browser slant the letters.
   -------------------------------------------------------------------------- */

/* Inter normal, latin-ext characters */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Inter normal, latin characters */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-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;
}

/* Playfair Display normal, latin-ext characters */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../fonts/playfair-display-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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Playfair Display normal, latin characters */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('../fonts/playfair-display-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;
}

/* --------------------------------------------------------------------------
   Reset
   Every element starts with no margin, no padding and no border, so all
   spacing comes from the classes in layout.css and components.css.
   -------------------------------------------------------------------------- */

* {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  -webkit-font-smoothing: antialiased;
}

p, li, ul, ol, pre, div, h1, h2, h3, h4, h5, h6, figure, blockquote, figcaption, address {
  margin: 0;
  padding: 0;
}

ul, ol {
  list-style: none;
}

address {
  font-style: normal;
}

a {
  color: inherit;
  text-decoration: inherit;
}

img {
  display: block;
}

button {
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  text-transform: none;
  color: inherit;
  background-color: transparent;
  -webkit-appearance: button;
}

button::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

details {
  display: block;
  margin: 0;
  padding: 0;
}

summary {
  list-style: none;
}

summary::-webkit-details-marker {
  display: none;
}

/* --------------------------------------------------------------------------
   Page defaults
   -------------------------------------------------------------------------- */

/* White everywhere, including the area outside the page (e.g. when the
   page bounces at the end of a scroll): the owner's choice of white
   backgrounds only. */
html {
  background-color: var(--color-surface);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.15;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-size: var(--text-base);
  font-weight: 400;
  font-style: normal;
  letter-spacing: normal;
  line-height: var(--leading-body);
  color: var(--color-ink);
  fill: var(--color-ink);
  background-color: var(--color-surface);
}

/* A link to a section (e.g. href="#courses") stops below the sticky header. */
[id] {
  scroll-margin-top: var(--header-height);
}

/* --------------------------------------------------------------------------
   Keyboard focus outline
   -------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 2px solid var(--color-focus-ring);
  outline-offset: 2px;
}

[tabindex="-1"]:focus-visible {
  outline: none;
}

/* --------------------------------------------------------------------------
   Skip link: hidden until a keyboard user tabs to it
   -------------------------------------------------------------------------- */

.skip-link {
  position: fixed;
  top: -100px;
  left: var(--space-2);
  z-index: 100000;
  padding: 10px var(--space-4);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
  font: 600 12px/1.2 system-ui, -apple-system, 'Segoe UI', sans-serif;
  color: var(--color-on-dark);
  background-color: var(--color-brand);
  text-decoration: none;
  transition: top 0.15s ease;
}

.skip-link:focus {
  top: 0;
}

/* --------------------------------------------------------------------------
   Text for screen readers only, e.g. "(opens in a new tab)"
   -------------------------------------------------------------------------- */

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}