/* Version 2: weniger Grün, warmes Taupe, Pastellgelb nur als kleiner Akzent */
:root {
  --taupe: #6f655d;       /* dunkle Flächen statt Salbei */
  --taupe-tief: #5b524b;
  --akzent: #8a7868;      /* Eyebrows, kursive Wörter */
  --gelb: #fff3b8;        /* Pastellgelb aus den Tools – sparsam! */
}
/* Grün raus */
.eyebrow { color: var(--akzent); }
.eyebrow--hell { color: var(--beige); }
h1 em, h2 em, h3 em { color: var(--akzent); }
.hero__unter { color: var(--akzent); }
.hero__siegel strong, .zahlen strong { color: var(--text); }
.karte__marke, .module span, .stimme figcaption, .mobilmenue small { color: var(--akzent); }
.wunschliste .nr, .stimme::before, .handschrift { color: #b8a898; }
.presse__titel { color: var(--akzent); }
.presse__liste li::after { color: #b8a898; }
.knopf:hover { background: var(--taupe); border-color: var(--taupe); }
.knopf--rand:hover { background: var(--text); border-color: var(--text); }
.knopf--hell:hover { background: transparent; color: var(--creme); border-color: var(--creme); }
.leiste { background: var(--text); }
.dunkel { background: var(--taupe); }
.dunkel h2 em { color: var(--beige); }
.zahlen { background: var(--beige); }
.zahlen__reihe > div + div { border-left-color: rgba(75, 75, 75, .18); }
.formular input:focus { border-color: var(--akzent); box-shadow: 0 0 0 3px rgba(138, 120, 104, .2); }
:focus-visible { outline-color: var(--text); }

/* Gelb: nur drei Stellen */
.knopf--stiltest { background: var(--gelb); border-color: var(--gelb); color: var(--text); }
.knopf--stiltest:hover { background: #ffec8f; border-color: #ffec8f; color: var(--text); }
.markiert { color: var(--text) !important; background: linear-gradient(transparent 62%, var(--gelb) 62%, var(--gelb) 92%, transparent 92%); padding: 0 .08em; }
.stempel { background: var(--gelb); color: var(--text); }

/* Startseite ohne Tools: 2 Angebotskarten */
.karten--zwei { grid-template-columns: repeat(2, minmax(0, 420px)); justify-content: center; }

/* Keine Angst vor Online-Kursen */
.sorgen { background: var(--beige-hell); }
.schritte { list-style: none; margin: 0 0 clamp(64px, 8vw, 110px); padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(28px, 4vw, 56px); }
.schritte li { border-top: 1px solid rgba(75,75,75,.25); padding-top: 26px; }
.schritte__nr { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%; border: 1px solid rgba(75,75,75,.25); background: var(--creme); font: italic 400 1.5rem/1 var(--serif); color: var(--akzent); margin-bottom: 18px; }
.schritte h3 { font-size: clamp(1.35rem, 2vw, 1.6rem); margin-bottom: .4em; }
.schritte p { margin: 0; color: var(--text-leise, #6b6b6b); }
.sorgen__unten { display: grid; grid-template-columns: 7fr 4fr; gap: clamp(40px, 6vw, 90px); align-items: start; }
.sorgen .fragen details { border-bottom: 1px solid rgba(75,75,75,.2); }
.sorgen .fragen summary { list-style: none; cursor: pointer; padding: 20px 52px 20px 0; position: relative; font: 400 clamp(1.1rem, 1.6vw, 1.28rem)/1.4 var(--serif); transition: color .3s; }
.sorgen .fragen summary::-webkit-details-marker { display: none; }
.sorgen .fragen summary::after { content: "+"; position: absolute; right: 4px; top: 50%; width: 34px; height: 34px; margin-top: -17px; border: 1px solid rgba(75,75,75,.25); border-radius: 50%; display: grid; place-items: center; font: 400 1.2rem/1 var(--sans); transition: transform .4s, background .3s; }
.sorgen .fragen summary:hover { color: var(--akzent); }
.sorgen .fragen details[open] summary::after { transform: rotate(45deg); background: var(--creme); }
.sorgen .fragen details > div p { margin: 0; padding: 0 52px 22px 0; color: var(--text-leise, #6b6b6b); }
.sorgen__stimme { margin: 0; background: var(--creme); padding: clamp(32px, 4vw, 52px); position: sticky; top: 120px; }
.sorgen__stimme::before { content: "“"; display: block; font: 400 4.5rem/.6 var(--serif); color: #b8a898; height: 34px; }
.sorgen__stimme blockquote { margin: 0 0 18px; font: italic 400 clamp(1.4rem, 2.2vw, 1.8rem)/1.4 var(--serif); }
.sorgen__stimme figcaption { font: 700 .72rem/1 var(--sans); letter-spacing: .22em; text-transform: uppercase; color: var(--akzent); margin-bottom: 28px; }
@media (max-width: 900px) {
  .karten--zwei { grid-template-columns: 1fr; }
  .schritte { grid-template-columns: 1fr; gap: 32px; }
  .sorgen__unten { grid-template-columns: 1fr; }
  .sorgen__stimme { position: static; }
  .sorgen .fragen summary { padding-right: 46px; }
  .sorgen .fragen details > div p { padding-right: 0; }
}