/*
 * FER – Fédération Equestre Romande
 * Design system of ferfer.ch. Plain CSS, no build step.
 */

/* ------------------------------------------------------------------ fonts */

/* Fraunces and Inter (SIL Open Font License, see assets/fonts), served by the website itself: no call to Google */

@font-face {
    font-family: "Fraunces";
    font-style: normal;
    font-weight: 300 600;
    font-display: swap;
    src: url("../fonts/fraunces-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;
}
@font-face {
    font-family: "Fraunces";
    font-style: normal;
    font-weight: 300 600;
    font-display: swap;
    src: url("../fonts/fraunces-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: "Fraunces";
    font-style: italic;
    font-weight: 300 600;
    font-display: swap;
    src: url("../fonts/fraunces-italic-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;
}
@font-face {
    font-family: "Fraunces";
    font-style: italic;
    font-weight: 300 600;
    font-display: swap;
    src: url("../fonts/fraunces-italic-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: "Inter";
    font-style: normal;
    font-weight: 400 600;
    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;
}
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 600;
    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;
}

/* ------------------------------------------------------------------ tokens */

:root {
    --navy-950: #0d1233;
    --navy-900: #141a45;
    --navy-800: #1c2459;
    --navy-700: #263070;
    --navy-500: #4a56a6;
    --navy-200: #c9cde8;
    --navy-100: #e9ebf6;
    --navy-50: #f4f5fb;

    --brass-700: #8a6a3b;
    --brass-600: #a07c46;
    --brass-500: #b8925a;
    --brass-200: #e7d7bd;
    --brass-100: #f4ecdf;

    --paper: #fbfaf7;
    --white: #ffffff;
    --ink: #1a1d2b;
    --ink-soft: #3d4256;
    --muted: #666b80;
    --line: #e6e2d9;
    --line-strong: #d3cdbf;
    --danger: #a3303a;
    --success: #2f6b4f;

    --font-serif: "Fraunces", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;
    --font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    --radius-sm: 6px;
    --radius: 12px;
    --radius-lg: 20px;
    --shadow-sm: 0 1px 2px rgba(20, 26, 69, .06), 0 1px 1px rgba(20, 26, 69, .04);
    --shadow: 0 10px 30px -12px rgba(20, 26, 69, .18), 0 2px 6px rgba(20, 26, 69, .05);
    --shadow-lg: 0 30px 60px -20px rgba(13, 18, 51, .35);

    --container: 1200px;
    --gutter: clamp(16px, 4vw, 32px);
    --header-h: 76px;
    --ease: cubic-bezier(.2, .7, .2, 1);
}

/* -------------------------------------------------------------------- base */

*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
    scroll-padding-top: calc(var(--header-h) + 16px);
}

body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--font-sans);
    font-size: 1.0625rem;
    line-height: 1.65;
    font-feature-settings: "ss01", "cv11";
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img, svg, video, iframe { display: block; max-width: 100%; }
/* cropped photos keep their upper part (riders' heads), the focal point of the media overrides it */
img { object-position: 50% 25%; }
img { height: auto; }

a { color: var(--navy-700); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--brass-700); }

:focus-visible { outline: 3px solid var(--brass-500); outline-offset: 2px; border-radius: 4px; }

h1, h2, h3, h4 {
    font-family: var(--font-serif);
    font-weight: 500;
    line-height: 1.15;
    letter-spacing: -.01em;
    color: var(--navy-900);
    margin: 0 0 .5em;
    font-variation-settings: "opsz" 72;
    text-wrap: balance;
}

h1 { font-size: clamp(2.1rem, 1.4rem + 3vw, 3.6rem); }
h2 { font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.3rem); }
h3 { font-size: clamp(1.25rem, 1.1rem + .6vw, 1.55rem); }
h4 { font-size: 1.15rem; }

p { margin: 0 0 1em; }

.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;
}

.skip-link {
    position: absolute; left: 16px; top: -100px; z-index: 100;
    background: var(--navy-900); color: var(--white); padding: 10px 16px; border-radius: var(--radius-sm);
}
.skip-link:focus { top: 12px; color: var(--white); }

.container { width: 100%; max-width: calc(var(--container) + 2 * var(--gutter)); margin: 0 auto; padding: 0 var(--gutter); }
.container--narrow { max-width: calc(820px + 2 * var(--gutter)); }

.icon { width: 1.1em; height: 1.1em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.icon--fill { fill: currentColor; stroke: none; }

.eyebrow {
    display: inline-flex; align-items: center; gap: .6em;
    font-family: var(--font-sans); font-size: .75rem; font-weight: 600;
    letter-spacing: .16em; text-transform: uppercase; color: var(--brass-600);
}
.eyebrow::before { content: ""; width: 28px; height: 1px; background: currentColor; }

/* ----------------------------------------------------------------- buttons */

.btn {
    display: inline-flex; align-items: center; gap: .55em;
    padding: .8em 1.35em; border-radius: 999px; border: 1px solid transparent;
    font: 600 .95rem/1.1 var(--font-sans); text-decoration: none; cursor: pointer;
    transition: background-color .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .2s var(--ease);
}
.btn:hover { transform: translateY(-1px); }
.btn .icon { width: 1em; height: 1em; }
.btn--primary { background: var(--brass-500); color: var(--navy-950); }
.btn--primary:hover { background: var(--brass-200); color: var(--navy-950); }
.btn--navy { background: var(--navy-700); color: var(--white); }
.btn--navy:hover { background: var(--navy-900); color: var(--white); }
.btn--ghost { border-color: rgba(255, 255, 255, .5); color: var(--white); }
.btn--ghost:hover { background: rgba(255, 255, 255, .12); color: var(--white); border-color: var(--white); }
.btn--outline { border-color: var(--line-strong); color: var(--navy-800); background: var(--white); }
.btn--outline:hover { border-color: var(--navy-700); color: var(--navy-900); }

.link-arrow {
    display: inline-flex; align-items: center; gap: .4em;
    font-weight: 600; font-size: .95rem; text-decoration: none; color: var(--navy-700);
}
.link-arrow .icon { transition: transform .2s var(--ease); }
.link-arrow:hover .icon { transform: translateX(4px); }

/* ------------------------------------------------------------------ topbar */

.topbar { background: var(--navy-950); color: var(--navy-200); font-size: .8rem; }
.topbar .container { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 38px; }
.topbar a { color: var(--navy-100); text-decoration: none; }
.topbar a:hover { color: var(--brass-200); }
.topbar__links { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; align-items: center; }
.topbar__links .icon { width: 15px; height: 15px; }
.topbar__tagline { letter-spacing: .04em; }

@media (max-width: 720px) {
    .topbar__tagline { display: none; }
    .topbar .container { justify-content: center; }
}

/* ------------------------------------------------------------------ header */

.site-header {
    position: sticky; top: 0; z-index: 50;
    background: rgba(251, 250, 247, .92);
    backdrop-filter: saturate(1.4) blur(12px);
    -webkit-backdrop-filter: saturate(1.4) blur(12px);
    border-bottom: 1px solid transparent;
    transition: border-color .2s, box-shadow .2s;
}
.site-header.is-scrolled { border-bottom-color: var(--line); box-shadow: var(--shadow-sm); }
.site-header .container { display: flex; align-items: center; gap: 24px; min-height: var(--header-h); }

.brand { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--navy-900); margin-right: auto; }
.brand img { height: 48px; width: auto; }
.brand__name { font-family: var(--font-serif); font-size: 1.05rem; line-height: 1.1; font-weight: 500; }
.brand:hover { color: var(--navy-900); }

.main-nav > ul { display: flex; list-style: none; margin: 0; padding: 0; gap: 4px; }
.main-nav li { position: relative; }
.main-nav a, .main-nav button.nav-toggle-sub {
    display: flex; align-items: center; gap: 6px;
    padding: 10px 14px; border-radius: 999px;
    font: 500 .95rem/1.2 var(--font-sans); color: var(--ink-soft); text-decoration: none;
    background: none; border: 0; cursor: pointer;
}
.main-nav > ul > li > a:hover, .main-nav > ul > li:hover > a, .main-nav > ul > li.is-active > a { color: var(--navy-900); background: var(--navy-50); }
.main-nav > ul > li.is-active > a { box-shadow: inset 0 -2px 0 var(--brass-500); border-radius: 999px 999px 4px 4px; }
.main-nav .chevron { width: 14px; height: 14px; transition: transform .2s; }

.subnav-panel {
    position: absolute; top: calc(100% + 8px); left: 50%; transform: translate(-50%, 6px);
    min-width: 280px; padding: 10px; list-style: none; margin: 0;
    background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
    opacity: 0; visibility: hidden; transition: opacity .18s var(--ease), transform .18s var(--ease), visibility .18s;
}
.subnav-panel::before { content: ""; position: absolute; inset: -12px 0 auto; height: 12px; }
.main-nav li:hover > .subnav-panel, .main-nav li:focus-within > .subnav-panel, .main-nav li.is-open > .subnav-panel {
    opacity: 1; visibility: visible; transform: translate(-50%, 0);
}
.subnav-panel a { border-radius: var(--radius-sm); padding: 9px 12px; font-size: .92rem; color: var(--ink-soft); }
.subnav-panel a:hover { background: var(--navy-50); color: var(--navy-900); }
.subnav-panel ul { list-style: none; margin: 0 0 4px 12px; padding: 0 0 0 10px; border-left: 1px solid var(--line); }
.subnav-panel ul a { font-size: .86rem; padding: 6px 10px; color: var(--muted); }
.subnav-panel--wide { min-width: 520px; display: grid; grid-template-columns: 1fr 1fr; gap: 0 8px; }

.header-actions { display: flex; align-items: center; gap: 6px; }
.icon-btn {
    display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 999px;
    border: 1px solid var(--line); background: var(--white); color: var(--navy-800); cursor: pointer;
}
.icon-btn:hover { border-color: var(--navy-200); color: var(--navy-900); }
.icon-btn .icon { width: 20px; height: 20px; }
.burger { display: none; }

.search-panel { border-top: 1px solid var(--line); background: var(--white); }
.search-panel[hidden] { display: none; }
.search-panel form { display: flex; gap: 10px; padding: 18px 0; }
.search-panel input {
    flex: 1; min-width: 0; font: inherit; font-size: 1.1rem; padding: 12px 18px;
    border: 1px solid var(--line-strong); border-radius: 999px; background: var(--paper);
}

