/* =====================================================================
   erbschleicherei.ch – Stylesheet
   Mobile-First (ab 320 px), Desktop-Version ab 900 px
   ===================================================================== */

/* ===== SCHRIFTEN (lokal gehostet) ===== */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/inter-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/inter-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/inter-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/inter-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: swap; src: url('../fonts/inter-latin-800-normal.woff2') format('woff2'); }
@font-face { font-family: 'Courier Prime'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/courier-prime-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Courier Prime'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/courier-prime-latin-700-normal.woff2') format('woff2'); }

/* ===== BASIS ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --card-width: 288px;
  --card-height: 220px;
  --card-upper: 132px;
  --card-lower: 88px;
  --card-pad: 10px;
  --card-radius: 10px;
  --icon-size: 15px;

  --carousel-factor: 1.0;
  --carousel-icon-size: calc(0.45cm * var(--carousel-factor));

  --bg-color: #FAFAF8;
  --text: #000000;
  --text-muted: #3d3d3d;
  --toggle-on: #4CD964;
  --toggle-off: #B5B5B5;
  --focus: #1F6FD6;

  --font-sans: 'Inter', 'Trebuchet MS', Arial, sans-serif;
  --font-mono: 'Courier Prime', 'Courier New', monospace;

  /* Markenfarben (dekorativ) */
  --brand-coral: #F65B4D;
  --brand-blue: #73C6FF;
  --brand-yellow: #F9D000;
  --brand-lime: #CDFF00;
  --brand-black: #000000;

  /* Textfarben mit ausreichendem Kontrast (≥ 4,5:1 auf Weiss) */
  --link-coral: #C8372B;
  --title-blue: #1F6FD6;

  --c3-circle-size: 19px;
  --c3-circle-gap: 22.8px;

  --font-size-title2: 13px;
  --font-size-legal: 14px;

  --sponsor-card-min-height: 200px;
}

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

html, body {
  min-height: 100%;
  background-color: var(--bg-color);
  color: var(--text);
  font-family: var(--font-sans);
}

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 16px 32px;
  gap: 18px;
  line-height: 1.4;
}

img { max-width: 100%; }

a { color: inherit; }

button {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  cursor: pointer;
}

ul { list-style: none; }

/* ===== BARRIEREFREIHEIT: Hilfsklassen ===== */
.sr-only {
  position: absolute !important;
  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: 8px;
  top: -60px;
  z-index: 1000;
  padding: 10px 14px;
  background: #000;
  color: #fff;
  font-weight: 700;
  border-radius: 6px;
  text-decoration: none;
}
.skip-link:focus { top: 8px; }

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

main:focus { outline: none; }

/* Externe Links: dezentes Pfeil-Symbol */
a.ext::after {
  content: "\2197" / "";
  display: inline-block;
  margin-left: 2px;
  font-size: 0.8em;
  text-decoration: none;
}
a.ext.no-ext-icon::after { content: none; }

