/* Eintracht Frankfurt Triathlon - gemeinsames Stylesheet
 * Alle Klassen mit Präfix ef- (keine Kollision mit Tailwind/Bootstrap).
 * Keine Element-Selektoren: wirkt nur, wo ef-Klassen gesetzt sind. */

@font-face {
  font-family: "Eintracht Display Headline";
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/Eintracht-Display-Headline-400.woff2") format("woff2")
}

@font-face {
  font-family: "Eintracht Display Headline Condensed";
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/Eintracht-Display-Headline-Condensed-400.woff2") format("woff2")
}

@font-face {
  font-family: "Eintracht Display Subline";
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/Eintracht-Display-Subline-400.woff2") format("woff2")
}

@font-face {
  font-family: "Eintracht Sans";
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/Eintracht-Sans-400.woff2") format("woff2")
}

@font-face {
  font-family: "Eintracht Sans";
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/Eintracht-Sans-700.woff2") format("woff2")
}

@font-face {
  font-family: "Noto Sans";
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/NotoSans-400.woff2") format("woff2")
}

@font-face {
  font-family: "Noto Sans";
  font-weight: 700;
  font-display: swap;
  src: url("/fonts/NotoSans-700.woff2") format("woff2")
}

:root {
  --ef-red: #E1001A;
  --ef-red-dark: #B80015;
  --ef-black: #1A1A1A;
  --ef-dark: #2D2D2D;
  --ef-gray: #F5F5F5;
  --ef-line: #e0e0e0;
  --ef-muted: #5f6368;
  --ef-white: #fff;
  --ef-font-display: "Eintracht Display Headline", "Eintracht Sans", sans-serif;
  --ef-font-condensed: "Eintracht Display Headline Condensed", "Eintracht Sans", sans-serif;
  --ef-font-subline: "Eintracht Display Subline", "Eintracht Sans", sans-serif;
  --ef-font-sans: "Eintracht Sans", system-ui, sans-serif;
  --ef-font-body: "Noto Sans", system-ui, sans-serif;
  --ef-max: 1200px;
  --ef-gap: 24px;
}

/* Grundgerüst */
.ef-body {
  margin: 0;
  background: var(--ef-white);
  color: var(--ef-black);
  font-family: var(--ef-font-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased
}

.ef-container {
  max-width: var(--ef-max);
  margin: 0 auto;
  padding: 0 20px
}

.ef-section {
  padding: 48px 0
}

.ef-section--gray {
  background: var(--ef-gray)
}

/* Typografie */
.ef-title {
  font-family: var(--ef-font-display);
  font-style: italic;
  text-transform: uppercase;
  font-size: clamp(28px, 5vw, 48px);
  line-height: 1;
  margin: 0 0 16px;
  letter-spacing: .01em
}

.ef-h2 {
  font-family: var(--ef-font-display);
  font-style: italic;
  text-transform: uppercase;
  font-size: clamp(22px, 3vw, 30px);
  line-height: 1.05;
  margin: 0 0 20px
}

.ef-h3 {
  font-family: var(--ef-font-sans);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.2;
  margin: 0 0 8px
}

.ef-lead {
  font-size: 18px;
  max-width: 760px
}

.ef-meta {
  font-family: var(--ef-font-sans);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--ef-muted)
}

.ef-link {
  color: var(--ef-black);
  font-weight: 700;
  text-decoration: none;
  border-bottom: 2px solid var(--ef-red)
}

.ef-link:hover {
  color: var(--ef-red)
}

.ef-section-head {
  display: flex;
  align-items: baseline;
  gap: 16px;
  margin-bottom: 20px
}

.ef-section-head .ef-h2 {
  margin: 0
}

.ef-more {
  font-family: var(--ef-font-sans);
  font-size: 13px;
  font-weight: 700;
  color: var(--ef-black);
  text-decoration: none
}

.ef-more:hover {
  color: var(--ef-red)
}

.ef-more::after {
  content: " \2192";
  color: var(--ef-red)
}

