/*
Theme Name:   Healthy Aging Lab
Description:  Child Theme für Healthy Aging Lab – evidenzbasierte Gesundheitsbegleitung
Author:       Healthy Aging Lab
Template:     generatepress
Version:      1.0.0
Text Domain:  hal
*/

/* ─────────────────────────────────────────
   GOOGLE FONTS werden via functions.php geladen
   ───────────────────────────────────────── */

/* ── WORDPRESS ADMIN BAR ────────────────────────────────────────────────────── */
/* Wenn ein Admin eingeloggt ist, schiebt WP die Seite 32px (Desktop) bzw. 46px (Mobile) runter.
   Die fixe Nav muss mitgehen, sonst klebt sie unter der Admin-Bar. */
body.admin-bar .hal-nav {
  top: calc(32px + 0.75rem);
}
@media screen and (max-width: 782px) {
  body.admin-bar .hal-nav {
    top: calc(46px + 0.75rem);
  }
}

:root {
  --rosewood:       #B84040;
  --rosewood-hover: #9e3535;
  --rosewood-light: #E8D6D6;
  --rosewood-pale:  #F5EDED;
  --teal:           #7DA8A0;
  --teal-hover:     #5a8880;
  --deep-teal:      #2A4F4A;
  --slate:          #8FA3B1;
  --powder:         #9DB8B2;
  --stone:          #5A6460;
  --stone-light:    #8A9490;
  --linen:          #F4F6F5;
  --cream:          #F7FAF9;
  --ice-teal:       #D8E8E6;
  --white:          #FCFDFC;
  --serif:          'Cormorant Garamond', Georgia, serif;
  --sans:           'Jost', sans-serif;
  --text-body:      1.35rem;
}

/* ── RESET & BASE ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; height: 100%; overflow-x: hidden; }
* { max-width: 100%; box-sizing: border-box; }
p, li { font-size: var(--text-body); }

body {
  overflow-x: hidden;
  background: var(--white) !important;
  color: var(--deep-teal) !important;
  font-family: var(--sans) !important;
  font-weight: 300;
  font-size: var(--text-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 100vh;
  display: flex !important;
  flex-direction: column !important;
}

/* GeneratePress Overrides – alle Layout-Wrapper neutralisieren */
.site-content,
.content-area,
.site-main,
#content,
.inside-page-hero,
.page-hero-container,
.container,
.grid-container,
.inside-article,
.entry-content,
.page-content {
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  background: transparent !important;
}

/* #page separat — flex-child von body, füllt Raum */
#page {
  max-width: none !important;
  width: 100% !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 1 0 auto !important;
}

.hal-footer { flex-shrink: 0; }
body.page .site-main > article { padding: 0 !important; margin: 0 !important; }

/* GeneratePress Header/Nav ausblenden */
.site-header,
.main-nav,
.nav-float,
.site-footer,
.generate-back-to-top,
.entry-header,
.entry-meta,
.entry-footer,
.breadcrumb-trail,
.page-header {
  display: none !important;
}

/* Sidebar ausblenden */
.sidebar,
#sidebar-1,
.widget-area {
  display: none !important;
}

/* ── ANIMATIONS ── */
@keyframes rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideRight { from { width: 0; } to { width: 48px; } }

.animate { animation: rise 0.7s ease both; }
.d1 { animation-delay: 0.1s; }
.d2 { animation-delay: 0.22s; }
.d3 { animation-delay: 0.34s; }
.d4 { animation-delay: 0.46s; }
.d5 { animation-delay: 0.58s; }

