/* =========================================================
   Team Germany – Cable Wakeboard | EM Jugend & Senioren 2026 Bratislava
   Presse-Onepager
   ========================================================= */

:root {
  --bg:            #0a0d13;
  --bg-alt:        #0e121b;
  --surface:       #151b27;
  --surface-2:     #1c2432;
  --line:          #262f40;
  --line-soft:     #1e2634;

  --ink:           #eef2f8;
  --ink-mid:       #b3bdcd;
  --ink-dim:       #7e8899;

  --gold:          #f5c542;
  --gold-deep:     #d9a520;
  --red:           #e23b32;
  --live:          #ff3b30;

  --radius:        14px;
  --radius-lg:     22px;
  --wrap:          1180px;

  --shadow:        0 18px 50px -18px rgba(0, 0, 0, .75);
  --shadow-sm:     0 6px 20px -10px rgba(0, 0, 0, .6);

  /* Systemfonts: kein render-blockierender Webfont-Roundtrip (Lighthouse LCP). */
  --font:          ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-display:  ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;

  --ease:          cubic-bezier(.2, .7, .2, 1);
}

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

/* Muss vor den Komponenten stehen: sonst gewinnt z. B. .btn { display: inline-flex }
   gegen das hidden-Attribut, und ausgeblendete Elemente bleiben sichtbar. */
[hidden] { display: none !important; }

html { scroll-behavior: smooth; scroll-padding-top: 88px; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; display: block; }
a { color: inherit; }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.03;
  letter-spacing: .005em;
  text-transform: uppercase;
  margin: 0;
}

.wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: clamp(18px, 4vw, 34px);
}

.skip-link {
  position: absolute;
  left: -9999px;
  z-index: 200;
  padding: 12px 20px;
  background: var(--gold);
  color: #10131a;
  font-weight: 700;
  border-radius: 0 0 10px 0;
}
.skip-link:focus { left: 0; top: 0; }

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

/* ---------------------------------------------------------
   Buttons
   --------------------------------------------------------- */
.btn {
  --btn-pad: 13px 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: var(--btn-pad);
  border: 1px solid transparent;
  border-radius: 999px;
  font: 600 15px/1 var(--font);
  letter-spacing: .01em;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: transform .18s var(--ease), background-color .18s var(--ease),
              border-color .18s var(--ease), color .18s var(--ease), box-shadow .18s var(--ease);
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn--sm { --btn-pad: 9px 17px; font-size: 13.5px; }

.btn--primary {
  background: linear-gradient(180deg, var(--gold), var(--gold-deep));
  color: #14171f;
  box-shadow: 0 10px 26px -12px rgba(245, 197, 66, .65);
}
.btn--primary:hover { box-shadow: 0 16px 34px -12px rgba(245, 197, 66, .8); }

.btn--ghost {
  background: rgba(255, 255, 255, .045);
  border-color: var(--line);
  color: var(--ink);
  backdrop-filter: blur(8px);
}
.btn--ghost:hover { background: rgba(255, 255, 255, .1); border-color: #3a465c; }

.btn--live {
  background: rgba(255, 59, 48, .12);
  border-color: rgba(255, 59, 48, .45);
  color: #ffd9d6;
  font-size: 14px;
  padding: 11px 19px;
}
.btn--live:hover { background: rgba(255, 59, 48, .2); }

.dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--live);
  box-shadow: 0 0 0 0 rgba(255, 59, 48, .7);
}
.is-live .dot { animation: pulse 1.8s infinite; }
@keyframes pulse {
  70%  { box-shadow: 0 0 0 9px rgba(255, 59, 48, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 59, 48, 0); }
}

/* ---------------------------------------------------------
   Navigation
   --------------------------------------------------------- */
.nav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(10, 13, 19, .55);
  backdrop-filter: blur(16px) saturate(160%);
  border-bottom: 1px solid transparent;
  transition: background-color .3s var(--ease), border-color .3s var(--ease);
}
.nav.is-stuck {
  background: rgba(10, 13, 19, .92);
  border-bottom-color: var(--line-soft);
}
.nav__inner {
  display: flex;
  align-items: center;
  gap: 22px;
  min-height: 72px;
}