@media (max-width: 1080px) {
    .burger { display: inline-grid; }
    /* a backdrop filter would make the header the containing block of the fixed menu */
    .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--paper); }
    .main-nav {
        position: fixed; top: var(--nav-top, calc(var(--header-h) + 38px)); right: 0; bottom: 0; left: 0; z-index: 40;
        background: var(--paper); overflow-y: auto; padding: 12px var(--gutter) 40px;
        transform: translateX(100%); transition: transform .3s var(--ease), visibility .3s; visibility: hidden;
    }
    body.nav-open { overflow: hidden; }
    body.nav-open .main-nav { transform: none; visibility: visible; }
    .main-nav > ul { flex-direction: column; gap: 0; }
    .main-nav > ul > li { border-bottom: 1px solid var(--line); }
    .main-nav > ul > li > a { padding: 16px 4px; font-family: var(--font-serif); font-size: 1.35rem; color: var(--navy-900); border-radius: 0; }
    .main-nav > ul > li > a:hover, .main-nav > ul > li.is-active > a { background: none; box-shadow: none; }
    .main-nav .has-children > a { padding-right: 56px; }
    .nav-expand {
        position: absolute; right: 0; top: 8px; width: 44px; height: 44px; display: grid; place-items: center;
        border: 0; background: none; color: var(--navy-700); cursor: pointer;
    }
    .main-nav li.is-open > .nav-expand .chevron { transform: rotate(180deg); }
    .subnav-panel, .subnav-panel--wide {
        position: static; transform: none; opacity: 1; visibility: visible; min-width: 0; display: none;
        box-shadow: none; border: 0; padding: 0 0 14px; background: none;
    }
    .main-nav li:hover > .subnav-panel, .main-nav li:focus-within > .subnav-panel { transform: none; }
    .main-nav li.is-open > .subnav-panel { display: block; transform: none; }
    .main-nav .chevron--desktop { display: none; }
}
@media (min-width: 1081px) {
    .nav-expand { display: none; }
}
@media (max-width: 520px) {
    .brand__name { display: none; }
    .brand img { height: 42px; }
}

/* -------------------------------------------------------------- home hero */

.hero {
    position: relative; isolation: isolate; color: var(--white);
    min-height: min(78vh, 760px); display: flex; align-items: flex-end;
    background: var(--navy-900);
    overflow: hidden;
}
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background:
        linear-gradient(90deg, rgba(13, 18, 51, .88) 0%, rgba(13, 18, 51, .55) 45%, rgba(13, 18, 51, .1) 100%),
        linear-gradient(0deg, rgba(13, 18, 51, .7) 0%, rgba(13, 18, 51, 0) 50%);
}
.hero .container { padding-top: 120px; padding-bottom: clamp(48px, 8vw, 96px); }
.hero__content { max-width: 680px; }
.hero h1 { color: var(--white); font-weight: 400; margin-bottom: .35em; }
.hero h1 em { font-style: italic; color: var(--brass-200); }
.hero .eyebrow { color: var(--brass-200); }
.hero__lead { font-size: clamp(1.05rem, 1rem + .3vw, 1.25rem); color: rgba(255, 255, 255, .85); max-width: 560px; margin-bottom: 1.8em; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------------------------------------------------------- inner hero */

.page-hero {
    position: relative; isolation: isolate; overflow: hidden;
    background: var(--navy-900); color: var(--navy-100);
    padding: clamp(40px, 6vw, 72px) 0 clamp(36px, 5vw, 56px);
}
.page-hero::after {
    content: ""; position: absolute; right: -120px; top: -160px; width: 520px; height: 520px; z-index: -1;
    border: 1px solid rgba(184, 146, 90, .25); border-radius: 50%;
    box-shadow: 0 0 0 60px rgba(184, 146, 90, .05), 0 0 0 140px rgba(184, 146, 90, .03);
}
.page-hero--image { padding-top: clamp(80px, 12vw, 160px); }
.page-hero__media { position: absolute; inset: 0; z-index: -2; }
.page-hero__media img { width: 100%; height: 100%; object-fit: cover; }
.page-hero--image::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13, 18, 51, .92) 10%, rgba(13, 18, 51, .35) 100%); }
.page-hero h1 { color: var(--white); margin: .3em 0 .2em; font-weight: 400; max-width: 900px; }
.page-hero__subtitle { font-size: 1.15rem; color: var(--navy-200); max-width: 720px; margin: 0; }
.page-hero__meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 18px; font-size: .9rem; color: var(--navy-200); }
.page-hero__meta span { display: inline-flex; align-items: center; gap: 8px; }

.breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 0; padding: 0; font-size: .82rem; }
.breadcrumb li { display: inline-flex; align-items: center; gap: 6px; color: var(--navy-200); }
.breadcrumb li + li::before { content: "/"; opacity: .5; }
.breadcrumb a { color: var(--navy-100); text-decoration: none; }
.breadcrumb a:hover { color: var(--brass-200); }

/* ------------------------------------------------------------- sections */

.section { padding: clamp(56px, 8vw, 104px) 0; }
.section--tight { padding: clamp(36px, 5vw, 64px) 0; }
.section--white { background: var(--white); }
.section--navy { background: var(--navy-900); color: var(--navy-100); }
.section--navy h2, .section--navy h3 { color: var(--white); }
.section--brass { background: var(--brass-100); }

.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: clamp(28px, 4vw, 44px); flex-wrap: wrap; }
.section-head h2 { margin: .25em 0 0; }
.section-head p { margin: .5em 0 0; color: var(--muted); max-width: 620px; }

/* --------------------------------------------------------- page layout */

.page-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 48px; padding: clamp(40px, 6vw, 72px) 0 clamp(56px, 8vw, 96px); }
.page-layout--sidebar { grid-template-columns: 260px minmax(0, 1fr); }
.page-layout__main { min-width: 0; max-width: 860px; }
.page-layout--wide .page-layout__main { max-width: none; }

.sidenav { position: sticky; top: calc(var(--header-h) + 24px); align-self: start; font-size: .93rem; }
.sidenav__title { font-family: var(--font-serif); font-size: 1.15rem; margin: 0 0 12px; }
.sidenav__title a { color: var(--navy-900); text-decoration: none; }
.sidenav ul { list-style: none; margin: 0; padding: 0; }
.sidenav li a { display: block; padding: 7px 12px; border-left: 2px solid var(--line); color: var(--ink-soft); text-decoration: none; }
.sidenav li a:hover { color: var(--navy-900); border-left-color: var(--navy-200); }
.sidenav li.is-active > a { color: var(--navy-900); font-weight: 600; border-left-color: var(--brass-500); background: linear-gradient(90deg, var(--brass-100), transparent); }
.sidenav ul ul a { padding-left: 26px; font-size: .86rem; }
.sidenav details summary { list-style: none; }

@media (max-width: 960px) {
    .page-layout--sidebar { grid-template-columns: minmax(0, 1fr); gap: 28px; }
    .sidenav { position: static; order: 2; border-top: 1px solid var(--line); padding-top: 18px; }
}

/* the navigation of the section: collapsed below the content on phones and tablets */
.sidenav__toggle { display: none; }
@media (max-width: 960px) {
    .sidenav__toggle {
        display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none;
        font-family: var(--font-serif); font-size: 1.1rem; color: var(--navy-900); padding: 4px 0;
    }
    .sidenav__toggle::-webkit-details-marker { display: none; }
    .sidenav__toggle::after { content: "+"; font-family: var(--font-sans); font-size: 1.3rem; color: var(--muted); }
    .sidenav details[open] .sidenav__toggle::after { content: "–"; }
    .sidenav details[open] .sidenav__title { display: none; }
    .sidenav details > ul { margin-top: 8px; }
}

/* ---------------------------------------------------------------- prose */

