/* ── RESET & ROOT ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --beige-light: #f5f0e8;
  --beige:       #ede5d4;
  --beige-dark:  #d6c9b0;
  --beige-deep:  #c4b49a;
  --cream:       #faf7f2;
  --text:        #1e1b18;
  --text-mid:    #5a5248;
  --text-light:  #8a8078;
  --border:      rgba(30,27,24,.1);
  --black:       #1e1b18;
  --sans:        'DM Sans', system-ui, sans-serif;
  --heading:     'Playfair Display', serif;
  --radius:      12px;
  --nav-h:       80px;
}

html { scroll-behavior: smooth; }
body { padding-top: var(--nav-h); font-family: var(--sans); background: var(--cream); color: var(--text); font-size: 16px; line-height: 1.7; }

/* ── TYPOGRAPHY ── */
h1,h2,h3,h4,h5,h6 { font-family: var(--heading); font-weight: 400; }
h1 { font-size: clamp(2.4rem, 5.5vw, 4.2rem); line-height: 1.1; }
h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); line-height: 1.2; }
h3 { font-family: var(--heading); font-size: 1.4rem; line-height: 1.35; font-weight: 400; }
p { color: var(--text-mid); }

/* ── NAV ── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--nav-h);
  background: rgba(250,247,242,.96);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
}
.nav-inner {
  max-width: 1400px; margin: 0 auto; width: 100%;
  padding: 0 1.5rem; height: 100%;
  display: flex; align-items: center; justify-content: space-between;
}
.logo {
  font-family: var(--sans); font-size: 1.25rem; font-weight: 400;
  color: var(--text); text-decoration: none; letter-spacing: .03em;
}
.logo span { color: var(--text); font-weight: 500; }

.nav-links { display: flex; align-items: center; gap: .6rem; list-style: none; }
.nav-links a {
  font-size: .7rem; font-weight: 400; letter-spacing: .04em;
  text-decoration: none; color: var(--text-mid);
  text-transform: uppercase; transition: color .2s; white-space: nowrap;
}
.nav-links a:hover, .nav-links a.active { color: var(--black); }
.nav-cta {
  background: var(--black) !important; color: #fff !important;
  padding: .35rem .8rem; border-radius: 100px;
  font-weight: 500 !important;
  transition: background .2s !important;
}
.nav-cta:hover { background: #3a3530 !important; }

.hamburger {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.hamburger span { display: block; width: 24px; height: 2px; background: var(--text); border-radius: 2px; transition: .3s; }
.hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hamburger.open span:nth-child(2) { opacity: 0; }
.hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.mobile-menu {
  display: none; position: fixed; top: var(--nav-h); left: 0; right: 0; bottom: 0;
  background: var(--cream); z-index: 99;
  flex-direction: column; align-items: center; justify-content: center; gap: 2rem;
  padding: 2rem;
}
.mobile-menu.open { display: flex; }
.mobile-menu a { font-family: var(--heading); font-size: 2rem; font-weight: 300; color: var(--text); text-decoration: none; transition: color .2s; }
.mobile-menu a:hover { color: var(--text-mid); }

/* ── LAYOUT ── */
.container { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }
.section { padding: 5rem 0; }
.section-sm { padding: 3rem 0; }
.divider { height: 1px; background: var(--border); }