.nav__lockup {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  margin-right: auto;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.brand__flag {
  display: grid;
  width: 26px;
  height: 26px;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .16);
  flex: none;
}
.brand__flag i { display: block; }
.brand__flag i:nth-child(1) { background: #16181d; }
.brand__flag i:nth-child(2) { background: var(--red); }
.brand__flag i:nth-child(3) { background: var(--gold); }

.brand__text { display: grid; line-height: 1.15; }
.brand__text strong {
  font-family: var(--font-display);
  font-size: 20px;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.brand__text small {
  font-size: 11.5px;
  letter-spacing: .17em;
  text-transform: uppercase;
  color: var(--ink-dim);
}

/* Logo des Verbandes, durch eine Trennlinie von der eigenen Wortmarke abgesetzt.
   flex: none verhindert, dass es in der engen Kopfzeile zusammengedrückt wird. */
.nav__org { display: flex; align-items: center; flex: none; }
.nav__org a {
  display: flex;
  align-items: center;
  padding: 6px 0 6px 14px;
  border-left: 1px solid var(--line);
}
.nav__org img { height: 36px; width: auto; }

.nav__links { display: flex; gap: 4px; }
.nav__links a {
  padding: 9px 14px;
  border-radius: 999px;
  font-size: 14.5px;
  font-weight: 500;
  color: var(--ink-mid);
  text-decoration: none;
  transition: color .18s var(--ease), background-color .18s var(--ease);
}
.nav__links a:hover { color: var(--ink); background: rgba(255, 255, 255, .06); }
.nav__links a.is-active { color: var(--gold); background: rgba(245, 197, 66, .1); }

.nav__toggle {
  display: none;
  width: 42px; height: 42px;
  padding: 0;
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--line);
  border-radius: 11px;
  cursor: pointer;
  place-content: center;
  gap: 5px;
}
.nav__toggle span {
  display: block;
  width: 17px; height: 2px;
  margin-inline: auto;
  background: var(--ink);
  border-radius: 2px;
  transition: transform .25s var(--ease), opacity .2s var(--ease);
}

/* ---------------------------------------------------------
   Hero
   --------------------------------------------------------- */
.hero {
  position: relative;
  isolation: isolate;
  padding: clamp(56px, 9vw, 104px) 0 0;
  overflow: hidden;
}
.hero__bg {
  position: absolute;
  inset: 0 0 12%;
  z-index: -2;
  overflow: hidden;
  background-size: cover;
  background-position: center 32%;
}

.hero__scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    radial-gradient(115% 90% at 12% 10%, rgba(10, 13, 19, .32) 0%, rgba(10, 13, 19, .84) 54%, var(--bg) 100%),
    linear-gradient(180deg, rgba(10, 13, 19, .3) 0%, rgba(10, 13, 19, .62) 44%, var(--bg) 94%);
}

/* Zweiter Platz für das Verbandslogo: nur auf schmalen Displays, wo die
   Kopfzeile schon mit Wortmarke, Livestream-Button und Menü ausgelastet ist. */
.hero__org { display: none; margin-bottom: 20px; }
.hero__org img { height: 46px; width: auto; }

.eyebrow {
  margin: 0 0 14px;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
}
.eyebrow.is-live { color: #ff8a83; }

.hero__title {
  /* Längste Zeile: „Nationalmannschaft“ – muss auf schmalen Displays in eine Zeile. */
  font-size: clamp(28px, 6.4vw + 0.55rem, 104px);
  max-width: 100%;
  margin-bottom: 22px;
  overflow-wrap: normal;
  word-break: normal;
}
.hero__title span { display: block; }
.hero__title .hl {
  color: transparent;
  background: linear-gradient(96deg, var(--gold) 15%, #ffe9a8 55%, var(--gold-deep) 95%);
  -webkit-background-clip: text;
  background-clip: text;
}

.hero__meta {
  max-width: 56ch;
  margin: 0 0 30px;
  font-size: clamp(17px, 2vw, 20.5px);
  color: var(--ink-mid);
}
.hero__meta strong { color: var(--ink); font-weight: 600; }

.countdown {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 32px;
}
.countdown__unit {
  min-width: 84px;
  padding: 12px 16px 10px;
  background: rgba(255, 255, 255, .05);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  text-align: center;
  backdrop-filter: blur(10px);
}
.countdown__num {
  display: block;
  font-family: var(--font-display);
  font-size: 34px;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.countdown__lbl {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.countdown__banner {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 22px;
  background: rgba(255, 59, 48, .1);
  border: 1px solid rgba(255, 59, 48, .4);
  border-radius: var(--radius);
  font-weight: 600;
}

.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 26px; }

.hero__note {
  max-width: 62ch;
  margin: 0 0 clamp(46px, 7vw, 76px);
  font-size: 14.5px;
  color: var(--ink-dim);
}
.hero__note strong { color: var(--ink-mid); font-weight: 600; }
/* Warnmeldung ueber dem Hero. Rot wie der Live-Punkt, damit sie sich vom
   uebrigen Seitenton absetzt, aber ohne Flaechenknall. */
.alert {
  background: rgba(255, 59, 48, .12);
  border-bottom: 1px solid rgba(255, 59, 48, .45);
}
.alert__inner {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding-block: 16px;
}
.alert__icon {
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255, 59, 48, .9);
  color: #fff;
  font-weight: 700;
  font-size: 15px;
  line-height: 24px;
  text-align: center;
}
.alert__title {
  display: block;
  margin-bottom: 4px;
  font-size: 16px;
  color: var(--ink);
}
.alert__text {
  margin: 0;
  max-width: 78ch;
  font-size: 14.5px;
  line-height: 1.6;
  color: var(--ink-mid);
}
.alert__text strong { color: var(--ink); font-weight: 600; }

.hero__press {
  margin: 28px 0 8px;
  max-width: 62ch;
  font-size: 15px;
  line-height: 1.6;
  color: var(--ink-mid);
}
.hero__press strong { color: var(--ink); font-weight: 600; }

.facts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 1px;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--line-soft);
  border-block: 1px solid var(--line-soft);
}
.facts li {
  padding: 26px clamp(18px, 3vw, 30px);
  background: var(--bg);
  min-width: 0;
}
.facts b {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(30px, 4vw, 42px);
  line-height: 1;
  color: var(--gold);
}
.facts span {
  display: block;
  margin-top: 7px;
  font-size: 13.5px;
  color: var(--ink-dim);
}