/* Kopfleiste */
.ef-topbar { background: var(--ef-white); color: var(--ef-black); font-family: var(--ef-font-sans); font-size: 14px; border-bottom: 1px solid var(--ef-line) }

.ef-topbar .ef-container {
  display: flex;
  align-items: center;
  gap: 16px;
  min-height: 56px
}

.ef-topbar a { color: var(--ef-black); text-decoration: none }

.ef-topbar a:hover {
  color: var(--ef-red)
}

.ef-topbar-spacer {
  flex: 1
}

.ef-breadcrumb {
  font-size: 12px;
  color: var(--ef-muted);
  padding: 10px 0;
  display: flex;
  gap: 8px;
  flex-wrap: wrap
}

.ef-breadcrumb a {
  color: var(--ef-black);
  text-decoration: none
}

/* Hero */
.ef-hero {
  position: relative;
  min-height: 320px;
  display: flex;
  align-items: flex-end;
  background: var(--ef-dark) center/cover no-repeat;
  color: var(--ef-white)
}

.ef-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 0, 0, .55), rgba(0, 0, 0, 0) 60%)
}

.ef-hero .ef-container {
  position: relative;
  width: 100%;
  padding-bottom: 32px
}

.ef-hero .ef-title {
  color: var(--ef-white);
  margin: 0
}

/* Buttons */
.ef-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 22px;
  border: 2px solid var(--ef-red);
  background: var(--ef-red);
  color: var(--ef-white);
  font-family: var(--ef-font-sans);
  font-weight: 700;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .05em;
  text-decoration: none;
  border-radius: 0;
  cursor: pointer;
  line-height: 1
}

.ef-btn:hover {
  background: var(--ef-red-dark);
  border-color: var(--ef-red-dark);
  color: var(--ef-white)
}

.ef-btn--outline {
  background: transparent;
  color: var(--ef-black);
  border-color: var(--ef-black)
}

.ef-btn--outline:hover {
  background: var(--ef-black);
  border-color: var(--ef-black);
  color: var(--ef-white)
}

.ef-btn--small {
  padding: 8px 14px;
  font-size: 12px
}

.ef-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center
}

/* News-Karten */
.ef-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: var(--ef-gap)
}

.ef-cards--scroll {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(260px, 1fr);
  grid-template-columns: none;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 8px
}

.ef-cards--scroll>* {
  scroll-snap-align: start
}

.ef-card {
  display: flex;
  flex-direction: column;
  background: var(--ef-white);
  color: inherit;
  text-decoration: none
}

.ef-card-img {
  display: block;
  width: 100%;
  aspect-ratio: 3/2;
  object-fit: cover;
  background: var(--ef-gray)
}

.ef-card-body {
  padding: 12px 0 0;
  display: flex;
  flex-direction: column;
  gap: 6px
}

.ef-card-title {
  font-family: var(--ef-font-sans);
  font-weight: 700;
  font-size: 20px;
  line-height: 1.2;
  margin: 0
}

a.ef-card:hover .ef-card-title {
  color: var(--ef-red)
}

.ef-card-text {
  font-size: 14px;
  color: var(--ef-dark);
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden
}

/* Kacheln (Abteilung, Training, ...) */
.ef-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--ef-gap)
}

.ef-tile {
  color: var(--ef-black);
  text-decoration: none;
  font-family: var(--ef-font-sans);
  font-weight: 700;
  font-size: 18px
}

.ef-tile img {
  display: block;
  width: 100%;
  aspect-ratio: 3/2;
  object-fit: cover;
  margin-bottom: 10px
}

.ef-tile:hover {
  color: var(--ef-red)
}

/* Infobox (Vorteile, Kontakt) */
.ef-box {
  background: var(--ef-gray);
  padding: 28px
}

.ef-box-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--ef-gap)
}

.ef-list {
  margin: 0;
  padding: 0;
  list-style: none
}

.ef-list li {
  position: relative;
  padding-left: 18px;
  margin: 4px 0
}

.ef-list li::before {
  content: "\2013";
  position: absolute;
  left: 0;
  color: var(--ef-red);
  font-weight: 700
}

