/* Yogahappiness 2026. Weiss und Blau wie ihr Auftritt, seit 20.10.2026 mit ihrem Mandala sanft im Hintergrund (Wunsch Corina). */

@font-face { font-family: "Baloo 2"; font-style: normal; font-weight: 600 700; font-display: swap; src: url("fonts/baloo2-latin-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Baloo 2"; font-style: normal; font-weight: 600 700; font-display: swap; src: url("fonts/baloo2-latin-ext-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/sourcesans3-latin-normal.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Sans 3"; font-style: normal; font-weight: 400 600; font-display: swap; src: url("fonts/sourcesans3-latin-ext-normal.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Source Sans 3"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/sourcesans3-latin-italic.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Source Sans 3"; font-style: italic; font-weight: 400; font-display: swap; src: url("fonts/sourcesans3-latin-ext-italic.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --weiss: #ffffff;
  --blau: #3782c8;        /* Überschriften ab 24 px, ihre Textfarbe */
  --blau-tief: #2b6aa8;   /* Knöpfe, Links, Fokus */
  --hellblau: #42ade6;    /* nur Linien und Flächen, Wortmarke */
  --hauch: #e8f4fc;       /* ruhige Flächen */
  --ocker: #cc7e00;       /* die Wand im Yogaraum */
  --auf-ocker: #17222b;
  --text: #1e3346;
  --leise: #4a5d70;
  --linie: #cfe6f6;

  --titel: "Baloo 2", "Trebuchet MS", system-ui, sans-serif;
  --grund: "Source Sans 3", "Segoe UI", system-ui, sans-serif;
  --wrap: 1160px;
  --gutter: clamp(16px, 4vw, 40px);
  --space: clamp(56px, 8vw, 104px);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 84px; }
body { margin: 0; background: var(--weiss); color: var(--text); font-family: var(--grund); font-size: 1.0625rem; line-height: 1.55; overflow-x: hidden; font-variant-numeric: tabular-nums; hyphens: manual; overflow-wrap: break-word; }
img { display: block; max-width: 100%; height: auto; }
figure { margin: 0; }
p { margin: 0 0 1em; }
a { color: var(--blau-tief); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { text-decoration-thickness: 2px; text-decoration-color: var(--hellblau); }
:focus-visible { outline: 3px solid var(--blau-tief); outline-offset: 3px; border-radius: 3px; }
h1, h2, h3 { font-family: var(--titel); font-weight: 700; color: var(--blau); margin: 0; line-height: 1.15; text-wrap: balance; }
h1 { font-size: clamp(2.2rem, 6vw, 3.6rem); letter-spacing: -.01em; margin-bottom: .45em; }
.h2 { font-size: clamp(1.6rem, 3.5vw, 2.2rem); margin-bottom: .55em; }
h3 { font-size: 1.3rem; margin-bottom: .4em; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 16px; top: -80px; z-index: 100; background: var(--blau-tief); color: #fff; padding: 10px 16px; font-weight: 600; }
.skip:focus { top: 10px; }
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.lesen { max-width: 66ch; }
.leise { color: var(--leise); }
.klein { font-size: .94rem; color: var(--leise); }

/* Entwurfsbalken */
.preview-bar { background: var(--hauch); color: var(--text); font-size: .82rem; text-align: center; padding: 6px 16px; line-height: 1.4; border-bottom: 1px solid var(--linie); }

/* Kopf */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.97); border-bottom: 1px solid var(--linie); }
.header-inner { display: flex; align-items: center; gap: 20px; min-height: 72px; }
.wordmark { font-family: var(--titel); font-size: 1.45rem; line-height: 1; letter-spacing: .04em; color: var(--blau); text-decoration: none; white-space: nowrap; padding: 10px 0; }
.wordmark b { font-weight: 700; color: var(--hellblau); }
.wordmark span { font-weight: 600; }
.wordmark:hover { text-decoration: none; }
.main-nav { margin-left: auto; }
.main-nav ul { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 20px; list-style: none; margin: 0; padding: 0; }
.main-nav a { display: inline-block; font-weight: 600; font-size: .98rem; color: var(--text); text-decoration: none; padding: 10px 0 8px; border-bottom: 3px solid transparent; white-space: nowrap; }
.main-nav a:hover { color: var(--blau-tief); border-bottom-color: var(--linie); }
.main-nav a[aria-current="page"] { color: var(--blau-tief); border-bottom-color: var(--hellblau); }
.menu-toggle { display: none; }

/* Knöpfe */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; min-height: 50px; padding: .7em 1.4em; font-family: var(--grund); font-weight: 600; font-size: 1.02rem; line-height: 1.25; text-align: center; text-decoration: none; border-radius: 999px; border: 2px solid var(--blau-tief); background: var(--blau-tief); color: #fff; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.btn:hover { background: #22578c; border-color: #22578c; color: #fff; }
.btn-line { background: transparent; color: var(--blau-tief); }
.btn-line:hover { background: var(--hauch); color: var(--blau-tief); border-color: var(--blau-tief); }
.btn-dark { background: var(--auf-ocker); border-color: var(--auf-ocker); color: #fff; }
.btn-dark:hover { background: #000; border-color: #000; }
.actions { display: flex; flex-wrap: wrap; gap: 12px 14px; margin-top: 24px; }
.textlink { font-weight: 600; }

/* Abschnitte */
.section { padding-block: var(--space); }
.band-hauch { background: var(--hauch); }
.rule-top { border-top: 1px solid var(--linie); }

/* Startseite: Einstieg */
.hero { padding-block: clamp(32px, 5vw, 72px) clamp(48px, 6vw, 88px); }
.hero-grid { display: grid; grid-template-columns: minmax(0, 5.2fr) minmax(0, 6.8fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
.hero h1 { color: var(--blau); }
.hero-lead { font-size: clamp(1.15rem, 1.8vw, 1.32rem); line-height: 1.5; margin: 0; }
.hero-photo img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 6px; }

/* Fünf Fragen */
.fragen-wrap { max-width: calc(860px + 2 * var(--gutter)); margin-inline: auto; }
.fragen-antwort { margin-top: 36px; }
.nobr { white-space: nowrap; }
.fragen { list-style: none; margin: 0; padding: 0; }
.fragen li { font-family: var(--titel); font-weight: 600; color: var(--blau); font-size: clamp(1.35rem, 3.2vw, 1.9rem); line-height: 1.3; padding: .5em 0; border-bottom: 1px solid var(--linie); text-wrap: balance; }
.fragen li:first-child { border-top: 1px solid var(--linie); }
.fragen-antwort p { font-size: 1.15rem; }
.fragen-antwort p:first-child { font-family: var(--titel); font-weight: 600; font-size: clamp(1.3rem, 2.4vw, 1.6rem); line-height: 1.35; color: var(--text); }

/* Die gelbe Wand */
.wand { background: var(--ocker); color: var(--auf-ocker); padding-block: clamp(56px, 8vw, 96px); }
.wand h2 { color: var(--auf-ocker); font-size: clamp(1.9rem, 4.5vw, 2.8rem); margin-bottom: .35em; }
.wand a:not(.btn) { color: var(--auf-ocker); text-decoration-thickness: 1px; }
.wand a:not(.btn):hover { text-decoration-thickness: 2px; text-decoration-color: var(--auf-ocker); }
.wand :focus-visible { outline-color: var(--auf-ocker); }
.wand-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px clamp(40px, 6vw, 88px); }
.plan { width: 100%; border-collapse: collapse; }
.plan th, .plan td { text-align: left; vertical-align: top; padding: 14px 0; border-bottom: 1px solid rgba(23, 34, 43, .28); }
.plan tr:first-child th, .plan tr:first-child td { border-top: 2px solid var(--auf-ocker); }
.plan th { font-family: var(--titel); font-weight: 700; font-size: clamp(1.15rem, 2.4vw, 1.45rem); line-height: 1.3; padding-right: 20px; width: 34%; }
.plan td { font-family: var(--titel); font-weight: 600; font-size: clamp(1.25rem, 2.8vw, 1.7rem); line-height: 1.3; }
.plan .online { display: block; font-family: var(--grund); font-weight: 400; font-size: 1rem; line-height: 1.4; margin-top: 2px; }
.plan .online a { display: inline-block; padding-block: 2px; }
.kosten { margin: 0; }
.kosten div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 20px; padding: 14px 0; border-bottom: 1px solid rgba(23, 34, 43, .28); }
.kosten div:first-child { border-top: 2px solid var(--auf-ocker); }
.kosten dt { font-weight: 600; line-height: 1.35; }
.kosten dt span { display: block; font-weight: 400; font-size: .98rem; }
.kosten dd { margin: 0; font-family: var(--titel); font-weight: 700; font-size: 1.4rem; line-height: 1.2; white-space: nowrap; }
.wand .actions { margin-top: 32px; }

/* Zweispaltig */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.split-photo img { width: 100%; border-radius: 6px; }

/* Der Yogaraum */
.raum-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
.raum-hoch img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 6px; }
.raum-text { padding-top: clamp(0px, 3vw, 40px); }
.raum-text p { font-size: 1.15rem; }
.raum-quer { margin-top: 36px; }
.raum-quer img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }

/* Corina */
.corina-photo img { aspect-ratio: 3 / 2; object-fit: cover; object-position: 62% 40%; }

/* Personal Yoga Band */
.pers-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 24px 64px; align-items: center; }
.preis { font-family: var(--titel); font-weight: 700; font-size: 1.5rem; line-height: 1.25; color: var(--text); margin: 0 0 .6em; }
.preis span { font-family: var(--grund); font-weight: 400; font-size: 1.05rem; color: var(--leise); }

/* Rezensionen */
.stimmen { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px clamp(40px, 6vw, 80px); margin-top: 16px; }
.stimme { margin: 0; padding-top: 20px; border-top: 3px solid var(--hellblau); }
.stimme blockquote { margin: 0; }
.stimme p { font-size: 1.1rem; line-height: 1.6; margin-bottom: .6em; }
.stimme-gross p { font-family: var(--titel); font-weight: 600; font-size: clamp(1.25rem, 2.2vw, 1.5rem); line-height: 1.45; color: var(--text); }
.stimme figcaption { font-weight: 600; color: var(--leise); }
.stimmen-rechts { display: grid; gap: 40px; align-content: start; }

/* Seitenkopf der Unterseiten */
.page-head { padding-block: clamp(32px, 5vw, 64px) clamp(40px, 5vw, 72px); }
.head-grid { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.head-grid.text-breit { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.head-photo img { width: 100%; border-radius: 6px; }
.lead { font-size: clamp(1.15rem, 1.8vw, 1.3rem); line-height: 1.5; }
.ratio-1 { aspect-ratio: 1; object-fit: cover; }
.ratio-45 { aspect-ratio: 4 / 5; object-fit: cover; }
.ratio-32 { aspect-ratio: 3 / 2; object-fit: cover; }

/* Listen */
.liste { list-style: none; margin: 0; padding: 0; }
.liste li { padding: 12px 0; border-bottom: 1px solid var(--linie); }
.liste li:first-child { border-top: 1px solid var(--linie); }
.zeiten li { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 4px 16px; }
.zeiten b { font-weight: 600; }
.punkte { margin: 0 0 1em; padding-left: 1.2em; }
.punkte li { margin-bottom: .45em; }
.punkte li::marker { color: var(--hellblau); }

/* Personal Yoga Seite */
.angebote { margin-top: 8px; }
.angebot { padding-block: 32px; border-top: 1px solid var(--hellblau); }
.angebot:last-child { border-bottom: 1px solid var(--hellblau); }
.angebot h2 { margin-bottom: .4em; }
.angebot p { margin: 0; }
.angebot-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 12px 56px; }

/* Über mich */
.titel-liste { list-style: none; margin: 0 0 8px; padding: 0; font-family: var(--titel); font-weight: 600; font-size: 1.2rem; line-height: 1.5; color: var(--text); }
.herz { margin: 2em 0; padding: 0 0 0 24px; border-left: 4px solid var(--hellblau); }
.herz p { font-family: var(--titel); font-weight: 600; color: var(--blau); font-size: clamp(1.4rem, 3vw, 1.95rem); line-height: 1.35; margin: 0; }
.breitbild img { width: 100%; aspect-ratio: 2 / 1; object-fit: cover; border-radius: 6px; }
.bildungen { list-style: none; margin: 0; padding: 0; }
.bildungen li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 24px; padding: 14px 0; border-bottom: 1px solid var(--linie); }
.bildungen li:first-child { border-top: 1px solid var(--linie); }
.bildungen .jahr { color: var(--leise); white-space: nowrap; text-align: right; }

.ueber-grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 16px clamp(32px, 6vw, 80px); align-items: start; }
.ueber-lead { font-family: var(--titel); font-weight: 600; font-size: clamp(1.4rem, 2.6vw, 1.9rem); line-height: 1.3; color: var(--text); margin: 0; }

