/* Lebendiger: Kopfzeile bleibt stehen, Inhalte blenden ein, Buttons wie auf der Emotionstraining-Seite */
#hd.sticky { position: sticky; top: 0; z-index: 50; background: #fff; transition: box-shadow .3s ease; }
#hd.sticky.sc { box-shadow: 0 4px 22px rgba(0,0,0, .10); }
.cv .ic { display: flex; align-items: center; justify-content: center; }
.cv .ic svg { width: 100%; height: 100%; max-width: 100%; max-height: 100%; }
.cv .bt.tb { background: #000; border: 1px solid #000; border-radius: 0; box-shadow: none; justify-content: center; padding: 0 18px; transition: background .25s ease, color .25s ease, transform .25s ease, box-shadow .25s ease; }
.cv .bt.tb span { font-family: Raleway, sans-serif; font-weight: 500; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: #fff; font-style: normal; text-decoration: none; line-height: 1.3; transition: color .25s ease; }
@media (hover: hover) and (pointer: fine) { .cv .bt.tb:hover { background: #2b2b2b; border-color: #2b2b2b; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0, .18); } }
.cv .bt.tb.dk { background: #fff; border-color: #fff; }
.cv .bt.tb.dk span { color: #000; }
@media (hover: hover) and (pointer: fine) { .cv .bt.tb.dk:hover { background: transparent; border-color: #fff; } }
@media (hover: hover) and (pointer: fine) { .cv .bt.tb.dk:hover span { color: #fff; } }
.cv.m .bt.tb span { font-size: 13px; }
.cv .nv { transition: opacity .2s ease; }
@media (hover: hover) and (pointer: fine) { .cv .nv:hover { opacity: .65; } }
.cv a.im img { transition: transform .8s cubic-bezier(.2, .7, .1, 1); }
@media (hover: hover) and (pointer: fine) { .cv a.im:hover img { transform: scale(1.04); } }
.cv .rv { opacity: 0; transform: translateY(12px); transition: opacity .45s cubic-bezier(.23, 1, .32, 1), transform .45s cubic-bezier(.23, 1, .32, 1); }
.cv .rv.in { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .cv .bt.tb.rv.in:hover { transform: translateY(-2px); } }
@media (prefers-reduced-motion: reduce) { .cv .rv { transform: none; transition: opacity .3s ease; } .cv a.im img, .cv .bt { transition-property: opacity, color, background-color, border-color !important; } }
.cv .bt.lk { transition: opacity .2s ease; }
@media (hover: hover) and (pointer: fine) { .cv .bt.lk:hover { opacity: .65; } }

/* Einheitliches System: Überschriften, Kicker, Karten, Buttons */
.cv .xh2{font-family:Raleway,sans-serif;font-weight:700;color:#000;letter-spacing:-.01em;line-height:1.2}
.cv .xk{font-family:Raleway,sans-serif;font-weight:500;color:#85663A;letter-spacing:.22em;text-transform:uppercase;line-height:1.5}
.cv .xct{font-family:Raleway,sans-serif;font-weight:600;color:#000;letter-spacing:.12em;text-transform:uppercase;line-height:1.4}
.cv .xcx{font-family:Raleway,sans-serif;font-weight:400;color:#000;line-height:1.6}
.cv .xqt{font-family:'Playfair Display',serif;color:#000;line-height:1.7}
.cv .xcen{text-align:center}
.cv .xlft{text-align:left}
.cv .xw{color:#fff}
.cv .xk.xw{color:#C9A66B}
.cv .xk.xpk{color:#BB013B}
.cv .xb{background:#000;justify-content:center}
.cv .bt.xo{background:transparent;border:1px solid #000;justify-content:center;transition:background .25s ease,transform .25s ease}
.cv .bt.xo span{font-family:Raleway,sans-serif;font-weight:500;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:#000;line-height:1.3;transition:color .25s ease}
@media (hover: hover) and (pointer: fine) { .cv .bt.xo:hover{opacity:1;background:#000;transform:translateY(-2px)} }
@media (hover: hover) and (pointer: fine) { .cv .bt.xo:hover span{color:#fff} }
.cv .bt.xow{background:transparent;border:1px solid #fff;justify-content:center;transition:background .25s ease,transform .25s ease}
.cv .bt.xow span{font-family:Raleway,sans-serif;font-weight:500;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:#fff;line-height:1.3;transition:color .25s ease}
@media (hover: hover) and (pointer: fine) { .cv .bt.xow:hover{opacity:1;background:#fff;transform:translateY(-2px)} }
@media (hover: hover) and (pointer: fine) { .cv .bt.xow:hover span{color:#000} }
.cv.m .bt.xo span,.cv.m .bt.xow span{font-size:11.5px;letter-spacing:.04em}

/* Ruhige Fußzeile */
.tf { background: #fff; border-top: 1px solid rgba(0,0,0, .1); font-family: Raleway, sans-serif; color: #000; }
.tf-in { max-width: 1180px; margin: 0 auto; padding: 56px 40px 28px; }
.tf-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px; }
.tf-brand { display: flex; flex-direction: column; gap: 8px; }
.tf-logo { display: block; width: 170px; height: 71px; overflow: hidden; position: relative; }
.tf-logo img { position: absolute; left: 0; top: -44px; width: 170px; height: 170px; max-width: none; }
.tf-claim { margin: 0; font: 500 13px/1.5 Raleway, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #85663A; }
.tf-nav { display: flex; gap: 30px; }
.tf-nav a { font: 500 13px/1.3 Raleway, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #000; text-decoration: none; border-bottom: 1px solid transparent; padding-bottom: 3px; transition: border-color .2s; }
@media (hover: hover) and (pointer: fine) { .tf-nav a:hover, .tf-nav a.on { border-color: #000; } }
.tf-soc { display: flex; justify-content: flex-end; gap: 18px; }
.tf-soc a { display: block; width: 22px; height: 22px; transition: opacity .2s; position: relative; }
.tf-soc a::after { content: ''; position: absolute; inset: -11px; }
@media (hover: hover) and (pointer: fine) { .tf-soc a:hover { opacity: .6; } }
.tf-soc svg { width: 100%; height: 100%; fill: #000; display: block; }
.tf-bot { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 44px; padding-top: 20px; border-top: 1px solid rgba(0,0,0, .1); font-size: 13px; }
.tf-bot p { margin: 0; color: #2b2b2b; }
.tf-bot nav { display: flex; gap: 26px; }
.tf-bot a { color: #2b2b2b; text-decoration: none; }
@media (hover: hover) and (pointer: fine) { .tf-bot a:hover { text-decoration: underline; text-underline-offset: 3px; } }
@media (max-width: 750px) {
  .tf-in { padding: 44px 24px 24px; }
  .tf-top { grid-template-columns: 1fr; justify-items: center; text-align: center; gap: 26px; }
  .tf-brand { align-items: center; }
  .tf-nav { flex-wrap: wrap; justify-content: center; gap: 14px 22px; }
  .tf-soc { justify-content: center; }
  .tf-bot { flex-direction: column; text-align: center; gap: 12px; margin-top: 32px; }
  .tf-bot nav { flex-wrap: wrap; justify-content: center; gap: 10px 22px; }
  .tf-bot nav a { white-space: nowrap; }
}
.tf-top { grid-template-columns: auto 1fr auto; }
.tf-nav { justify-self: center; }
.tf-logo { width: 150px; height: 64px; }
.tf-logo img { left: -13px; top: -40px; width: 170px; height: 170px; }
.tf-claim { white-space: nowrap; }
@media (max-width: 750px) { .tf-top { grid-template-columns: 1fr; } .tf-claim { white-space: normal; } }

@media (max-width: 1120px) and (min-width: 751px) { .tf-top { gap: 22px; } .tf-nav { gap: 18px; } .tf-nav a { font-size: 13px; letter-spacing: .08em; } .tf-claim { font-size: 13px; letter-spacing: .12em; } .tf-soc { gap: 14px; } }

.cv [id] { scroll-margin-top: 150px; }
.cv.m [id] { scroll-margin-top: 110px; }

/* Größere Tippflächen am Handy */
.dt{position:relative}
.dt::after{content:'';position:absolute;inset:-16px -6px}
.lsm::after,.burger::after{content:'';position:absolute;inset:-12px -4px}
.tf-nav a,.tf-bot a{display:inline-block;padding-top:14px;padding-bottom:14px}
.mmenu{gap:10px}.mmenu a{padding:9px 0}
.cv .nv::after{content:'';position:absolute;left:0;right:0;top:-4px;bottom:-4px}

/* Ohne Trennlinien: Fragen als abgerundete Kästchen, Fußzeile ohne Striche */
.et.et details{border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:14px;padding:18px 22px;margin:0 0 10px}
.et.et details:last-child{border:1px solid rgba(0,0,0,.12)}
.et.et .card .side{border-left:0;border-top:0}
.tf.tf{border-top:0}
.tf.tf .tf-bot{border-top:0}
.et.et .deep details{background:#fff}
.tf.tf .tf-nav{flex-wrap:wrap;min-width:0;justify-content:center;gap:2px 26px}


/* Handwerk nach Emil Kowalski: Gold auf dunklem Grund heller, Knöpfe geben beim Drücken leicht nach */
.cv .t.dk .xk { color: #B08D57; }
.cv .bt:active, a.b:active, button.b:active, .btn:active, a.band:active { transform: scale(.97); transition: transform .12s cubic-bezier(.23, 1, .32, 1); }


/* Kompass auf hellem Grund: abgerundete Kästchen zum Antippen */
.et.et .compass .scale{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;max-width:1080px;margin:0 auto;justify-content:stretch}
.et.et .compass .scale li{display:flex}
.et.et .compass .scale button{display:block;width:100%;background:#fff;border:1px solid rgba(0,0,0,.14);border-radius:14px;padding:18px 12px 16px;box-shadow:0 1px 2px rgba(0,0,0,.05);text-decoration:none;color:#000;transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .12s cubic-bezier(.23,1,.32,1)}
.et.et .compass .scale button span{color:rgba(0,0,0,.72)}
@media (hover:hover) and (pointer:fine){.et.et .compass .scale button:hover{background:#fff;border-color:#000;text-decoration:none}}
.et.et .compass .scale button:active{transform:scale(.97)}
.et.et .compass .scale button[aria-pressed="true"]{background:#000;border-color:#000;color:#fff;text-decoration:none}
.et.et .compass .scale button[aria-pressed="true"] span{color:rgba(255,255,255,.85)}
@media (max-width:860px){.et.et .compass .scale{grid-template-columns:1fr;max-width:420px;gap:10px}.et.et .compass .scale button{padding:16px 18px}}

/* Kontrast (Okt 2026): Unterseiten passend zu den neuen Hauptseiten, Schwarz-Weiß, Grün nur im Logo */
.et.et h2{font-weight:500;font-size:clamp(24px,2.6vw,34px);line-height:1.3;letter-spacing:.16em;text-transform:uppercase}
@media (max-width:820px){.et.et h2{font-size:22px;letter-spacing:.14em}}
.et.et .b{border-radius:12px}
.ck.ck{color:#000}.ck.ck p a{color:#000}.ck.ck .ck-yes,.ck.ck .ck-no{border-color:#000}.ck.ck .ck-yes{background:#000;color:#fff}.ck.ck .ck-no{background:transparent;color:#000}.ck.ck input{accent-color:#000}
@media (hover:hover) and (pointer:fine){.ck.ck .ck-yes:hover{background:#2b2b2b;border-color:#2b2b2b}.ck.ck .ck-no:hover{background:#000;color:#fff}}