:root{
    --cream:        #fbf1e4;
    --sand:         #f0dcc2;
    --sand-line:    #e3c8a3;
    --terracotta:   #c1502e;
    --terracotta-dk:#8f3a20;
    --maroon:       #5b2a1f;
    --gold:         #d98a3d;
    --ink:          #3a2a22;
    --ink-soft:     #6b564a;
    --card-bg:      #fffaf2;
    --focus:        #8f3a20;
  }

  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --cream:        #241712;
      --sand:         #2e1e17;
      --sand-line:    #40291d;
      --terracotta:   #e07a4f;
      --terracotta-dk:#f0a06e;
      --maroon:       #f3d9c4;
      --gold:         #e6a75a;
      --ink:          #f1e3d6;
      --ink-soft:     #cbb5a3;
      --card-bg:      #2c1c15;
      --focus:        #f0a06e;
    }
  }
  :root[data-theme="dark"]{
    --cream:        #241712;
    --sand:         #2e1e17;
    --sand-line:    #40291d;
    --terracotta:   #e07a4f;
    --terracotta-dk:#f0a06e;
    --maroon:       #f3d9c4;
    --gold:         #e6a75a;
    --ink:          #f1e3d6;
    --ink-soft:     #cbb5a3;
    --card-bg:      #2c1c15;
    --focus:        #f0a06e;
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } *{ animation:none !important; transition:none !important; } }

  body{
    margin:0;
    background:var(--cream);
    color:var(--ink);
    font-family:"Karla", ui-sans-serif, system-ui, sans-serif;
    font-size:17px;
    line-height:1.65;
  }

  h1,h2,h3,.brand{
    font-family:"Shantell Sans", "Comic Sans MS", cursive, sans-serif;
    color:var(--maroon);
    font-weight:600;
    text-wrap:balance;
    margin:0;
  }

  a{ color:inherit; }
  img{ max-width:100%; display:block; }

  .wrap{
    max-width:1160px;
    margin-inline:auto;
    padding-inline:clamp(20px,5vw,48px);
  }

  section{ padding-block:clamp(56px,9vw,108px); }

  .eyebrow{
    display:inline-flex;
    align-items:center;
    gap:.5em;
    font-family:"Karla",sans-serif;
    font-weight:700;
    font-size:.78rem;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--terracotta-dk);
  }

  p{ max-width:62ch; color:var(--ink-soft); }
  .measure-wide p{ max-width:68ch; }

  :focus-visible{ outline:3px solid var(--focus); outline-offset:3px; border-radius:4px; }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:40;
    background:var(--terracotta);
    box-shadow:0 1px 0 rgba(0,0,0,.08);
  }
  .nav-row{
    display:flex; align-items:center; justify-content:space-between;
    gap:1rem; padding-block:.85rem;
  }
  .brand{
    color:var(--cream);
    font-size:1.35rem;
    text-decoration:none;
    white-space:nowrap;
  }
  nav.primary-nav{
    display:flex; align-items:center; gap:1.6rem;
  }
  nav.primary-nav a{
    font-size:.95rem; font-weight:600; text-decoration:none;
    color:var(--cream); opacity:.92;
    padding-block:.3rem;
    border-bottom:2px solid transparent;
  }
  nav.primary-nav a:hover{ border-color:var(--cream); opacity:1; }

  .call-pill{
    display:inline-flex; align-items:center; gap:.5em;
    background:var(--maroon); color:var(--cream);
    padding:.5rem 1rem; border-radius:999px;
    font-weight:700; font-size:.9rem; text-decoration:none;
    white-space:nowrap;
  }
  .call-pill:hover{ background:var(--terracotta-dk); }
  .call-pill svg{ width:1em; height:1em; }

  .burger{
    display:none;
    background:none; border:0; color:var(--cream);
    width:2.4rem; height:2.4rem; cursor:pointer;
  }
  .burger svg{ width:100%; height:100%; }

  #mobile-nav{ display:none; }

  @media (max-width:860px){
    nav.primary-nav{ display:none; }
    .burger{ display:inline-flex; align-items:center; justify-content:center; }
    #mobile-nav.open{
      display:flex; flex-direction:column; gap:.2rem;
      padding-block:.75rem 1.1rem;
      border-top:1px solid rgba(255,255,255,.25);
    }
    #mobile-nav a{
      color:var(--cream); text-decoration:none; font-weight:600;
      padding:.55rem .1rem;
    }
    .header-actions{ display:flex; align-items:center; gap:.6rem; }
  }

  /* ---------- Hero ---------- */
  .hero .wrap{
    display:grid;
    grid-template-columns:1.05fr .95fr;
    gap:clamp(2rem,5vw,4rem);
    align-items:center;
  }
  @media (max-width:900px){ .hero .wrap{ grid-template-columns:1fr; } .hero .portrait-frame{ order:-1; max-width:340px; margin-inline:auto; } }

  .hero h1{
    font-size:clamp(2.1rem,4.4vw,3.1rem);
    line-height:1.12;
    margin-block:.5rem .9rem;
  }
  .hero .credentials{
    font-size:.98rem; color:var(--ink-soft); margin-bottom:1.4rem;
  }
  .hero .credentials strong{ color:var(--maroon); }

  .btn{
    display:inline-flex; align-items:center; gap:.6em;
    background:var(--terracotta); color:#fffaf2;
    padding:.85rem 1.5rem; border-radius:999px;
    font-weight:700; text-decoration:none; font-size:1rem;
    border:2px solid var(--terracotta);
    cursor:pointer;
    transition:transform .15s ease, background .15s ease;
  }
  .btn:hover{ background:var(--terracotta-dk); border-color:var(--terracotta-dk); transform:translateY(-1px); }

  .cta-row{ display:flex; flex-wrap:wrap; gap:.9rem 1.2rem; align-items:center; margin-top:1.6rem; }
  .tel-link{ font-weight:700; color:var(--maroon); text-decoration:none; display:inline-flex; gap:.5em; align-items:center; }
  .tel-link svg{ width:1.1em; height:1.1em; }

  .portrait-frame{
    position:relative;
    align-self:start;
  }
  .portrait-frame img{
    width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 14%;
    max-height:clamp(300px,34vw,440px);
    border-radius:58% 42% 47% 53% / 46% 40% 60% 54%;
    box-shadow:0 22px 44px -18px rgba(91,42,31,.45);
  }
  @media (max-width:900px){ .portrait-frame img{ max-height:380px; } }

  /* ---------- Alt section bg ---------- */
  .alt-bg{ background:var(--sand); border-block:1px solid var(--sand-line); }

  /* ---------- Themen section ---------- */
  .themen-head{ max-width:64ch; margin-bottom:2.4rem; }
  .themen-stage{
    display:flex; flex-direction:column;
    gap:clamp(2.2rem,4vw,3rem);
  }

  .pill-cluster{
    display:flex; flex-wrap:wrap; gap:1.1rem 1.4rem;
    padding-block:.5rem;
  }
  .pill{
    background:var(--card-bg);
    border:2px solid var(--sand-line);
    color:var(--maroon);
    font-weight:700; font-size:.94rem;
    padding:.7rem 1.2rem .7rem 1rem;
    border-radius:999px;
    display:inline-flex; align-items:center; gap:.55em;
    box-shadow:0 8px 18px -12px rgba(91,42,31,.35);
    transition:transform .18s ease, border-color .18s ease;
  }
  .pill img{ width:1.35em; height:1.35em; object-fit:contain; flex:none; }
  .pill:hover{ transform:translateY(-4px) rotate(0deg) !important; border-color:var(--terracotta); }
  .pill:nth-child(1){ transform:rotate(-4deg) translateY(2px); }
  .pill:nth-child(2){ transform:rotate(3deg) translateY(-6px); }
  .pill:nth-child(3){ transform:rotate(-2deg) translateY(6px); }
  .pill:nth-child(4){ transform:rotate(5deg) translateY(-2px); }
  .pill:nth-child(5){ transform:rotate(-5deg) translateY(-8px); }
  .pill:nth-child(6){ transform:rotate(2deg) translateY(4px); }

  .followups{
    display:grid; grid-template-columns:1fr 1fr;
    gap:1.6rem;
  }
  @media (max-width:700px){ .followups{ grid-template-columns:1fr; } }
  .followup-card{
    background:var(--card-bg);
    border-radius:22px;
    padding:1.5rem 1.6rem;
    box-shadow:0 10px 24px -18px rgba(91,42,31,.4);
  }
  .followup-card p{ margin:0; font-size:.96rem; }

  /* ---------- Arbeitsweise (alternating) ---------- */
  .split{
    display:grid; grid-template-columns:.85fr 1.15fr;
    gap:clamp(2rem,5vw,4rem); align-items:center;
  }
  .split.reverse{ grid-template-columns:1.15fr .85fr; }
  .split.reverse .split-media{ order:2; }
  @media (max-width:860px){
    .split, .split.reverse{ grid-template-columns:1fr; }
    .split.reverse .split-media{ order:-1; }
  }
  .split-media{ position:relative; }
  .split-media img{
    width:100%; object-fit:cover;
    aspect-ratio:5/4;
    border-radius:36px 12px 36px 12px;
    box-shadow:0 20px 40px -22px rgba(91,42,31,.4);
  }
  @media (max-width:860px){ .split-media img{ aspect-ratio:4/3; } }
  .split ul.method-list{
    list-style:none; margin:1.2rem 0 0; padding:0;
    display:grid; gap:.6rem;
  }
  .split ul.method-list li{
    display:flex; align-items:center; gap:.6em; color:var(--ink-soft); font-size:.97rem;
  }
  .split ul.method-list li img{
    width:1.3em; height:1.3em; object-fit:contain; flex:none;
  }

  /* ---------- Ablauf panel ---------- */
  .ablauf-panel{
    background:linear-gradient(155deg,var(--terracotta) 0%,var(--terracotta-dk) 100%);
    border-radius:32px;
    padding:clamp(1.8rem,4vw,3.2rem);
    color:#fffaf2;
    position:relative;
    overflow:hidden;
  }
  .ablauf-panel h2{ color:#fffaf2; }
  .ablauf-panel .eyebrow{ color:#ffe3cf; }
  .ablauf-grid{
    display:grid; grid-template-columns:1.1fr .9fr;
    gap:clamp(2rem,4vw,3rem); margin-top:2rem;
  }
  @media (max-width:820px){ .ablauf-grid{ grid-template-columns:1fr; } }

  .timeline{ list-style:none; margin:0; padding:0; display:grid; gap:1.3rem; }
  .timeline li{ display:grid; grid-template-columns:2.6rem 1fr; gap:1rem; }
  .timeline .num{
    width:2.6rem; height:2.6rem; border-radius:50%;
    background:rgba(255,250,242,.16); border:2px solid rgba(255,250,242,.55);
    display:flex; align-items:center; justify-content:center;
    font-family:"Shantell Sans",cursive; font-weight:700;
  }
  .timeline h3{ color:#fffaf2; font-size:1.08rem; margin-bottom:.25rem; }
  .timeline p{ color:#ffe9db; max-width:46ch; margin:0; font-size:.95rem; }

  .fact-card{
    background:rgba(255,250,242,.12);
    border:1px solid rgba(255,250,242,.35);
    border-radius:22px;
    padding:1.5rem 1.6rem;
  }
  .fee-row{
    display:flex; justify-content:space-between; align-items:baseline;
    padding-block:.55rem;
    border-bottom:1px dashed rgba(255,250,242,.35);
    font-variant-numeric:tabular-nums;
  }
  .fee-row:last-of-type{ border-bottom:none; }
  .fee-row .duration{ font-weight:600; }
  .fee-row .price{ font-family:"Shantell Sans",cursive; font-size:1.25rem; }
  .fact-card .note{ color:#ffe9db; font-size:.88rem; margin-top:1rem; max-width:none; }
  .fact-card .divider{ height:1px; background:rgba(255,250,242,.3); margin-block:1.1rem; }

  /* ---------- Über mich ---------- */
  .ueber-media{ position:relative; }
  .ueber-media img.portrait-sm{
    border-radius:20px; width:100%; aspect-ratio:4/5; object-fit:cover;
    object-position:top;
    box-shadow:0 20px 40px -22px rgba(91,42,31,.4);
  }
  @media (min-width:861px){
    #ueber-mich .split{ align-items:stretch; }
    .ueber-media img.portrait-sm{ height:100%; aspect-ratio:auto; }
  }
  .memberships{
    display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.3rem;
  }
  .memberships span{
    font-size:.82rem; font-weight:700; color:var(--terracotta-dk);
    border:1.5px solid var(--sand-line); border-radius:999px;
    padding:.35rem .85rem;
  }

  /* ---------- Kontakt ---------- */
  .kontakt-grid{
    display:grid; grid-template-columns:1fr 1fr;
    gap:clamp(2rem,4vw,3.5rem);
  }
  @media (max-width:860px){ .kontakt-grid{ grid-template-columns:1fr; } }

  .contact-card{
    background:var(--card-bg); border-radius:26px;
    padding:clamp(1.5rem,3vw,2.2rem);
    box-shadow:0 14px 30px -20px rgba(91,42,31,.4);
  }
  .contact-info-list{ list-style:none; margin:1.4rem 0 0; padding:0; display:grid; gap:1rem; }
  .contact-info-list li{ display:flex; gap:.8em; align-items:flex-start; }
  .contact-info-list svg{ width:1.3em; height:1.3em; flex:none; color:var(--terracotta-dk); margin-top:.15em; }
  .contact-info-list a{ text-decoration:none; font-weight:700; color:var(--maroon); }
  .contact-info-list .muted{ color:var(--ink-soft); font-weight:400; font-size:.92rem; }
  .placeholder{
    color:var(--ink-soft); font-style:italic; font-size:.85rem;
    border:1.5px dashed var(--sand-line); border-radius:10px; padding:.4rem .6rem;
    display:inline-block; margin-top:.3rem;
  }

  .field{ display:grid; gap:.4rem; margin-bottom:1.1rem; }
  .field label{ font-weight:700; font-size:.9rem; color:var(--maroon); }
  .field input, .field textarea{
    font:inherit; padding:.75rem .9rem;
    border-radius:12px; border:1.5px solid var(--sand-line);
    background:var(--cream); color:var(--ink);
  }
  .field textarea{ resize:vertical; min-height:110px; }
  .field input:focus, .field textarea:focus{ border-color:var(--terracotta); }
  .form-note{ font-size:.85rem; margin:.3rem 0 1.2rem; }
  .form-status{ font-size:.88rem; margin-top:.8rem; color:var(--terracotta-dk); font-weight:700; }

  /* ---------- Footer ---------- */
  footer{ background:var(--maroon); color:#f3e3d7; }
  footer .wrap{
    padding-block:2.4rem;
    display:flex; flex-wrap:wrap; gap:1rem;
    align-items:center; justify-content:space-between;
    font-size:.88rem;
  }
  footer a{ color:#f3e3d7; text-decoration:underline; text-decoration-color:rgba(243,227,215,.4); }
  footer .foot-links{ display:flex; gap:1.4rem; flex-wrap:wrap; }

/* ---------- Legal pages (Impressum / Datenschutz) ---------- */
.legal-page{ max-width:760px; }
.back-link{
  display:inline-flex; align-items:center; gap:.4em;
  font-weight:700; color:var(--terracotta-dk); text-decoration:none; font-size:.9rem;
}
.back-link:hover{ text-decoration:underline; }
.legal-page h1{ font-size:clamp(1.9rem,3.4vw,2.6rem); margin-top:1.1rem; margin-bottom:.3rem; }
.legal-page h2{ font-size:1.2rem; margin-top:2.2rem; margin-bottom:.6rem; }
.legal-page p, .legal-page li{ color:var(--ink-soft); max-width:68ch; }
.legal-page ul{ padding-left:1.2rem; margin:0 0 1rem; }
.legal-page li{ margin-bottom:.4rem; }
.dummy-note{
  background:var(--sand); border:1.5px dashed var(--sand-line);
  border-radius:14px; padding:1rem 1.2rem; font-size:.9rem;
  color:var(--ink-soft); margin:1.6rem 0 2.2rem; max-width:68ch;
}
.dummy-note strong{ color:var(--maroon); }