.prose { color: var(--ink-soft); }
.prose > :first-child { margin-top: 0; }
.prose h2, .prose h3, .prose h4 { margin-top: 1.6em; }
.prose h3 { font-size: 1.4rem; }
.prose a { color: var(--navy-700); text-decoration: underline; text-decoration-color: var(--brass-500); }
.prose a:hover { color: var(--brass-700); }
.prose strong { color: var(--ink); font-weight: 600; }
.prose ul, .prose ol { padding-left: 1.3em; margin: 0 0 1.2em; }
.prose li { margin: .3em 0; }
.prose li::marker { color: var(--brass-500); }
.prose img { border-radius: var(--radius-sm); margin: 1em 0; }
.prose blockquote { margin: 1.5em 0; padding: .2em 0 .2em 1.2em; border-left: 3px solid var(--brass-500); font-family: var(--font-serif); font-size: 1.2rem; color: var(--navy-800); }
.prose hr { border: 0; height: 1px; background: var(--line); margin: 2em 0; }
.prose table { width: 100%; border-collapse: collapse; margin: 1.2em 0 1.8em; font-size: .92rem; background: var(--white); border-radius: var(--radius-sm); overflow: hidden; box-shadow: 0 0 0 1px var(--line); }
.prose th, .prose td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.prose th { background: var(--navy-50); color: var(--navy-900); font-weight: 600; }
.prose tr:last-child td { border-bottom: 0; }
.prose iframe { width: 100%; border: 0; border-radius: var(--radius); margin: 1em 0; }
/* the tables saved by the text editor are in a <figure class="table"> */
.prose figure.table { margin: 0; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.lead { font-size: clamp(1.1rem, 1rem + .4vw, 1.3rem); color: var(--ink); font-weight: 450; line-height: 1.55; }

.block { margin: 0 0 clamp(28px, 4vw, 44px); }
.block-heading { margin: clamp(36px, 5vw, 56px) 0 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.block-heading:first-child { margin-top: 0; }
.block-heading h2 { margin: 0; font-size: clamp(1.4rem, 1.2rem + .8vw, 1.9rem); }
.block-heading p { margin: 6px 0 0; color: var(--muted); }

/* ---------------------------------------------------------------- cards */

.grid { display: grid; gap: clamp(18px, 2.5vw, 28px); }
.grid--2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }

.card {
    position: relative; display: flex; flex-direction: column;
    background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
    transition: transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s;
}
.card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.card__media { aspect-ratio: 3 / 2; background: var(--navy-100); overflow: hidden; }
.card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.card:hover .card__media img { transform: scale(1.04); }
.card__body { display: flex; flex-direction: column; gap: 10px; padding: 20px 22px 22px; flex: 1; }
.card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; font-size: .8rem; color: var(--muted); }
.card__title { font-size: 1.2rem; margin: 0; line-height: 1.25; }
.card__title a { color: var(--navy-900); text-decoration: none; }
.card__title a::after { content: ""; position: absolute; inset: 0; }
.card__text { margin: 0; color: var(--muted); font-size: .95rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card__more { margin-top: auto; padding-top: 6px; }

.tag {
    display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px;
    background: var(--brass-100); color: var(--brass-700); font-size: .72rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
}
.tag--navy { background: var(--navy-100); color: var(--navy-700); }
.tag--danger { background: #f7e3e5; color: var(--danger); }
.tag--success { background: #e1efe8; color: var(--success); }

/* featured news (home) */
.news-feature { display: grid; grid-template-columns: 1.25fr 1fr; gap: clamp(18px, 2.5vw, 28px); }
.news-feature .card--featured .card__media { aspect-ratio: 16 / 10; }
.news-feature .card--featured .card__title { font-size: clamp(1.4rem, 1.2rem + .8vw, 1.9rem); }
.news-feature__list { display: grid; gap: 14px; align-content: start; }
.news-row {
    position: relative; display: grid; grid-template-columns: 116px 1fr; gap: 16px; align-items: center;
    padding: 12px; border-radius: var(--radius); background: var(--white); border: 1px solid var(--line);
    transition: box-shadow .25s var(--ease), border-color .25s;
}
.news-row:hover { box-shadow: var(--shadow); border-color: var(--line-strong); }
.news-row__media { aspect-ratio: 4 / 3; border-radius: var(--radius-sm); overflow: hidden; background: var(--navy-100); }
.news-row__media img { width: 100%; height: 100%; object-fit: cover; }
.news-row h3 { font-size: 1.02rem; margin: 4px 0 0; line-height: 1.3; }
.news-row h3 a { color: var(--navy-900); text-decoration: none; }
.news-row h3 a::after { content: ""; position: absolute; inset: 0; }

@media (max-width: 880px) {
    .news-feature { grid-template-columns: 1fr; }
}

/* discipline tiles: compact, all the disciplines are visible at a glance (2 rows on desktop, ~4 on phones) */
.tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.tile {
    position: relative; isolation: isolate; display: flex; align-items: flex-end; aspect-ratio: 4 / 3;
    border-radius: var(--radius); overflow: hidden; text-decoration: none; color: var(--white);
    background: linear-gradient(160deg, var(--navy-700), var(--navy-950));
}
.tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform .7s var(--ease); }
.tile::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13, 18, 51, .85) 0%, rgba(13, 18, 51, .15) 65%); transition: background .3s; }
.tile:hover img { transform: scale(1.06); }
.tile:hover { color: var(--white); }
.tile__label { display: flex; align-items: center; justify-content: space-between; gap: 6px; width: 100%; padding: 12px 14px; font-family: var(--font-serif); font-size: 1.1rem; line-height: 1.15; }
.tile__label .icon { width: 18px; height: 18px; flex: none; opacity: .7; transition: transform .2s; }
.tile:hover .tile__label .icon { transform: translateX(4px); opacity: 1; }

@media (max-width: 900px) {
    .tiles { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .tile { aspect-ratio: 1; border-radius: var(--radius-sm); }
    .tile__label { padding: 8px; font-size: .85rem; }
    .tile__label .icon { display: none; }
}

/* ---------------------------------------------------------------- events */

.event-list { display: grid; gap: 10px; list-style: none; margin: 0; padding: 0; }
.event {
    display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 18px; align-items: center;
    padding: 14px 18px 14px 14px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
}
.event.is-cancelled { opacity: .65; }
.event.is-cancelled .event__title { text-decoration: line-through; }
.date-badge {
    display: grid; place-items: center; align-content: center; text-align: center; aspect-ratio: 1;
    border-radius: var(--radius-sm); background: var(--navy-50); color: var(--navy-900); line-height: 1;
}
.date-badge__day { font-family: var(--font-serif); font-size: 1.7rem; }
.date-badge__month { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; margin-top: 4px; color: var(--muted); }
.event__title { font-weight: 600; color: var(--navy-900); margin: 0; font-size: 1.02rem; }
.event__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .84rem; color: var(--muted); margin-top: 3px; }
.event__meta span { display: inline-flex; align-items: center; gap: 5px; }
.event__meta .icon { width: 14px; height: 14px; }
.event__actions { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.event__actions a {
    display: inline-flex; align-items: center; gap: 5px; padding: 6px 12px; border-radius: 999px;
    border: 1px solid var(--line); font-size: .8rem; font-weight: 500; text-decoration: none; color: var(--navy-800); white-space: nowrap;
}
.event__actions a:hover { border-color: var(--navy-700); background: var(--navy-50); }
.event__actions .icon { width: 14px; height: 14px; }
.event details { grid-column: 2 / -1; font-size: .86rem; color: var(--muted); }
.event details summary { cursor: pointer; color: var(--navy-700); font-weight: 500; width: max-content; }

@media (max-width: 720px) {
    .event { grid-template-columns: 60px minmax(0, 1fr); gap: 14px; }
    .event__actions { grid-column: 1 / -1; justify-content: flex-start; }
    .event details { grid-column: 1 / -1; }
    .date-badge__day { font-size: 1.4rem; }
}

.month-heading { display: flex; align-items: center; gap: 14px; margin: 34px 0 14px; font-family: var(--font-serif); font-size: 1.35rem; color: var(--navy-900); text-transform: capitalize; }
.month-heading::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.month-heading:first-child { margin-top: 0; }

/* compact events (home side card) */
.events-card { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 26px; box-shadow: var(--shadow); }
.events-card h3 { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.mini-events { list-style: none; margin: 0 0 18px; padding: 0; }
.mini-events li { display: grid; grid-template-columns: 54px 1fr; gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); }
.mini-events li:last-child { border-bottom: 0; }
.mini-events .date-badge__day { font-size: 1.3rem; }
.mini-events strong { display: block; color: var(--navy-900); font-size: .95rem; line-height: 1.3; }
.mini-events span { font-size: .8rem; color: var(--muted); }

/* filters */
.filters { display: grid; gap: 14px; margin-bottom: 28px; padding: 18px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.filters__row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.filters__label { font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-right: 6px; min-width: 84px; }
.chip {
    padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--white);
    font: 500 .85rem/1.2 var(--font-sans); color: var(--ink-soft); cursor: pointer;
}
.chip:hover { border-color: var(--navy-500); }
.chip[aria-pressed="true"] { background: var(--navy-700); border-color: var(--navy-700); color: var(--white); }
.filters input[type="search"] {
    flex: 1; min-width: 200px; font: inherit; font-size: .95rem; padding: 9px 16px;
    border: 1px solid var(--line-strong); border-radius: 999px; background: var(--paper);
}
.empty-state { padding: 40px; text-align: center; color: var(--muted); background: var(--white); border: 1px dashed var(--line-strong); border-radius: var(--radius); }

.year-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 28px; }
.year-tabs a { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line-strong); text-decoration: none; color: var(--ink-soft); font-size: .9rem; background: var(--white); }
.year-tabs a:hover { border-color: var(--navy-500); }
.year-tabs a[aria-current="page"] { background: var(--navy-700); color: var(--white); border-color: var(--navy-700); }

/* -------------------------------------------------------------- persons */

.people { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 18px; }
.person { display: flex; flex-direction: column; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.person__photo { aspect-ratio: 1; background: var(--navy-50); }
.person__photo img { width: 100%; height: 100%; object-fit: cover; }
.person__photo--empty { display: grid; place-items: center; color: var(--navy-200); }
.person__photo--empty .icon { width: 64px; height: 64px; stroke-width: 1.2; }
.person__body { padding: 18px 20px 20px; }
.person__role { font-size: .74rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--brass-600); margin: 0 0 6px; }
.person__name { font-size: 1.25rem; margin: 0 0 10px; }
.person__details { font-size: .9rem; color: var(--muted); line-height: 1.55; }
.person__details p { margin: 0 0 .5em; }

/* ------------------------------------------------------------ files, links */

.file-list, .link-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.file-list a, .link-list a {
    display: grid; grid-template-columns: 40px 1fr auto; gap: 14px; align-items: center;
    padding: 12px 16px 12px 12px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
    text-decoration: none; color: var(--navy-900); transition: border-color .2s, box-shadow .2s;
}
.file-list a:hover, .link-list a:hover { border-color: var(--navy-200); box-shadow: var(--shadow-sm); color: var(--navy-900); }
.file-icon {
    display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--radius-sm);
    background: var(--navy-50); color: var(--navy-700); font-size: .62rem; font-weight: 700; letter-spacing: .04em;
}
.file-icon--pdf { background: #f8e6e4; color: #a3303a; }
.file-icon--doc { background: #e5ecf8; color: #2b579a; }
.file-icon--xls { background: #e3f1e8; color: #217346; }
.file-list__name { font-weight: 500; line-height: 1.35; }
.file-list__meta { font-size: .78rem; color: var(--muted); white-space: nowrap; }

/* ------------------------------------------------------------ media blocks */

.media-text { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: clamp(20px, 3vw, 36px); align-items: start; }
.media-text--right { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.media-text--right .media-text__media { order: 2; }
.media-text__media img { border-radius: var(--radius); width: 100%; }
.media-text__media figcaption { font-size: .8rem; color: var(--muted); margin-top: 8px; }
.media-text--image-only { grid-template-columns: 1fr; }
@media (max-width: 720px) {
    .media-text, .media-text--right { grid-template-columns: 1fr; }
    .media-text--right .media-text__media { order: 0; }
}

.gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(46%, 180px), 1fr)); gap: 10px; }
.gallery a { display: block; aspect-ratio: 1; border-radius: var(--radius-sm); overflow: hidden; background: var(--navy-50); }
.gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease), opacity .3s; }
.gallery a:hover img { transform: scale(1.05); }