/* ── NAVIGATION ── */
.hal-nav {
  position: fixed;
  top: 0.75rem; left: 1rem; right: 1rem;
  z-index: 100;
  background: rgba(244,246,245,0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(42,79,74,0.09);
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(22,46,41,0.11), 0 2px 8px rgba(22,46,41,0.07);
  padding: 1.1rem 3rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.hal-nav-brand {
  font-family: var(--serif);
  font-size: 1.65rem;
  font-weight: 600;
  color: var(--rosewood);
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  letter-spacing: -0.01em;
}
.hal-nav-links { display: flex; gap: 2rem; align-items: center; }
.hal-nav-links a:not(.nav-cta) {
  font-size: 0.82rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--stone);
  text-decoration: none;
  transition: color 0.25s;
  position: relative;
}
.hal-nav-links a:not(.nav-cta)::after {
  content: '';
  position: absolute;
  bottom: -3px; left: 0;
  width: 0; height: 1px;
  background: var(--rosewood);
  transition: width 0.3s;
}
.hal-nav-links a:not(.nav-cta):hover { color: var(--rosewood); }
.hal-nav-links a:not(.nav-cta):hover::after { width: 100%; }
.nav-cta {
  font-family: var(--sans);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: #fff !important;
  background: linear-gradient(145deg, #C24545 0%, #B84040 60%, #A63C3C 100%);
  padding: 0.5rem 1.25rem;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.25s, transform 0.25s, box-shadow 0.25s;
}
.nav-cta:hover {
  background: var(--rosewood-hover) !important;
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(184,64,64,0.25);
}

/* ── HAMBURGER ── */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  cursor: pointer;
  padding: 0.4rem;
  z-index: 200;
  appearance: none !important;
  -webkit-appearance: none !important;
  -webkit-tap-highlight-color: transparent;
  box-shadow: none !important;
  outline: none;
}
.nav-hamburger:hover,
.nav-hamburger:focus,
.nav-hamburger:active,
.nav-hamburger.open {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none;
}
.nav-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: var(--deep-teal);
  border-radius: 2px;
  transition: transform 0.3s, opacity 0.3s;
}
.nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-hamburger.open span:nth-child(2) { opacity: 0; }
.nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── MOBILE MENU KACHEL ── */
/* Außerhalb von .hal-nav → kein Stacking-Context-Problem */
@keyframes menuPop {
  from { opacity: 0; transform: scale(0.96) translateY(-8px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}
.hal-mobile-menu {
  display: none;
  position: fixed;
  top: 5rem;
  left: 0.5rem;
  right: 0.5rem;
  z-index: 490;
  flex-direction: column;
  background: rgba(244,246,245,0.85);
  backdrop-filter: blur(28px);
  -webkit-backdrop-filter: blur(28px);
  border-radius: 20px;
  border: 1px solid rgba(42,79,74,0.09);
  box-shadow: 0 20px 60px rgba(22,46,41,0.22), 0 4px 16px rgba(22,46,41,0.12);
  overflow: hidden;
}
.hal-mobile-menu.open {
  display: flex;
  animation: menuPop 0.22s cubic-bezier(0.34,1.56,0.64,1) both;
}

/* Schließen-Button (oben rechts in der Kachel) */
.hal-mobile-close {
  position: absolute;
  top: 0.9rem;
  right: 0.9rem;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.35rem;
  color: var(--deep-teal);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  transition: background 0.15s;
  z-index: 1;
}
.hal-mobile-close:hover { background: rgba(42,79,74,0.08); }

/* Links – selbe Typografie wie Desktop-Nav */
.hal-mobile-links {
  display: flex;
  flex-direction: column;
  padding: 0.6rem 0 0;
}
.hal-mobile-links a {
  font-family: var(--sans);
  font-size: 0.82rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--stone);
  text-decoration: none;
  padding: 0.95rem 1.4rem;
  border-bottom: 1px solid rgba(42,79,74,0.07);
  transition: color 0.2s, background 0.18s;
}
.hal-mobile-links a:last-child { border-bottom: none; }
.hal-mobile-links a:hover { color: var(--rosewood); background: rgba(184,64,64,0.03); }

/* Kontakt-Button */
.hal-mobile-cta {
  display: block;
  font-family: var(--sans);
  font-size: 0.82rem;
  font-weight: 500;
  letter-spacing: 0.06em;
  text-align: center;
  color: #fff !important;
  background: linear-gradient(145deg, #C24545 0%, #B84040 60%, #A63C3C 100%);
  padding: 0.7rem 2rem;
  margin: 0.6rem 1.4rem 1.2rem;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.22s;
}
.hal-mobile-cta:hover { background: var(--rosewood-hover) !important; }

/* ── SECTIONS ── */
.section { padding: 8rem 5rem; border-bottom: 1px solid rgba(42,79,74,0.06); }
.s-white { background: var(--white); }
.s-linen { background: var(--linen); }

/* Gleiche Hintergrundfarbe aufeinanderfolgend → nur 8rem total, nicht 16rem */
.s-white + .s-white,
.s-linen + .s-linen { padding-top: 0; }
.s-cream { background: var(--cream); }

/* ── PAGE TILE (gemeinsame Kachel für alle Content-Sections) ── */
.page-tile {
  background: var(--white);
  border-radius: 20px;
  padding: 3.5rem 4rem;
  box-shadow: 0 4px 32px rgba(42,79,74,0.07), 0 1px 4px rgba(42,79,74,0.04);
}

/* ── BUTTONS ── */
.btn-primary {
  display: inline-flex; align-items: center;
  background: linear-gradient(145deg, #C24545 0%, #B84040 60%, #A63C3C 100%);
  color: #fff !important;
  padding: 0.9rem 2rem; border-radius: 8px;
  font-family: var(--sans); font-size: 0.9rem; font-weight: 500;
  letter-spacing: 0.04em; text-decoration: none;
  transition: background 0.25s, transform 0.25s, box-shadow 0.25s;
}
.btn-primary:hover {
  background: var(--rosewood-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(184,64,64,0.25);
}
.btn-ghost {
  display: inline-flex; align-items: center;
  background: transparent; color: var(--rosewood) !important;
  padding: 0.9rem 2rem; border-radius: 8px;
  border: 1.5px solid rgba(184,64,64,0.3);
  font-family: var(--sans); font-size: 0.9rem; font-weight: 500;
  text-decoration: none;
  transition: border-color 0.25s, background 0.25s, transform 0.25s;
}
.btn-ghost:hover {
  border-color: var(--rosewood);
  background: rgba(184,64,64,0.04);
  transform: translateY(-2px);
}
.btn-teal {
  display: inline-flex; align-items: center;
  background: linear-gradient(145deg, #8BB8B0 0%, #7DA8A0 60%, #6E9890 100%);
  color: #fff !important;
  padding: 0.9rem 2rem; border-radius: 8px;
  font-family: var(--sans); font-size: 0.9rem; font-weight: 500;
  text-decoration: none;
  transition: background 0.25s, transform 0.25s, box-shadow 0.25s;
}
.btn-teal:hover {
  background: var(--teal-hover);
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(125,168,160,0.28);
}

/* ── EYEBROW ── */
.section-eyebrow {
  font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--rosewood); margin-bottom: 0.9rem;
  display: flex; align-items: center; gap: 0.8rem;
}
.section-eyebrow::after {
  content: ''; display: block;
  width: 28px; height: 1px;
  background: var(--rosewood); opacity: 0.35;
}

/* ── HERO ── */
.hero {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 2fr 3fr;
  align-items: stretch;
  padding: 3rem 3rem 0 5rem;
  position: relative;
  overflow: hidden;
  background: var(--linen);
  gap: 3rem;
}
.hero-left { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 140px 0 100px; }
.hero-right { display: flex; align-items: stretch; position: relative; padding: 0; margin-right: -3rem; align-self: stretch; }
.hero-image-wrap { position: relative; width: 100%; height: 100%; display: flex; align-items: stretch; min-height: 100%; }
.hero-image {
  width: 100%; height: 100%; min-height: 480px;
  object-fit: cover; border-radius: 0; display: block;
  background: linear-gradient(135deg, #2A4F4A, #7DA8A0);
}
.hero-image-badge {
  position: absolute; bottom: 1.8rem; left: -1.5rem;
  background: var(--white); border-radius: 99px;
  padding: 0.6rem 1.1rem; display: flex; align-items: center; gap: 0.5rem;
  box-shadow: 0 8px 28px rgba(42,79,74,0.13);
  font-family: var(--serif); font-size: 0.82rem; font-style: italic; color: var(--rosewood);
}
.hero-eyebrow {
  font-size: 0.82rem; font-weight: 500; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--rosewood); margin-bottom: 1.5rem;
  display: flex; align-items: center; gap: 0.8rem;
}
.hero-eyebrow::after { content: ''; display: block; width: 48px; height: 1px; background: var(--rosewood); opacity: 0.4; animation: slideRight 0.8s ease 0.4s both; }
.hero-title {
  font-family: var(--serif); font-size: clamp(2.8rem, 4vw, 4.2rem); font-weight: 400;
  line-height: 1.08; letter-spacing: -0.02em; color: var(--deep-teal); margin-bottom: 1.6rem;
}
.hero-title em { font-style: italic; color: var(--rosewood); }
.hero-desc { font-family: var(--sans); font-size: var(--text-body); font-weight: 300; color: var(--stone); line-height: 1.5; max-width: 42ch; margin-bottom: 2.2rem; }
.hero-buttons { display: flex; gap: 1rem; align-items: center; flex-wrap: wrap; justify-content: center; }
.hero-buttons a, .cta-buttons a { width: 320px; justify-content: center; white-space: nowrap; }

/* ── LEISTUNGSSPEKTRUM ── */
.program-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin-bottom: 1.5rem; align-items: stretch; pointer-events: none; }
.program-card { border-radius: 20px; padding: 2.5rem; display: flex; flex-direction: column; position: relative; overflow: hidden; transition: transform 0.35s ease, box-shadow 0.35s ease, opacity 0.35s ease, filter 0.35s ease; pointer-events: auto; }
.program-grid:hover .program-card { opacity: 0.55; filter: brightness(0.82); transform: scale(0.98); }
.program-grid:hover .program-card:hover { opacity: 1; filter: brightness(1.06); transform: translateY(-8px) scale(1.02); box-shadow: 0 32px 64px rgba(0,0,0,0.22); }
.program-card::before {
  content: '';
  position: absolute;
  top: -70px; right: -70px;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 68%);
  pointer-events: none;
}
.program-card::after {
  content: '';
  position: absolute;
  bottom: -60px; left: -40px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 68%);
  pointer-events: none;
}
.program-card-rose { background: linear-gradient(145deg, #C24545 0%, #B84040 55%, #A63C3C 100%); }
.program-card-ice { background: linear-gradient(145deg, #2e5550 0%, #2A4F4A 60%, #1f3d39 100%); }
.program-items { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 1.2rem; }
.program-item { font-size: var(--text-body); font-weight: 300; line-height: 1.5; padding: 0.5rem 0; border-bottom: 1px solid rgba(255,255,255,0.1); }
.program-card-ice .program-item { border-bottom-color: rgba(255,255,255,0.1); }

/* ── PROGRAM STEPS (horizontale 01-03 Darstellung) ── */
.program-steps {
  display: flex;
  align-items: stretch;
  margin-top: 2rem;
  flex: 1;
}
.program-step {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0.5rem 1.2rem;
}
.program-step-num {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 3rem;
  line-height: 1;
  margin-bottom: 0.75rem;
  color: rgba(255,255,255,0.22);
  letter-spacing: -0.02em;
}
.program-step-label {
  font-family: var(--sans);
  font-weight: 300;
  font-size: var(--text-body);
  color: rgba(255,255,255,0.82);
  line-height: 1.4;
}
.program-step-sep {
  width: 1px;
  align-self: stretch;
  background: rgba(255,255,255,0.14);
  flex-shrink: 0;
  margin: 0.25rem 0;
}
.followup-arrows { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; margin: 0.5rem 0; text-align: center; }
.followup-arrow { font-size: 1.2rem; color: var(--stone); opacity: 0.4; }
.program-badge { display: inline-flex; align-items: center; padding: 0.3rem 0.75rem; border-radius: 99px; font-size: 0.65rem; font-weight: 500; font-family: var(--sans); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 1.5rem; width: fit-content; }
.program-title { font-family: var(--serif); font-size: 1.8rem; font-weight: 500; line-height: 1.15; margin-bottom: 1rem; }
.program-desc { font-size: var(--text-body); font-weight: 300; line-height: 1.5; margin-bottom: 1.5rem; }
.program-list { list-style: none; display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 2rem; }
.program-list li { font-size: var(--text-body); font-weight: 300; line-height: 1.6; padding-left: 1.2rem; position: relative; }
.program-list li::before { content: '–'; position: absolute; left: 0; opacity: 0.5; }
.program-cta-link { font-size: 0.82rem; font-weight: 500; letter-spacing: 0.06em; text-decoration: none; display: flex; align-items: center; gap: 0.4rem; margin-top: auto; transition: gap 0.2s; }
.program-cta-link:hover { gap: 0.7rem; }

.followup-card { background: linear-gradient(145deg, #E2F0EE 0%, #D8E8E6 55%, #C6DCDA 100%); border: 1px solid transparent; border-radius: 20px; padding: 2rem 2.5rem; position: relative; overflow: hidden; transition: transform 0.35s ease, box-shadow 0.35s ease; }
.followup-card:hover { transform: translateY(-5px); box-shadow: 0 20px 48px rgba(42,79,74,0.18); }
.followup-card::before {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 280px; height: 280px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(125,168,160,0.2) 0%, transparent 70%);
  pointer-events: none;
}
.followup-card::after {
  content: '';
  position: absolute;
  bottom: -60px; left: -40px;
  width: 200px; height: 200px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(184,64,64,0.1) 0%, transparent 70%);
  pointer-events: none;
}
.followup-card .followup-item-text { color: rgba(42,79,74,0.82); }
.followup-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 15%; height: 70%; width: 1px; background: rgba(42,79,74,0.12); }
.followup-title { font-family: var(--sans); font-size: 0.72rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--stone); text-align: center; margin-bottom: 1.5rem; }
.followup-items { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; }
.followup-item { text-align: center; padding: 0.5rem 1rem; position: relative; }
.followup-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 15%; height: 70%; width: 1px; background: rgba(42,79,74,0.1); }
.followup-item-icon { font-size: 1.2rem; margin-bottom: 0.4rem; }
.followup-item-text { font-size: var(--text-body); font-weight: 300; color: var(--stone); line-height: 1.5; }

.section-cta { text-align: center; margin-top: 2rem; }

/* ── ANSATZ ── */
.ansatz-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; pointer-events: none; }
.card { background: linear-gradient(145deg, var(--white) 0%, var(--linen) 100%); border: 1px solid rgba(42,79,74,0.06); border-radius: 20px; padding: 2.2rem; position: relative; overflow: hidden; transition: transform 0.35s ease, box-shadow 0.35s ease, opacity 0.35s ease, filter 0.35s ease, border-color 0.35s ease; pointer-events: auto; }
.card::before { content: ''; position: absolute; top: -70px; right: -70px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, rgba(42,79,74,0.06) 0%, transparent 68%); pointer-events: none; }
.card::after  { content: ''; position: absolute; bottom: -60px; left: -40px; width: 180px; height: 180px; border-radius: 50%; background: radial-gradient(circle, rgba(42,79,74,0.03) 0%, transparent 68%); pointer-events: none; }
.ansatz-grid:hover .card { opacity: 0.55; filter: brightness(0.92); transform: scale(0.98); }
.ansatz-grid:hover .card:hover { opacity: 1; filter: brightness(1.02); transform: translateY(-8px) scale(1.02); box-shadow: 0 32px 64px rgba(42,79,74,0.14); border-color: rgba(42,79,74,0.18); }
.card-icon {
  width: 52px; height: 52px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 1.2rem; flex-shrink: 0;
}
.card-title { font-family: var(--sans); font-size: 1rem; font-weight: 500; color: var(--deep-teal); margin-bottom: 0.5rem; }
.card-desc { font-size: var(--text-body); font-weight: 300; color: var(--stone); line-height: 1.5; }