/* ── COMPONENTS ── */
.tag {
  display: inline-block; font-size: .72rem; font-weight: 500; letter-spacing: .1em;
  text-transform: uppercase; color: var(--text-mid); background: var(--beige);
  padding: .28rem .8rem; border-radius: 100px; margin-bottom: 1rem;
}
.btn {
  display: inline-block; padding: .7rem 2rem; border-radius: 100px;
  font-family: var(--sans); font-size: .875rem; font-weight: 500;
  letter-spacing: .04em; text-decoration: none; cursor: pointer;
  transition: .2s; border: none;
}
.btn-primary { background: var(--black); color: #fff; }
.btn-primary:hover { background: #3a3530; }
.btn-outline { background: transparent; color: var(--text); border: 1.5px solid var(--border); }
.btn-outline:hover { border-color: var(--black); color: var(--black); }

/* ── HERO (cream) ── */
.hero-cream { padding: 7rem 0 5rem; background: var(--cream); }
.hero-cream-inner { max-width: 680px; }
.hero-cream-inner h1 { font-size: clamp(2.8rem, 6vw, 4.8rem); font-style: italic; font-weight: 300; margin: .5rem 0 1.25rem; line-height: 1.05; }
.hero-cream-inner > p { font-size: 1.1rem; color: var(--text-mid); line-height: 1.75; margin-bottom: 2rem; }
.hero-badge-cream {
  display: inline-block; background: var(--beige); border: 1px solid var(--beige-dark);
  color: var(--text-mid); padding: .35rem .9rem; border-radius: 100px;
  font-size: .78rem; letter-spacing: .06em; text-transform: uppercase;
}

/* ── STRAND BANNER ── */
.strand-banner { width: 100%; height: 480px; overflow: hidden; position: relative; }
.strand-img { width: 100%; height: 100%; object-fit: cover; object-position: center 68%; display: block; }

/* ── STATS BAR ── */
.stats-bar { background: var(--black); padding: 2rem 0; }
.stats-grid { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; }
.stat-item { flex: 1; min-width: 140px; text-align: center; padding: 1rem 2rem; }
.stat-num { font-family: var(--sans); font-size: clamp(2rem,4vw,3rem); font-weight: 300; color: #fff; line-height: 1; }
.stat-label { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.5); margin-top: .4rem; }
.stat-divider { width: 1px; height: 36px; background: rgba(255,255,255,.15); flex-shrink: 0; }

/* ── CARDS ── */
.card { background: #fff; border-radius: var(--radius); padding: 2rem; border: 1px solid var(--border); }
.card-grid { display: grid; gap: 1.5rem; }
.card-grid-2 { grid-template-columns: repeat(2, 1fr); }
.card-grid-3 { grid-template-columns: repeat(3, 1fr); }

/* ── PERSON CARD ── */
.person-card { display: flex; gap: 3rem; align-items: center; padding: 3rem 0; }
.person-card:not(:last-child) { border-bottom: 1px solid var(--border); }
.person-img { width: 220px; height: 280px; object-fit: cover; border-radius: var(--radius); flex-shrink: 0; }
.person-info h3 { margin-bottom: .25rem; }
.person-role { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-light); margin-bottom: 1rem; font-weight: 500; }
.person-info p { margin-bottom: .75rem; }

/* ── INVESTITION ── */
.preis-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.preis-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 2.5rem 2rem; }
.preis-card.featured { background: var(--black); border-color: var(--black); }
.preis-card.featured * { color: #fff !important; }
.preis-card.featured .btn { background: var(--beige-deep); color: var(--black) !important; }
.preis-card.featured .btn:hover { background: var(--beige-dark); }
.preis-amount { font-family: var(--heading); font-size: 2.8rem; font-weight: 300; color: var(--text); line-height: 1; margin-bottom: .25rem; }
.preis-per { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-mid); margin-bottom: 1.5rem; }
.preis-includes { list-style: none; margin-bottom: 2rem; }
.preis-includes li { padding: .5rem 0; border-bottom: 1px solid var(--border); font-size: .9rem; color: var(--text-mid); }
.preis-includes li::before { content: "✓ "; color: var(--text); font-weight: 500; }

/* ── PHASE CARDS ── */
.phase-card { border-left: 3px solid var(--beige-dark); padding: 1.5rem 1.5rem 1.5rem 2rem; background: #fff; border-radius: 0 var(--radius) var(--radius) 0; }
.phase-num { font-size: .75rem; letter-spacing: .15em; text-transform: uppercase; color: var(--text-light); font-weight: 500; margin-bottom: .5rem; }

/* ── PODCAST ── */
.episode-card { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; margin-bottom: 1.5rem; }
.ep-meta { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-light); margin-bottom: .5rem; font-weight: 500; }
.player { margin-top: 1.25rem; }
.player-bar { display: flex; align-items: center; gap: 1rem; }
.play-btn { width: 44px; height: 44px; border-radius: 50%; background: var(--black); border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background .2s; }
.play-btn:hover { background: #3a3530; }
.play-btn svg { fill: #fff; margin-left: 3px; }
.progress-wrap { flex: 1; height: 4px; background: var(--beige); border-radius: 2px; cursor: pointer; position: relative; }
.progress-fill { height: 100%; background: var(--black); border-radius: 2px; width: 0; pointer-events: none; }
.time-display { font-size: .8rem; color: var(--text-mid); white-space: nowrap; min-width: 90px; text-align: right; }

/* ── WISSEN ── */
.wissen-layout { display: grid; grid-template-columns: 220px 1fr; gap: 4rem; align-items: start; }
.wissen-nav { position: sticky; top: calc(var(--nav-h) + 2rem); }
.wissen-nav a { display: block; padding: .6rem .75rem; font-size: .85rem; color: var(--text-mid); text-decoration: none; border-radius: 6px; transition: .2s; border-left: 2px solid transparent; }
.wissen-nav a:hover, .wissen-nav a.active { color: var(--black); background: var(--beige-light); border-left-color: var(--black); }
.wissen-article { display: none; }
.wissen-article.active { display: block; }
.wissen-article h2 { margin-bottom: 1.5rem; }
.wissen-article h3 { margin-top: 2rem; margin-bottom: .75rem; font-size: 1.15rem; }
.wissen-article p { margin-bottom: 1rem; }
.wissen-article ul { padding-left: 1.5rem; margin-bottom: 1rem; }
.wissen-article ul li { margin-bottom: .4rem; color: var(--text-mid); }

/* ── FORM ── */
.form-section { background: var(--beige-light); }
.hs-form-wrapper { max-width: 640px; margin: 0 auto; }
.hs-form input, .hs-form textarea, .hs-form select {
  width: 100%; padding: .85rem 1rem; border: 1.5px solid var(--border);
  border-radius: 8px; font-family: var(--sans); font-size: .95rem;
  background: #fff; color: var(--text); transition: border-color .2s; margin-bottom: .25rem;
}
.hs-form input:focus, .hs-form textarea:focus { outline: none; border-color: var(--black); }
.hs-form .hs-submit input { background: var(--black); color: #fff; font-weight: 500; cursor: pointer; border: none; }
.hs-form .hs-submit input:hover { background: #3a3530; }
.hs-form label { font-size: .85rem; font-weight: 500; margin-bottom: .3rem; display: block; }
.hs-form .hs-form-field { margin-bottom: 1.25rem; }
.hs-form .hs-error-msgs { list-style: none; }
.hs-form .hs-error-msgs li { color: #c0392b; font-size: .8rem; margin-top: .2rem; }

/* ── FOOTER ── */
footer { background: var(--black); padding: 4rem 0 2rem; color: rgba(255,255,255,.6); }
.footer-inner { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 3rem; margin-bottom: 3rem; }
footer .logo { color: #fff; font-size: 1.1rem; display: block; margin-bottom: .75rem; text-decoration: none; }
footer .logo span { color: rgba(255,255,255,.6); }
footer p { font-size: .875rem; line-height: 1.6; }
.footer-links, .footer-legal { display: flex; flex-direction: column; gap: .5rem; padding-top: .25rem; }
.footer-links a, .footer-legal a { color: rgba(255,255,255,.5); text-decoration: none; font-size: .875rem; transition: color .2s; }
.footer-links a:hover, .footer-legal a:hover { color: #fff; }

/* ── PAGE HERO (inner pages) ── */
.page-hero { padding: 5rem 0 3rem; background: var(--beige-light); border-bottom: 1px solid var(--border); }

/* ── BLOCKQUOTE ── */
blockquote { border-left: 3px solid var(--beige-dark); padding: 1rem 1.5rem; margin: 2rem 0; font-family: var(--heading); font-size: 1.3rem; font-style: italic; color: var(--text); }

/* ── RESPONSIVE ── */
@media (max-width: 900px) {
  .preis-grid { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; }
  .card-grid-3 { grid-template-columns: 1fr; }
  .card-grid-2 { grid-template-columns: 1fr; }
  .wissen-layout { grid-template-columns: 1fr; }
  .wissen-nav { position: static; display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 2rem; }
  .person-card { flex-direction: column; gap: 1.5rem; }
  .person-img { width: 100%; height: 260px; }
  .footer-inner { grid-template-columns: 1fr; gap: 2rem; }
}
@media (max-width: 1024px) {
  .nav-links { display: none; }
  .vision-grid { grid-template-columns: 1fr !important; }
  .hamburger { display: flex; }
  .hero-btns { flex-direction: column; align-items: flex-start; }
  .stats-grid .stat-divider { display: none; }
  .strand-banner { height: 260px; }
  .hero-cream { padding: 5rem 0 3rem; }
}

/* ── TIMETABLE ── */
.timetable { width: 100%; border-collapse: collapse; margin-top: 2rem; }
.timetable th {
  background: var(--black); color: #fff;
  padding: .9rem 1.25rem; font-family: var(--sans);
  font-size: .78rem; font-weight: 500; letter-spacing: .08em;
  text-transform: uppercase; text-align: left;
}
.timetable th:first-child { width: 110px; }
.timetable td {
  padding: .85rem 1.25rem; font-size: .9rem;
  border-bottom: 1px solid var(--border); vertical-align: top;
  color: var(--text-mid);
}
.timetable tr:last-child td { border-bottom: none; }
.timetable tr:nth-child(even) td { background: var(--beige-light); }
.timetable .time {
  font-family: var(--sans); font-weight: 500;
  color: var(--text); font-size: .85rem; white-space: nowrap;
}
.timetable .discipline {
  display: inline-block; font-size: .7rem; font-weight: 500;
  letter-spacing: .08em; text-transform: uppercase;
  padding: .15rem .55rem; border-radius: 100px; margin-bottom: .25rem;
}
.disc-pilates  { background: #e8e0d0; color: #4a3f35; }
.disc-yoga     { background: #dde8df; color: #2d4a33; }
.disc-breath   { background: #dfe4ed; color: #2d3a4a; }
.disc-ernaehr  { background: #ede8dc; color: #4a3d28; }
.disc-frei     { background: var(--beige); color: var(--text-mid); }
.disc-gemeins  { background: #f0ebe2; color: var(--text-mid); }
.timetable strong { display: block; color: var(--text); font-weight: 500; margin-bottom: .15rem; }
.day-header { background: var(--beige) !important; }
.day-header td {
  font-family: var(--heading); font-size: 1.1rem !important;
  font-weight: 400; color: var(--text) !important;
  padding: 1rem 1.25rem !important; border-bottom: 2px solid var(--beige-dark) !important;
}
@media (max-width: 768px) {
  .timetable th:nth-child(n+3), .timetable td:nth-child(n+3) { display: none; }
  .timetable { font-size: .82rem; }
}

/* ── STRAND QUOTE OVERLAY ── */
.strand-quote {
  position: absolute;
  bottom: 0; left: 0;
  width: 42%;
  background: rgba(30,27,24,.72);
  backdrop-filter: blur(6px);
  padding: 2.5rem;
  color: #fff;
}
.strand-quote blockquote {
  border: none; padding: 0; margin: 0;
  font-family: var(--heading);
  font-size: 1.25rem;
  font-style: italic;
  color: #fff;
  line-height: 1.55;
}
.strand-quote cite {
  display: block;
  margin-top: 1rem;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(255,255,255,.6);
  font-style: normal;
}
@media (max-width: 768px) {
  .strand-quote { width: 100%; }
  .strand-banner { height: 560px; }
}