/* Michaela Thoma Coaching — dunkles Design (Update 07.07.2026)
   Palette: Nachtbraun #1A0D08 (Grund), Weinrot #BB1E2F (Akzent), Sonnengelb #FFD700 (CTA/Highlights),
   Cremeweiß #FAF3E0 (Text), Dunkelbraun #5C4033 / Mittelbraun #8B5A2B (Flächen). Hellbraun entfernt. */
:root{
  --nacht:#1A0D08;
  --nacht-hell:#2A160E;
  --karte:#241209;
  --dunkelbraun:#5C4033;
  --mittelbraun:#8B5A2B;
  --terrakotta:#7A1622;   /* Bordeaux-Akzent (dunkler als Michaelas ursprüngliches #BB1E2F — Feedback 06.07.) */
  --karmin:#7A1622;
  --sonnengelb:#FFD700;
  --creme:#FAF3E0;
  --linie:rgba(250,243,224,.14);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Raleway',sans-serif;font-weight:300;color:var(--creme);background:var(--nacht);line-height:1.8;font-size:17px}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:500;line-height:1.25;color:var(--creme)}
strong{font-weight:600}
.accent{font-family:'Dancing Script',cursive;color:var(--sonnengelb)}
.wrap{max-width:920px;margin:0 auto;padding:0 22px}
img{max-width:100%;height:auto;border-radius:16px;display:block}

/* Navigation */
nav{background:rgba(26,13,8,.97);padding:18px 0;border-bottom:1px solid var(--linie);position:sticky;top:0;z-index:10}
nav .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 22px}
nav .logo{font-family:'Cormorant Garamond',serif;font-size:1.4rem;color:var(--creme);text-decoration:none;margin-right:auto;letter-spacing:.5px}
nav .logo img{height:46px;width:auto;border-radius:0;display:block}
nav a{color:var(--creme);text-decoration:none;font-size:14px;letter-spacing:.8px;opacity:.85;padding-bottom:3px}
nav a:hover,nav a.aktiv{opacity:1;border-bottom:2px solid var(--sonnengelb)}

/* Hero (Startseite, mit Foto) */
header.hero{background:linear-gradient(rgba(26,13,8,.72),rgba(26,13,8,.94)),url('/bilder/hero.jpg') center 30%/cover no-repeat;color:var(--creme);padding:110px 0 96px;text-align:center}
header.hero .kicker{font-size:13px;letter-spacing:4px;text-transform:uppercase;color:var(--sonnengelb);margin-bottom:20px}
header.hero h1{font-size:clamp(2.4rem,6.5vw,4rem);margin-bottom:12px}
header.hero .sub{max-width:640px;margin:0 auto 30px;opacity:.92}
header.hero .hallo{font-family:'Dancing Script',cursive;font-size:clamp(1.6rem,4vw,2.3rem);color:var(--sonnengelb);margin-bottom:22px}

/* Seitenkopf Unterseiten */
header.kopf{background:linear-gradient(160deg,var(--nacht) 30%,var(--nacht-hell) 100%);color:var(--creme);padding:64px 0 56px;text-align:center;border-bottom:1px solid var(--linie)}
header.kopf h1{font-size:clamp(2rem,5vw,3rem)}
header.kopf .sub{margin-top:12px;opacity:.85;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.3rem}

/* Buttons */
.btn{display:inline-block;background:var(--sonnengelb);color:var(--nacht);text-decoration:none;padding:15px 36px;border-radius:40px;font-weight:600;letter-spacing:1.2px;font-size:14px;text-transform:uppercase;transition:all .2s;border:none;cursor:pointer;font-family:'Raleway',sans-serif}
.btn:hover{background:var(--karmin);color:#fff}

/* Sektionen */
section{padding:76px 0}
section.weiss{background:var(--nacht-hell)}
section h2{font-size:clamp(1.8rem,4.5vw,2.5rem);margin-bottom:26px}
section h3{font-size:1.4rem;margin:32px 0 10px;color:var(--sonnengelb);font-weight:500}
section p{margin-bottom:16px;max-width:720px;opacity:.94}
.mitte{text-align:center}
.mitte p{margin-left:auto;margin-right:auto}
.kicker{font-size:12px;letter-spacing:4px;text-transform:uppercase;color:var(--karmin);margin-bottom:14px;font-weight:600}

/* Zitate */
.zitat{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(1.35rem,3.4vw,1.85rem);color:var(--creme);max-width:680px;margin:10px auto;text-align:center;opacity:.95;line-height:1.5}
.mitte .zitat::after{content:"";display:block;width:56px;height:2px;background:var(--sonnengelb);margin:26px auto 0;opacity:.7}

/* Karten */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:10px}
.card{background:var(--karte);border-radius:16px;padding:32px 28px;border:1px solid var(--linie);border-top:3px solid var(--karmin);transition:transform .25s ease,border-color .25s ease}
.card:hover{transform:translateY(-4px);border-color:rgba(250,243,224,.28)}
section.weiss .card{background:var(--nacht)}
.card h3{margin:0 0 12px;font-size:1.45rem;color:var(--creme)}
.card p{font-size:15.5px;margin-bottom:10px;opacity:.88}
.card .badge{display:inline-block;background:var(--karmin);color:#fff;font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;border-radius:20px;padding:4px 14px;margin-bottom:12px}
.card a{color:var(--sonnengelb);font-weight:500;text-decoration:none;font-size:15px}
.card a:hover{color:#fff}
.card a.btn{color:var(--nacht);font-size:13px;padding:12px 26px}
.card a.btn:hover{color:#fff;background:var(--karmin)}

/* Listen */
ul.liste{margin:0 0 18px 0;padding-left:0;list-style:none;max-width:720px}
ul.liste li{padding-left:30px;position:relative;margin-bottom:12px;opacity:.94}
ul.liste li::before{content:"—";position:absolute;left:0;color:var(--karmin);font-weight:600}

/* Merksatz */
.merksatz{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:1.45rem;color:var(--sonnengelb);margin:26px 0}

/* Bilder-Layout */
.bild-text{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center}
@media (max-width:720px){.bild-text{grid-template-columns:1fr}}

/* Formular */
form{max-width:560px;margin:0 auto;text-align:left}
form label{display:block;font-weight:500;font-size:15px;margin:18px 0 6px;color:var(--creme)}
form input[type=text],form input[type=email],form textarea{width:100%;padding:13px 15px;border:1px solid var(--linie);border-radius:10px;font-family:'Raleway',sans-serif;font-size:16px;background:var(--karte);color:var(--creme)}
form input:focus,form textarea:focus{outline:none;border-color:var(--sonnengelb)}
form textarea{min-height:150px;resize:vertical}
form .check{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:18px 0;opacity:.9}
form .check input{margin-top:5px}
form button{margin-top:6px}

/* Hinweis-Box */
.hinweisbox{background:var(--karte);border-left:3px solid var(--karmin);border-radius:10px;padding:18px 22px;font-size:14.5px;max-width:720px;margin:26px 0;opacity:.85}

/* Footer */
footer{background:#120803;color:var(--creme);padding:48px 0;font-size:14.5px;border-top:1px solid var(--linie)}
footer .spalten{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:26px}
footer h3{font-family:'Raleway',sans-serif;font-size:13px;text-transform:uppercase;letter-spacing:2px;margin-bottom:10px;color:var(--sonnengelb);opacity:.9}
footer a{color:var(--creme)}
footer a:hover{color:var(--sonnengelb)}
footer .unten{margin-top:30px;opacity:.55;text-align:center}