/* ── FÜR WEN ── */
.section-title { font-family: var(--serif); font-size: clamp(2rem, 3vw, 2.8rem); font-weight: 400; line-height: 1.15; color: var(--deep-teal); margin-bottom: 0.8rem; }
.section-title em { font-style: italic; color: var(--rosewood); }
.section-desc { font-family: var(--sans); font-size: var(--text-body); font-weight: 300; color: var(--stone); line-height: 1.5; max-width: 58ch; margin-bottom: 2.5rem; }
.persona-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.2rem; pointer-events: none; }
.persona-card { border-radius: 20px; padding: 2.5rem; position: relative; overflow: hidden; transition: transform 0.35s ease, box-shadow 0.35s ease, opacity 0.35s ease, filter 0.35s ease; pointer-events: auto; }
.persona-grid:hover .persona-card { opacity: 0.55; filter: brightness(0.82); transform: scale(0.98); }
.persona-grid:hover .persona-card:hover { opacity: 1; filter: brightness(1.06); transform: translateY(-8px) scale(1.02); box-shadow: 0 32px 64px rgba(0,0,0,0.22); }
.persona-card::before {
  content: '';
  position: absolute;
  top: -70px; right: -70px;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 68%);
  pointer-events: none;
}
.p-rose { background: linear-gradient(145deg, #C24545 0%, #B84040 55%, #A63C3C 100%); }
.p-dark { background: linear-gradient(145deg, #2e5550 0%, #2A4F4A 55%, #1f3d39 100%); }
.p-ice  { background: linear-gradient(145deg, #E2F0EE 0%, #D8E8E6 55%, #C6DCDA 100%); }
.p-rose::after {
  content: '';
  position: absolute;
  bottom: -50px; left: -40px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,200,180,0.18) 0%, transparent 70%);
  pointer-events: none;
}
.p-dark::after {
  content: '';
  position: absolute;
  bottom: -50px; left: -40px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(125,168,160,0.22) 0%, transparent 70%);
  pointer-events: none;
}
.p-ice::after {
  content: '';
  position: absolute;
  bottom: -50px; left: -40px;
  width: 180px; height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(42,79,74,0.1) 0%, transparent 70%);
  pointer-events: none;
}
.persona-num { font-family: var(--serif); font-size: 2.2rem; font-weight: 400; line-height: 1; margin-bottom: 1rem; }
.persona-title { font-family: var(--sans); font-size: 1rem; font-weight: 500; margin-bottom: 0.2rem; }
.persona-sub { font-size: 0.72rem; font-weight: 400; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 1.2rem; }
.persona-quote { font-family: var(--serif); font-size: var(--text-body); line-height: 1.55; }

/* ── CTA SECTION ── */
.cta-section {
  background: var(--white);
  padding: 8rem 5rem;
  text-align: center;
  border-bottom: none;
}
.cta-title {
  font-family: var(--serif); font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 400;
  color: var(--deep-teal); line-height: 1.2; max-width: 20ch; margin: 0 auto 1.2rem; letter-spacing: -0.01em;
}
.cta-desc { font-size: var(--text-body); font-weight: 300; color: var(--stone); max-width: 48ch; margin: 0 auto 2.5rem; line-height: 1.5; }
.cta-buttons { display: flex; gap: 1rem; align-items: center; justify-content: center; flex-wrap: wrap; }
.cta-team-note {
  margin-top: 8rem;
  max-width: 90%;
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 400;
  color: var(--rosewood);
  line-height: 1.6;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/* ── FOOTER ── */
.hal-footer { background: var(--deep-teal); }
.hal-footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2rem 5rem;
}
.footer-brand {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--serif); font-size: 1.2rem; font-weight: 600;
  color: rgba(255,255,255,0.82);
  text-decoration: none;
}
.footer-links {
  display: flex; gap: 2rem; align-items: center;
}
.footer-links a {
  color: rgba(255,255,255,0.45);
  font-size: 0.84rem;
  letter-spacing: 0.04em;
  text-decoration: none;
}
.footer-links a:hover { color: rgba(255,255,255,0.75); }
.footer-copy-full, .footer-copy-short {
  color: rgba(255,255,255,0.28);
  font-size: 0.84rem;
}
.footer-copy-short { display: none; }

/* ── INNER PAGES ── */
.page-hero {
  padding: 160px 5rem 5rem;
  background: var(--linen);
}
.page-hero-eyebrow {
  font-size: 0.72rem; font-weight: 500; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--rosewood); margin-bottom: 1rem;
}
.page-hero-title {
  font-family: var(--serif); font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 400;
  line-height: 1.1; color: var(--deep-teal); max-width: 18ch; margin-bottom: 1.2rem;
}
.page-hero-title em { font-style: italic; color: var(--rosewood); }
.page-hero-desc { font-size: var(--text-body); font-weight: 300; color: var(--stone); max-width: 52ch; line-height: 1.5; }