/* Blog */
.eintrag { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: 20px 48px; align-items: center; padding-block: 32px; border-top: 1px solid var(--linie); border-bottom: 1px solid var(--linie); }
.eintrag h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); margin-bottom: .35em; }
.eintrag h2 a { color: inherit; text-decoration: none; }
.eintrag h2 a:hover { text-decoration: underline; text-decoration-color: var(--hellblau); }
.datum { color: var(--leise); font-size: .98rem; margin-bottom: .4em; }
.artikel { max-width: 70ch; }
.artikel h2 { margin-top: 1.4em; }
.schritte { margin: 0 0 1em; padding-left: 1.4em; }
.schritte li { margin-bottom: .7em; padding-left: .3em; }
.schritte li::marker { font-family: var(--titel); font-weight: 700; color: var(--blau); }
.artikel-bild { margin: 8px 0 24px; max-width: 560px; }

/* Kontakt */
.wege { display: grid; gap: 12px; max-width: 460px; margin: 28px 0 32px; }
.wege .btn { width: 100%; justify-content: flex-start; padding-inline: 1.5em; }
.adresse { font-style: normal; }

/* Links-Seite */
.linkgruppe { padding-block: 22px; border-top: 1px solid var(--linie); }
.linkgruppe:last-child { border-bottom: 1px solid var(--linie); }
.linkgruppe h2 { font-size: 1.45rem; margin-bottom: .3em; }
.linkgruppe ul { list-style: none; margin: 0; padding: 0; }
.linkgruppe li { padding: 4px 0; }
.linkgruppe a { display: inline-block; padding-block: 6px; }