/* Handy/Tablet: feste 2 Spalten; ungerade letzte Karte vollbreit,
   sonst bleibt eine leere Zelle neben „4 Uhr“. */
@media (max-width: 820px) {
  .facts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .facts li:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

/* ---------------------------------------------------------
   Sections
   --------------------------------------------------------- */
.section { padding: clamp(62px, 9vw, 112px) 0; }
.section--alt { background: var(--bg-alt); }

.section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 26px;
  margin-bottom: clamp(34px, 5vw, 54px);
}
.section__head h2 { font-size: clamp(32px, 5.2vw, 56px); }
.section__aside { display: flex; flex-wrap: wrap; gap: 10px; }

.lede {
  max-width: 62ch;
  margin: 16px 0 0;
  font-size: 17px;
  color: var(--ink-mid);
}
.lede strong { color: var(--ink); font-weight: 600; }

.sub {
  font-size: clamp(21px, 3vw, 27px);
  margin: clamp(44px, 6vw, 66px) 0 22px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
  color: var(--ink);
}

.empty {
  padding: 40px;
  background: var(--surface);
  border: 1px dashed var(--line);
  border-radius: var(--radius);
  color: var(--ink-dim);
  text-align: center;
}

/* ---------------------------------------------------------
   Tagesberichte
   --------------------------------------------------------- */
.posts { display: grid; gap: 20px; }

.post {
  display: grid;
  grid-template-columns: 300px 1fr;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  overflow: hidden;
  transition: border-color .25s var(--ease), transform .25s var(--ease), box-shadow .25s var(--ease);
}
.post:hover {
  border-color: #33405a;
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.post.is-hidden { display: none; }
.post--text { grid-template-columns: 1fr; }

/* Ohne feste Hoehe zieht die Rasterzelle das Bild auf die Hoehe des Textes
   daneben. Bei langen Berichten bleibt von einem Vorschaubild dann nur ein
   schmaler Streifen uebrig, der stark hochgerechnet wird und verpixelt. */
.post__media {
  position: relative;
  align-self: start;
  /* 5:4 ist das Format, in dem die Mediathek liefert (2048 x 1638 bzw.
     640 x 512). Gleiches Verhaeltnis heisst: kein Beschnitt, kein Hochrechnen. */
  aspect-ratio: 5 / 4;
  background: var(--surface-2);
  min-height: 220px;
  overflow: hidden;
}
.post__media img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease);
}
.post:hover .post__media img { transform: scale(1.05); }

/* Unsichtbare Fläche über dem Titelbild, die die Großansicht öffnet. Nur
   vorhanden, wenn das Bild aus der Mediathek stammt und dort auch anklickbar
   ist – bei fest hinterlegten Bildern gäbe es kein Ziel. */
.post__zoom {
  position: absolute;
  inset: 0;
  padding: 0;
  background: none;
  border: 0;
  cursor: zoom-in;
}
.post__zoom:focus-visible { outline: 2px solid var(--gold); outline-offset: -4px; }

.post__day {
  position: absolute;
  top: 14px; left: 14px;
  padding: 6px 13px;
  background: rgba(10, 13, 19, .82);
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 999px;
  backdrop-filter: blur(8px);
  font: 700 11.5px/1 var(--font);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--gold);
}

.post__body { padding: clamp(24px, 3.4vw, 36px); }

.post__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  font-size: 13px;
  color: var(--ink-dim);
}
.post__meta time { font-variant-numeric: tabular-nums; }
.post__meta .sep { opacity: .4; }

.tag {
  padding: 4px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ink-mid);
}
.tag--result { border-color: rgba(245, 197, 66, .45); color: var(--gold); }
.tag--day { border-color: rgba(255, 255, 255, .3); color: var(--gold); }

.post__title {
  font-size: clamp(23px, 3.1vw, 33px);
  margin-bottom: 14px;
}