/* ── TABLET (≤ 1024px) ── */
@media (max-width: 1024px) {
  :root { --text-body: 1.15rem; }
  .hal-nav { padding: 1rem 1.5rem; left: 0.75rem; right: 0.75rem; }
  .hal-nav-links a:not(.nav-cta) { display: none; }
  .nav-cta { display: none; }
  .nav-hamburger { display: flex; }

  .hero {
    grid-template-columns: 1fr;
    padding: 120px 2.5rem 0;
    gap: 0;
    min-height: auto;
  }
  .hero-left { padding: 2.5rem 0 3rem; }
  .hero-right { margin-right: -2.5rem; margin-left: -2.5rem; }
  .hero-image { min-height: 340px; }
  .hero-image-badge { left: 1rem; }

  .section { padding: 4rem 2.5rem; }
  .page-tile { padding: 2.5rem; }
  .cta-section { padding: 4rem 2.5rem; }
  .page-hero { padding: 130px 2.5rem 4rem; }

  .program-grid { grid-template-columns: 1fr; }
  .ansatz-grid { grid-template-columns: 1fr; }
  .persona-grid { grid-template-columns: 1fr; }
  .followup-items { grid-template-columns: 1fr 1fr; }
  .followup-item:not(:last-child)::after { display: none; }
}