.lightbox { width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: rgba(8, 10, 28, .94); color: var(--white); }
.lightbox::backdrop { background: rgba(8, 10, 28, .94); }
.lightbox__figure { position: absolute; inset: 56px 64px 72px; display: grid; place-items: center; margin: 0; }
.lightbox__figure img { max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 4px; }
.lightbox__caption { position: absolute; left: 0; right: 0; bottom: 20px; text-align: center; font-size: .9rem; color: var(--navy-200); padding: 0 24px; }
.lightbox button { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .25); background: rgba(255, 255, 255, .06); color: var(--white); cursor: pointer; }
.lightbox button:hover { background: rgba(255, 255, 255, .16); }
.lightbox__close { top: 14px; right: 14px; }
.lightbox__prev { left: 10px; top: 50%; transform: translateY(-50%); }
.lightbox__next { right: 10px; top: 50%; transform: translateY(-50%); }
@media (max-width: 720px) { .lightbox__figure { inset: 64px 8px 80px; } .lightbox__prev, .lightbox__next { top: auto; bottom: 14px; transform: none; } }

.video { position: relative; aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: var(--navy-950); }
.video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.callout { padding: 24px 28px; border-radius: var(--radius); background: var(--brass-100); border: 1px solid var(--brass-200); }
.callout h3 { font-size: 1.25rem; margin-bottom: .4em; }
.callout .prose { color: var(--ink); }

.quote { margin: 0; padding: 30px 34px; border-radius: var(--radius); background: var(--navy-900); color: var(--white); }
.quote p { font-family: var(--font-serif); font-size: clamp(1.25rem, 1.1rem + .6vw, 1.6rem); line-height: 1.4; margin: 0; }
.quote footer { margin-top: 14px; color: var(--brass-200); font-size: .9rem; }

.divider { border: 0; height: 1px; background: var(--line); margin: clamp(32px, 5vw, 56px) 0; }
.divider--space { background: none; }

/* ---------------------------------------------------------- logos strip */

.logos { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: clamp(16px, 3vw, 40px); }
.logos a { display: grid; place-items: center; height: 72px; padding: 8px; border-radius: var(--radius-sm); filter: grayscale(1); opacity: .75; transition: filter .3s, opacity .3s; }
.logos a:hover { filter: none; opacity: 1; }
.logos img { max-height: 56px; max-width: 140px; width: auto; object-fit: contain; }
.logos--members a { height: 80px; }
.logos--members img { max-height: 64px; max-width: 110px; }
@media (max-width: 640px) {
    .logos { gap: 6px 14px; }
    .logos a, .logos--members a { height: 46px; padding: 4px; }
    .logos img, .logos--members img { max-height: 38px; max-width: 64px; }
}

/* ------------------------------------------------------------ intro (home) */

.intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 80px); align-items: start; }
.intro h2 { font-size: clamp(1.8rem, 1.3rem + 2vw, 2.8rem); font-weight: 400; }
.intro h2 em { color: var(--brass-600); }
@media (max-width: 960px) { .intro { grid-template-columns: 1fr; } }

.stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-top: 28px; }
.stats div { background: var(--white); padding: 18px; }
.stats strong { display: block; font-family: var(--font-serif); font-size: 2rem; font-weight: 400; color: var(--navy-900); line-height: 1; }
.stats span { font-size: .8rem; color: var(--muted); }

/* --------------------------------------------------------------- CTA band */

.cta-band { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: clamp(28px, 4vw, 44px); border-radius: var(--radius-lg); background: linear-gradient(120deg, var(--navy-800), var(--navy-950)); color: var(--navy-100); position: relative; overflow: hidden; }
.cta-band::after { content: ""; position: absolute; right: -80px; bottom: -140px; width: 320px; height: 320px; border-radius: 50%; border: 1px solid rgba(184, 146, 90, .35); pointer-events: none; }
.cta-band h2 { color: var(--white); margin: 0 0 .3em; font-size: clamp(1.4rem, 1.2rem + 1vw, 2rem); }
.cta-band p { margin: 0; }
@media (max-width: 720px) { .cta-band { grid-template-columns: 1fr; } }

/* -------------------------------------------------------------- pagination */

.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 40px; list-style: none; padding: 0; }
.pagination a, .pagination span {
    display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 12px; border-radius: 999px;
    border: 1px solid var(--line-strong); background: var(--white); text-decoration: none; color: var(--ink-soft); font-size: .92rem;
}
.pagination a:hover { border-color: var(--navy-500); }
.pagination [aria-current="page"] { background: var(--navy-700); border-color: var(--navy-700); color: var(--white); }

/* ------------------------------------------------------------------ forms */

.form-grid form, form.form-grid, form.sulu-form { display: grid; grid-template-columns: repeat(12, 1fr); gap: 16px; }
.form-grid .form-row { grid-column: span 12; }
.form-grid label { display: block; font-size: .85rem; font-weight: 600; color: var(--navy-900); margin-bottom: 6px; }
.form-grid input:not([type="checkbox"]):not([type="radio"]), .form-grid select, .form-grid textarea {
    width: 100%; font: inherit; font-size: 1rem; padding: 11px 14px; border-radius: var(--radius-sm);
    border: 1px solid var(--line-strong); background: var(--white); color: var(--ink);
}
.form-grid textarea { min-height: 160px; }
.form-grid input:focus, .form-grid select:focus, .form-grid textarea:focus { outline: none; border-color: var(--navy-500); box-shadow: 0 0 0 3px var(--navy-100); }
.form-grid button { justify-self: start; }
.form-grid ul { color: var(--danger); font-size: .85rem; padding-left: 1em; }
.form-honeypot { position: absolute; left: -9999px; }

/* ---------------------------------------------------------------- search */

.search-hits { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.search-hits li { padding: 18px 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.search-hits h3 { font-size: 1.15rem; margin: 6px 0; }
.search-hits h3 a { text-decoration: none; color: var(--navy-900); }
.search-hits p { margin: 0; font-size: .92rem; color: var(--muted); }

/* ---------------------------------------------------------------- footer */

.site-footer { background: var(--navy-950); color: var(--navy-200); font-size: .93rem; }
.site-footer a { color: var(--navy-100); text-decoration: none; }
.site-footer a:hover { color: var(--brass-200); }
.footer-sponsors { background: var(--white); border-top: 1px solid var(--line); padding: 40px 0; }
.footer-sponsors h2 { text-align: center; font-family: var(--font-sans); font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); margin: 0 0 22px; font-weight: 600; }
.footer-main { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 40px; padding: clamp(48px, 7vw, 80px) 0 40px; }
.footer-main h2 { font-family: var(--font-sans); font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--brass-200); margin: 0 0 16px; font-weight: 600; }
.footer-main ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.footer-brand img { height: 64px; width: auto; margin-bottom: 18px; }
.footer-brand p { margin: 0 0 .4em; }
.footer-social { display: flex; gap: 10px; margin-top: 18px; }
.footer-social a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .15); }
.footer-social a:hover { border-color: var(--brass-200); }
.footer-social .icon { width: 18px; height: 18px; }
.footer-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding: 22px 0 30px; border-top: 1px solid rgba(255, 255, 255, .08); font-size: .8rem; color: var(--navy-200); }
.footer-bottom ul { display: flex; flex-wrap: wrap; gap: 18px; list-style: none; margin: 0; padding: 0; }
.footer-events li { display: grid; gap: 1px; }
.footer-events small { color: var(--navy-200); font-size: .78rem; }

@media (max-width: 960px) { .footer-main { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .footer-main { grid-template-columns: 1fr; } }

/* ----------------------------------------------------------------- error */

.error-page { text-align: center; padding: clamp(64px, 10vw, 140px) 0; }
.error-page__code { font-family: var(--font-serif); font-size: clamp(5rem, 3rem + 10vw, 10rem); line-height: 1; color: var(--navy-100); margin: 0; }
.error-page h1 { margin-top: -.3em; }
.error-page .hero__actions { justify-content: center; margin-top: 28px; }

/* ------------------------------------------------------------------ utils */

.mt-0 { margin-top: 0; }
.text-muted { color: var(--muted); }
.stack > * + * { margin-top: 16px; }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

@media print {
    .topbar, .site-header, .site-footer, .sidenav, .hero__actions, .event__actions { display: none !important; }
    body { background: #fff; }
    .page-hero { background: none; color: #000; padding: 0 0 20px; }
    .page-hero h1 { color: #000; }
}

/* ----------------------------------------------------------------- agenda */

.agenda { padding: clamp(32px, 5vw, 56px) 0 clamp(56px, 8vw, 96px); }
.agenda__intro { max-width: 820px; margin-bottom: 28px; }
.agenda__source { font-size: .82rem; color: var(--muted); margin-top: 40px; }
.agenda__main { min-width: 0; }
.agenda__layout { display: grid; grid-template-columns: 270px minmax(0, 1fr); gap: 36px; align-items: start; }

.agenda__filters { position: sticky; top: calc(var(--header-h) + 20px); display: grid; gap: 22px; padding: 22px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); max-height: calc(100vh - var(--header-h) - 40px); overflow-y: auto; }
.agenda__filters-head { display: flex; align-items: center; justify-content: space-between; }
.agenda__filters-head h2 { font-size: 1.2rem; margin: 0; }
.agenda__close { display: none; }
.agenda__filters fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 10px; }
.agenda__filters legend { font-size: .72rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; padding: 0; }
.agenda__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.agenda__reset { justify-content: center; }
.agenda__reset[hidden] { display: none; }

.chip--assoc { display: inline-flex; align-items: center; gap: 7px; }
.chip--assoc .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--assoc); }
.chip--assoc[aria-pressed="true"] { background: var(--assoc); border-color: var(--assoc); }
.chip--assoc[aria-pressed="true"] .dot { background: var(--white); }

.switch { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: var(--ink-soft); cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.switch__track { position: relative; flex: none; width: 36px; height: 20px; border-radius: 999px; background: var(--line-strong); transition: background .2s; }
.switch__track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: var(--white); box-shadow: var(--shadow-sm); transition: transform .2s var(--ease); }
.switch input:checked + .switch__track { background: var(--navy-700); }
.switch input:checked + .switch__track::after { transform: translateX(16px); }
.switch input:focus-visible + .switch__track { outline: 3px solid var(--brass-500); outline-offset: 2px; }

