/*
 * Therapie-OS — kuratierter Auftritt der fiktiven Schau-Praxis.
 *
 * Wird ausschließlich im Betriebsmodus "demo" geladen. Kunden-Websites
 * behalten ihr gewähltes Template; die Live-Demo erhält eine bewusst
 * eigenständige, vollständig ausgearbeitete Bühne.
 */

body.ghos-site--demo {
  --demo-dark: #102d2a;
  --demo-dark-2: #183f3b;
  --demo-gold: #d7a95f;
  --demo-sage: #8bb8a8;
  --ghos-maxw: 1220px;
  background: #fbfaf6;
  color: #21302e;
}

/* Demo-Leiste */
.ghos-demo-strip {
  position: relative;
  z-index: 120;
  background: #0b2422;
  color: #c8d8d4;
}
.ghos-demo-strip__inner {
  width: min(100%, var(--ghos-maxw));
  min-height: 42px;
  margin-inline: auto;
  padding: .45rem clamp(1rem,4vw,2.5rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.ghos-demo-strip__text {
  display: flex;
  align-items: center;
  gap: .7rem;
  min-width: 0;
  font-size: .74rem;
  line-height: 1.35;
}
.ghos-demo-strip__badge {
  flex: 0 0 auto;
  padding: .25rem .52rem;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  color: #fff;
  font-size: .62rem;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}
.ghos-demo-strip__actions { display: flex; align-items: center; gap: .55rem; flex: 0 0 auto; }
.ghos-demo-strip__actions a {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: .32rem .62rem;
  border-radius: 7px;
  color: #dce8e5;
  font-size: .7rem;
  font-weight: 700;
  text-decoration: none;
}
.ghos-demo-strip__actions a:first-child { background: #2b7a78; color: #fff; }
.ghos-demo-strip__actions a:hover { background: rgba(255,255,255,.13); color: #fff; }

/* Kopf */
.ghos-site--demo .ghos-header {
  background: rgba(251,250,246,.92);
  border-bottom-color: rgba(33,48,46,.08);
  backdrop-filter: blur(20px) saturate(130%);
  -webkit-backdrop-filter: blur(20px) saturate(130%);
}
.ghos-site--demo .ghos-header__inner { min-height: 84px; }
.ghos-site--demo .ghos-header__brand-logo { width: min(330px,37vw); max-height: 58px; }
.ghos-site--demo .ghos-nav { gap: .15rem; }
.ghos-site--demo .ghos-nav__link {
  padding: .62rem .76rem;
  border-radius: 9px;
  color: #3e514d;
  font-size: .9rem;
  font-weight: 650;
}
.ghos-site--demo .ghos-nav__link:hover,
.ghos-site--demo .ghos-nav__link.is-active { background: #e7f1ef; color: #205c5a; }
.ghos-site--demo .ghos-nav > .ghos-nav__link:nth-last-child(2) {
  margin-left: .45rem;
  padding-inline: 1rem;
  background: #2b7a78;
  color: #fff;
}
.ghos-site--demo .ghos-nav > .ghos-nav__link:nth-last-child(2):hover { background: #205c5a; color: #fff; }

/* Hero */
.ghos-site--demo .ghos-hero--editorial {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(circle at 8% 12%,rgba(215,169,95,.15),transparent 28%),
    linear-gradient(135deg,#edf5f2 0%,#f8f4ec 52%,#eef5f2 100%);
}
.ghos-site--demo .ghos-hero--editorial::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  opacity: .32;
  background-image: linear-gradient(rgba(43,122,120,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(43,122,120,.08) 1px,transparent 1px);
  background-size: 68px 68px;
  mask-image: linear-gradient(90deg,#000,transparent 56%);
}
.ghos-site--demo .ghos-hero__inner--split {
  min-height: min(720px,calc(100vh - 126px));
  grid-template-columns: minmax(0,.82fr) minmax(480px,1.18fr);
  gap: clamp(2.5rem,5vw,5.5rem);
  padding-block: clamp(4rem,7vw,6.8rem);
}
.ghos-site--demo .ghos-hero__col-text { position: relative; z-index: 2; }
.ghos-site--demo .ghos-hero__pills { gap: .4rem; }
.ghos-site--demo .ghos-pill {
  padding: .38rem .68rem;
  border-color: rgba(43,122,120,.18);
  background: rgba(255,255,255,.66);
  color: #296e69;
  font-size: .68rem;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.ghos-site--demo .ghos-hero__titel {
  max-width: 11.5ch;
  margin-bottom: 1.25rem;
  color: var(--demo-dark);
  font-size: clamp(3.2rem,6vw,5.8rem);
  font-weight: 650;
  line-height: .95;
  letter-spacing: -.065em;
}
.ghos-site--demo .ghos-hero__untertitel {
  max-width: 51ch;
  margin-bottom: 1.8rem;
  color: #526561;
  font-size: clamp(1.03rem,1.4vw,1.17rem);
  line-height: 1.75;
}
.ghos-site--demo .ghos-hero__col-bild { position: relative; min-height: 540px; }
.ghos-site--demo .ghos-hero__col-bild::before {
  content: "Seit 2021 in Musterstadt";
  position: absolute;
  z-index: 3;
  left: -28px;
  bottom: 36px;
  max-width: 120px;
  padding: .9rem 1rem;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 15px;
  background: rgba(255,255,255,.9);
  color: var(--demo-dark);
  box-shadow: 0 18px 45px rgba(16,45,42,.18);
  font-size: .72rem;
  font-weight: 750;
  line-height: 1.35;
  backdrop-filter: blur(12px);
}
.ghos-site--demo .ghos-hero__bild {
  min-height: 540px;
  border-radius: 34px 8px 34px 8px;
  background-position: center;
  box-shadow: 0 35px 80px rgba(16,45,42,.22);
}
.ghos-site--demo .ghos-btn { border-radius: 10px; }
.ghos-site--demo .ghos-btn--primaer {
  min-height: 50px;
  padding-inline: 1.25rem;
  background: #2b7a78;
  box-shadow: 0 12px 28px rgba(43,122,120,.23);
}

/* Inhaltsrhythmus */
.ghos-site--demo .ghos-block { padding-block: clamp(4.8rem,8vw,8rem); }
.ghos-site--demo .ghos-kicker {
  color: #2b7a78;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .13em;
}
.ghos-site--demo .ghos-h2 { font-size: clamp(2.2rem,4.2vw,3.8rem); line-height: 1.05; letter-spacing: -.05em; }
.ghos-site--demo .ghos-block__header { max-width: 58rem; margin-bottom: 3rem; }

/* Leistungen als wertige Karten */
.ghos-site--demo .ghos-block--features { background: #fff; }
.ghos-site--demo .ghos-features__grid { gap: 1rem; }
.ghos-site--demo .ghos-feature {
  min-height: 220px;
  padding: 1.6rem;
  border: 1px solid #dde5e1;
  border-radius: 18px;
  background: #fbfcfa;
  box-shadow: 0 8px 25px rgba(22,53,49,.045);
  transition: transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.ghos-site--demo .ghos-feature:hover { transform: translateY(-3px); border-color: #bfd4ce; box-shadow: 0 18px 40px rgba(22,53,49,.09); }
.ghos-site--demo .ghos-feature__icon { width: 48px; height: 48px; border-radius: 13px; }
.ghos-site--demo .ghos-feature__titel { margin-top: .7rem; font-size: 1.22rem; }
.ghos-site--demo .ghos-feature__text { font-size: .93rem; line-height: 1.65; }

/* Kennzahlen */
.ghos-site--demo .ghos-block--stats { padding-block: 0; background: #fff; }
.ghos-site--demo .ghos-stats__grid {
  gap: 1px;
  overflow: hidden;
  border-radius: 22px;
  background: rgba(255,255,255,.12);
  box-shadow: 0 25px 60px rgba(16,45,42,.15);
}
.ghos-site--demo .ghos-stats__item { min-height: 145px; justify-content: center; padding: 1.45rem; background: var(--demo-dark); }
.ghos-site--demo .ghos-stats__zahl { color: #f0c984; font-size: clamp(2.1rem,4vw,3.25rem); }
.ghos-site--demo .ghos-stats__label { max-width: 18ch; color: #bed0cc; font-size: .86rem; }

/* Editoriale Bild-Text-Strecken */
.ghos-site--demo .ghos-block--text-bild { background: #f2f6f3; }
.ghos-site--demo .ghos-block--text-bild .ghos-grid-2 { gap: clamp(3rem,8vw,8rem); }
.ghos-site--demo .ghos-tb__bild { position: relative; }
.ghos-site--demo .ghos-tb__bild::after {
  content: "";
  position: absolute;
  z-index: -1;
  width: 55%;
  height: 55%;
  right: -18px;
  bottom: -18px;
  border-radius: 22px;
  background: #d7a95f;
  opacity: .22;
}
.ghos-site--demo .ghos-tb__bild img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 8px 30px 8px 30px;
  box-shadow: 0 28px 65px rgba(16,45,42,.15);
}

/* CTA */
.ghos-site--demo .ghos-cta--stil-solid {
  position: relative;
  overflow: hidden;
  background: linear-gradient(135deg,#102d2a,#1a4742);
}
.ghos-site--demo .ghos-cta--stil-solid::after {
  content: "";
  position: absolute;
  width: 470px;
  height: 470px;
  right: -190px;
  bottom: -300px;
  border-radius: 50%;
  background: radial-gradient(circle,rgba(143,216,207,.25),transparent 65%);
}
.ghos-site--demo .ghos-cta--stil-solid .ghos-container { position: relative; z-index: 2; }
.ghos-site--demo .ghos-cta__titel { font-size: clamp(2.25rem,4.5vw,4rem); letter-spacing: -.045em; }

/* Formulare und Akkordeon */
.ghos-site--demo .ghos-akkordeon__item,
.ghos-site--demo .ghos-anfrage-form {
  border-color: #dce5e1;
  box-shadow: 0 8px 28px rgba(22,53,49,.05);
}

/* Footer */
.ghos-site--demo .ghos-footer { padding-top: 5.2rem; background: #0b2422; color: #d5e1de; }
.ghos-site--demo .ghos-newsletter { border-color: rgba(255,255,255,.12); background: rgba(255,255,255,.045); }
.ghos-site--demo .ghos-footer__name { color: #fff; }
.ghos-site--demo .ghos-footer a { color: #b8cbc7; }
.ghos-site--demo .ghos-footer a:hover { color: #fff; }

@media (max-width: 980px) {
  .ghos-site--demo .ghos-header__brand-logo { width: min(285px,43vw); }
  .ghos-site--demo .ghos-hero__inner--split { grid-template-columns: 1fr; min-height: 0; }
  .ghos-site--demo .ghos-hero__col-text { max-width: 760px; }
  .ghos-site--demo .ghos-hero__col-bild,
  .ghos-site--demo .ghos-hero__bild { min-height: 440px; }
}

@media (max-width: 760px) {
  .ghos-demo-strip__text > span:last-child { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .ghos-demo-strip__actions a:last-child { display: none; }
  .ghos-site--demo .ghos-header__inner { min-height: 72px; }
  .ghos-site--demo .ghos-header__brand-logo { width: min(275px,65vw); max-height: 50px; }
  .ghos-site--demo .ghos-hero__inner--split { padding-block: 3.2rem; }
  .ghos-site--demo .ghos-hero__titel { font-size: clamp(2.85rem,13vw,4.4rem); }
  .ghos-site--demo .ghos-hero__col-bild,
  .ghos-site--demo .ghos-hero__bild { min-height: 330px; }
  .ghos-site--demo .ghos-hero__col-bild::before { left: 12px; bottom: 14px; }
  .ghos-site--demo .ghos-feature { min-height: 0; }
}

@media (max-width: 520px) {
  .ghos-demo-strip__inner { min-height: 38px; }
  .ghos-demo-strip__text { font-size: .68rem; }
  .ghos-demo-strip__actions { display: none; }
  .ghos-site--demo .ghos-hero__col-bild,
  .ghos-site--demo .ghos-hero__bild { min-height: 270px; }
  .ghos-site--demo .ghos-hero__bild { border-radius: 22px 6px 22px 6px; }
  .ghos-site--demo .ghos-hero__col-bild::before { display: none; }
  .ghos-site--demo .ghos-stats__item { min-height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
  .ghos-site--demo .ghos-feature { transition: none; }
}