/* ── MOBILE (≤ 640px) ── */
@media (max-width: 640px) {
  :root { --text-body: 1rem; }
  .hal-nav { padding: 0.9rem 1.25rem; left: 0.5rem; right: 0.5rem; border-radius: 12px; }

  .hero { padding: 100px 1.25rem 0; gap: 0; }
  .hero-left { padding: 2rem 0 2.5rem; }
  .hero-right { margin-right: -1.25rem; margin-left: -1.25rem; }
  .hero-title { font-size: 2.4rem; }
  .hero-image { min-height: 240px; }
  .hero-image-badge { display: none; }
  .hero-buttons { flex-direction: column; align-items: stretch; }
  .hero-buttons a { text-align: center; justify-content: center; }

  .section { padding: 3rem 1.25rem; }
  .page-tile { padding: 2rem 1.5rem; }
  .cta-section { padding: 3rem 1.25rem; }
  .page-hero { padding: 110px 1.25rem 3rem; }

  .followup-items { grid-template-columns: 1fr 1fr; }
  .cta-buttons { flex-direction: column; align-items: stretch; }
  .cta-buttons a { text-align: center; justify-content: center; }

  .hal-footer-inner { padding: 0.75rem 1.25rem 1rem; flex-direction: column; justify-content: center; align-items: center; gap: 0.6rem; }
  .footer-links { order: 2; gap: 0.75rem; justify-content: center; }
  .footer-brand { order: 1; justify-content: center; }
  .footer-copy-full  { display: none; }
  .footer-copy-short { display: inline; }
  .footer-links a { font-size: 0.82rem; }

  /* ── Typografie Mobile ── */
  .hal-nav-brand { font-size: 1.3rem; }
  .section-title { font-size: 1.5rem; text-align: center; }
  .section-desc { text-align: center; }
  .program-title { font-size: 1.35rem; }
  .program-step-num { font-size: 2rem; }
  .persona-num { font-size: 1.6rem; }
  .cta-title { font-size: 1.6rem; text-align: center; }
  .cta-team-note { font-size: 1.15rem; }
  .page-hero-title { font-size: clamp(1.8rem, 6vw, 2.4rem); text-align: center; }

  /* ── Eyebrow zentriert ── */
  .section-eyebrow {
    justify-content: center;
    text-align: center;
  }
  .section-eyebrow::before {
    content: '';
    display: block;
    width: 28px; height: 1px;
    background: var(--rosewood);
    opacity: 0.35;
    flex-shrink: 0;
  }
}