.agenda__toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.agenda__search { flex: 1 1 280px; display: flex; align-items: center; gap: 10px; padding: 0 16px; background: var(--white); border: 1px solid var(--line-strong); border-radius: 999px; color: var(--muted); }
.agenda__search:focus-within { border-color: var(--navy-500); box-shadow: 0 0 0 3px var(--navy-100); }
.agenda__search input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 1rem; padding: 12px 0; color: var(--ink); outline: none; }
.agenda__filters-toggle { display: none; }
.segmented { display: inline-flex; padding: 4px; background: var(--white); border: 1px solid var(--line-strong); border-radius: 999px; }
.segmented button { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border: 0; border-radius: 999px; background: none; font: 500 .9rem/1 var(--font-sans); color: var(--ink-soft); cursor: pointer; }
.segmented button[aria-pressed="true"] { background: var(--navy-700); color: var(--white); }

.agenda__summary { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 20px; margin-bottom: 8px; }
.agenda__summary p { margin: 0; color: var(--muted); font-size: .92rem; }
.agenda__summary strong { color: var(--navy-900); }
.agenda__subscribe { position: relative; }
.agenda__subscribe button.link-arrow { background: none; border: 0; cursor: pointer; padding: 0; font: inherit; font-weight: 600; font-size: .92rem; color: var(--navy-700); }
.agenda__subscribe-panel { position: absolute; right: 0; top: calc(100% + 10px); z-index: 20; width: min(420px, 90vw); padding: 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); font-size: .9rem; color: var(--ink-soft); }
.agenda__subscribe-panel .hero__actions { gap: 8px; }
.agenda__subscribe-panel .btn { padding: .65em 1em; font-size: .85rem; }

.agenda-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.agenda-event {
    position: relative; display: grid; grid-template-columns: 74px minmax(0, 1fr) 40px; gap: 18px; align-items: start;
    padding: 16px 14px 16px 16px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
    border-left: 4px solid var(--assoc); transition: box-shadow .2s, border-color .2s;
}
.agenda-event:hover, .agenda-event.is-open { box-shadow: var(--shadow); }
.agenda-event.is-fer { background: linear-gradient(90deg, var(--navy-50), var(--white) 40%); }
.agenda-event.is-cancelled .agenda-event__title { text-decoration: line-through; color: var(--muted); }
.agenda-event__date { display: grid; justify-items: center; align-content: start; padding: 8px 4px; border-radius: var(--radius-sm); background: var(--paper); line-height: 1; text-align: center; }
.agenda-event__day { font-family: var(--font-serif); font-size: 1.8rem; color: var(--navy-900); }
.agenda-event__month { font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-top: 4px; }
.agenda-event__until { font-size: .7rem; color: var(--muted); margin-top: 6px; }
.agenda-event__tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.agenda-event__title { font-family: var(--font-sans); font-size: 1.05rem; font-weight: 600; margin: 0; letter-spacing: 0; }
.agenda-event__title button { all: unset; cursor: pointer; color: var(--navy-900); }
.agenda-event__title button:hover { color: var(--brass-700); }
.agenda-event__title button:focus-visible { outline: 3px solid var(--brass-500); outline-offset: 2px; border-radius: 4px; }
.agenda-event__meta { margin: 4px 0 0; font-size: .87rem; color: var(--muted); }
.agenda-event__details { margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line-strong); font-size: .92rem; }
.agenda-event__details .event__actions { justify-content: flex-start; margin-top: 10px; }
.agenda-event__classes { color: var(--ink-soft); margin: 0; }
.agenda-event__chevron { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 999px; border: 1px solid var(--line); background: var(--white); color: var(--navy-700); cursor: pointer; }
.agenda-event__chevron .icon { transition: transform .2s; }
.agenda-event.is-open .agenda-event__chevron .icon { transform: rotate(180deg); }

.assoc-badge { display: inline-flex; align-items: center; padding: 3px 9px; border-radius: 999px; background: var(--assoc, var(--navy-700)); color: var(--white); font-size: .7rem; font-weight: 700; letter-spacing: .06em; }
.tag--muted { background: var(--paper); color: var(--muted); box-shadow: inset 0 0 0 1px var(--line-strong); }

.month-nav { display: flex; align-items: center; gap: 10px; margin: 6px 0 16px; }
.month-nav h2 { margin: 0 6px; font-size: 1.6rem; text-transform: capitalize; min-width: 210px; text-align: center; }
.month-nav .icon-btn { font-size: 1.4rem; line-height: 1; }
.month-nav .btn { margin-left: auto; padding: .55em 1.1em; }

.month-grid { background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.month-grid__head, .month-grid__body { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.month-grid__head span { padding: 10px; font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); text-align: center; border-bottom: 1px solid var(--line); background: var(--paper); }
.month-grid__day {
    display: flex; flex-direction: column; align-items: stretch; gap: 3px; min-width: 0; min-height: 112px; padding: 6px;
    border: 0; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--white);
    font: inherit; text-align: left; cursor: pointer; overflow: hidden;
}
.month-grid__day:nth-child(7n) { border-right: 0; }
.month-grid__day:hover { background: var(--navy-50); }
.month-grid__day.is-outside { background: var(--paper); }
.month-grid__day.is-outside .month-grid__number { color: var(--line-strong); }
.month-grid__day.is-selected { box-shadow: inset 0 0 0 2px var(--navy-700); }
.month-grid__number { font-size: .85rem; font-weight: 600; color: var(--ink-soft); width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; }
.month-grid__day.is-today .month-grid__number { background: var(--brass-500); color: var(--navy-950); }
.month-grid__event { display: block; padding: 3px 6px; border-radius: 4px; font-size: .74rem; line-height: 1.25; color: var(--ink); background: color-mix(in srgb, var(--assoc) 14%, white); border-left: 3px solid var(--assoc); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; max-width: 100%; }
.month-grid__event.is-cancelled { text-decoration: line-through; opacity: .6; }
.month-grid__more { font-size: .72rem; font-weight: 600; color: var(--navy-700); padding-left: 4px; }
.month-grid__dots { display: none; gap: 3px; justify-content: center; }
.month-grid__dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--assoc); }
.month-day { margin-top: 28px; }
.month-day h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; font-size: 1.3rem; }
.month-day h3 button { background: none; border: 0; cursor: pointer; font: inherit; font-size: .9rem; font-weight: 600; color: var(--navy-700); font-family: var(--font-sans); }

@media (max-width: 1024px) {
    .agenda__layout { grid-template-columns: minmax(0, 1fr); }
    .agenda__filters-toggle { display: inline-flex; }
    .agenda__close { display: inline-grid; }
    .agenda__filters {
        position: fixed; inset: auto 0 0 0; top: auto; z-index: 60; max-height: 82vh; border-radius: var(--radius-lg) var(--radius-lg) 0 0;
        box-shadow: var(--shadow-lg); transform: translateY(105%); transition: transform .3s var(--ease); visibility: hidden;
    }
    .agenda__filters.is-open { transform: none; visibility: visible; }
    body.agenda-filters-open::after { content: ""; position: fixed; inset: 0; z-index: 55; background: rgba(13, 18, 51, .4); }
}

@media (max-width: 720px) {
    .agenda__toolbar .segmented { flex: 1; }
    .agenda__toolbar .segmented button { flex: 1; justify-content: center; }
    .agenda__subscribe-panel { position: fixed; left: 16px; right: 16px; top: auto; bottom: 16px; width: auto; }
    .agenda-event { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 14px 12px; }
    .agenda-event__chevron { display: none; }
    .agenda-event__day { font-size: 1.5rem; }
    .month-nav h2 { font-size: 1.25rem; min-width: 0; flex: 1; }
    .month-grid__day { min-height: 58px; align-items: center; padding: 4px 2px; }
    .month-grid__event, .month-grid__more { display: none; }
    .month-grid__dots { display: flex; }
    .month-grid__head span { padding: 8px 2px; font-size: .62rem; letter-spacing: .04em; }
}

/* --------------------------------------------------------- document library */

.library { padding: clamp(32px, 5vw, 56px) 0 clamp(56px, 8vw, 96px); max-width: 980px; }
.library__intro { margin-bottom: 28px; }
.library__toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 16px; }
.library__select select {
    appearance: none; -webkit-appearance: none; height: 100%; min-height: 48px; padding: 0 40px 0 16px; border-radius: 999px;
    border: 1px solid var(--line-strong); background: var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23263070' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 14px center;
    font: 500 .92rem var(--font-sans); color: var(--ink-soft); cursor: pointer;
}
.library__categories { margin-bottom: 18px; }
.library__categories .chip span { margin-left: 4px; opacity: .6; font-size: .78rem; }
.library__count { color: var(--muted); font-size: .92rem; margin: 0 0 8px; }
.library__count strong { color: var(--navy-900); }
.library__group[hidden], .library [data-document][hidden] { display: none; }
.library__description { display: block; font-size: .82rem; color: var(--muted); font-weight: 400; margin-top: 2px; }
@media (max-width: 720px) {
    .library__select { flex: 1 1 140px; }
    .library__select select { width: 100%; }
    .library .file-list a { grid-template-columns: 40px 1fr; }
    .library .file-list__meta { grid-column: 2; }
}

.person__note { color: var(--ink-soft); font-style: italic; margin-bottom: .6em; }
.person__note p { margin: 0; }
.person__contact { display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; margin: .6em 0 0; }
.person__contact dt { font-weight: 600; color: var(--ink-soft); }
.person__contact dt::after { content: " :"; }
.person__contact dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }

/* contact form */
.contact-form { padding: clamp(20px, 3vw, 32px); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.form-grid .form-row--half { grid-column: span 6; }
.form-grid optgroup { font-style: normal; font-weight: 600; }
.form-error { color: var(--danger); font-size: .85rem; margin: 6px 0 0; }
.form-grid [aria-invalid="true"] { border-color: var(--danger); }
.form-note { font-size: .82rem; margin: 12px 0 0; }
.person__write { margin-top: 12px; }
.person__write .btn { padding: .6em 1em; font-size: .85rem; }
@media (max-width: 720px) { .form-grid .form-row--half { grid-column: span 12; } }

/* championships */
.championship-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.championship { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 18px; padding: 18px; background: var(--white); border: 1px solid var(--line); border-left: 4px solid var(--brass-500); border-radius: var(--radius); }
.championship.is-past { background: var(--paper); }
.championship.is-past .date-badge { opacity: .6; }
.championship[hidden] { display: none; }
.championship__title { font-size: 1.3rem; margin: 2px 0 4px; }
.championship details { font-size: .88rem; color: var(--muted); margin-top: 8px; }
.championship details summary { cursor: pointer; color: var(--navy-700); font-weight: 500; }
.championship .event__actions { justify-content: flex-start; margin-top: 12px; }
.event__actions a.is-primary { background: var(--navy-700); border-color: var(--navy-700); color: var(--white); }
.championships__more { margin-top: clamp(40px, 6vw, 64px); }
.championships .library__select { display: inline-block; margin-bottom: 14px; }
@media (max-width: 720px) { .championship { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 14px; } }

.tag--fer { background: var(--brass-500); color: var(--navy-950); }
.chip--fer[aria-pressed="true"] { background: var(--brass-500); border-color: var(--brass-500); color: var(--navy-950); }

.contact-form__to { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin: 0; font-size: 1.1rem; font-weight: 600; color: var(--navy-900); }
.contact-form__to span { font-size: .85rem; font-weight: 600; color: var(--muted); }
.contact-form__to a { font-size: .85rem; font-weight: 500; }

/* list of people (speakers) */
.people-list { padding: 0; max-width: none; }
.people-list__items { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); overflow: hidden; }
.people-list__item { display: grid; grid-template-columns: minmax(0, 1.6fr) auto minmax(0, 1.4fr); gap: 8px 16px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.people-list__item:last-child { border-bottom: 0; }
.people-list__item[hidden], .people-list__group[hidden] { display: none; }
.people-list__name strong { display: block; color: var(--navy-900); }
.people-list__name span { display: inline-flex; align-items: center; gap: 4px; font-size: .84rem; color: var(--muted); }
.people-list__name .icon { width: 13px; height: 13px; }
.people-list__label { padding: 3px 10px; border-radius: 999px; background: var(--brass-100); color: var(--brass-700); font-size: .78rem; font-weight: 600; white-space: nowrap; }
.people-list__contact { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 6px 14px; font-size: .9rem; }
.people-list__contact a:not(.btn) { display: inline-flex; align-items: center; gap: 5px; text-decoration: none; white-space: nowrap; }
.people-list__contact .btn { padding: .5em 1em; font-size: .82rem; }
.people-list__group { padding: 0 16px; border-bottom: 1px solid var(--line); }
@media (max-width: 720px) {
    .people-list__item { grid-template-columns: minmax(0, 1fr) auto; }
    .people-list__contact { grid-column: 1 / -1; justify-content: flex-start; }
}

/* preview of a news (or page) without image: label on navy with the FER emblem as watermark */
.card__media.card__media--placeholder, .news-row__media.card__media--placeholder {
    position: relative; display: flex; align-items: flex-end; overflow: hidden; padding: 16px 18px;
    background:
        radial-gradient(circle at 90% 105%, rgba(184, 146, 90, .45), transparent 55%),
        linear-gradient(135deg, var(--navy-700), var(--navy-950));
}
.card__media--placeholder img.placeholder__logo {
    position: absolute; right: -8%; top: 50%; width: 55%; height: auto; max-height: none;
    object-fit: contain; opacity: .16; transform: translateY(-50%) rotate(-8deg); transition: opacity .3s, transform .6s var(--ease);
}
.card:hover .card__media--placeholder img.placeholder__logo { opacity: .24; transform: translateY(-50%) rotate(-4deg) scale(1.04); }
.placeholder__label {
    position: relative; max-width: 70%; font-family: var(--font-serif); font-size: clamp(1.3rem, 1.1rem + .8vw, 1.8rem); line-height: 1.1;
    color: var(--white);
}
.placeholder__label::before { content: ""; display: block; width: 28px; height: 2px; margin-bottom: 10px; background: var(--brass-500); }
.news-row__media.card__media--placeholder { padding: 8px 10px; }
.news-row__media .placeholder__label { font-size: .85rem; max-width: 100%; }
.news-row__media .placeholder__label::before { width: 16px; margin-bottom: 5px; }
.news-row__media img.placeholder__logo { width: 75%; right: -18%; }

/* entry at Swiss Equestrian */
.agenda-event__entry { margin: 10px 0 0; }
.agenda-event__entry .btn, .event-entry .btn { padding: .55em 1.1em; font-size: .85rem; }
.event-entry { margin: 10px 0 0; }

/* person cards on phones: horizontal and compact (small photo on the left) */
@media (max-width: 640px) {
    .people { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    .person { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; align-items: start; padding: 14px; }
    .person__photo { width: 76px; height: 76px; aspect-ratio: auto; border-radius: 50%; overflow: hidden; }
    .person__photo--empty .icon { width: 34px; height: 34px; }
    .person__body { padding: 0; }
    .person__role { font-size: .66rem; margin-bottom: 3px; }
    .person__name { font-size: 1.05rem; margin-bottom: 6px; }
    .person__details { font-size: .84rem; line-height: 1.45; }
    .person__details p { margin-bottom: .35em; }
    .person__contact { margin-top: .3em; }
    .person__write { margin-top: 8px; }
    .person__write .btn { padding: .45em .9em; font-size: .8rem; }
}

/* label (discipline) on the image of a card, same style as the previews without image */
.card__media.has-label, .news-row__media.has-label { position: relative; }
.card__media.has-label::after, .news-row__media.has-label::after {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(0deg, rgba(13, 18, 51, .78) 0%, rgba(13, 18, 51, 0) 55%);
}
.placeholder__label.media__label { position: absolute; left: 18px; bottom: 16px; z-index: 1; max-width: calc(100% - 36px); font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem); text-shadow: 0 1px 8px rgba(13, 18, 51, .4); }
.news-row__media .placeholder__label.media__label { left: 8px; bottom: 7px; max-width: calc(100% - 16px); font-size: .8rem; }

/* compact tiles of pages (members): logo not cropped and title */
.page-tiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: 10px; }
.page-tile { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px 10px 10px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--navy-900); transition: border-color .2s, box-shadow .2s; }
.page-tile:hover { border-color: var(--navy-200); box-shadow: var(--shadow-sm); color: var(--navy-900); }
.page-tile__logo { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--radius-sm); background: var(--white); overflow: hidden; }
.page-tile__logo img { max-width: 52px; max-height: 52px; width: auto; height: auto; object-fit: contain; }
.page-tile__title { font-weight: 600; font-size: .92rem; line-height: 1.3; }
.page-tile .icon { width: 16px; height: 16px; color: var(--muted); transition: transform .2s; }
.page-tile:hover .icon { transform: translateX(3px); color: var(--navy-700); }

/* cards of pages (sub-pages of Disciplines, Fédération…): compact on every screen */
.page-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), 1fr)); gap: 12px; }
.card--compact .card__media { aspect-ratio: 16 / 9; }
.card--compact .card__body { padding: 12px 14px 14px; gap: 4px; }
.card--compact .card__title { font-size: 1rem; line-height: 1.25; }
.card--compact .card__text { font-size: .82rem; -webkit-line-clamp: 2; }
.card--compact .placeholder__label { font-size: 1.05rem; }
.card--compact .card__media--placeholder { padding: 10px 12px; }
.card--compact .placeholder__label::before { width: 20px; margin-bottom: 6px; }
@media (max-width: 640px) {
    .page-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .card--compact .card__body { padding: 10px 10px 12px; }
    .card--compact .card__title { font-size: .9rem; }
    .card--compact .card__text { display: none; }
}

/* ------------------------------------------------- person cards (all sizes) */
/* horizontal and compact: small round photo, details next to it, several cards per row */
.people { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.person { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 16px; align-items: start; padding: 16px; }
.person__photo { width: 84px; height: 84px; aspect-ratio: auto; border-radius: 50%; overflow: hidden; background: var(--navy-50); }
.person__photo--empty .icon { width: 36px; height: 36px; }
.person__body { padding: 0; }
.person__role { font-size: .68rem; margin-bottom: 4px; }
.person__name { font-size: 1.1rem; margin-bottom: 6px; }
.person__details { font-size: .86rem; line-height: 1.45; }
.person__details p { margin-bottom: .35em; }
.person__contact { margin-top: .3em; }
.person__write { margin-top: 10px; }
.person__write .btn { padding: .45em .95em; font-size: .8rem; }
@media (max-width: 640px) {
    .person { grid-template-columns: 68px minmax(0, 1fr); gap: 12px; padding: 14px; }
    .person__photo { width: 68px; height: 68px; }
}

/* ------------------------------------------------- image and text */
/* the image floats next to the text: a long text continues below it instead of leaving an empty column */
.media-text:not(.media-text--image-only) { display: flow-root; }
.media-text:not(.media-text--image-only) .media-text__media { float: left; width: min(38%, 300px); margin: 4px 28px 14px 0; }
.media-text--right:not(.media-text--image-only) .media-text__media { float: right; margin: 4px 0 14px 28px; }
.media-text:not(.media-text--image-only) .prose > :first-child { margin-top: 0; }
.media-text--image-only .media-text__media { max-width: 100%; }
@media (max-width: 560px) {
    .media-text:not(.media-text--image-only) .media-text__media,
    .media-text--right:not(.media-text--image-only) .media-text__media { float: none; width: 100%; margin: 0 0 14px; }
}

/* ------------------------------------------------- compact list of news (discipline pages) */
.news-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 10px; }
.news-list .news-row { grid-template-columns: 96px minmax(0, 1fr); padding: 10px; gap: 14px; }
.news-list .news-row h3 { font-size: .95rem; }

/* embedded PDF: the viewer of the browser on computers, the link only on phones */
.pdf { margin: 0 0 clamp(28px, 4vw, 44px); }
.pdf__title { font-family: var(--font-serif); font-size: 1.2rem; color: var(--navy-900); margin-bottom: 10px; }
.pdf__viewer { height: min(80vh, 900px); border: 1px solid var(--line); border-radius: var(--radius) var(--radius) 0 0; overflow: hidden; background: var(--white); }
.pdf__viewer iframe { width: 100%; height: 100%; border: 0; }
.pdf__download { display: grid; grid-template-columns: 40px 1fr auto; gap: 14px; align-items: center; padding: 10px 16px 10px 12px; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 var(--radius) var(--radius); background: var(--white); text-decoration: none; color: var(--navy-900); }
.pdf__download:hover { background: var(--navy-50); color: var(--navy-900); }
@media (max-width: 720px) {
    .pdf__viewer { display: none; }
    .pdf__download { border-top: 1px solid var(--line); border-radius: var(--radius); }
}