.post__text { color: var(--ink-mid); }
.post__text p { margin: 0 0 14px; }
.post__text p:last-child { margin-bottom: 0; }
.post__text strong { color: var(--ink); font-weight: 600; }
.post__text a {
  color: var(--gold);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}
.post__text a:hover { text-decoration-thickness: 2px; }

.post__more { display: grid; }
.post__more[hidden] { display: none; }

.post__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}

.post__results {
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 1px;
  background: var(--line-soft);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  overflow: hidden;
}
.post__results li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px;
  padding: 11px 16px;
  background: var(--surface-2);
  font-size: 15px;
}
.post__results .rank {
  min-width: 42px;
  font-family: var(--font-display);
  font-size: 19px;
  color: var(--gold);
}
.post__results .who { font-weight: 600; }
.post__results .what { margin-left: auto; font-size: 13.5px; color: var(--ink-dim); }

/* ---------------------------------------------------------
   Mediathek
   --------------------------------------------------------- */
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip {
  padding: 9px 16px;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 999px;
  font: 600 13.5px/1 var(--font);
  color: var(--ink-mid);
  cursor: pointer;
  transition: all .18s var(--ease);
}
.chip:hover { color: var(--ink); border-color: #3a465c; }
.chip.is-active {
  background: var(--gold);
  border-color: var(--gold);
  color: #14171f;
}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 14px;
}

.shot {
  position: relative;
  padding: 0;
  aspect-ratio: 3 / 2;
  background: var(--surface-2);
  border: 0;
  border-radius: var(--radius);
  overflow: hidden;
  cursor: zoom-in;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.shot.is-hidden { display: none; }

/* Zwischenüberschrift je Aufnahmetag. Sie liegt im selben Raster wie die
   Bilder und nimmt deshalb die volle Breite ein. */
.gallery__day {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 12px;
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}
.gallery__day:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.gallery__day.is-hidden { display: none; }
.gallery__day h3 {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(19px, 2.4vw, 24px);
  text-transform: uppercase;
  letter-spacing: .01em;
}
.gallery__count { margin-left: auto; font-size: 13.5px; color: var(--ink-dim); }
.gallery__more { display: flex; justify-content: center; margin: 22px 0 8px; }

@media (max-width: 560px) {
  .gallery__count { margin-left: 0; }
}
.shot:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.shot img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s var(--ease), opacity .4s var(--ease);
}
.shot:hover img { transform: scale(1.06); }
.shot img.is-loading { opacity: 0; }

.shot__cap {
  position: absolute;
  inset: auto 0 0;
  padding: 34px 14px 12px;
  background: linear-gradient(180deg, transparent, rgba(6, 8, 12, .9));
  text-align: left;
  font-size: 13px;
  color: #e6ebf3;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .25s var(--ease), transform .25s var(--ease);
}
.shot:hover .shot__cap, .shot:focus-visible .shot__cap { opacity: 1; transform: none; }

/* Kennzeichnet das Bild, das über dem Bericht dieses Tages steht. */
.shot__lead {
  position: absolute;
  top: 9px; left: 9px;
  z-index: 1;
  padding: 5px 10px;
  background: var(--gold);
  border-radius: 999px;
  font: 700 10.5px/1 var(--font);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #14171f;
}

.notice {
  margin-top: clamp(30px, 4vw, 44px);
  padding: clamp(22px, 3vw, 32px);
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-left: 3px solid var(--gold);
  border-radius: var(--radius);
}
.notice h3 { font-size: 20px; margin-bottom: 12px; }
.notice ul { margin: 0; padding-left: 20px; color: var(--ink-mid); font-size: 15.5px; }
.notice li { margin-bottom: 7px; }
.notice li:last-child { margin-bottom: 0; }

/* ---------------------------------------------------------
   Ergebnisse
   --------------------------------------------------------- */
