/* sylviafreygner.com V32 – 29.10.2026: Startseite ruhiger und edler.
   Reihenfolge wie im Wegweiser (Mentoring · Five Codes · Decision Making), Philosophie ohne Blocksatz auf Beige,
   Schlussblock Camel statt Schwarz. Gilt nur für die Startseite (body.pg-index). */
body.pg-index { --g32: #3D1F16; --cam32: #C19A6B; --beige32: #EFE5DA; --txt32: #4A3B34; --line32: rgba(61, 31, 22, .14);
  --sp32: clamp(84px, 9vw, 150px);
  --camf32: #CBA97F; /* hellere Camel-Fläche (Variante B); Linien und Akzente bleiben --cam32 */ }

/* ---------- Kicker: überall gleich – Camel-Linie + Versalien ---------- */
html body.v7.pg-index :is(.k7, .k5, .hh8__k) { display: flex; align-items: center; gap: 16px; margin: 0 0 22px;
  font-size: 12px !important; font-weight: 400; letter-spacing: .26em !important; text-transform: uppercase; color: var(--g32); }
html body.v7.pg-index :is(.k7, .k5, .hh8__k)::before { content: ""; flex: none; width: 44px; height: 1px; background: var(--cam32); }
html body.v7.pg-index :is(.ab8, .dm29) .k7 { color: rgba(255, 255, 255, .78) !important; }
html body.v7.pg-index .h5fmt + *, html body.v7.pg-index .wrap5 > .k5 { justify-content: flex-start; }

/* ---------- Überschriften: eine Größe, Playfair, kein Versal-Schreien ---------- */
html body.v7.pg-index :is(.h2-8, .hh8__h, .h5h2, .h5next__h) { font-family: var(--pf8) !important; font-weight: 700 !important;
  font-size: clamp(32px, 3.1vw, 48px) !important; line-height: 1.1 !important; letter-spacing: -.01em !important;
  text-transform: none !important; }
html body.v7.pg-index .hh8__h span { color: inherit; }

/* ---------- Wegweiser „Was ich mache“ ---------- */
body.pg-index .do9 { border-bottom: 1px solid var(--line32); }
body.pg-index .do9 a { padding-top: clamp(30px, 3vw, 46px); padding-bottom: clamp(30px, 3vw, 46px); border-right-color: var(--line32); }
body.pg-index .do9 a:hover { background: var(--beige32); }
body.pg-index .do9__n { color: var(--cam32) !important; font-weight: 400; letter-spacing: .2em; }
body.pg-index .do9 b { color: var(--g32); }

/* ---------- Executive Mentoring (Beige) ---------- */
body.pg-index .em8__txt { padding-top: var(--sp32); padding-bottom: var(--sp32); }
html body.v7.pg-index .em8 .q8 { color: var(--g32); }

/* ---------- The Five Codes: Kapitel-Kopf mit Bild ---------- */
body.pg-index .hh8--codes { border-top: 0; align-items: start; }
body.pg-index .hh8--codes .hh8__txt { padding-top: var(--sp32); padding-bottom: clamp(40px, 4vw, 70px); }
body.pg-index .hh8--codes .hh8__s { font-size: 12px; letter-spacing: .26em; color: var(--txt32); margin: 0 0 26px; }
body.pg-index .hh8--codes .hh8__p { font-size: 17px; line-height: 1.75; color: var(--txt32); max-width: 46ch; margin: 0 0 14px; }
body.pg-index .hh8--codes .hh8__img { align-self: start; padding: calc(var(--sp32) + 4px) var(--pad7) 0 0; }
body.pg-index .cd32 { padding-top: clamp(40px, 4vw, 70px); }

/* ---------- Philosophie: Beige, Flattersatz, ruhige Liste ---------- */
html body.v7.pg-index .why32 { background: var(--beige32); padding: var(--sp32) 0; }
body.pg-index .why32 .p7 p { text-align: left; hyphens: manual; -webkit-hyphens: manual; font-size: 17px; line-height: 1.8;
  color: var(--txt32); max-width: 62ch; }
body.pg-index .why32 .ac8 { border-top-color: rgba(193, 154, 107, .55); }
body.pg-index .why32 .ac8:last-child { border-bottom: 1px solid rgba(193, 154, 107, .55); }
body.pg-index .why32 .ac8 summary { padding: 28px 0; }
body.pg-index .why32 .ac8 summary span { font-size: clamp(22px, 1.9vw, 28px); color: var(--g32); }
body.pg-index .why32 .ac8 summary .mono7 { width: 34px; opacity: .75; }
html body.v7.pg-index .why32 .ac8 summary i::before, html body.v7.pg-index .why32 .ac8 summary i::after { background: var(--g32); height: 1px; }
body.pg-index .why32 .ac8 > .p7 { padding-bottom: 40px; }
body.pg-index .why32 .five7 { gap: 0; margin: 22px 0 26px; border-top: 1px solid var(--line32); max-width: 62ch; }
body.pg-index .why32 .five7 p { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 18px; align-items: baseline;
  padding: 13px 0; border-bottom: 1px solid var(--line32); line-height: 1.55; }
body.pg-index .why32 .five7 b { font-size: 12.5px; letter-spacing: .2em; color: var(--g32); }
body.pg-index .why32 .list7 li { line-height: 1.7; }
body.pg-index .why32 .caps7 { font-size: 12px; letter-spacing: .22em; line-height: 1.7; color: var(--g32); }

/* ---------- The Art of Decision Making ---------- */
body.pg-index .dm29__g { padding-top: var(--sp32); padding-bottom: var(--sp32); }
html body.v7.pg-index .dm29__h { font-size: clamp(36px, 3.6vw, 56px) !important; line-height: 1.04; margin: 0 0 22px; }
html body.v7.pg-index .dm29__s { font-style: italic !important; font-weight: 400; font-size: clamp(20px, 1.7vw, 25px); line-height: 1.4;
  color: var(--cam32); margin: 0 0 18px; }
body.pg-index .dm29__p { margin: 0; }
body.pg-index .dm29__g .btns7 { justify-self: end; }

/* ---------- Abstände der übrigen Kapitel ---------- */
body.pg-index #vertiefung, body.pg-index .h5tr, body.pg-index .h5ins { padding-top: var(--sp32); padding-bottom: var(--sp32); }
body.pg-index .h5tr { padding-bottom: clamp(40px, 4vw, 70px); }
body.pg-index .ab8 { padding-top: var(--sp32) !important; padding-bottom: var(--sp32) !important; }

/* ---------- Schlussblock: Camel statt Schwarz ---------- */
html body.v7.pg-index .h5next { background: var(--camf32) !important; color: var(--g32); }
html body.v7.pg-index .h5next__txt { padding-top: var(--sp32); padding-bottom: var(--sp32); }
html body.v7.pg-index .h5next .k5 { color: var(--g32) !important; }
html body.v7.pg-index .h5next .k5::before { background: var(--g32); }
html body.v7.pg-index .h5next__h { color: var(--g32) !important; }
html body.v7.pg-index .h5next__h span { font-family: var(--pf8) !important; color: inherit !important; font-style: italic !important; font-weight: 400 !important; }
html body.v7.pg-index .h5next p { color: rgba(61, 31, 22, .88) !important; }
html body.v7.pg-index .h5next .b4 { background: var(--g32) !important; border: 1px solid var(--g32) !important; color: #fff !important; }
html body.v7.pg-index .h5next .b4--line { background: transparent !important; color: var(--g32) !important; }
html body.v7.pg-index .h5next .b4:hover { background: #fff !important; border-color: #fff !important; color: var(--g32) !important; }

/* ---------- Kopf: zweiter Button als feine Linie ---------- */
html body.v7.pg-index .cv12 .btn7--onc { background: transparent !important; border: 1px solid rgba(255, 255, 255, .6) !important; color: #fff !important; }
html body.v7.pg-index .cv12 .btn7--onc:hover { background: #fff !important; color: var(--g32) !important; }

@media (max-width: 1000px) {
  body.pg-index .hh8--codes .hh8__img { padding: 0; order: -1; }
  body.pg-index .hh8--codes .hh8__txt { padding-top: clamp(48px, 8vw, 80px); }
  body.pg-index .dm29__g .btns7 { justify-self: start; }
}
@media (max-width: 560px) {
  body.pg-index .why32 .five7 p { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}
/* Farbstreifen über dem Decision-Making-Band: ausgeblendete Beschriftung darf auf 320 px nicht über den Rand ragen */
body.pg-index .dm29__codes { overflow: hidden; }