/* ===== ANIMATIONEN: global abschaltbar ===== */
html[data-motion="off"] *,
html[data-motion="off"] *::before,
html[data-motion="off"] *::after {
  transition: none !important;
  animation: none !important;
  scroll-behavior: auto !important;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

/* Play/Pause-Schalter direkt beim Karussell */
.sponsor-controls {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.carousel-toggle {
  /* Sichtbar 18 px, Klickfläche 24 px (WCAG 2.5.8) */
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
.ct-circle {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid #000;
  transition: background 0.15s;
}
.carousel-toggle:hover .ct-circle { background: #ececec; }
.ct-circle svg { fill: #000; display: block; }
.ct-circle .icon-play { display: none; }
.carousel-toggle[data-state="paused"] .ct-circle { background: #000; }
.carousel-toggle[data-state="paused"] .ct-circle svg { fill: #fff; }
.carousel-toggle[data-state="paused"] .icon-play { display: block; }
.carousel-toggle[data-state="paused"] .icon-pause { display: none; }

/* ===== TOOLTIP / HINWEISBLASE ===== */
.tooltip {
  position: fixed;
  z-index: 1000;
  max-width: 260px;
  padding: 8px 10px;
  background: #1b1b1b;
  color: #fff;
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 1.35;
  border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
  white-space: pre-line;
}
.tooltip[hidden] { display: none; }

/* ===== KOPFBEREICH ===== */
.site-header {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ueberschrift {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: 40px;
  color: #000;
  text-align: center;
  line-height: 1.1;
  width: 100%;
}
.bogensegment {
  width: var(--card-width);
  display: flex;
  justify-content: center;
  margin: 0 auto;
}
.bogensegment img { width: 100%; height: auto; display: block; }
.square-cap {
  width: var(--card-width);
  height: 76px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.square-cap img { height: 76px; width: auto; }

main {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  gap: 28px;
}

/* ===== RASTER DER 4 TAFELN ===== */
.cards-grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

/* ===== TAFELN 1–3 ===== */
.card {
  width: var(--card-width);
  min-height: var(--card-height);
  border-radius: var(--card-radius);
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.13);
  display: flex;
  flex-direction: column;
  background: #fff;
  margin-bottom: 18px;
}
.card-upper {
  min-height: var(--card-upper);
  padding: var(--card-pad);
  position: relative;
  overflow: hidden;
}
.card-lower {
  min-height: var(--card-lower);
  padding: var(--card-pad);
  background: #fff;
  display: flex;
  flex-direction: column;
  border-top: 1px solid #e8e8e8;
}
.info-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
}
.info-row img.icon,
.info-row-last img.icon,
.card3-web-row img.icon {
  width: var(--icon-size);
  height: var(--icon-size);
  flex-shrink: 0;
  object-fit: contain;
}
.info-text {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  color: #000;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.info-text a { color: #000; text-decoration: underline; }
.info-text a:hover { color: var(--link-coral); }

.info-row-last {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  min-height: 24px;
}
.info-row-last .left-group,
.info-row-last .right-group {
  display: flex;
  align-items: center;
  gap: 6px;
}
.status-label {
  font-family: var(--font-mono);
  font-size: 11px;
  color: #000;
}
.toggle {
  position: relative;
  display: inline-block;
  width: 28px;
  height: 14px;
  border-radius: 7px;
  flex-shrink: 0;
}
.toggle.on { background: var(--toggle-on); }
.toggle.off { background: var(--toggle-off); }
.toggle::after {
  content: '';
  position: absolute;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
  top: 2px;
}
.toggle.on::after { left: 16px; }
.toggle.off::after { left: 2px; }

/* Tafel 1 */
.card1-upper {
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.card1-title1 {
  font-family: var(--font-sans);
  font-size: 20.5px;
  font-weight: 700;
  color: var(--title-blue);
  text-align: justify;
  text-align-last: justify;
  white-space: nowrap;
  width: 100%;
  line-height: 1.2;
}
.card1-row2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}
.card1-title2 {
  font-size: var(--font-size-title2);
  color: var(--title-blue);
  flex: 1;
}
.card1-img { height: 62px; width: auto; object-fit: contain; }

/* Tafel 2 */
.card2-upper {
  background: #2D7233;
  display: flex;
  align-items: center;
  gap: 10px;
}
.card2-logo { height: 62px; width: auto; object-fit: contain; flex-shrink: 0; }
.card2-text {
  font-size: 15px;
  font-weight: 400;
  color: #fff;
  text-align: right;
  line-height: 1.5;
  flex: 1;
}

/* Tafel 3 */
.card3-upper { background: #fff; }
.card3-title1 { font-size: 12px; font-weight: 700; color: #000; line-height: 1.3; }
.card3-title2, .card3-title3, .card3-title4 { font-size: 12px; font-weight: 400; color: #000; line-height: 1.35; }
.card3-circles { display: flex; margin-top: 8px; }
.circle {
  width: var(--c3-circle-size);
  height: var(--c3-circle-size);
  border-radius: 50%;
  margin-right: var(--c3-circle-gap);
  flex-shrink: 0;
}
.circle:last-child { margin-right: 0; }
.c-coral { background: var(--brand-coral); }
.c-black { background: var(--brand-black); }
.c-blue { background: var(--brand-blue); }
.c-yellow { background: var(--brand-yellow); }
.c-lime { background: var(--brand-lime); }

.card3-lower { gap: 6px; }
.card3-web-row { display: flex; align-items: center; gap: 6px; }
.card3-wayback { height: 40px; width: auto; object-fit: contain; }
.card3-links-area {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}
.card3-link-btn {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: #3a2400;
  background: #FFE033;
  border-radius: 4px;
  padding: 4px 4px;
  text-decoration: none;
  display: block;
  text-align: center;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background 0.15s ease;
}
.card3-link-btn:hover { background: #F9D000; text-decoration: underline; }
.card3-last { margin-top: auto; }

/* ===== TAFEL 4: UNTERSTÜTZER ===== */
.sponsor-container-wrapper {
  width: var(--card-width);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.sponsor-intro-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin-top: 29px;
}
.sponsor-intro-text {
  font-size: 15px;
  font-weight: 400;
  text-decoration: underline;
}
.mainfilter-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  min-height: 36px;
  border-radius: 6px;
}
.mainfilter-btn img {
  width: calc(32px * var(--carousel-factor));
  height: auto;
  display: block;
}

.filter-wrapper {
  background: #fff;
  border-radius: var(--card-radius);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.13);
  padding: var(--card-pad);
}
.filter-wrapper[hidden] { display: none; }
.filter-header-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-bottom: 1px solid #e8e8e8;
  padding-bottom: 8px;
  margin-bottom: 8px;
}
.filter-tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 4px 0;
  border-radius: 6px;
}
.filter-tab:first-child { border-right: 1px solid #e8e8e8; border-radius: 6px 0 0 6px; }
.filter-tab[aria-pressed="true"] .filter-tab-title { font-weight: 700; }
.filter-tab-title {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
}
.filter-tab-title img { width: 16px; height: 16px; object-fit: contain; }

.tab-toggle {
  display: inline-block;
  width: 24px;
  height: 12px;
  border-radius: 6px;
  background: var(--toggle-off);
  position: relative;
  transition: background 0.2s;
}
.tab-toggle.on { background: var(--toggle-on); }
.tab-toggle::after {
  content: '';
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  top: 2px;
  left: 2px;
  transition: left 0.2s;
}
.tab-toggle.on::after { left: 14px; }

.filter-content-area {
  max-height: 220px;
  overflow-y: auto;
  font-size: 14px;
  padding-right: 4px;
}
.filter-content-area::-webkit-scrollbar { width: 6px; }
.filter-content-area::-webkit-scrollbar-track { background: #f1f1f1; border-radius: 3px; }
.filter-content-area::-webkit-scrollbar-thumb { background: #999; border-radius: 3px; }

.filter-fieldset { border: 0; }
.filter-fieldset[hidden] { display: none; }
.filter-country-section { margin-bottom: 4px; }
.filter-country-trigger {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  font-weight: 700;
  padding: 4px 0;
  text-align: left;
  border-radius: 4px;
}
.filter-country-trigger .chev { transition: transform 0.2s; display: inline-block; }
.filter-country-trigger[aria-expanded="true"] .chev { transform: rotate(90deg); }
.filter-accordion-content {
  padding-left: 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin: 2px 0 6px;
}
.filter-accordion-content[hidden] { display: none; }
.filter-checkbox-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 26px;
  cursor: pointer;
}
.filter-checkbox-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #1F6FD6;
}
.filter-checkbox-row.master-row {
  font-weight: 700;
  border-bottom: 1px dashed #d5d5d5;
}
.publi-centered-content {
  display: flex;
  justify-content: center;
  padding: 15px 0;
}

/* Karussell */
#block05-container {
  width: var(--card-width);
  position: relative;
  min-height: var(--sponsor-card-min-height);
}
.sponsor-card {
  width: 100%;
  min-height: var(--sponsor-card-min-height);
  padding: var(--card-pad);
  padding-bottom: calc(var(--card-pad) + 5px);
  position: relative;
  overflow: hidden;
  border-radius: var(--card-radius);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.13);
  display: flex;
  flex-direction: column;
  background: #fff;
}
.sponsor-card.is-empty {
  justify-content: center;
  align-items: center;
  text-align: center;
  font-size: 14px;
}
.noscript-hint { font-size: 14px; padding: 12px; }

.sponsor-title-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 6px;
  margin-bottom: 3px;
}
.sponsor-title-text {
  font-size: calc(15.5px * var(--carousel-factor));
  font-weight: 700;
  line-height: 1.15;
  flex: 1;
}
.sponsor-zulassung-text {
  font-size: max(12px, calc(10px * var(--carousel-factor)));
  font-weight: 700;
  line-height: 1.15;
  text-align: right;
}
.sponsor-funktion-text {
  font-size: max(12px, calc(10px * var(--carousel-factor)));
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 4px;
}
.sponsor-slogan-text {
  font-size: max(13px, calc(11px * var(--carousel-factor)));
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 10px;
}
.sponsor-slogan-text.is-center { text-align: center; }

.logo-container {
  margin: calc(-1 * var(--card-pad)) calc(-1 * var(--card-pad)) 6px;
}
.company-logo {
  width: 100%;
  display: block;
  border-top-left-radius: var(--card-radius);
  border-top-right-radius: var(--card-radius);
}

.person-layout {
  display: flex;
  gap: var(--card-pad);
  align-items: flex-start;
  flex-grow: 1;
  margin-bottom: 4px;
}
.portrait-container { width: 25%; flex-shrink: 0; }
.person-portrait { width: 100%; height: auto; display: block; border-radius: 6px; }

.address-container {
  flex-grow: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.address-row {
  display: flex;
  align-items: center;
  font-size: max(12px, calc(9.5px * var(--carousel-factor)));
  line-height: 1.35;
  min-height: var(--carousel-icon-size);
  min-width: 0;
}
.address-row > a,
.address-row > span:not(.sr-only),
.address-row > button {
  display: block;
  line-height: 24px; /* Klickfläche mind. 24 px (WCAG 2.5.8) */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.address-row a { color: #000; text-decoration: none; }
.address-row a:hover,
.address-row a:focus-visible { text-decoration: underline; }
.address-icon {
  width: var(--carousel-icon-size);
  height: var(--carousel-icon-size);
  object-fit: contain;
  margin-right: 8px;
  flex-shrink: 0;
}
.vcard-trigger {
  display: inline-flex;
  align-items: center;
  text-decoration: underline;
  padding: 0;
  font-size: inherit;
}

/* Sichtbares "pausiert"-Etikett auf der Karte */
.sponsor-card.paused::after {
  content: "pausiert" / "";
  position: absolute;
  right: 8px;
  bottom: 6px;
  z-index: 11;
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  background: rgba(0, 0, 0, 0.72);
  border-radius: 10px;
  padding: 2px 8px;
}

/* Vor/Zurück: sichtbar bei Pause oder Tastaturfokus */
.nav-overlay {
  position: absolute;
  top: 0;
  width: 14%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 10;
}
.nav-overlay-left { left: 0; background: linear-gradient(to right, rgba(0,0,0,0.04), transparent); }
.nav-overlay-right { right: 0; background: linear-gradient(to left, rgba(0,0,0,0.04), transparent); }
.sponsor-card.paused .nav-overlay,
.nav-overlay:focus-visible {
  opacity: 1;
  pointer-events: auto;
}
.nav-arrow {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.7);
  background: rgba(255, 255, 255, 0.95);
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}

/* ===== FUSSBEREICH ===== */
.legal-impressum-container {
  width: var(--card-width);
  margin-top: 40px;
  text-align: left;
}
.legal-divider {
  width: calc(var(--card-width) / 3);
  height: 1px;
  background: #000;
  margin-bottom: 24px;
}
.legal-tab {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  border-radius: 4px;
  text-align: left;
}
.legal-tab-title {
  font-size: 14px;
  text-decoration: underline;
}
.legal-icon { flex-shrink: 0; }
.legal-icon circle { fill: #000; }
.legal-icon path { fill: #fff; }
.legal-icon { transition: transform 0.2s ease; }
.legal-tab[aria-expanded="true"] .legal-icon { transform: rotate(180deg); }

.legal-panel {
  margin-top: 8px;
  height: calc(10 * 1.5 * var(--font-size-legal) + 24px); /* ca. 10 Textzeilen */
  overflow-y: auto;
  padding: 12px 14px;
  border: 1px solid #c9c9c9;
  border-radius: var(--card-radius);
  background: #fff;
  font-size: var(--font-size-legal);
  line-height: 1.5;
}
.legal-panel[hidden] { display: none; }
.legal-panel h3 {
  font-size: calc(var(--font-size-legal) + 1px);
  font-weight: 700;
  margin: 12px 0 2px;
}
.legal-panel h3:first-child { margin-top: 0; }
.legal-panel p {
  margin-bottom: 8px;
  white-space: pre-line;
  text-align: left;
  -webkit-hyphens: auto;
  hyphens: auto;
}
.legal-panel a { color: var(--link-coral); text-decoration: underline; }
.legal-panel::-webkit-scrollbar { width: 6px; }
.legal-panel::-webkit-scrollbar-thumb { background: #999; border-radius: 3px; }

.inline-impressum-icon { height: 1em; width: auto; vertical-align: -0.1em; margin-right: 4px; }
.inline-webmaster-icon { height: 1.1em; width: auto; vertical-align: -0.2em; margin: 0 4px 0 2px; }

/* ===== RESPONSIVE ===== */
@media (min-width: 480px) {
  :root {
    --card-width: 320px;
    --card-height: 260px;
    --card-upper: 156px;
    --card-lower: 104px;
    --card-pad: 11px;
    --icon-size: 19px;
    --c3-circle-size: 22px;
    --c3-circle-gap: 26.4px;
    --font-size-title2: 14px;
    --carousel-factor: 1.18;
    --sponsor-card-min-height: 230px;
  }
  .ueberschrift { font-size: 50px; }
  .square-cap { height: 90px; }
  .square-cap img { height: 90px; }
  .status-label { font-size: 12px; }
  .info-text { font-size: 12.5px; }
  .card1-title1 { font-size: 23px; }
  .card1-img { height: 74px; }
  .card2-logo { height: 74px; }
  .card2-text { font-size: 17px; }
  .card3-title1, .card3-title2, .card3-title3, .card3-title4 { font-size: 13px; }
  .card3-wayback { height: 48px; }
  .card3-link-btn { font-size: 12px; }
  .toggle { width: 32px; height: 16px; border-radius: 8px; }
  .toggle::after { width: 12px; height: 12px; }
  .toggle.on::after { left: 18px; }
  .sponsor-intro-text { font-size: 16px; }
  .sponsor-intro-row { margin-top: 35px; }
  .legal-tab-title { font-size: 15px; }
  .legal-panel p { text-align: justify; }
}

@media (min-width: 768px) {
  :root {
    --card-width: 384px;
    --card-height: 308px;
    --card-upper: 185px;
    --card-lower: 123px;
    --card-pad: 13px;
    --icon-size: 22px;
    --c3-circle-size: 27px;
    --c3-circle-gap: 32.4px;
    --font-size-title2: 16px;
    --font-size-legal: 15px;
    --carousel-factor: 1.41;
    --sponsor-card-min-height: 270px;
  }
  .ueberschrift { font-size: 60px; }
  .square-cap { height: 108px; }
  .square-cap img { height: 108px; }
  .status-label { font-size: 12px; }
  .info-text { font-size: 13.5px; }
  .info-row, .info-row-last { min-height: 28px; }
  .card1-title1 { font-size: 27.6px; }
  .card1-img { height: 90px; }
  .card2-logo { height: 90px; }
  .card2-text { font-size: 20px; }
  .card3-title1, .card3-title2, .card3-title3, .card3-title4 { font-size: 14px; }
  .card3-wayback { height: 56px; }
  .card3-link-btn { font-size: 13px; padding: 5px 6px; }
  .sponsor-intro-text { font-size: 18px; }
  .sponsor-intro-row { margin-top: 41px; }
}

/* ===== DESKTOP (Zweitversion): 2×2-Raster ===== */
@media (min-width: 900px) {

  .cards-grid {
    display: grid;
    grid-template-columns: max-content max-content;
    justify-content: center;
    align-items: start;
    gap: 24px;
  }
  .cards-grid .card { margin-bottom: 0; }
  .cards-grid .sponsor-intro-row { margin-top: 0; }
  /* Tafel 3 auf gleiche Höhe wie die Karussell-Box schieben */
  .cards-grid > section:nth-of-type(3) {
    margin-top: calc(32px * var(--carousel-factor) + 10px);
  }
}