.tally {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: clamp(28px, 4vw, 42px);
}
.tally__item {
  display: grid;
  gap: 4px;
  padding: 18px 12px 16px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  text-align: center;
}
.tally__item--gold { border-color: rgba(245, 197, 66, .55); }
.tally__item--silber { border-color: rgba(196, 204, 216, .4); }
.tally__item--bronze { border-color: rgba(205, 127, 50, .5); }
.tally__num {
  font-family: var(--font-display);
  font-size: clamp(32px, 5vw, 44px);
  line-height: 1;
  letter-spacing: .02em;
}
.tally__item--gold .tally__num { color: var(--gold); }
.tally__item--silber .tally__num { color: #d5dbe6; }
.tally__item--bronze .tally__num { color: #d08a4a; }
.tally__lbl {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-dim);
}

.medals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
  margin-bottom: clamp(36px, 5vw, 56px);
}
.medal {
  display: grid;
  gap: 6px;
  padding: 20px 20px 18px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  border-left-width: 3px;
}
.medal--gold { border-left-color: var(--gold); }
.medal--silber { border-left-color: #c4ccd8; }
.medal--bronze { border-left-color: #cd7f32; }
.medal__rank {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.medal--gold .medal__rank { color: var(--gold); }
.medal--silber .medal__rank { color: #d5dbe6; }
.medal--bronze .medal__rank { color: #d08a4a; }
.medal__who {
  font-family: var(--font-display);
  font-size: 22px;
  letter-spacing: .01em;
}
.medal__cat, .medal__score { font-size: 14.5px; color: var(--ink-mid); }
.medal__score { font-variant-numeric: tabular-nums; }

.nations, .gerlist, .podiums { margin-top: clamp(36px, 5vw, 56px); }
.nations h3, .gerlist h3, .podiums h3 {
  font-size: clamp(21px, 3vw, 27px);
  margin: 0 0 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line-soft);
}

.nations__list, .gerlist__list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.nations__list li, .gerlist__list li {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: baseline;
  padding: 12px 4px;
  border-bottom: 1px solid var(--line-soft);
  font-size: 16px;
}
.nations__list li:last-child, .gerlist__list li:last-child { border-bottom: 0; }
.nations__rank, .gerlist__rank {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  color: var(--ink-dim);
}
.nations__list .is-ger {
  color: var(--ink);
  background: rgba(245, 197, 66, .08);
  margin: 0 -12px;
  padding-left: 16px;
  padding-right: 16px;
  border-radius: 10px;
  border-bottom-color: transparent;
}
.nations__list .is-ger .nations__rank,
.nations__list .is-ger .nations__team { color: var(--gold); }
.nations__pts, .gerlist__score {
  font-variant-numeric: tabular-nums;
  color: var(--ink-mid);
}
.gerlist__who { font-weight: 600; }
.gerlist__cat { color: var(--ink-mid); font-size: 14.5px; }
.gerlist__list li {
  grid-template-columns: 42px minmax(0, 1.1fr) minmax(0, 1.4fr) auto;
}

.podiums__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 14px;
}
.podium {
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
  overflow: hidden;
}
.podium__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 14px;
  padding: 16px 18px 12px;
}
.podium__head b { font-family: var(--font-display); font-size: 18px; }
.podium__head span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.podium__list { list-style: none; margin: 0; padding: 0 18px 14px; }
.podium__list li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-top: 1px solid var(--line-soft);
  font-size: 15px;
}
.podium__list .is-ger .place__who { color: var(--gold); font-weight: 600; }
.place {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  font-size: 12px;
  font-weight: 700;
  background: var(--surface-2);
  color: var(--ink-dim);
}
.place--gold { background: rgba(245, 197, 66, .2); color: var(--gold); }
.place--silber { background: rgba(196, 204, 216, .16); color: #d5dbe6; }
.place--bronze { background: rgba(205, 127, 50, .18); color: #d08a4a; }
.place__who { min-width: 0; }
.place__who small {
  display: block;
  font-size: 12.5px;
  color: var(--ink-dim);
  font-weight: 400;
}
.place__score {
  font-variant-numeric: tabular-nums;
  font-size: 14px;
  color: var(--ink-mid);
}

.results__note {
  margin: clamp(28px, 4vw, 40px) 0 0;
  font-size: 14.5px;
  color: var(--ink-dim);
}
.results__note a { color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 720px) {
  .tally { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gerlist__list li {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    grid-template-areas:
      "rank who score"
      "rank cat cat";
  }
  .gerlist__rank { grid-area: rank; }
  .gerlist__who { grid-area: who; }
  .gerlist__cat { grid-area: cat; }
  .gerlist__score { grid-area: score; }
}

/* ---------------------------------------------------------
   Team – Kader als dichte Presse-Liste, kein Kachel-Raster
   --------------------------------------------------------- */
.group { margin-bottom: clamp(36px, 5vw, 56px); }
.group__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 16px;
  margin-bottom: 4px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}
.group__head h3 {
  font-size: clamp(18px, 2.2vw, 22px);
  letter-spacing: .04em;
}
.group__note {
  font-size: 13px;
  color: var(--ink-dim);
  letter-spacing: .02em;
}

.riders {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
}

@media (min-width: 720px) {
  .riders {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 28px;
  }
}

@media (min-width: 1100px) {
  .riders {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.rider {
  position: relative;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 16px 4px 16px 0;
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line-soft);
  border-radius: 0;
  overflow: visible;
  transition: background-color .2s var(--ease);
}
.rider:last-child { border-bottom-color: transparent; }

@media (min-width: 720px) {
  /* In Mehrspalten: Trennlinie je Zelle, letzte Reihe optisch leichter. */
  .rider { border-bottom-color: var(--line-soft); }
}

.rider__body {
  min-width: 0;
  display: grid;
  gap: 4px;
  align-content: center;
}

.rider__cat {
  margin: 0;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-dim);
  line-height: 1.3;
}

.rider__name {
  margin: 0;
  font-family: var(--font-display);
  font-size: clamp(17px, 1.8vw, 20px);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  line-height: 1.15;
  overflow-wrap: break-word;
}

.rider__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  margin: 4px 0 0;
  line-height: 1.35;
}

.rider__badge {
  display: inline;
  margin: 0;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .01em;
  color: var(--gold);
}
.rider__badge--muted { color: var(--ink-dim); font-weight: 500; }
.rider__badge + .rider__badge::before {
  content: "·";
  margin-right: 12px;
  color: var(--ink-dim);
  font-weight: 400;
}

.rider__avatar {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  border: 1px solid var(--line);
  background: var(--surface-2);
  object-fit: cover;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.rider__avatar--initials {
  display: grid;
  place-items: center;
  background:
    linear-gradient(145deg, rgba(226, 59, 50, .18), transparent 55%),
    linear-gradient(155deg, #232c40, var(--surface-2));
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--ink-mid);
  user-select: none;
}

.rider__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  color: inherit;
  text-decoration: none;
  transition: color .2s var(--ease);
}
/* Klickfläche = gesamte Zeile (Instagram). */
.rider__link::after {
  content: "";
  position: absolute;
  inset: 0;
}
.rider__ig {
  flex: none;
  width: 14px;
  height: 14px;
  color: var(--ink-dim);
  transition: color .2s var(--ease);
}

.rider--linked:hover,
.rider--linked:focus-within {
  background: linear-gradient(90deg, rgba(245, 197, 66, .06), transparent 70%);
  cursor: pointer;
}
.rider--linked:hover .rider__link,
.rider__link:hover,
.rider__link:focus-visible { color: var(--gold); }
.rider--linked:hover .rider__ig,
.rider__link:hover .rider__ig,
.rider__link:focus-visible .rider__ig { color: var(--gold); }
.rider--linked:hover .rider__avatar,
.rider--linked:focus-within .rider__avatar {
  border-color: rgba(245, 197, 66, .45);
}

@media (max-width: 419px) {
  .rider {
    grid-template-columns: 60px minmax(0, 1fr);
    gap: 12px;
    padding: 14px 2px 14px 0;
  }
  .rider__avatar { width: 60px; height: 60px; border-radius: 8px; }
  .rider__avatar--initials { font-size: 18px; }
}

.staff {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.person {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  padding: 14px 16px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius);
}
.person .rider__avatar { width: 54px; height: 54px; }
.person .rider__avatar--initials { font-size: 17px; }
.person b { display: block; font-size: 16.5px; }
.person span { font-size: 13.5px; color: var(--ink-dim); }

/* ---------------------------------------------------------
   Links / Kontakt
   --------------------------------------------------------- */
.linkgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(270px, 100%), 1fr));
  gap: 14px;
}
.linkcard {
  display: grid;
  align-content: start;
  gap: 8px;
  min-width: 0;
  padding: clamp(22px, 3vw, 30px);
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  text-decoration: none;
  overflow: hidden;
  transition: border-color .25s var(--ease), transform .25s var(--ease), background-color .25s var(--ease);
}
.linkcard:hover {
  border-color: rgba(245, 197, 66, .5);
  background: var(--surface-2);
  transform: translateY(-3px);
}
.linkcard b {
  font-family: var(--font-display);
  font-size: clamp(17px, 1.7vw, 22px);
  line-height: 1.15;
  text-transform: uppercase;
  overflow-wrap: anywhere;
  word-break: break-word;
  hyphens: none;
}
.linkcard span {
  font-size: 14.5px;
  color: var(--ink-mid);
  overflow-wrap: anywhere;
}
.linkcard em {
  font-style: normal;
  font-size: 12.5px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--gold);
}

