/* REHASPORT SUHL | Premium-Übersichtsseiten (2026)
   Layout follows the approved light-image hero composition. Brand green: #8BBE26. */

.reha-unified .reha-overview-page {
  --overview-green: #8BBE26;
  --overview-ink: #222829;
  --overview-paper: #F5F7F3;
  background: var(--overview-paper);
}
.reha-unified .reha-overview-hero {
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: var(--overview-paper);
  min-height: clamp(680px, calc(100svh - 98px), 900px);
}
.reha-unified .reha-overview-visual,
.reha-unified .reha-overview-visual img,
.reha-unified .reha-overview-wash {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.reha-unified .reha-overview-visual { z-index: 0; }
.reha-unified .reha-overview-visual img {
  display: block;
  object-fit: cover;
  object-position: var(--overview-position, 62% 50%);
  filter: saturate(.97) contrast(1.02);
}
.reha-unified .reha-overview-wash {
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(90deg,
    #F5F7F3 0%,
    rgba(245,247,243,.985) 18%,
    rgba(245,247,243,.97) 28%,
    rgba(245,247,243,.83) 37%,
    rgba(245,247,243,.30) 54%,
    rgba(245,247,243,0) 72%);
}
.reha-unified .reha-overview-container {
  width: min(calc(100% - 2 * var(--home-gutter, 5vw)), var(--home-max, 1640px));
  max-width: var(--home-max, 1640px);
  margin-inline: auto;
}
.reha-unified .reha-overview-inner {
  position: relative;
  z-index: 2;
  padding: clamp(62px, 6.8vw, 112px) 0;
}
.reha-unified .reha-overview-copy {
  width: min(100%, 570px);
}
.reha-unified .reha-overview-kicker {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 clamp(23px, 2.8vw, 40px);
  color: #354038;
  font-size: clamp(11px, .89vw, 13px);
  line-height: 1.5;
  font-weight: 700;
  letter-spacing: .19em;
  text-transform: uppercase;
}
.reha-unified .reha-overview-kicker::before {
  content: '';
  display: block;
  flex: none;
  height: 2px;
  width: 37px;
  background: var(--overview-green);
}
.reha-unified .reha-overview-copy h1 {
  margin: 0 0 22px;
  color: var(--overview-ink);
  font-size: clamp(56px, 5.0vw, 92px);
  line-height: 1.035;
  letter-spacing: -.052em;
  font-weight: 800;
}
.reha-unified .reha-overview-copy h1 span {
  display: block;
  color: var(--overview-green);
}
.reha-unified .reha-overview-hero--funktionstraining h1,
.reha-unified .reha-overview-hero--medizinisches-training h1 {
  font-size: clamp(48px, 4.4vw, 78px);
}
.reha-unified .reha-overview-promise {
  color: #333a3a;
  font-size: clamp(24px, 1.85vw, 34px);
  font-weight: 700;
  letter-spacing: -.025em;
  line-height: 1.29;
  margin: 0 0 clamp(20px, 2.2vw, 31px);
}
.reha-unified .reha-overview-promise span { display: block; }
.reha-unified .reha-overview-intro {
  width: min(100%, 500px);
  max-width: 100%;
  color: #414b48;
  font-size: clamp(15px, 1.05vw, 18px);
  font-weight: 500;
  line-height: 1.69;
  margin: 0 0 clamp(29px, 3.1vw, 46px);
}
.reha-unified .reha-overview-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 46px;
  min-height: 60px;
  min-width: 236px;
  padding: 16px 24px;
  border-radius: 6px;
  background: var(--overview-green);
  color: #162119 !important;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 800;
  letter-spacing: .012em;
  box-shadow: 0 10px 24px rgba(27,38,18,.10);
  text-decoration: none !important;
  transition: transform .23s ease, box-shadow .23s ease, filter .23s ease;
}
.reha-unified .reha-overview-cta svg { width: 21px; height: 21px; flex: none; }
.reha-unified .reha-overview-cta:hover,
.reha-unified .reha-overview-cta:focus-visible {
  color: #162119 !important;
  transform: translateY(-2px);
  filter: brightness(1.035);
  box-shadow: 0 15px 31px rgba(27,38,18,.17);
}
.reha-unified .reha-overview-cta:focus-visible { outline: 3px solid #1B2520; outline-offset: 4px; }
.reha-unified .reha-overview-hero--wellness .reha-overview-wash {
  background: linear-gradient(90deg,#F5F7F3 0%,rgba(245,247,243,.98) 21%,rgba(245,247,243,.93) 34%,rgba(245,247,243,.62) 50%,rgba(245,247,243,0) 78%);
}

@media (min-width: 1900px) {
  .reha-unified .reha-overview-copy { width: min(100%, 650px); }
  .reha-unified .reha-overview-hero--funktionstraining h1,
  .reha-unified .reha-overview-hero--medizinisches-training h1 { font-size: 78px; }
}
@media (max-width: 1199px) {
  .reha-unified .reha-overview-hero { min-height: 670px; }
  .reha-unified .reha-overview-copy { width: min(100%, 500px); }
  .reha-unified .reha-overview-copy h1 { font-size: clamp(48px, 5.8vw, 72px); }
  .reha-unified .reha-overview-hero--funktionstraining h1,
  .reha-unified .reha-overview-hero--medizinisches-training h1 { font-size: clamp(40px, 5.2vw, 64px); }
  .reha-unified .reha-overview-wash {background:linear-gradient(90deg,#F5F7F3 0%,rgba(245,247,243,.99) 23%,rgba(245,247,243,.91) 42%,rgba(245,247,243,.28) 74%,transparent 100%);}
}
@media (max-width: 899.98px) {
  .reha-unified .reha-overview-hero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-height: 0;
  }
  .reha-unified .reha-overview-visual {
    position: relative;
    inset: auto;
    width: 100%;
    height: clamp(320px,48vw,460px);
    flex: none;
  }
  .reha-unified .reha-overview-visual img { object-position: var(--overview-position-mobile, 60% 40%); }
  .reha-unified .reha-overview-wash { display: none; }
  .reha-unified .reha-overview-inner { padding: 56px 0 68px; }
  .reha-unified .reha-overview-copy { width: min(100%, 650px); }
  .reha-unified .reha-overview-copy h1 { font-size: clamp(52px, 7.7vw, 72px); }
  .reha-unified .reha-overview-hero--funktionstraining h1,
  .reha-unified .reha-overview-hero--medizinisches-training h1 { font-size: clamp(46px, 6.8vw, 64px); }
  .reha-unified .reha-overview-promise { font-size: clamp(24px,3.8vw,32px); }
  .reha-unified .reha-overview-intro {font-size: 17px;}
}
@media (max-width: 575.98px) {
  .reha-unified .reha-overview-visual { height: clamp(245px, 69vw, 350px); }
  .reha-unified .reha-overview-inner { padding: 40px 0 54px; }
  .reha-unified .reha-overview-kicker { font-size: 10px; gap: 9px; letter-spacing: .14em; margin-bottom: 21px; }
  .reha-unified .reha-overview-kicker::before { width: 24px; }
  .reha-unified .reha-overview-copy h1 { font-size: clamp(44px, 10.5vw, 61px); letter-spacing: -.047em; margin-bottom: 20px; }
  .reha-unified .reha-overview-hero--funktionstraining h1,
  .reha-unified .reha-overview-hero--medizinisches-training h1 { font-size: clamp(35px, 9.1vw, 48px); }
  .reha-unified .reha-overview-promise { font-size: clamp(22px, 5.2vw, 27px); margin-bottom: 22px; }
  .reha-unified .reha-overview-intro {font-size:16px;line-height:1.69;margin-bottom:28px;}
  .reha-unified .reha-overview-cta { width: 100%; min-width:0; min-height: 58px; }
}
@media (prefers-reduced-motion: reduce) {
  .reha-unified .reha-overview-cta { transition: none; }
}


/* Präventions-Übersichtsseite: Intro + Kurskarten */
.reha-unified .reha-overview-hero--praevention {
  min-height: clamp(640px, calc(100svh - 110px), 850px);
}
.reha-unified .reha-overview-hero--praevention .reha-overview-copy {
  width: min(100%, 560px);
}
.reha-unified .reha-overview-courses {
  position: relative;
  z-index: 3;
  margin-top: -48px;
  padding-bottom: 84px;
}
.reha-unified .reha-overview-courses-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}
.reha-unified .reha-overview-course-card {
  background: rgba(255,255,255,.97);
  border: 1px solid #d9dfd3;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 22px 56px rgba(28,34,27,.08);
  display: flex;
  flex-direction: column;
}
.reha-unified .reha-overview-course-image {
  position: relative;
  aspect-ratio: 16 / 7.6;
  overflow: hidden;
}
.reha-unified .reha-overview-course-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.reha-unified .reha-overview-course-icon {
  position: absolute;
  left: 22px;
  bottom: 18px;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: rgba(139,190,38,.92);
  border: 4px solid rgba(255,255,255,.9);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 34px;
  box-shadow: 0 12px 26px rgba(44,66,19,.16);
}
.reha-unified .reha-overview-course-body {
  padding: 22px 24px 24px;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
}
.reha-unified .reha-overview-course-title {
  margin: 0 0 4px;
  color: #252b2c;
  font-size: clamp(20px, 1.65vw, 24px);
  line-height: 1.14;
  letter-spacing: -.03em;
  font-weight: 800;
}
.reha-unified .reha-overview-course-subtitle {
  margin: 0 0 14px;
  color: var(--overview-green);
  font-size: clamp(16px, 1.05vw, 18px);
  line-height: 1.34;
  font-weight: 700;
}
.reha-unified .reha-overview-course-text {
  margin: 0 0 22px;
  color: #4a5351;
  font-size: 16px;
  line-height: 1.58;
  font-weight: 500;
}
.reha-unified .reha-overview-course-button {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  min-height: 56px;
  width: 100%;
  padding: 15px 18px;
  border-radius: 8px;
  background: #edf1e8;
  border: 1px solid #d5ddcb;
  color: #30402f !important;
  font-size: 16px;
  line-height: 1.4;
  font-weight: 800;
  text-decoration: none !important;
  transition: background-color .22s ease, border-color .22s ease, transform .22s ease;
}
.reha-unified .reha-overview-course-button:hover,
.reha-unified .reha-overview-course-button:focus-visible {
  background: #e4ebda;
  border-color: #c8d3bb;
  color: #1c271b !important;
  transform: translateY(-1px);
}
.reha-unified .reha-overview-course-button svg {
  width: 18px;
  height: 18px;
  flex: none;
}
@media (max-width: 1199px) {
  .reha-unified .reha-overview-courses-grid { gap: 20px; }
  .reha-unified .reha-overview-course-icon { width: 76px; height: 76px; font-size: 31px; }
  .reha-unified .reha-overview-course-body { padding: 20px 20px 22px; }
}
@media (max-width: 991.98px) {
  .reha-unified .reha-overview-courses { margin-top: 0; padding-top: 16px; }
  .reha-unified .reha-overview-courses-grid { grid-template-columns: 1fr; }
  .reha-unified .reha-overview-course-card { border-radius: 18px; }
}
@media (max-width: 575.98px) {
  .reha-unified .reha-overview-courses { padding-bottom: 60px; }
  .reha-unified .reha-overview-course-image { aspect-ratio: 16 / 8.2; }
  .reha-unified .reha-overview-course-icon { left: 18px; bottom: 16px; width: 70px; height: 70px; font-size: 28px; }
  .reha-unified .reha-overview-course-title { font-size: 18px; }
  .reha-unified .reha-overview-course-subtitle,
  .reha-unified .reha-overview-course-text,
  .reha-unified .reha-overview-course-button { font-size: 15px; }
}

/* Premium teasers on all five overview pages */
.reha-unified .reha-overview-page--with-cards .reha-overview-hero {
  min-height: clamp(630px, calc(100svh - 125px), 830px);
}
.reha-unified .reha-overview-page--with-cards .reha-overview-courses {
  margin-top: -42px;
}
.reha-unified .reha-overview-course-card {
  transition: transform .22s ease, box-shadow .22s ease;
}
.reha-unified .reha-overview-course-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 26px 60px rgba(28,34,27,.115);
}
.reha-unified .reha-overview-course-card .reha-overview-course-icon svg {
  width: 35px;
  height: 35px;
}
.reha-unified .reha-overview-courses-grid--four {
  grid-template-columns: repeat(4, minmax(0,1fr));
}
.reha-unified .reha-overview-courses-grid--four .reha-overview-course-body {
  padding-inline: 20px;
}
.reha-unified .reha-overview-courses-grid--four .reha-overview-course-title {
  font-size: clamp(19px, 1.35vw, 23px);
}
.reha-unified [id="rehasport-eignung"],
.reha-unified [id="trainingsstunde"] {
  scroll-margin-top: 105px;
}
@media (max-width: 1299px) {
  .reha-unified .reha-overview-courses-grid--four {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 991.98px) {
  .reha-unified .reha-overview-page--with-cards .reha-overview-hero {
    min-height: 0;
  }
  .reha-unified .reha-overview-page--with-cards .reha-overview-courses {
    margin-top: 0;
  }
  .reha-unified .reha-overview-course-card:hover { transform: none; }
}
@media (max-width: 575.98px) {
  .reha-unified .reha-overview-courses-grid--four {
    grid-template-columns: 1fr;
  }
}
@media (prefers-reduced-motion: reduce) {
  .reha-unified .reha-overview-course-card { transition: none; }
}

/* Favor the faces in the individual medical-training consultation card. */
.reha-unified .reha-overview-page--medizinisches-training .reha-overview-course-card:nth-child(3) .reha-overview-course-image img { object-position: 50% 10%; }


/* 2026 final: Karten ohne doppelte CTA-Flächen, eine klare Klickzone je Karte. */
.reha-unified .reha-overview-page--with-cards .reha-overview-course-card {
  overflow:hidden; background:#fff; border:1px solid rgba(44,59,47,.12);
  border-radius:18px; box-shadow:0 13px 33px rgba(30,38,31,.07);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}
.reha-unified .reha-overview-page--with-cards .reha-overview-course-card:hover,
.reha-unified .reha-overview-page--with-cards .reha-overview-course-card:focus-within {
  transform:translateY(-5px); border-color:rgba(139,190,38,.52);
  box-shadow:0 23px 45px rgba(30,38,31,.12);
}
.reha-unified .reha-overview-card-link {
  color:inherit!important; text-decoration:none!important;
  display:flex; flex-direction:column; height:100%; min-width:0;
  outline-offset:-4px;
}
.reha-unified .reha-overview-card-link:focus-visible {outline:3px solid #8BBE26!important;}
.reha-unified .reha-overview-course-image {
  flex:0 0 auto; aspect-ratio:16 / 8.5;
  background:#e6ebe4; overflow:visible;
}
.reha-unified .reha-overview-course-image img {
  object-fit:cover; transition:transform .35s ease;
  border-radius:0;
}
.reha-unified .reha-overview-card-link:hover .reha-overview-course-image img {transform:scale(1.035);}
.reha-unified .reha-overview-course-icon {
  width:56px; height:56px; left:23px; bottom:-27px;
  border:3px solid #fff; background:#8BBE26; font-size:24px;
  box-shadow:0 7px 18px rgba(34,53,20,.16);
}
.reha-unified .reha-overview-course-icon svg {width:27px!important;height:27px!important;}
.reha-unified .reha-overview-course-body {
  padding:38px 26px 27px; flex:1 1 auto; gap:0;
}
.reha-unified .reha-overview-course-title {
  color:#202828!important; margin:0 0 8px;
  font-size:clamp(19px,1.35vw,23px); line-height:1.23;
  letter-spacing:-.035em; font-weight:800;
  display:flex; gap:12px; align-items:flex-start; justify-content:space-between;
}
.reha-unified .reha-overview-course-title::after {
  content:'↗'; flex:0 0 31px; width:31px; height:31px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:#f0f4e9; border:1px solid #e0e9d5;
  color:#28312e; font-family:Arial,sans-serif;
  font-size:18px; line-height:1; font-weight:400;
  transition:background .25s ease,transform .25s ease;
}
.reha-unified .reha-overview-card-link:hover .reha-overview-course-title::after,
.reha-unified .reha-overview-card-link:focus-visible .reha-overview-course-title::after {
  background:#e6f1d0; transform:translate(2px,-2px);
}
.reha-unified .reha-overview-course-subtitle {
  margin:0 0 13px; color:#3e4542!important;
  font-size:clamp(14px,.95vw,16px); line-height:1.44; font-weight:700;
}
.reha-unified .reha-overview-course-text {
  margin:0; color:#515c55!important; font-size:15px;
  font-weight:500; line-height:1.68;
}
.reha-unified .reha-overview-courses {padding-bottom:88px;}
.reha-unified .reha-overview-courses-grid {gap:24px;}
.reha-unified .reha-overview-courses-grid--four .reha-overview-course-body {padding-inline:23px;}
/* Funktionstraining: weder den Namen mitten im Wort brechen noch über den Textbereich ragen lassen. */
.reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 {
  font-size:clamp(40px,3.68vw,63px)!important;
  line-height:1.10;
  letter-spacing:-.052em;
  overflow-wrap:normal!important; word-break:normal!important; hyphens:none!important;
}
.reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 span {
  display:block; white-space:nowrap;
}
@media (min-width:1900px) {
 .reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy {width:min(100%,650px);}
}
@media (max-width:1199.98px) {
 .reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 {font-size:clamp(35px,4.0vw,49px)!important;}
}
@media (max-width:1099.98px) {
 .reha-unified .reha-overview-courses-grid,
 .reha-unified .reha-overview-courses-grid--four {grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:899.98px) {
 .reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 {
   font-size:clamp(31px,5.25vw,46px)!important;
 }
 .reha-unified .reha-overview-page--with-cards .reha-overview-course-card:hover {transform:none;}
}
@media (max-width:699.98px) {
 .reha-unified .reha-overview-courses-grid,
 .reha-unified .reha-overview-courses-grid--four {grid-template-columns:1fr;}
 .reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 {
   font-size:clamp(23px,7.4vw,39px)!important;
 }
 .reha-unified .reha-overview-course-body {padding:36px 23px 26px;}
 .reha-unified .reha-overview-course-image {aspect-ratio:16 / 8.7;}
 .reha-unified .reha-overview-course-icon {left:21px;width:52px;height:52px;bottom:-25px;}
 .reha-unified .reha-overview-courses {padding-bottom:60px;}
}
@media (prefers-reduced-motion:reduce) {
 .reha-unified .reha-overview-course-card,
 .reha-unified .reha-overview-card-link img,
 .reha-unified .reha-overview-course-title::after {transition:none!important;}
}

/* Deterministische Bildhöhe: identisches Raster unabhängig vom Seitenverhältnis der Originalbilder. */
.reha-unified .reha-overview-page--with-cards .reha-overview-course-image {
  display:block; position:relative; flex:0 0 auto;
  width:100%; height:clamp(190px,16.5vw,242px);
  aspect-ratio:auto!important; overflow:visible;
}
.reha-unified .reha-overview-page--with-cards .reha-overview-course-image img {
  position:absolute; inset:0; display:block;
  width:100%; height:100%!important; object-fit:cover;
}
.reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 .reha-overview-title-main {
  color:var(--overview-ink)!important;
}
.reha-unified .reha-overview-hero--funktionstraining .reha-overview-copy h1 .reha-overview-title-location {
  color:var(--overview-green)!important;
}
@media (max-width:699.98px) {
 .reha-unified .reha-overview-page--with-cards .reha-overview-course-image {height:clamp(180px,56vw,245px);}
}


/* 2026-10-18: abgestimmte Wellness-Typografie für die längere freigegebene Headline. */
.reha-unified .reha-overview-hero--wellness .reha-overview-copy {
  width:min(100%, 625px);
}
.reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 {
  font-size:clamp(49px, 4.2vw, 76px)!important;
  letter-spacing:-.05em;
  line-height:1.07;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}
.reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 span {
  white-space:nowrap;
}
@media (max-width:1199.98px) {
  .reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 {
    font-size:clamp(42px, 5.1vw, 63px)!important;
  }
}
@media (max-width:899.98px) {
  .reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 {
    font-size:clamp(40px, 6.5vw, 60px)!important;
  }
}
@media (max-width:575.98px) {
  .reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 {
    font-size:clamp(30px, 8.6vw, 43px)!important;
  }
  .reha-unified .reha-overview-hero--wellness .reha-overview-copy h1 span {
    white-space:normal;
  }
}