/* Artikel */
.ef-article { max-width: 760px; width: 100%; box-sizing: border-box; font-family: var(--ef-font-body); color: var(--ef-black); line-height: 1.6 }

.ef-article img {
  max-width: 100%;
  height: auto
}

.ef-article a { color: var(--ef-red) }

/* Tabellen (Reports, Listen) */
.ef-table-wrap {
  overflow-x: auto
}

.ef-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px
}

.ef-table th {
  text-align: left;
  font-family: var(--ef-font-sans);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
  padding: 10px 12px;
  border-bottom: 2px solid var(--ef-black);
  white-space: nowrap
}

.ef-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--ef-line);
  vertical-align: top
}

.ef-table tbody tr:hover {
  background: var(--ef-gray)
}

/* Filter und Formulare */
.ef-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  background: var(--ef-gray);
  padding: 16px;
  margin-bottom: 20px
}

.ef-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 160px
}

.ef-label {
  font-family: var(--ef-font-sans);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em
}

.ef-input {
  font: inherit;
  font-size: 15px;
  padding: 9px 10px;
  border: 1px solid #ccc;
  border-radius: 0;
  background: var(--ef-white);
  color: var(--ef-black)
}

.ef-input:focus {
  outline: 2px solid var(--ef-red);
  outline-offset: -1px;
  border-color: var(--ef-red)
}

/* Badges */
.ef-badge {
  display: inline-block;
  padding: 2px 8px;
  font-family: var(--ef-font-sans);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  background: var(--ef-black);
  color: var(--ef-white)
}

.ef-badge--red {
  background: var(--ef-red)
}

.ef-badge--light {
  background: var(--ef-gray);
  color: var(--ef-black)
}

/* Fußbereich */
.ef-footer {
  background: var(--ef-gray);
  padding: 40px 0 24px;
  font-size: 13px;
  color: var(--ef-dark)
}

.ef-footer-logos {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-bottom: 32px
}

.ef-footer-logos img {
  max-height: 36px;
  width: auto
}

.ef-footer-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--ef-gap);
  margin-bottom: 24px
}

.ef-footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  border-top: 1px solid var(--ef-line);
  padding-top: 16px;
  font-size: 12px
}

.ef-footer a {
  color: var(--ef-dark);
  text-decoration: none
}

.ef-footer a:hover {
  color: var(--ef-red)
}