.contact {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
}
.card {
  padding: clamp(24px, 3vw, 32px);
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
}
.card h3 { font-size: 21px; margin-bottom: 6px; }
.card .role {
  margin: 0 0 16px;
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--gold);
}
.card dl { display: grid; gap: 10px; margin: 0; }
.card dl > div { display: grid; gap: 2px; }
.card dt {
  font-size: 11.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.card dd { margin: 0; font-size: 16px; }
.card dd a { text-decoration: none; border-bottom: 1px solid rgba(245, 197, 66, .45); }
.card dd a:hover { color: var(--gold); }
.card p { color: var(--ink-mid); font-size: 15.5px; }

/* ---------------------------------------------------------
   Verband und Partner
   --------------------------------------------------------- */
.section--partners { padding: clamp(52px, 7vw, 84px) 0; }

.partners {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 14px;
}

.partner {
  display: grid;
  justify-items: center;
  align-content: center;
  gap: 16px;
  min-height: 138px;
  padding: 26px 22px;
  background: var(--surface);
  border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: border-color .25s var(--ease), background-color .25s var(--ease),
              transform .25s var(--ease);
}
.partner:hover {
  border-color: rgba(245, 197, 66, .5);
  background: var(--surface-2);
  transform: translateY(-3px);
}

/* Die Höhe kommt je Logo aus data.js, die Breite begrenzt die Kachel. Das feste
   Maß des Kastens hält die Beschriftungen aller Kacheln auf einer Linie. */
.partner__logo {
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 56px;
}
.partner__logo img { width: auto; max-width: 100%; }

.partner__role {
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--ink-dim);
}
.partner:hover .partner__role { color: var(--ink-mid); }

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.footer {
  padding: clamp(44px, 6vw, 68px) 0 30px;
  background: #070910;
  border-top: 1px solid var(--line-soft);
}
.footer__inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 26px;
  padding-bottom: 26px;
}
.footer__brand {
  margin: 0 0 6px;
  font-family: var(--font-display);
  font-size: 22px;
  text-transform: uppercase;
}
.footer__small { margin: 0; max-width: 52ch; font-size: 14px; color: var(--ink-dim); }
.footer__links { display: grid; gap: 8px; align-content: start; }
.footer__links a {
  font-size: 14.5px;
  color: var(--ink-mid);
  text-decoration: none;
}
.footer__links a:hover { color: var(--gold); }
.footer__legal {
  padding-top: 24px;
  border-top: 1px solid var(--line-soft);
}
/* Mindestens 4.5:1 auf dem Footer-Hintergrund (#070910), sonst faellt
   Lighthouse beim Kontrast durch. */