/* headings of the groups of the library and of the lists: no capitals on every word */
.library .month-heading, .people-list .month-heading { text-transform: none; font-size: 1.2rem; margin: 26px 0 10px; }
.library__group:first-of-type .month-heading { margin-top: 6px; }
.library .file-list a { padding-top: 9px; padding-bottom: 9px; }
.library .file-list { gap: 6px; }

/* news grid: more compact, 4 per row on large screens */
.news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 16px; }
.news-grid .card__media { aspect-ratio: 16 / 10; }
.news-grid .card__body { padding: 14px 16px 16px; gap: 6px; }
.news-grid .card__title { font-size: 1.05rem; }
.news-grid .card__text { font-size: .85rem; -webkit-line-clamp: 2; }
.news-grid .placeholder__label.media__label, .news-grid .placeholder__label { font-size: 1.05rem; }
@media (max-width: 640px) {
    .news-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
    /* on phones, the news are rows: thumbnail and title */
    .news-grid .card { display: grid; grid-template-columns: 110px minmax(0, 1fr); }
    .news-grid .card__media { aspect-ratio: auto; height: 100%; min-height: 96px; }
    .news-grid .card__body { padding: 10px 12px; }
    .news-grid .card__title { font-size: .95rem; }
    .news-grid .card__text { display: none; }
    .news-grid .placeholder__label, .news-grid .placeholder__label.media__label { font-size: .8rem; left: 8px; bottom: 7px; }
    .news-grid .card__media--placeholder { padding: 8px 10px; }
    .news-grid .card__media--placeholder img.placeholder__logo { width: 75%; right: -18%; }
}

/* images next to a text: smaller when the image is a pictogram or a document preview (phones: full width) */
@media (min-width: 561px) {
    .media-text:not(.media-text--image-only) .media-text__media { width: min(34%, 260px); }
}
.media-text__media figure { margin: 0; }
.media-text__media figure + figure { margin-top: 12px; }

/* articles: the blocks image + text follow each other closely */
.page-layout__main .media-text + .media-text { margin-top: -8px; }

/* ------------------------------------------------- spacing fixes */
/* the button of a contact card keeps some air below the phone numbers */
.person .person__write { margin: 16px 0 0; }
@media (max-width: 640px) {
    .person .person__write { margin-top: 12px; }
}

/* the tiles of a row have the same height (members) */
.page-tiles > li { display: flex; }
.page-tiles .page-tile { flex: 1; }

/* agenda: a month heading has more space before it (previous month) than after it */
.agenda-month + .agenda-month { margin-top: 44px; }
.agenda-month .month-heading { margin: 0 0 14px; }
.pagination button {
    display: grid; place-items: center; min-width: 42px; height: 42px; padding: 0 14px; border-radius: 999px;
    border: 1px solid var(--line-strong); background: var(--white); color: var(--ink-soft); font: inherit; font-size: .92rem; cursor: pointer;
}
.pagination button:hover { border-color: var(--navy-500); color: var(--navy-900); }
.pagination .pagination__gap { border-color: transparent; background: none; min-width: 20px; padding: 0; }

/* ------------------------------------------------- photos of the inner hero */
/* on the right of the band, faded into the navy on the left and at the bottom */
.page-hero__photo { position: absolute; top: 0; right: 0; bottom: 0; width: min(56%, 820px); z-index: -1; pointer-events: none; }
.page-hero__photo img {
    width: 100%; height: 100%; object-fit: cover; opacity: .62;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .55) 32%, #000 70%);
    mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .55) 32%, #000 70%);
}
.page-hero--photo::after { display: none; }
.page-hero--photo .container { position: relative; }
.page-hero--photo h1, .page-hero--photo .page-hero__subtitle { text-shadow: 0 1px 14px rgba(13, 18, 51, .55); }
@media (max-width: 760px) {
    /* phones: the photo behind the whole band, discreet */
    .page-hero__photo { width: 100%; }
    .page-hero__photo img {
        opacity: .32;
        -webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 60%);
        mask-image: linear-gradient(0deg, transparent 0%, #000 60%);
    }
}