@media (max-width:640px) {
  .ef-section {
    padding: 32px 0
  }

  .ef-hero {
    min-height: 220px
  }

  .ef-box {
    padding: 20px
  }
}
.ef-topbar--fixed { position:fixed; top:0; left:0; right:0; z-index:106; border-top:4px solid var(--ef-red); padding:16px 24px; display:flex; align-items:center; justify-content:space-between; gap:16px }
.ef-topbar-brand { display:flex; align-items:center; gap:8px; font-family:var(--ef-font-subline); font-size:20px; text-transform:uppercase; min-width:0 }
.ef-topbar-tools { display:flex; align-items:center; gap:16px; font-family:var(--ef-font-subline); font-size:16px }
.ef-topbar-menu { display:flex; cursor:pointer; margin-right:8px }
.ef-topbar-menu img { width: 32px; height: 32px; filter: none }
.ef-topbar-logo { height:40px; width:auto; display:block }
.ef-topbar-sep { display:inline-flex; color:var(--ef-muted) }
.ef-topbar-sep svg { width:16px; height:16px }
.ef-topbar-search svg { width:20px; height:20px; display:block }
.ef-topbar-user { display: flex; align-items: center; gap: 16px; font-family: var(--ef-font-sans); font-size: 14px; color: var(--ef-black); text-transform: none }
.ef-topbar-user-name { font-weight:700 }
.ef-subnav { position:fixed; top:4.5rem; left:0; width:100%; z-index:105; padding:4px 40px 2px; background:#fff; border-bottom:1px solid #e5e5e5; font-family:var(--ef-font-sans); font-size:14px; line-height:40px }
.ef-subnav-inner { max-width: 64rem; margin: 0 auto; padding-top: 4px; display: flex; align-items: center; gap: 24px; line-height: 32px; overflow-x: auto; white-space: nowrap; scrollbar-width: none }
.ef-subnav-link { color: var(--ef-black); text-decoration: none; border-bottom: 4px solid transparent; transition: border-color .15s; flex-shrink: 0 }
.ef-subnav-link:hover, .ef-subnav-link.is-active { border-bottom-color:var(--ef-red) }
.ef-subnav-home { font-weight:700 }
.ef-subnav-sep { display:inline-flex; color:var(--ef-muted); margin:0 -16px }
.ef-hero--page { z-index: 101; height: auto; max-height: none; min-height: 0; background-position: center top; padding-top: calc(4.5rem + 48px + 32px) }
.ef-hero-title { font-size: clamp(32px, 5vw, 56px); line-height: 1.05; text-transform: uppercase }
.ef-hero-lead { margin: 16px 0 0; font-family: var(--ef-font-sans); font-size: 18px; line-height: 1.4; color: var(--ef-white); max-width: 46rem }
.ef-hero-lead:empty { display: none }
.ef-footer--site { position: sticky; padding: 48px 40px 32px; border-bottom: 8px solid var(--ef-red); font-family: var(--ef-font-sans); font-size: 14px; display: flex; flex-direction: column; gap: 48px; top: 100dvh }
.ef-footer--site .ef-footer-logos { justify-content:space-between; gap:24px; margin-bottom:0 }
.ef-footer--site .ef-footer-logos > div { flex:1 1 0; width:auto; display:flex; align-items:center }
.ef-footer--site .ef-footer-logos img { max-height:64px; max-width:60%; width:auto; height:auto }
.ef-footer--site .ef-footer-cols { gap:32px; margin-bottom:0 }
.ef-footer--site .ef-footer-cols > div { width:auto; display:flex; flex-direction:column; gap:12px }
.ef-footer-heading { margin:0; font-family:var(--ef-font-sans); font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ef-black) }
.ef-footer-text { margin:0; font-size:14px; line-height:1.5; color:var(--ef-dark) }
.ef-footer--site .ef-footer-legal { justify-content:space-between; align-items:center; gap:16px 32px; font-size:13px }
.ef-footer-legal-links { display:flex; flex-wrap:wrap; gap:8px 32px }
.ef-footer-powered { display:inline-flex; align-items:center; gap:4px; white-space:nowrap }
.ef-footer-powered img { height:16px; width:auto }
.ef-dialog { width:calc(100% - 32px); max-width:1024px; max-height:calc(100vh - 64px); margin:auto; padding:clamp(24px,4vw,48px); border:0; border-top:6px solid var(--ef-red); border-radius:0; background:var(--ef-white); color:var(--ef-dark); font-family:var(--ef-font-sans); font-size:15px; line-height:1.6; overflow:auto }
.ef-dialog::backdrop { background:rgba(0,0,0,.6) }
.ef-dialog h1 { margin:0 48px 24px 0; padding:0; font-family:var(--ef-font-display); font-style:italic; font-weight:700; text-transform:uppercase; font-size:clamp(26px,3.5vw,36px); line-height:1.1; color:var(--ef-black) }
.ef-dialog h2 { margin:24px 0 8px; padding:0; font-size:18px; font-weight:700; color:var(--ef-black) }
.ef-dialog h3 { margin:20px 0 6px; padding:0; font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ef-black) }
.ef-dialog a { color:var(--ef-red); text-decoration:underline }
.ef-dialog ul { list-style:none; margin:8px 0; padding:0 }
.ef-dialog li { position:relative; margin:4px 0; padding-left:18px }
.ef-dialog li::before { content:""; position:absolute; left:0; top:.75em; width:8px; height:2px; background:var(--ef-red) }
.ef-dialog-close { position:absolute; top:20px; right:20px; padding:0; border:0; background:none; color:var(--ef-muted); line-height:0; cursor:pointer }
.ef-dialog-close:hover { color:var(--ef-red) }
.ef-dialog-close svg { width:28px; height:28px }
.ef-dialog-done { margin-top:32px }
.ef-mobile-menu { position: fixed; top: 0; bottom: 0; left: 0; width: min(100vw, 22rem); z-index: 200; overflow-y: auto; box-sizing: border-box; background: var(--ef-white); color: var(--ef-black); border-top: 4px solid var(--ef-red); padding: 24px 32px; box-shadow: 0 0 40px rgba(0,0,0,.35); font-family: var(--ef-font-sans); text-align: left; }
.ef-mobile-menu.hidden, .ef-mobile-menu .hidden { display: none; }
.ef-mobile-menu-close { position: absolute; top: 16px; right: 24px; background: none; border: 0; padding: 0; font-size: 36px; line-height: 1; cursor: pointer; color: var(--ef-black); }
.ef-mobile-menu-close:hover { color: var(--ef-red); }
.ef-mobile-menu-logo { width: auto; margin: 16px 0 32px; display: flex; align-items: center; gap: 12px }
.ef-mobile-menu-nav { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.ef-mobile-menu-nav a { font-family: var(--ef-font-condensed); font-size: 24px; text-transform: uppercase; letter-spacing: .02em; color: var(--ef-black); text-decoration: none; padding: 4px 0; border-bottom: 2px solid transparent; }
.ef-mobile-menu-nav a:hover { color: var(--ef-red); border-bottom-color: var(--ef-red); }
.ef-mobile-menu-nav a.ef-mobile-menu-login { color: var(--ef-red); }
.ef-news { position: relative; z-index: 101; box-sizing: border-box; width: 100%; background: var(--ef-white); padding: clamp(32px, 5vw, 48px) clamp(16px, 4vw, 40px); padding-left: max(clamp(16px, 4vw, 40px), calc((100% - 1280px) / 2)); padding-right: max(clamp(16px, 4vw, 40px), calc((100% - 1280px) / 2)) }
.ef-news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 18rem), 1fr)); gap: 32px; }
.ef-news-grid > div { grid-column: auto; min-width: 0; }
.ef-news-grid > div:first-child { grid-column: 1 / -1; }
.ef-article h4 { font-family: var(--ef-font-sans); font-weight: 700; margin: 0 0 8px; }
.ef-article--intro { display: flex; flex-direction: column; height: 100%; padding: 16px 20px 20px; background: var(--ef-gray); border-top: 4px solid var(--ef-red); min-width: 0; overflow: hidden; overflow-wrap: anywhere; word-break: break-word; hyphens: auto }
.ef-article-meta { margin: 0 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--ef-line); font-family: var(--ef-font-sans); font-size: 13px; color: var(--ef-muted); }
.ef-article-meta-strong { font-weight: 700; }
.ef-article-category a { color: var(--ef-red); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; text-decoration: none; }
.ef-article-category a:hover { text-decoration: underline; }
.ef-article-title { font-family: var(--ef-font-condensed); font-weight: 400; font-size: 26px; line-height: 1.15; text-transform: uppercase; margin: 8px 0 12px; color: var(--ef-black); }
.ef-article--full .ef-article-title { font-size: clamp(28px, 3.5vw, 40px); }
.ef-article-more { margin-top: auto; padding-top: 16px; }
.ef-article-more-link { font-family: var(--ef-font-sans); font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .04em; color: var(--ef-red); text-decoration: none; }
.ef-article-more-link:hover { color: var(--ef-red-dark); text-decoration: underline; }
.ef-news-lead { margin-bottom: 40px; max-width: 860px; margin-left: auto; margin-right: auto }
.ef-news-row-head { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; padding-bottom:8px; border-bottom:1px solid var(--ef-line) }
.ef-news-row-title { font-family:var(--ef-font-condensed); font-weight:400; font-size:28px; line-height:1.1; text-transform:uppercase; margin:0; color:var(--ef-black) }
.ef-news-row-nav { display: none; gap: 8px }
.ef-news-row-btn { width:40px; height:40px; border:0; background:var(--ef-black); color:var(--ef-white); font-size:24px; line-height:1; cursor:pointer }
.ef-news-row-btn:hover { background:var(--ef-red) }
.ef-news-strip { display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; overscroll-behavior-x:contain; padding-bottom:12px }
.ef-news-strip > .ef-article--intro { flex:0 0 min(85%, 20rem); height:auto; scroll-snap-align:start }
.ef-article-thumb { margin:-16px -20px 12px; aspect-ratio:16/9; overflow:hidden; background:var(--ef-black) }
.ef-article-thumb img { display:block; width:100%; height:100%; object-fit:cover }
.ef-article-thumb--empty { display:flex; align-items:center; justify-content:center; background:var(--ef-dark) }
.ef-article-thumb--empty img { width:64px; height:64px; object-fit:contain; opacity:.6 }
.ef-layout { display:flex; flex-wrap:wrap; align-items:flex-start; gap:32px; padding-top:32px; padding-bottom:48px; background:var(--ef-white); position:relative; z-index:2 }
.ef-sidenav { flex:1 1 220px; max-width:280px; display:flex; flex-direction:column; background:var(--ef-gray); border-top:4px solid var(--ef-red); padding:8px 0 }
.ef-sidenav-link { display:block; padding:10px 20px; font-family:var(--ef-font-sans); font-size:15px; color:var(--ef-black); text-decoration:none; border-left:4px solid transparent }
.ef-sidenav-link:hover { color:var(--ef-red); background:var(--ef-white) }
.ef-sidenav-link.is-active { font-weight:700; border-left-color:var(--ef-red); background:var(--ef-white) }
.ef-main { flex:999 1 480px; min-width:0; display:flex; flex-direction:column; gap:48px }
.ef-page-body { position:relative; z-index:2; background:var(--ef-white); display:flex; flex-direction:column; gap:48px }
.ef-news-category { display:flex; flex-direction:column; gap:24px }
.ef-news-category-lead { max-width:860px }
.ef-photo-mosaic { position:relative; z-index:2; background:var(--ef-black); overflow:hidden; max-height:208px }
.ef-photo-mosaic-grid { display:flex; flex-wrap:wrap; line-height:0 }
.ef-photo-mosaic-img { width:104px; height:104px; object-fit:cover; display:block }
.ef-folder-overview { flex:1 1 100%; min-width:0 }
.ef-folder-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--ef-gap); padding-bottom: 12px; width: 100% }
.ef-folder-tile { display:flex; flex-direction:column; gap:12px; padding:16px; background:var(--ef-white); border:1px solid var(--ef-line); border-top:4px solid var(--ef-red); color:var(--ef-black); text-decoration:none; transition:box-shadow .2s }
.ef-folder-tile:hover { box-shadow:0 6px 18px rgba(0,0,0,.12); color:var(--ef-red) }
.ef-folder-tile-thumbs { display:grid; grid-template-columns:repeat(4, 1fr); gap:4px; overflow:hidden; background:var(--ef-gray) }
.ef-folder-tile-thumb { width:100%; aspect-ratio:1; object-fit:cover; display:block }
.ef-folder-tile-title { font-family:var(--ef-font-sans); font-weight:700; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.ef-photo-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:var(--ef-gap) }
.ef-photo-card { display:flex; flex-direction:column; gap:8px; padding:8px; background:var(--ef-white); border:1px solid var(--ef-line); color:var(--ef-muted); font-size:12px; text-decoration:none; overflow:hidden }
.ef-photo-card-img { width:100%; aspect-ratio:4 / 3; object-fit:cover; display:block; background:var(--ef-gray) }
.ef-mobile-menu-nav a.is-active { color: var(--ef-red); border-bottom-color: var(--ef-red) }
.ef-subnav .ef-subnav-hidden { display: none }
.ef-folder-tiles > .ef-folder-tile { min-width: 0 }
.ef-main[hidden] { display:none }
.ef-scroller { position:relative }
.ef-scroller > .ef-news-strip, .ef-scroller > .ef-folder-tiles { scrollbar-width:none }
.ef-scroller-btn { position: absolute; top: 0; bottom: 12px; width: 48px; z-index: 3; display: flex; align-items: center; justify-content: center; padding: 0; border: 0; background: rgba(240,240,240,.6); color: #333; font-family: var(--ef-font-display); font-size: 0; line-height: 1; cursor: pointer; transition: background .2s, opacity .2s; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px) }
.ef-scroller-btn--prev { left:0 }
.ef-scroller-btn--next { right:0 }
.ef-scroller-btn:hover, .ef-scroller-btn:focus-visible { background: rgba(220,220,220,.85); outline: none; color: #111 }
.ef-scroller-btn.is-off { opacity:0; pointer-events:none }
.ef-scroller.is-static .ef-scroller-btn { display:none }
.ef-news-row { margin-left:calc(12px - clamp(16px, 4vw, 40px)); margin-right:calc(12px - clamp(16px, 4vw, 40px)) }
.ef-layout--wide { max-width:none; padding-left:12px; padding-right:12px }
.ef-scroller-icon { display:block; width:14px; height:14px; border-top:2px solid currentColor; border-right:2px solid currentColor }
.ef-scroller-btn--next .ef-scroller-icon { transform:translateX(-3px) rotate(45deg) }
.ef-scroller-btn--prev .ef-scroller-icon { transform:translateX(3px) rotate(-135deg) }
.ef-wissen-card { border:1px solid #e5e5e5; padding:16px 20px; background:#fff; color:inherit; text-decoration:none; transition:border-color .15s }
.ef-wissen-card:hover { border-color:var(--ef-red) }
.ef-wissen-card .ef-card-body { padding:0; height:100% }
.ef-card-more { margin-top:auto; padding-top:12px; font-size:14px; font-weight:700; color:var(--ef-red) }
.ef-wissen-heading { font-family:var(--ef-font-subline); text-transform:uppercase; font-size:28px; margin:0 0 24px }
.ef-back-link { display:inline-block; margin-bottom:16px; font-weight:700; color:var(--ef-red); text-decoration:none }
.ef-hero--hidden { display: block; height: calc(4.5rem + 48px); min-height: 0; max-height: none; background: var(--ef-white) !important; padding: 0 }
.ef-hero--hidden::before, .ef-hero--hidden .ef-container { display: none }
a.ef-article-thumb { display: block; text-decoration: none }
.ef-article-title-link { color: inherit; text-decoration: none }
.ef-article-title-link:hover { color: var(--ef-red) }
.ef-article--intro img, .ef-article--intro iframe, .ef-article--intro table { max-width: 100% }
.ef-article .ef-article-title-link { color: var(--ef-black); text-decoration: none; transition: color .3s ease-in-out }
.ef-article .ef-article-title-link:hover, .ef-article .ef-article-title-link:focus { color: var(--ef-red) }
.ef-subnav-divider { flex:0 0 1px; width:1px; height:20px; background:#e5e5e5 }
.ef-layout > .ef-sidenav { display:none }
.ef-avatar-menu { position:relative }
.ef-avatar { list-style:none; cursor:pointer; position:relative; width:36px; height:36px; border-radius:50%; overflow:hidden; background:var(--ef-red); color:var(--ef-white); display:flex; align-items:center; justify-content:center; font-family:var(--ef-font-sans); font-weight:700; font-size:14px; letter-spacing:.5px }
.ef-avatar::-webkit-details-marker { display:none }
.ef-avatar-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover }
.ef-avatar-dropdown { position:absolute; right:0; top:calc(100% + 10px); min-width:220px; background:var(--ef-white); color:var(--ef-black); border:1px solid var(--ef-line); box-shadow:0 8px 24px rgba(0,0,0,.12); padding:8px 0; z-index:200; display:flex; flex-direction:column }
.ef-avatar-head { padding:8px 16px 10px; font-weight:700; border-bottom:1px solid var(--ef-line); margin-bottom:4px }
.ef-avatar-link { display:block; padding:8px 16px; color:var(--ef-black); text-decoration:none; font-size:14px }
.ef-avatar-link:hover { background:var(--ef-gray); color:var(--ef-red) }
.ef-avatar-signout { border-top:1px solid var(--ef-line); margin-top:4px }
.ef-mydata { gap:24px }
.ef-mydata-title { margin:0 }
.ef-data-note { margin:0; color:var(--ef-black); font-family:var(--ef-font-sans); font-size:15px; line-height:1.5; max-width:720px }
.ef-data-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:24px }
.ef-data-card { background:var(--ef-gray); border-top:4px solid var(--ef-red); padding:20px 24px }
.ef-data-card h2 { margin:0 0 12px; font-family:var(--ef-font-sans); font-size:18px; font-weight:700; color:var(--ef-black) }
.ef-data-list { display:grid; grid-template-columns:minmax(120px, auto) 1fr; gap:8px 16px; margin:0; font-family:var(--ef-font-sans); font-size:15px }
.ef-data-list dt { color:#666 }
.ef-data-list dd { margin:0; color:var(--ef-black); overflow-wrap:anywhere }
.ef-data-empty { color:#999 }
.ef-avatar-dropdown, .ef-avatar-dropdown .ef-avatar-head, .ef-topbar .ef-avatar-dropdown a.ef-avatar-link { color:var(--ef-black) }
.ef-topbar .ef-avatar-dropdown a.ef-avatar-link:hover { color:var(--ef-red); background:var(--ef-gray) }
.ef-avatar-tools { border-top:1px solid var(--ef-line); margin-top:4px }
.ef-folder-overview .ef-scroller { width:100% }
.ef-page-body > .ef-folder-overview, .ef-page-body > .ef-main { align-self:stretch; width:100% }
.ef-mobile-menu-logo svg { width:64px; height:64px; flex:none }
.ef-mobile-menu-wordmark { display: flex; flex-direction: column; font-family: "Eintracht Display VF", var(--ef-font-display); font-size: 18px; font-weight: 800; line-height: 0.90; letter-spacing: 0.01em; text-transform: uppercase; color: var(--ef-black); font-style: normal; font-synthesis: none; font-stretch: 88% }
.ef-mobile-menu-wordmark > span:nth-child(3) { font-family: "Eintracht Display VF", var(--ef-font-subline); font-style: normal; font-weight: 500; font-stretch: 90%; font-variation-settings: "wdth" 1, "wght" 60, "slnt" 1 }
.ef-mobile-menu-wordmark > span { display: block; transform: none; transform-origin: left center; white-space: nowrap; font-variation-settings: "wdth" 1, "wght" 80, "slnt" 1 }
.ef-news-grid--flat > div:first-child { grid-column: auto }
body:has(> .ef-footer--site) { min-height:100vh; min-height:100dvh }
.ef-data-card h3 { margin:0 0 12px; font-family:var(--ef-font-sans); font-size:18px; font-weight:700; color:var(--ef-black) }
.ef-data-card label { margin-top: 16px; font-family: var(--ef-font-sans); font-size: 13px; line-height: 1.2; gap: 2px }
.ef-data-card h3 + label { margin-top:0 }
.ef-data-card label input, .ef-data-card label select, .ef-data-card label textarea { font-size:15px }
.ef-data-card > div:has(> .ef-profile-preview) { display:flex; align-items:flex-start; gap:16px }
.ef-data-card > div:has(> .ef-profile-preview) > .ef-data-note { flex:1; min-width:0 }
.ef-gr-event { display:flex; flex-direction:column; gap:8px; font-family:var(--ef-font-sans); font-size:15px }
.ef-gr-event h3, .ef-gr-event p { margin:0 }
.ef-gr-link { font-size:14px; font-weight:700; color:var(--ef-red); text-decoration:none }
.ef-gr-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:auto; padding-top:8px }
.ef-gr-mine { font-family:var(--ef-font-sans); font-size:14px; font-weight:700; color:var(--ef-red) }
.ef-gr-tm { margin-top:16px }
.ef-gr-form { display:flex; flex-direction:column; gap:16px; scroll-margin-top:96px }
.ef-gr-form h3, .ef-gr-form .ef-data-note { margin:0 }
.ef-data-card.ef-gr-form label { margin-top:0 }
.ef-hero.ef-hero--guest { min-height: 100vh; min-height: 100dvh; background-position: center; background-size: cover }