/* Karten: Kopf + Raster, Werte je Typ (link, person, bild, slot, benefit
   mit Berufsfeldern, story, mitglied, aussage). */
.r-karten{position:relative;padding:120px 0}
.r-karten .head{max-width:760px;margin-bottom:48px}
.r-karten.r-karten--kopf-nebeneinander .head{max-width:none;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;margin-bottom:56px}
.r-karten .head .lead{color:var(--schwarz);margin-top:22px}
.r-karten.r-karten--kopf-nebeneinander .head .lead{margin-top:0}
.r-karten .head .h-m{margin:0}
.r-karten .h-board{font-size:clamp(30px,3.4vw,48px);letter-spacing:-.02em;margin-top:14px}
.r-karten .k-intro{font-size:clamp(19px,1.6vw,24px);line-height:1.45;font-weight:300;max-width:820px;margin:-8px 0 32px;color:var(--schwarz)}
.r-karten .k-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.r-karten.is-joined{padding-top:0}
.r-karten .foot-note{margin-top:26px;font-size:15px;color:var(--grau-text)}
.r-karten .k-text a:not(.thr-link):not(.pill){font-weight:600;text-decoration:underline;text-decoration-color:var(--sonne);text-underline-offset:3px}

/* link (Ehemalige) */
.r-karten--link{padding:110px 0 120px}
.r-karten .k-grid--link{grid-template-columns:repeat(2,minmax(0,1fr))}
.k-link{background:#fff;border-radius:24px;padding:32px 32px 28px;display:flex;flex-direction:column;gap:12px}
.bg-weiss .k-link{background:var(--paper)}
.k-link .eyebrow{margin-bottom:2px}
.k-link h3{font-size:28px}
.k-link p{font-size:16px;line-height:1.5;text-wrap:pretty}
.k-link .links{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:10px}
.r-karten .k-link .pill{background:var(--paper)}
.r-karten.bg-weiss .k-link .pill{background:#fff}
.r-karten .k-link .pill:hover,.r-karten .k-link .pill:focus-visible{background:var(--sonne)}
.k-link.gelb{background:var(--sonne);color:var(--tanne)}
.k-link.gelb .eyebrow{color:var(--tanne);opacity:.85}
.r-karten .k-link.gelb .pill{background:#fff}
.r-karten .k-link.gelb .pill:hover,.r-karten .k-link.gelb .pill:focus-visible{background:var(--tanne);color:#fff}

/* person (Leitung) */
.r-karten--person{padding:120px 0 130px}
.r-karten .k-grid--person{grid-template-columns:repeat(4,minmax(0,1fr))}
.k-person{background:#fff;border-radius:24px;padding:28px 26px 22px;display:flex;flex-direction:column}
.bg-weiss .k-person{background:var(--paper)}
.k-person h3{font-size:24px;margin:0 0 6px;color:var(--tanne)}
.k-person .role{font-size:13px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:#5c5c59;line-height:1.4;min-height:2.8em;margin-bottom:16px}
.k-person a{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:600;color:var(--tanne);line-height:1.4;padding:10px 0;border-top:1px solid #e3e2dc}
.k-person a svg{flex:0 0 18px;color:var(--tanne)}
.k-person a:hover,.k-person a:focus-visible{color:var(--tanne);text-decoration:underline;text-decoration-color:var(--sonne);text-underline-offset:3px}

/* bild (Schreibtische, Kühlschränke) */
.k-bild{background:var(--paper);border-radius:26px;overflow:hidden;display:flex;flex-direction:column;transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.bg-paper .k-bild{background:#fff}
.k-bild:hover{transform:translateY(-6px);box-shadow:0 40px 60px -40px rgba(0,70,59,.35)}
.bg-paper .k-bild:hover{box-shadow:none}
.k-bild .pic{aspect-ratio:4/3;overflow:hidden;background:var(--wiese)}
.k-bild img,.k-bild .ph{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s var(--ease)}
.k-bild:hover img{transform:scale(1.05)}
.k-bild .body{padding:24px 26px 28px}
.k-bild h4{font-size:22px;line-height:1.25;color:var(--tanne);margin:0}
.k-bild p{font-size:15px;line-height:1.55;margin-top:8px;color:#3d3d3a;text-wrap:pretty}
.r-karten.is-center .k-grid--bild{grid-template-columns:repeat(6,minmax(0,1fr))}
.r-karten.is-center .k-grid--bild .k-bild{grid-column:span 2}
.r-karten.is-center .k-grid--bild .k-bild:nth-child(3n+1):nth-last-child(2){grid-column:2/span 2}

/* slot (Tagesablauf) */
.r-karten .k-grid--slot{gap:18px}
.r-karten.r-karten--slot .head{margin-bottom:60px}
.k-slot{background:#fff;border-radius:22px;padding:26px 26px 44px;position:relative;overflow:hidden}
.bg-weiss .k-slot{background:var(--paper)}
.k-slot .t{font-weight:600;font-size:34px;letter-spacing:-.02em;color:var(--tanne);line-height:1}
.k-slot h4{font-size:19px;margin-top:16px}
/* h3-Variante (Überschriften-Hierarchie) sieht aus wie die h4-Variante */
.k-slot h3,.k-benefit h3{font-weight:700;color:inherit;letter-spacing:normal;line-height:normal;text-wrap:wrap;margin-bottom:1.33em}
.k-slot h3{font-size:19px;margin-top:16px}
.k-benefit h3{font-size:20px;margin-top:1.33em}
.k-slot p{font-size:15px;line-height:1.5;margin-top:8px;color:#3d3d3a;padding-right:44px}
.k-slot::after{content:"";position:absolute;right:-34px;bottom:-34px;width:90px;height:90px;border-radius:50%;background:var(--grau-kreis)}
.k-slot.gelb{background:var(--sonne)}
.k-slot.gelb::after{background:rgba(0,70,59,.1)}
.k-slot.gelb p{color:var(--tanne)}

/* benefit (Was wir bieten) + Berufsfelder */
.r-karten--benefit .head{max-width:820px;margin-bottom:56px}
.r-karten .k-grid--benefit{gap:18px}
.k-benefit{background:var(--paper);border-radius:22px;padding:28px 26px 26px;position:relative}
.bg-paper .k-benefit{background:#fff}
.k-benefit .ico{width:44px;height:44px;border-radius:12px;background:var(--tanne);color:var(--sonne);display:grid;place-items:center;margin-bottom:20px}
.k-benefit h4{font-size:20px}
.k-benefit p{font-size:15px;line-height:1.5;margin-top:8px;color:#3d3d3a}
.k-benefit .badge{position:absolute;top:22px;right:22px;display:inline-flex;align-items:center;gap:6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;line-height:1;border-radius:999px;padding:5px 10px;background:var(--paper);color:#6f6f6c}
.r-karten .felder{margin-top:64px;display:grid;grid-template-columns:1fr 2fr;gap:40px;align-items:start;padding-top:48px;border-top:1px solid #e6e5df}
.r-karten .felder h3{font-size:28px}
.r-karten .felder .chips{display:flex;flex-wrap:wrap;gap:8px}
.r-karten .felder .chip{background:var(--paper);color:var(--tanne);font-size:16px;padding:12px 16px;border-radius:999px}

/* story (Stimmen aus dem Team) */
.r-karten--story{padding:130px 0 120px;overflow:hidden;color:#fff}
.r-karten--story .bg-oe{position:absolute;right:-220px;top:-200px;width:720px;color:#fff;opacity:.06;pointer-events:none}
.r-karten--story .bg-oe .oe{width:100%;height:auto}
.r-karten--story .eyebrow{color:var(--sonne)}
.r-karten--story h2{color:#fff}
.r-karten--story .head{max-width:820px;margin-bottom:64px}
.r-karten--story .head .lead{color:rgba(255,255,255,.82)}
.r-karten .k-grid--story{gap:24px}
.k-story{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:0 30px 34px;display:flex;flex-direction:column;overflow:hidden}
.k-story .por{width:calc(100% + 60px);margin:0 -30px 24px;aspect-ratio:4/3;overflow:hidden;background:var(--wiese)}
.k-story .por img{width:100%;height:100%;object-fit:cover;object-position:60% 30%;display:block;transition:transform 1.4s var(--ease)}
.k-story:hover .por img{transform:scale(1.04)}
.k-story .motto{font-weight:600;font-size:26px;line-height:1.12;letter-spacing:-.015em;text-wrap:balance}
.k-story .who{margin-top:10px;font-size:15px;color:var(--sonne);font-weight:600}
.k-story .txt{margin-top:22px}
.k-story .txt p{font-size:16px;line-height:1.55;color:rgba(255,255,255,.84);text-wrap:pretty}

/* mitglied (Stiftungsrat) */
.r-karten.r-karten--mitglied .head{max-width:none;margin-bottom:40px}
.r-karten--mitglied.is-joined .wrap > :first-child{margin-top:110px;padding-top:90px;border-top:1px solid #e6e5df}
.r-karten .k-grid--mitglied{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.k-mitglied{background:var(--paper);border-radius:22px;overflow:hidden}
.bg-paper .k-mitglied{background:#fff}
.k-mitglied .member-pic{aspect-ratio:4/3;overflow:hidden;background:var(--wiese)}
.k-mitglied .member-pic img{width:100%;height:100%;object-fit:cover;display:block}
.k-mitglied h3{font-size:20px;margin:16px 18px 4px}
.k-mitglied p{font-size:14px;line-height:1.4;margin:0 18px 18px;color:var(--grau-text)}

/* aussage (Alltag und Lebensbewältigung) */
.r-karten--aussage{padding:120px 0 40px}
.r-karten .k-grid--aussage{grid-template-columns:1fr 1fr}
.k-aussage{background:var(--paper);border-radius:28px;padding:40px;position:relative;overflow:hidden}
.bg-paper .k-aussage{background:#fff}
.k-aussage h4{font-size:22px;line-height:1.25;color:var(--tanne);margin:0}
.k-aussage p{font-size:17px;line-height:1.6;margin-top:12px;text-wrap:pretty;color:var(--schwarz)}
.k-aussage.tanne{background:var(--tanne);color:#fff}
.k-aussage.tanne h4{color:#fff}
.k-aussage.tanne p{color:rgba(255,255,255,.84)}
.k-aussage.gelb{background:var(--sonne);color:var(--tanne)}
.k-aussage.gelb p{color:var(--tanne)}
.k-aussage.wide{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start}
.k-aussage.wide h4{font-size:clamp(24px,2.4vw,32px)}
.k-aussage .werte{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.k-aussage .werte span{font-weight:600;font-size:15px;color:var(--tanne);background:#fff;border-radius:999px;padding:9px 14px}
.k-aussage.tanne .werte span{background:rgba(255,255,255,.12);color:#fff}

@media (max-width:1024px){
  .r-karten.r-karten--kopf-nebeneinander .head{grid-template-columns:1fr;gap:20px}
  .r-karten .k-grid--person{grid-template-columns:repeat(2,minmax(0,1fr))}
  .r-karten .k-grid--bild{grid-template-columns:repeat(2,minmax(0,1fr))}
  .r-karten.is-center .k-grid--bild{grid-template-columns:1fr 1fr}
  .r-karten.is-center .k-grid--bild .k-bild,.r-karten.is-center .k-grid--bild .k-bild:nth-child(3n+1):nth-last-child(2){grid-column:auto}
  .r-karten .k-grid--slot,.r-karten .k-grid--story,.r-karten .k-grid--benefit{grid-template-columns:repeat(2,minmax(0,1fr))}
  .r-karten .felder{grid-template-columns:1fr}
  .r-karten .k-grid--mitglied{grid-template-columns:repeat(3,minmax(0,1fr))}
  .r-karten .k-grid--aussage,.k-aussage.wide{grid-template-columns:1fr;gap:20px}
  .k-aussage.wide{grid-column:auto}
}
@media (max-width:760px){
  .r-karten,.r-karten--link,.r-karten--aussage{padding:80px 0}
  .r-karten--person{padding:80px 0 90px}
  .k-link{padding:26px 24px}
  .r-karten .k-grid--person{grid-template-columns:1fr;gap:12px}
  .r-karten .k-grid--bild,.r-karten.is-center .k-grid--bild{grid-template-columns:1fr;gap:12px}
  .r-karten .k-grid--slot,.r-karten .k-grid--story,.r-karten .k-grid--benefit{grid-template-columns:1fr;gap:12px}
  .r-karten .k-grid--mitglied{grid-template-columns:1fr 1fr;gap:12px}
  .k-aussage{padding:28px 24px}
}

/* Tablet hoch: Link-Karten (z. B. «Unterstützung» auf Ehemalige) einspaltig */
@media (max-width:1100px) and (orientation:portrait), (max-width:760px){
  .r-karten .k-grid--link{grid-template-columns:1fr;gap:12px}
}