.footer__legal p { margin: 0; font-size: 13px; color: #9aa3b5; }

/* ---------------------------------------------------------
   Lightbox
   --------------------------------------------------------- */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  padding: clamp(14px, 3vw, 42px);
  background: rgba(4, 6, 10, .95);
  backdrop-filter: blur(6px);
  animation: fade .2s var(--ease);
}
.lightbox[hidden] { display: none; }
@keyframes fade { from { opacity: 0; } }

.lightbox__figure {
  display: grid;
  gap: 16px;
  margin: 0;
  max-width: min(1200px, 100%);
  max-height: 100%;
}
.lightbox__figure img {
  max-height: min(76vh, 900px);
  width: auto;
  margin-inline: auto;
  border-radius: 10px;
  box-shadow: 0 30px 80px -30px #000;
}
.lightbox__figure figcaption {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.lightbox__figure figcaption p { margin: 0; font-size: 15.5px; }
.lightbox__credit { color: var(--ink-dim); font-size: 13.5px !important; margin-top: 4px !important; }

.lightbox__close,
.lightbox__nav {
  position: absolute;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .16);
  color: #fff;
  cursor: pointer;
  transition: background-color .18s var(--ease), transform .18s var(--ease);
}
.lightbox__close:hover, .lightbox__nav:hover { background: rgba(255, 255, 255, .18); }

.lightbox__close {
  top: 18px; right: 18px;
  width: 44px; height: 44px;
  border-radius: 50%;
  font-size: 26px;
  line-height: 1;
}
.lightbox__nav {
  top: 50%;
  width: 52px; height: 52px;
  margin-top: -26px;
  border-radius: 50%;
  font-size: 30px;
  line-height: 1;
}
.lightbox__nav--prev { left: 14px; }
.lightbox__nav--next { right: 14px; }
.lightbox__nav:hover { transform: scale(1.06); }

body.is-locked { overflow: hidden; }

/* Titelbildwahl in der Grossansicht (nur im Redaktionsmodus sichtbar).
   Zusammen mit Bildunterschrift und Knopf braucht die Zeile Platz, deshalb
   bekommt das Bild in diesem Modus etwas weniger Hoehe. */
.lightbox.is-redaktion .lightbox__figure img { max-height: min(58vh, 720px); }