/* ------------------------------------------------- news: search and filters */
.news-filters { margin-bottom: 10px; }
.news-filters__row { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.news-filters__row .library__select select { height: 100%; }
.news-filters__row .btn { padding: .7em 1.4em; }
.news-filters__chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.news-filters__chips .chip { text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.news-filters__chips .chip span { font-size: .75rem; opacity: .7; }
.news-filters__count { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin: 14px 0 18px; }
@media (max-width: 640px) {
    .news-filters__row .library__select { flex: 1 1 auto; }
    .news-filters__row .btn { flex: 0 0 auto; }
    /* the discipline chips scroll horizontally instead of taking half of the screen */
    .news-filters__chips { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
    .news-filters__chips .chip { flex: 0 0 auto; }
}

/* ------------------------------------------------- homepage: members, side column, advertising */
.home-members { padding: 28px 0; border-bottom: 1px solid var(--line); }
.home-side { display: grid; gap: 18px; align-content: start; }
.intro__link { margin-top: 24px; }

.ad-space { position: relative; display: grid; justify-items: center; padding: 26px 18px 18px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); }
.ad-space__label { position: absolute; top: 8px; left: 14px; font-size: .66rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ad-space__banners { display: grid; justify-items: center; width: 100%; }
.ad-space__banner { display: block; max-width: 100%; animation: ad-fade .5s var(--ease, ease); }
.ad-space__banner[hidden] { display: none; }
.ad-space__banner img { display: block; max-width: min(100%, 300px); max-height: 600px; width: auto; height: auto; margin: 0 auto; border-radius: var(--radius-sm); }
@keyframes ad-fade { from { opacity: 0; } to { opacity: 1; } }

/* the advertisement of the FER for its own offer */
.ad-space__house { display: grid; justify-items: center; gap: 8px; width: 100%; padding: 22px 18px; text-align: center; text-decoration: none; color: var(--navy-100); background: linear-gradient(160deg, var(--navy-700), var(--navy-900)); border-radius: var(--radius); }
.ad-space__house:hover { color: var(--white); }
.ad-space__logo { width: 64px; height: auto; filter: brightness(0) invert(1); opacity: .9; }
.ad-space__house strong { font-family: var(--font-serif); font-size: 1.3rem; font-weight: 400; color: var(--white); }
.ad-space__house span { font-size: .9rem; line-height: 1.45; }
.ad-space__house .link-arrow { color: var(--brass-200); margin-top: 4px; }
@media (prefers-reduced-motion: reduce) {
    .ad-space__banner { animation: none; }
}
/* the members in one row on a computer, two rows on a phone */
.logos--members { display: grid; grid-template-columns: repeat(auto-fit, minmax(84px, 1fr)); gap: 8px 12px; }
.logos--members a { height: 72px; padding: 6px; }
.logos--members img { max-height: 58px; max-width: 100%; }
@media (max-width: 640px) {
    .logos--members { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
    .logos--members a { height: 44px; padding: 3px; }
    .logos--members img { max-height: 38px; }
}

/* long addresses in the texts break instead of widening the page (phones) */
.prose a, .prose td, .callout a { overflow-wrap: anywhere; }
@media (max-width: 640px) {
    /* a tall banner (skyscraper) does not take a whole screen on a phone */
    .ad-space__banner img { max-height: 360px; }
}
@media (max-width: 640px) {
    /* categories of the library and championships: one row that scrolls */
    .library__categories { flex-wrap: nowrap; overflow-x: auto; margin-right: -16px; padding-right: 16px; scrollbar-width: none; }
    .library__categories .chip { flex: 0 0 auto; }
}

/* search of the site: the field takes the whole width, the button is only an icon on phones */
.search-panel__submit { flex: 0 0 auto; }
@media (max-width: 640px) {
    .search-panel form { gap: 8px; padding: 12px 0; }
    .search-panel input { font-size: 1rem; padding: 11px 16px; }
    .search-panel__submit { width: 46px; padding: 0; justify-content: center; }
    .search-panel__submit span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}

/* ------------------------------------------------- content: cards, key figures, small images */
.info-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 14px; }
.info-card { display: flex; flex-direction: column; gap: 10px; padding: 22px 20px 20px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.info-card__icon { width: 64px; height: 64px; }
.info-card__image { max-width: 120px; max-height: 64px; width: auto; height: auto; object-fit: contain; align-self: flex-start; }
.info-card__title { font-size: 1.2rem; margin: 0; }
.info-card__text { font-size: .92rem; color: var(--ink-soft); }
.info-card__text > :first-child { margin-top: 0; }
.info-card__text > :last-child { margin-bottom: 0; }
/* a list of links: buttons one below the other */
.info-card__text ul { list-style: none; padding: 0; margin: 4px 0 0; display: grid; gap: 8px; }
.info-card__text ul li { margin: 0; padding: 0; }
.info-card__text ul li::before { display: none; }
.info-card__text ul a {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 12px;
    border: 1px solid var(--line-strong); border-radius: var(--radius-sm); text-decoration: none; color: var(--navy-900); font-weight: 500; font-size: .88rem;
    transition: border-color .2s var(--ease), background-color .2s var(--ease);
}
.info-card__text ul a::after { content: "→"; color: var(--brass-600); }
.info-card__text ul a:hover { border-color: var(--navy-500); background: var(--navy-50); }

.stats--page { margin-top: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); }

.media-text--small:not(.media-text--image-only) .media-text__media { width: min(30%, 180px); }
.media-text--small.media-text--image-only .media-text__media { max-width: 240px; }
@media (max-width: 560px) {
    .media-text--small:not(.media-text--image-only) .media-text__media { width: 40%; float: left; margin: 4px 16px 10px 0; }
    .media-text--small.media-text--right:not(.media-text--image-only) .media-text__media { float: right; margin: 4px 0 10px 16px; }
}

/* ------------------------------------------------- news: main photo and rankings */
.article-photo { margin: 0 0 28px; }
.article-photo a { display: block; background: var(--navy-50); border-radius: var(--radius); overflow: hidden; }
/* the whole photo (a poster is not cropped), not higher than a screen */
.article-photo img { display: block; width: 100%; max-height: min(70vh, 620px); object-fit: contain; margin: 0 auto; }
.article-photo figcaption { font-size: .8rem; color: var(--muted); margin-top: 8px; }

.prose ol.ranking { list-style: none; padding: 0; margin: 10px 0 22px; display: grid; gap: 6px; counter-reset: ranking; }
.prose ol.ranking li { position: relative; margin: 0; padding: 8px 12px 8px 52px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-sm); counter-increment: ranking; }
/* the position: written in the old texts, counted for the lists made with the style "Classement" of the editor */
.ranking__position, .prose ol.ranking li::before {
    position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%;
    font: 600 .82rem/1 var(--font-sans); color: var(--navy-900); background: var(--navy-50);
}
.prose ol.ranking li::before { content: counter(ranking); }
.prose ol.ranking li:has(.ranking__position)::before { display: none; }
.ranking li:nth-child(1) .ranking__position, .prose ol.ranking li:nth-child(1)::before { background: #e9c766; }
.ranking li:nth-child(2) .ranking__position, .prose ol.ranking li:nth-child(2)::before { background: #d3d7de; }
.ranking li:nth-child(3) .ranking__position, .prose ol.ranking li:nth-child(3)::before { background: #dcae84; }
.prose h3 + ol.ranking { margin-top: 6px; }

/* decorative circles never catch the clicks */
.page-hero::after, .hero::after, .hero::before, .page-hero--image::before { pointer-events: none; }

/* library: the archives on request */
.library__archives { padding: 0 6px; white-space: nowrap; }
.tag--archive { background: var(--line); color: var(--ink-soft); margin-right: 4px; }
[data-document][data-archived] .file-list__name { color: var(--ink-soft); }

/* news of a discipline: separated from the content above */
section.block[aria-labelledby="discipline-news"] { margin-top: clamp(40px, 5vw, 56px); }
.library__toolbar .library__archives { order: 10; }

/* ------------------------------------------------- library: grid of documents with a preview */
.doc-grid { list-style: none; margin: 0 0 8px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.doc-grid > li { display: flex; }
.doc-grid > li[hidden] { display: none; }
.doc-card {
    flex: 1; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; align-items: start; padding: 12px;
    background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); text-decoration: none; color: var(--ink);
    transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.doc-card:hover { border-color: var(--navy-200); box-shadow: var(--shadow-sm); transform: translateY(-1px); color: var(--ink); }
.doc-card__preview {
    display: grid; place-items: center; width: 76px; aspect-ratio: 210 / 297; overflow: hidden; border-radius: 4px;
    background: var(--paper); border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(13, 18, 51, .06);
}
.doc-card__preview img { width: 100%; height: 100%; object-fit: cover; object-position: top center; }
.doc-card__preview > span { font: 700 .78rem/1 var(--font-sans); letter-spacing: .06em; }
.doc-card__preview--pdf > span { color: #a3303a; }
.doc-card__preview--doc { background: #e5ecf8; } .doc-card__preview--doc > span { color: #2b579a; }
.doc-card__preview--xls { background: #e3f1e8; } .doc-card__preview--xls > span { color: #217346; }
.doc-card__preview--ppt { background: #fbe9e1; } .doc-card__preview--ppt > span { color: #c4401c; }
.doc-card__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding-top: 2px; }
.doc-card__title { font-weight: 600; font-size: .93rem; line-height: 1.3; color: var(--navy-900); }
.doc-card:hover .doc-card__title { text-decoration: underline; text-decoration-color: var(--brass-500); text-underline-offset: 3px; }
.doc-card__description { font-size: .82rem; color: var(--muted); line-height: 1.4; }
.doc-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: auto; font-size: .76rem; color: var(--muted); }
.doc-card__meta .file-icon { min-width: 0; width: auto; height: auto; padding: 2px 6px; font-size: .64rem; border-radius: 4px; }
.doc-card__meta .tag { font-size: .62rem; }
.library__group + .library__group { margin-top: 26px; }
@media (max-width: 560px) {
    .doc-card { grid-template-columns: 58px minmax(0, 1fr); gap: 12px; padding: 10px; }
    .doc-card__preview { width: 58px; }
}
.library--documents { max-width: none; }
.library--documents .library__intro, .library--documents .library__toolbar { max-width: 980px; }
/* files of a news or a page (narrower column): two cards per row at most */
.doc-grid--block { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }

/* ------------------------------------------------- long words (file names, addresses) never overflow a box */
h1, h2, h3, h4, h5,
.doc-card__title, .doc-card__description, .card__title, .card__text, .page-tile__title, .info-card__title,
.news-row h3, .person__name, .person__role, .tile__label, .file-list__name, .event__title, .agenda-event h3,
.championship__title, .library__description, .breadcrumb, .chip, .search-hits h3, .link-list .file-list__name {
    overflow-wrap: anywhere;
}
/* the cells of the grids and flex rows can be narrower than their content */
.doc-card__body, .card__body, .page-tile > *, .info-card, .news-row > *, .person__body, .agenda-event > * { min-width: 0; }

/* homepage hero: the photos are stacked, the active one fades in (several photos rotate) */
.hero__media img { position: absolute; inset: 0; }
.hero__media[data-hero-rotate] img { opacity: 0; transition: opacity 1.4s ease; }
.hero__media[data-hero-rotate] img.is-active { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
    .hero__media[data-hero-rotate] img { transition: none; }
}

/* PDF in a page: a compact card, then the document in a large viewer */
.pdf__card { max-width: 460px; margin-bottom: 14px; }
.pdf__card .doc-card { grid-template-columns: 56px minmax(0, 1fr); }
.pdf__card .doc-card__preview { width: 56px; }
.pdf .pdf__viewer { height: max(78vh, 640px); border-radius: var(--radius); box-shadow: var(--shadow-sm); background: #525659; }
@media (max-width: 760px) {
    .pdf .pdf__viewer { display: none; }
    .pdf__card { max-width: none; }
}

/* ------------------------------------------------- links with a preview of the website */
.link-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 14px; }
.link-card {
    display: flex; flex-direction: column; overflow: hidden; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius);
    text-decoration: none; color: var(--ink); transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease);
}
.link-card:hover { border-color: var(--navy-200); box-shadow: var(--shadow); transform: translateY(-2px); color: var(--ink); }
.link-card__media { position: relative; display: grid; place-items: center; aspect-ratio: 1.91 / 1; background: var(--navy-50); overflow: hidden; border-bottom: 1px solid var(--line); }
.link-card__image { width: 100%; height: 100%; object-fit: cover; }
.link-card__media--logo { background: linear-gradient(160deg, var(--white), var(--navy-50)); }
.link-card__big-icon { max-width: 38%; max-height: 58%; object-fit: contain; }
.link-card__initial { font: 400 2.6rem/1 var(--font-serif); color: var(--navy-200); }
.link-card__body { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px 14px; min-width: 0; }
.link-card__site { display: flex; align-items: center; gap: 6px; font-size: .74rem; color: var(--muted); overflow-wrap: anywhere; }
.link-card__site img { width: 16px; height: 16px; object-fit: contain; border-radius: 3px; }
.link-card__title { font-weight: 600; font-size: .95rem; line-height: 1.3; color: var(--navy-900); overflow-wrap: anywhere; }
.link-card:hover .link-card__title { text-decoration: underline; text-decoration-color: var(--brass-500); text-underline-offset: 3px; }
.link-card__text { font-size: .82rem; color: var(--muted); line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.link-card__placeholder { position: absolute; inset: 0; display: grid; place-items: center; overflow: hidden; background: linear-gradient(140deg, var(--navy-700), var(--navy-950)); }
.link-card__watermark { position: absolute; right: -14%; bottom: -26%; width: 62%; opacity: .12; filter: brightness(0) invert(1); }
.link-card__placeholder .link-card__initial { position: relative; font: 400 clamp(1.6rem, 1.2rem + 1.4vw, 2.3rem)/1 var(--font-serif); letter-spacing: .04em; color: var(--brass-200); }
.topbar__tagline a { text-decoration: underline; text-decoration-color: rgba(184, 146, 90, .5); text-underline-offset: 3px; }
/* the logos without intrinsic size (SVG) keep their proportions in the box */
.link-card__big-icon { width: 40%; height: 60%; max-width: none; max-height: none; object-fit: contain; }

/* ------------------------------------------------- agenda, month view: one bar per event and per week */
.month-grid__body { display: block; }
.month-week { position: relative; }
.month-week__days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.month-week__events {
    position: absolute; left: 0; right: 0; top: 36px; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));
    grid-auto-rows: 21px; row-gap: 3px; pointer-events: none;
}
/* the bars let the clicks through to the days below them */
.month-bar {
    margin: 0 5px; padding: 2px 7px; min-width: 0; border-radius: 5px; font-size: .74rem; line-height: 17px; color: var(--ink);
    background: color-mix(in srgb, var(--assoc) 16%, white); border-left: 3px solid var(--assoc);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.month-bar.is-continued { margin-left: 0; border-left: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; padding-left: 9px; }
.month-bar.is-continuing { margin-right: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.month-bar.is-cancelled { text-decoration: line-through; opacity: .6; }
.month-bar__more { padding-left: 9px; font-size: .72rem; font-weight: 600; line-height: 21px; color: var(--navy-700); }
@media (max-width: 720px) {
    .month-week__events { display: none; }
}
/* the form of the search takes the whole width of the header (its container is a flex row) */
.search-panel .container { display: block; }
.search-panel form { width: 100%; }

/* tables of results (palmarès): category or association above the name, the horse in italics */
/* the style "Étiquette" of the editor (<small>): above the name in a table, in the text elsewhere */
.prose small { font-size: .7em; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--brass-600); }
.prose td small { display: block; margin-bottom: 2px; font-size: .66rem; }
.prose td em, .prose td i { color: var(--muted); }
.prose td:first-child { white-space: nowrap; }
.prose tbody tr:nth-child(even) td { background: var(--paper); }
.prose tbody tr:hover td { background: var(--navy-50); }