/* Fusszeile */
.site-footer { background: var(--text); color: #dbe7f2; padding: 56px 0 32px; font-size: 1rem; }
.site-footer a { color: #fff; display: inline-block; padding-block: 5px; }
.site-footer a:hover { text-decoration-color: var(--hellblau); }
.site-footer :focus-visible { outline-color: var(--hellblau); }
.foot-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, .8fr); gap: 32px 48px; }
.foot-grid p { margin: 0 0 .5em; }
.site-footer .wordmark { color: #fff; font-size: 1.3rem; padding: 0; display: inline-block; margin-bottom: 10px; }
.site-footer .wordmark b { color: var(--hellblau); }
.foot-links { list-style: none; margin: 0; padding: 0; }
.ferien { margin-top: 12px !important; }

/* Tablet: Menü klappt ein */
@media (max-width: 1120px) {
  .menu-toggle { display: inline-flex; align-items: center; gap: 10px; min-height: 46px; padding: 0 18px; margin-left: auto; background: var(--weiss); color: var(--blau-tief); border: 2px solid var(--blau-tief); border-radius: 999px; font-family: var(--grund); font-weight: 600; font-size: 1rem; cursor: pointer; }
  .menu-icon, .menu-icon::before { display: block; width: 16px; height: 2px; background: currentColor; position: relative; }
  .menu-icon { box-shadow: 0 5px 0 currentColor; top: -2.5px; }
  .menu-icon::before { content: ""; position: absolute; top: 10px; }
  .nav-open .menu-icon { box-shadow: none; transform: translateY(2.5px) rotate(45deg); }
  .nav-open .menu-icon::before { top: 0; transform: rotate(-90deg); }
  .js .main-nav { display: none; }
  .main-nav { position: absolute; left: 0; right: 0; top: 100%; background: var(--weiss); border-bottom: 1px solid var(--linie); box-shadow: 0 12px 24px rgba(30, 51, 70, .08); max-height: calc(100vh - 100px); overflow-y: auto; }
  .js.nav-open .main-nav, .nav-open .main-nav { display: block; }
  .main-nav ul { display: block; max-width: var(--wrap); margin: 0 auto; padding: 8px var(--gutter) 20px; }
  .main-nav li { border-bottom: 1px solid var(--linie); }
  .main-nav li:last-child { border-bottom: 0; }
  .main-nav a { display: flex; align-items: center; min-height: 52px; font-family: var(--titel); font-size: 1.25rem; padding: 6px 0; border-bottom: 0; white-space: normal; }
  .main-nav a:hover { border-bottom: 0; }
  .main-nav a[aria-current="page"] { border-bottom: 0; }
  .main-nav a[aria-current="page"]::before { content: ""; width: 4px; height: 1.2em; background: var(--hellblau); margin-right: 12px; border-radius: 2px; }
  html:not(.js) .main-nav { position: static; box-shadow: none; border: 0; }
  html:not(.js) .header-inner { flex-wrap: wrap; }
  html:not(.js) .menu-toggle { display: none; }
}

/* Handy */
@media (max-width: 820px) {
  .header-inner { min-height: 64px; }
  .wordmark { font-size: 1.25rem; }
  .hero { padding-top: 0; }
  .hero-grid, .wand-grid, .split, .raum-grid, .pers-grid, .stimmen, .ueber-grid, .head-grid, .head-grid.text-breit, .eintrag, .angebot-grid, .foot-grid { grid-template-columns: minmax(0, 1fr); }
  .hero-photo { order: -1; margin-inline: calc(-1 * var(--gutter)); }
  .hero-photo img { border-radius: 0; aspect-ratio: 4 / 3; }
  .head-photo { order: -1; }
  .actions .btn { width: 100%; }
  .wand .actions .btn { width: 100%; }
  .raum-text { padding-top: 0; }
  .raum-hoch img { aspect-ratio: 4 / 5; }
  .split-photo { order: -1; }
  .plan th { width: 38%; }
  .kosten dd { font-size: 1.25rem; }
  .eintrag-bild { max-width: 420px; }
  .zeiten li { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .site-footer { padding-top: 44px; }
}

@media (max-width: 380px) {
  .bildungen li { grid-template-columns: minmax(0, 1fr); }
  .bildungen .jahr { text-align: left; }
  .plan th { width: auto; padding-right: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}
.corina-hoch { object-position: 53% 35%; }
.wand-rechts { object-position: 100% 50%; }
.sozial { list-style: none; margin: 1em 0 0; padding: 0; }
.sozial a { display: inline-block; padding-block: 8px; }

/* Logo statt Wortmarke (10.10.2026, Wunsch Corina) */
.logo { display: block; padding: 6px 0; line-height: 0; }
.logo img { height: 72px; width: auto; }
@media (max-width: 600px) { .logo img { height: 54px; } }

/* Video Stucki und Kambundji (10.10.2026): Vorschaubild, YouTube lädt erst nach dem Klick */
.video-split { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 64px); align-items: center; }
.video-titel { font-size: clamp(1.6rem, 3.2vw, 2.3rem); }
.video { position: relative; }
.video-start, .video iframe { display: block; position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; border: 0; background: var(--hauch); }
.video-start img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.video-play { position: absolute; left: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px 0 14px; border-radius: 999px; background: var(--blau-tief); color: #fff; font-family: var(--grund); font-weight: 600; font-size: 1rem; box-shadow: 0 6px 20px rgba(23, 34, 43, .3); transition: transform .2s ease, background-color .2s ease; }
.video-start:hover .video-play, .video-start:focus-visible .video-play { transform: translateY(-2px); background: var(--blau); }
.video-start:hover img { transform: scale(1.02); }
.video figcaption { margin-top: 10px; font-size: .9rem; color: var(--leise); }
@media (max-width: 820px) { .video-split { grid-template-columns: minmax(0, 1fr); } .video-play { left: 10px; bottom: 10px; width: 52px; min-height: 52px; padding: 0; justify-content: center; gap: 0; font-size: 0; } .video-play svg { margin-left: 3px; } }
@media (prefers-reduced-motion: reduce) { .video-start img, .video-play { transition: none; } .video-start:hover img { transform: none; } }

/* ---------- Anpassungen nach Corinas Wünschen, 20.10.2026 ----------
   Ihr Mandala (img/hintergrund-mandala.webp, aus ihrer Datei blau1) liegt sanft hinter jeder Seite,
   kein Orange mehr, keine Linien zwischen den Abschnitten, Abschnitte näher zusammen,
   die blauen Sätze und alle Rezensionen kleiner, Schriftgrössen ruhiger wie bei Lea Julia Salvi. */
:root { --space: clamp(36px, 5vw, 64px); }
body { background: var(--weiss); font-size: 1.125rem; line-height: 1.62; position: relative; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: url("img/hintergrund-mandala.webp") center 58% / min(1100px, 135vw) no-repeat; }
h1 { font-size: clamp(2rem, 4.6vw, 3rem); }
.h2 { font-size: clamp(1.45rem, 2.8vw, 1.9rem); }
.band-hauch, .wand { background: transparent; }
.rule-top { border-top: 0; }

/* die fünf Fragen: kleiner, weiterhin blau, ohne Linien */
.fragen li { font-size: clamp(1.15rem, 2vw, 1.35rem); line-height: 1.4; padding: .3em 0; border: 0; }
.fragen li:first-child { border-top: 0; }
.fragen-antwort p:first-child { font-size: clamp(1.15rem, 1.8vw, 1.3rem); }

/* Stundenplan und Kosten ohne Ockerfläche */
.wand { color: var(--text); padding-block: var(--space); }
.wand h2 { color: var(--blau); font-size: clamp(1.45rem, 2.8vw, 1.9rem); }
.wand a:not(.btn) { color: var(--blau-tief); }
.wand a:not(.btn):hover { text-decoration-color: var(--hellblau); }
.wand :focus-visible { outline-color: var(--blau-tief); }
.plan th, .plan td, .kosten div { border-bottom-color: var(--linie); }
.plan tr:first-child th, .plan tr:first-child td, .kosten div:first-child { border-top: 1px solid var(--linie); }
.plan th { font-size: clamp(1.05rem, 1.8vw, 1.2rem); }
.plan td { font-size: clamp(1.1rem, 2vw, 1.3rem); }
.kosten dd { font-size: 1.25rem; }
.btn-dark { background: var(--blau-tief); border-color: var(--blau-tief); }
.btn-dark:hover { background: #22578c; border-color: #22578c; }

/* Rezensionen alle in der kleineren Schrift, statt Linien je eine ruhige, halbtransparente Karte über dem Mandala */
.stimme { padding: clamp(20px, 3vw, 32px); border-top: 0; border-radius: 16px; background: rgba(255, 255, 255, .78);
  box-shadow: 0 1px 2px rgba(30, 51, 70, .04), 0 10px 28px rgba(30, 51, 70, .06); }
.stimme p:last-child { margin-bottom: 0; }
.stimme figcaption { margin-top: 12px; color: var(--blau-tief); }
.stimmen { gap: 24px clamp(24px, 3vw, 40px); align-items: start; }
.stimmen-rechts { gap: 24px; }
.stimme-gross p { font-family: var(--grund); font-weight: 400; font-size: 1.1rem; line-height: 1.6; color: var(--text); }

/* Über mich: das Herz-Zitat kleiner */
.herz p { font-size: clamp(1.15rem, 2vw, 1.35rem); line-height: 1.45; }

/* Unterseiten: keine Trennlinien zwischen Abschnitten */
.angebot, .angebot:last-child, .eintrag, .linkgruppe, .linkgruppe:last-child { border-top: 0; border-bottom: 0; }
.angebot { padding-block: 20px; }

/* Fotos mit weissem Grund (Pranayama) ohne weissen Kasten über dem Mandala */
.eintrag-bild img, .artikel-bild img { mix-blend-mode: multiply; }

/* 21.10.2026: Hinweis «Made by Salvi Design» ganz unten in der Fusszeile (Marco) */
.site-footer .foot-made { margin: 36px 0 0; padding-top: 18px; border-top: 1px solid rgba(219, 231, 242, .18); font-size: .875rem; }
.site-footer .foot-made a { color: #dbe7f2; opacity: .8; text-decoration: none; padding-block: 12px; }
.site-footer .foot-made a:hover { opacity: 1; text-decoration: underline; text-decoration-color: var(--hellblau); }
@media (max-width: 720px) { .site-footer .foot-made { margin-top: 28px; } }

/* 22.10.2026, Wunsch Corina: Schnupper-Satz neben «Krankenkassen» in Blau und überall etwas kleiner als der Titel daneben */
.preis.schnupper-satz { color: var(--blau); font-size: clamp(1.2rem, 2.2vw, 1.5rem); }

/* Live-Fassung 24.10.2026: AGB, Impressum und Datenschutz als eigene Seiten */
.h3 { font-size: 1.3rem; margin-bottom: .4em; }
.agb .h3, .datenschutz .h3 { margin-top: 1.6em; }
.agb h1 { margin-bottom: .4em; }
.datenschutz p { overflow-wrap: anywhere; }