.lbedit {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: rgba(255, 255, 255, .045);
}
.lbedit__label { font: 600 13.5px/1.3 var(--font); color: var(--ink-mid); }
.lbedit__select {
  flex: 1 1 130px;
  min-width: 0;
  min-height: 44px;
  padding: 0 12px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  font: 600 14px/1 var(--font);
}
.lbedit__btn { min-height: 44px; }
.lbedit__hint {
  flex: 1 1 100%;
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: var(--ink-dim);
}
.lbedit__hint.is-ok { color: var(--gold); }
.lbedit__hint.is-error { color: #ffb4ae; }

@media (max-width: 520px) {
  .lbedit__label, .lbedit__select, .lbedit__btn { flex: 1 1 100%; }
  .lbedit__btn { justify-content: center; }
}

.noscript {
  padding: 60px 0;
}

/* ---------------------------------------------------------
   Reveal on scroll
   --------------------------------------------------------- */
.reveal {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.reveal.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */
@media (max-width: 980px) {
  .post { grid-template-columns: 1fr; }
  .post__media { min-height: 210px; aspect-ratio: 16 / 9; }
}

@media (max-width: 820px) {
  html { scroll-padding-top: 74px; }

  /* Eine Zeile: Marke · Livestream · Toggle. Menü als Overlay darunter,
     damit der Burger nicht umbricht. */
  .nav__inner {
    position: relative;
    flex-wrap: nowrap;
    min-height: 64px;
    gap: 8px;
  }
  .nav__lockup {
    flex: 1 1 auto;
    min-width: 0;
    margin-right: 0;
    gap: 10px;
  }
  .nav__toggle {
    display: grid;
    order: 3;
    flex: none;
  }
  .btn--live {
    order: 2;
    flex: none;
    --btn-pad: 9px 12px;
    font-size: 13px;
  }

  .nav__links {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 110;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    margin: 0;
    padding: 12px 0 16px;
    border-top: 1px solid var(--line-soft);
    background: rgba(10, 13, 19, .98);
    box-shadow: 0 28px 48px -20px rgba(0, 0, 0, .7);
  }
  .nav.is-open .nav__links { display: flex; }
  .nav.is-open {
    background: rgba(10, 13, 19, .98);
    border-bottom-color: var(--line-soft);
  }
  .nav__links a {
    display: block;
    width: 100%;
    padding: 14px 16px;
    font-size: 17px;
    border-radius: 12px;
  }
  .nav__links a.is-active {
    background: rgba(245, 197, 66, .14);
  }

  .nav.is-open .nav__toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav.is-open .nav__toggle span:nth-child(2) { opacity: 0; }
  .nav.is-open .nav__toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

  .brand { min-width: 0; }
  .brand__text { min-width: 0; }
  .brand__text small { display: none; }
  .brand__text strong {
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .nav__org a { padding-left: 10px; }
  .nav__org img { height: 30px; }

  .section__head { align-items: flex-start; }
  .countdown__unit { min-width: 72px; padding: 10px 12px 8px; }
  .countdown__num { font-size: 27px; }

  .lightbox__nav { width: 44px; height: 44px; margin-top: -22px; font-size: 25px; }
  .lightbox__nav--prev { left: 6px; }
  .lightbox__nav--next { right: 6px; }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .gallery { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }

  /* Hero-Titel: „Nationalmannschaft“ darf nicht aus dem Viewport laufen. */
  .hero__title {
    font-size: clamp(26px, 7.6vw, 34px);
    letter-spacing: 0;
    line-height: 1.05;
  }

  /* Alle vier Countdown-Werte sollen in eine Zeile passen */
  .countdown { gap: 7px; }
  .countdown__unit { min-width: 0; flex: 1; padding: 9px 6px 7px; }
  .countdown__num { font-size: 24px; }
  .countdown__lbl { font-size: 9.5px; letter-spacing: .06em; }

  .hero__cta .btn { width: 100%; }

  .nav__org { display: none; }
  .hero__org { display: flex; }
  .partner { min-height: 124px; padding: 24px 20px; }
}

/* ---------------------------------------------------------
   Trefferflächen auf Touchgeräten
   ---------------------------------------------------------
   Reine Textlinks sind nur so hoch wie ihre Zeile – bei den Kontaktdaten
   rund 21 px. Zum Antippen ist das zu wenig; die Barrierefreiheitsrichtlinie
   nennt 24 px als Untergrenze, angenehm sind etwa 40 px. Die Fläche wächst
   deshalb über Innenabstände, die ein negativer Außenabstand wieder
   ausgleicht: Die Links sind leichter zu treffen, das Layout bleibt gleich.
   Bei den Athletenkarten ist das nicht nötig, dort liegt bereits ein
   unsichtbares Overlay über der ganzen Karte. */
@media (pointer: coarse) {
  .card dd a {
    display: inline-block;
    padding-block: 10px;
    margin-block: -10px;
  }

  /* Die Wortmarke ist ein inline-flex-Element aus Flagge und Text – die
     Anzeigeart darf hier nicht verändert werden, sonst rutscht der Text
     unter die Flagge. */
  .brand {
    padding-block: 9px;
    margin-block: -9px;
  }

  /* In der Fußzeile stehen die Links untereinander in einem Raster. Hier
     reicht der Abstand nicht für einen vollen Ausgleich, sonst würden sich
     benachbarte Flächen überlappen und Tipps landeten im falschen Link. */
  .footer__links a {
    display: inline-block;
    padding-block: 8px;
    margin-block: -4px;
  }
}

@media print {
  /* Die Partnerlogos sind für dunklen Grund aufbereitet – auf weißem Papier
     wäre die helle Variante unsichtbar, deshalb im Druck ausgeblendet. */
  .nav, .hero__bg, .hero__scrim, .lightbox, .post__actions, .nav__toggle,
  .section--partners { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  .section { padding: 18pt 0; }
  a { color: #000; }
}