/* ════════════════════════════════════════════════════════════════
   DAS GLÜCK IN DIR · Philipp Meier
   Sacred Earth · Ritual Editorial
   ──────────────────────────────────────────────────────────────── */

/* ── RESET ── */
*,*::before,*::after{ margin:0; padding:0; box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; color-scheme:dark; scroll-padding-top:100px; }
@media(prefers-reduced-motion:no-preference){ html{ scroll-behavior:smooth; } }
section[id],div[id]{ scroll-margin-top:88px; }
body{ -webkit-tap-highlight-color:rgba(212,167,81,.18); }
button,a,input,select,textarea,.faq-q{ touch-action:manipulation; }

img{ display:block; max-width:100%; }
button,input,select,textarea{ font:inherit; color:inherit; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
h1,h2,h3,.sec-title{ text-wrap:balance; }
/* Lange Komposita („Bewusstseinscoaching", „Krafttiersuche") sollen auf
   320px-Geräten umbrechen statt aus ihrer Box zu laufen. */
h1,h2,h3,h4{ overflow-wrap:break-word; }

/* sichtbarer Tastatur-Fokus */
:focus-visible{ outline:2px solid var(--gold-glow); outline-offset:3px; border-radius:1px; }
.nav-links a:focus-visible,.mobile-menu a:focus-visible,.btn:focus-visible,.faq-q:focus-visible,
.sound-toggle:focus-visible,.nav-cta a:focus-visible{ outline:2px solid var(--gold-glow); outline-offset:4px; }
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{ outline:2px solid var(--gold-glow); outline-offset:2px; }

.skip-link{ position:fixed; top:-100px; left:1rem; z-index:10001;
  background:var(--gold); color:var(--ink); font-family:var(--f-display); font-size:.7rem; font-weight:600;
  letter-spacing:.16em; text-transform:uppercase; padding:1.15em 1.6em; transition:top .3s ease; }
.skip-link:focus{ top:1rem; }

/* nur für Screenreader */
.hp{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ── VARIABLEN ── */
:root{
  /* Erde & Tinte */
  --ink:    #060402;
  --black:  #0a0704;
  --dark:   #110c06;
  --earth-s:#1a1208;
  --warm:   #271a0c;
  --bark:   #382611;

  /* gealtertes Gold — Pigment, kein Metallglanz */
  --gold:    #b3852a;
  --gold-lt: #d4a751;
  --gold-glow:#edca7c;

  /* Naturakzente */
  --sage:  #7f9070;
  --silver:#9fb1b4;

  /* Text — alle Werte auf --dark mit mind. 4.5:1 geprüft */
  --text:     #c6ac84;
  --text-lt:  #ece0cc;
  --text-mute:#9a8663;
  --text-faint:#8f8064;

  /* Linien & Glas */
  --line:       rgba(179,133,42,.20);
  --line-soft:  rgba(179,133,42,.10);
  --line-strong:rgba(212,167,81,.42);
  --glass:      rgba(18,13,7,.78);

  /* Schrift */
  --f-display:'Cinzel', serif;
  --f-body:   'Cormorant Garamond', Georgia, serif;
  --f-script: 'IM Fell English', serif;

  --tr:  .55s cubic-bezier(.22,.61,.36,1);
  --tr-s:.32s cubic-bezier(.22,.61,.36,1);

  --maxw: 1240px;
  --pad:  clamp(1.4rem, 5vw, 6rem);
}

/* ── BASIS ── */
body{
  background:var(--dark);
  color:var(--text);
  font-family:var(--f-body);
  font-size:clamp(1.04rem,.55vw + .92rem,1.2rem);
  line-height:1.72;
  overflow-x:hidden;
  letter-spacing:.005em;
  position:relative;
}
body::before{
  content:''; position:fixed; inset:0; z-index:-2;
  background:
    radial-gradient(120% 80% at 50% -10%, #1d140a 0%, transparent 55%),
    radial-gradient(100% 60% at 100% 100%, #15100a 0%, transparent 60%),
    linear-gradient(180deg, #0c0805 0%, #110c06 40%, #0a0704 100%);
}
body::after{ /* Filmkorn */
  content:''; position:fixed; inset:0; z-index:9990; pointer-events:none;
  opacity:.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.vignette{ position:fixed; inset:0; z-index:9989; pointer-events:none; box-shadow:inset 0 0 240px 60px rgba(0,0,0,.7); }
::selection{ background:rgba(179,133,42,.3); color:var(--text-lt); }
::-webkit-scrollbar{ width:10px; }
::-webkit-scrollbar-track{ background:var(--ink); }
::-webkit-scrollbar-thumb{ background:linear-gradient(var(--bark),var(--warm)); }
::-webkit-scrollbar-thumb:hover{ background:var(--gold); }

/* ── TYPOGRAFIE ── */
h1,h2,h3,h4{ font-family:var(--f-display); font-weight:400; line-height:1.1; color:var(--text-lt); }
.script{ font-family:var(--f-script); font-style:italic; }
em{ font-family:var(--f-script); font-style:italic; color:var(--gold-glow); }
strong{ color:var(--text-lt); font-weight:600; }
.lead{ color:var(--text-lt); font-size:1.16em; line-height:1.6; }

.eyebrow{
  font-family:var(--f-display); font-size:.62rem; font-weight:600;
  letter-spacing:.44em; text-transform:uppercase; color:var(--gold-lt);
  display:inline-flex; align-items:center; gap:1rem;
}
.eyebrow::before{ content:''; width:34px; height:1px; background:linear-gradient(90deg,transparent,var(--gold)); flex:none; }
.eyebrow.center{ display:flex; justify-content:center; }
.eyebrow.center::after{ content:''; width:34px; height:1px; background:linear-gradient(90deg,var(--gold),transparent); flex:none; }

/* ── LAYOUT ── */
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
section{ position:relative; }
.sec{ padding-block:clamp(4.5rem,10vw,10rem); }

.sec-head{ max-width:760px; margin-bottom:clamp(2.6rem,5vw,4.4rem); }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-head .eyebrow{ margin-bottom:1.5rem; }
.sec-title{ font-size:clamp(2.1rem,4.8vw,4rem); line-height:1.06; letter-spacing:.01em; }
.sec-title .alt{ display:block; color:var(--gold-lt); font-size:.62em; font-style:italic; font-family:var(--f-script); letter-spacing:0; margin-top:.4em; line-height:1.3; }
.sec-sub{ margin-top:1.5rem; color:var(--text); max-width:62ch; }
.sec-head.center .sec-sub{ margin-inline:auto; }

.rule{ display:flex; align-items:center; justify-content:center; gap:1.4rem; color:var(--gold); margin:0 auto; }
.rule::before,.rule::after{ content:''; height:1px; width:min(120px,16vw); background:linear-gradient(90deg,transparent,var(--line-strong),transparent); }
.rule .mark{ font-size:1rem; opacity:.85; }

/* ── BUTTONS ── */
.btn{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:.7em;
  font-family:var(--f-display); font-size:.72rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; text-align:center;
  padding:1.15em 2.1em; min-height:48px; color:var(--gold-glow);
  border:1px solid var(--line-strong); background:transparent;
  cursor:pointer; overflow:hidden; isolation:isolate;
  transition:color var(--tr-s),border-color var(--tr-s);
}
.btn::before{
  content:''; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg,var(--gold),var(--gold-lt));
  transform:translateY(101%); transition:transform var(--tr);
}
.btn:hover{ color:var(--ink); border-color:var(--gold); }
.btn:hover::before{ transform:translateY(0); }
.btn-solid{ color:var(--ink); border-color:var(--gold); }
.btn-solid::before{ transform:translateY(0); }
.btn-solid:hover::before{ filter:brightness(1.12); transform:translateY(0); }
.btn .ar{ font-size:.9em; transition:transform var(--tr-s); }
.btn:hover .ar{ transform:translateX(4px); }
.btn[disabled]{ opacity:.55; cursor:progress; }
.btn[disabled]:hover::before{ filter:none; }

/* ── NAV ── */
nav#nav{
  position:fixed; inset:0 0 auto 0; z-index:600;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.3rem var(--pad);
  transition:padding var(--tr-s),background var(--tr-s),border-color var(--tr-s);
  background:linear-gradient(180deg,rgba(8,5,3,.85),transparent);
  border-bottom:1px solid transparent;
}
nav#nav.scrolled{
  padding:.8rem var(--pad);
  background:var(--glass); backdrop-filter:blur(14px) saturate(1.1);
  border-bottom:1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:.8rem; flex:none; min-height:44px; }
.brand .seal{ width:30px; height:30px; opacity:.92; filter:drop-shadow(0 0 6px rgba(179,133,42,.4)); flex:none; }
.brand .bname{ font-family:var(--f-display); font-size:.78rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--text-lt); }
.brand .bsub{ display:block; font-family:var(--f-script); font-style:italic; font-size:.7rem; letter-spacing:.14em; color:var(--gold-lt); text-transform:none; margin-top:1px; }

.nav-links{ display:flex; gap:1.9rem; align-items:center; }
.nav-links a{
  font-family:var(--f-display); font-size:.66rem; font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; color:var(--text);
  position:relative; padding:.6em 0; transition:color var(--tr-s);
}
.nav-links a::after{ content:''; position:absolute; left:0; bottom:.2em; height:1px; width:0; background:var(--gold-lt); transition:width var(--tr-s); }
.nav-links a:hover{ color:var(--gold-glow); }
.nav-links a:hover::after{ width:100%; }
.nav-links a.active{ color:var(--gold-glow); }
.nav-links a.active::after{ width:100%; }
.nav-cta{ margin-left:.4rem; }
.nav-cta a{ border:1px solid var(--line-strong); padding:.8em 1.3em !important; color:var(--gold-glow); transition:background var(--tr-s),color var(--tr-s),border-color var(--tr-s); }
.nav-cta a::after{ display:none; }
.nav-cta a:hover{ background:var(--gold); color:var(--ink); border-color:var(--gold); }

.burger{ display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  background:none; border:0; cursor:pointer; width:46px; height:46px; margin-right:-.5rem; z-index:601; }
.burger span{ width:26px; height:1.5px; background:var(--gold-lt); transition:var(--tr-s); transform-origin:center; }
.burger.open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger.open span:nth-child(2){ opacity:0; }
.burger.open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:590; background:rgba(7,4,2,.98); backdrop-filter:blur(6px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.4rem;
  padding:5rem 1.4rem 2rem;
  opacity:0; visibility:hidden; transition:opacity .4s ease,visibility .4s ease;
}
.mobile-menu[hidden]{ display:none; }
.mobile-menu.open{ opacity:1; visibility:visible; }
.mobile-menu a{ font-family:var(--f-display); font-size:1.05rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-lt);
  padding:.6em 1em; opacity:0; transform:translateY(12px); transition:.45s; }
.mobile-menu.open a{ opacity:1; transform:none; }
.mobile-menu.open a:nth-child(1){ transition-delay:.05s; }
.mobile-menu.open a:nth-child(2){ transition-delay:.10s; }
.mobile-menu.open a:nth-child(3){ transition-delay:.15s; }
.mobile-menu.open a:nth-child(4){ transition-delay:.20s; }
.mobile-menu.open a:nth-child(5){ transition-delay:.25s; }
.mobile-menu.open a:nth-child(6){ transition-delay:.30s; }
.mobile-menu.open a:nth-child(7){ transition-delay:.35s; }
.mobile-menu a:hover{ color:var(--gold-glow); }
.mobile-menu .mm-cta{ margin-top:1rem; border:1px solid var(--gold); color:var(--gold-glow); padding:1em 1.6em; font-size:.72rem; }

/* ════════ HERO ════════ */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; overflow:hidden;
  padding-top:clamp(92px,13vh,120px); padding-bottom:clamp(3rem,7vh,4.5rem); }
.hero-bg{ position:absolute; inset:0; z-index:0; transition:transform .5s cubic-bezier(.22,.61,.36,1); }
.hero-bg img{ width:100%; height:100%; object-fit:cover; object-position:center 35%;
  transform:scale(1.1); animation:kenburns 30s ease-in-out infinite alternate;
  filter:saturate(.8) contrast(1.03) brightness(.5); }
@keyframes kenburns{ from{ transform:scale(1.1) translate(0,0); } to{ transform:scale(1.2) translate(-2%,-2%); } }
.hero-bg::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(6,4,2,.66) 0%, rgba(6,4,2,.38) 32%, rgba(8,5,3,.82) 76%, var(--dark) 100%),
    radial-gradient(75% 70% at 20% 55%, rgba(6,4,2,.72), transparent 72%);
}
.hero-inner{ position:relative; z-index:2; width:100%; display:grid; grid-template-columns:1fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.hero-copy{ max-width:min(100%,42rem); }
.hero h1{ font-size:clamp(2rem,5.2vw,3.4rem); line-height:1.1; letter-spacing:.005em;
  color:var(--text-lt); text-shadow:0 6px 50px rgba(0,0,0,.7); animation:rise 1s .1s both; }
.hero h1 .ln{ display:block; overflow:hidden; }
.hero h1 .ln span{ display:block; animation:rise 1.1s cubic-bezier(.22,.61,.36,1) both; }
.hero h1 .ln:nth-child(1) span{ animation-delay:.24s; }
.hero h1 .ln:nth-child(2) span{ animation-delay:.36s; }
.hero h1 .h1-alt{ display:block; font-family:var(--f-script); font-style:italic; font-weight:400;
  font-size:.66em; line-height:1.3; color:var(--gold-lt); margin-top:.5em; letter-spacing:.01em;
  animation:rise 1s .6s both; }
.hero-desc{ margin-top:1.7rem; max-width:44ch; color:var(--text-lt); font-size:1.06rem; line-height:1.62; animation:rise 1s .68s both; }
/* „Genau dort beginnt meine Arbeit." bekommt eine eigene Zeile — der Satz
   trägt den Übergang von Beobachtung zu Angebot und geht im Fließtext unter. */
.hero-desc span{ display:block; margin-top:.5em; color:var(--gold-lt); }
.hero-disciplines{ margin-top:1.5rem; padding-top:1.1rem; border-top:1px solid var(--line);
  max-width:44ch; font-family:var(--f-display); font-size:.62rem; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase; color:var(--gold-lt); line-height:1.9;
  animation:rise 1s .82s both; }
.hero-actions{ margin-top:1.9rem; display:flex; gap:1rem; flex-wrap:wrap; animation:rise 1s .92s both; }
.hero-meta{ margin-top:1.4rem; font-family:var(--f-display); font-size:.6rem; letter-spacing:.22em;
  text-transform:uppercase; color:var(--text-mute); animation:rise 1s 1.05s both; }

.hero-portrait{ display:none; position:relative; animation:rise 1.2s .5s both; }
.hero-portrait picture{ display:block; overflow:hidden; }
.hero-portrait img{ width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center 30%;
  filter:saturate(.62) contrast(1.1) brightness(.62) sepia(.14); }
.hero-portrait::after{ content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(200deg, rgba(179,133,42,.10), transparent 45%), inset 0 0 0 0 transparent;
  box-shadow:inset 0 0 90px 18px rgba(6,4,2,.85); }
.hero-portrait .corner{ position:absolute; width:38px; height:38px; border:1px solid var(--gold); opacity:.55; }
.hero-portrait .corner.tl{ top:-10px; left:-10px; border-right:0; border-bottom:0; }
.hero-portrait .corner.br{ bottom:-10px; right:-10px; border-left:0; border-top:0; }

.scroll-cue{ position:absolute; bottom:1.8rem; left:50%; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:.7rem;
  font-family:var(--f-display); font-size:.55rem; letter-spacing:.4em; text-transform:uppercase; color:var(--text-mute);
  animation:rise 1s 1.3s both; }
.scroll-cue .line{ width:1px; height:44px; background:linear-gradient(var(--gold),transparent); position:relative; overflow:hidden; }
.scroll-cue .line::after{ content:''; position:absolute; top:-50%; left:0; width:100%; height:50%; background:var(--gold-glow); animation:scrolldot 2.2s ease-in-out infinite; }
@keyframes scrolldot{ 0%{ top:-50%; } 60%,100%{ top:100%; } }
@keyframes rise{ from{ opacity:0; transform:translateY(28px); } to{ opacity:1; transform:none; } }

/* ════════ MARQUEE ════════ */
.marquee{ border-block:1px solid var(--line); padding-block:1.2rem; overflow:hidden; background:rgba(8,5,3,.4); white-space:nowrap; }
.marquee-track{ display:inline-flex; align-items:center; gap:2.2rem; animation:scrollx 52s linear infinite; }
.marquee:hover .marquee-track{ animation-play-state:paused; }
.marquee span{ font-family:var(--f-display); font-size:.92rem; letter-spacing:.3em; text-transform:uppercase; color:var(--text-mute); }
.marquee .star{ color:var(--gold); font-size:.66rem; }
@keyframes scrollx{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ════════ 1 · RESONANZ ════════ */
.res-list{ max-width:44rem; margin-inline:auto; display:flex; flex-direction:column; }
.res-list li{
  font-family:var(--f-body); font-size:clamp(1.15rem,2.5vw,1.65rem); line-height:1.5;
  color:var(--text-lt); text-align:center; padding-block:clamp(.9rem,2vw,1.25rem);
  border-bottom:1px solid var(--line-soft); text-wrap:pretty;
}
.res-list li:first-child{ border-top:1px solid var(--line-soft); }
.res-close{ margin-top:clamp(2.4rem,5vw,3.4rem); text-align:center;
  font-family:var(--f-script); font-style:italic; font-size:clamp(1.25rem,2.8vw,1.8rem);
  color:var(--gold-lt); max-width:32ch; margin-inline:auto; line-height:1.45; }
.resonance .rule{ margin-top:clamp(2.6rem,5vw,3.6rem); }

/* ════════ 2 · EINE STIMME ════════ */
.voice{ padding-block:clamp(3.5rem,8vw,7rem); background:linear-gradient(180deg,transparent,rgba(8,5,3,.55),transparent); }
.voice-quote{ max-width:56rem; margin-inline:auto; text-align:center; position:relative; }
.voice-quote::before{ content:'„'; display:block; font-family:var(--f-script); font-style:italic;
  font-size:clamp(3.5rem,9vw,6rem); line-height:.6; color:var(--line-strong); margin-bottom:.35em; }
.voice-quote blockquote p{ font-family:var(--f-script); font-style:italic;
  font-size:clamp(1.35rem,3.2vw,2.2rem); line-height:1.5; color:var(--text-lt); text-wrap:pretty; }
.voice-quote figcaption{ margin-top:1.8rem; font-family:var(--f-display); font-size:.62rem;
  letter-spacing:.24em; text-transform:uppercase; color:var(--gold-lt); }

/* ════════ 3 · MEINE ARBEIT ════════ */
.work-grid{ display:grid; grid-template-columns:1fr; gap:clamp(2.5rem,6vw,5rem); align-items:center; }
.work-body .sec-title{ margin-top:1.4rem; }
.work-body .lead{ margin-top:1.8rem; }
.work-look{ margin:1.8rem 0; display:flex; flex-direction:column; gap:.35rem; }
.work-look li{ font-family:var(--f-script); font-style:italic; font-size:clamp(1.1rem,2.2vw,1.35rem);
  color:var(--gold-lt); padding-left:1.5rem; position:relative; line-height:1.5; }
.work-look li::before{ content:'✦'; position:absolute; left:0; top:.15em; font-size:.6em; color:var(--gold); font-style:normal; }
.work-body > p{ margin-bottom:1.2rem; }
.work-claim{ margin-top:2.6rem; padding:1.8rem 0 0; border-top:1px solid var(--line);
  font-family:var(--f-display); font-size:clamp(.95rem,2vw,1.3rem); line-height:1.55;
  letter-spacing:.05em; color:var(--text-lt); text-transform:uppercase; }
.work-claim span{ display:block; color:var(--gold-lt); }

/* §9 — „Kein Retten. Kein Reparieren. Keine Rolle." ist ein Markenstatement,
   kein gewöhnlicher Abschnitt. Deshalb mehr Luft und eine größere Überschrift
   als in den übrigen Sektionen. */
.work{ padding-block:clamp(5.5rem,13vw,13rem); }
.work .sec-title{ font-size:clamp(2.3rem,5.4vw,4.4rem); line-height:1.02; }

.work-figure{ position:relative; }
.work-figure .img-frame{ position:relative; overflow:hidden; aspect-ratio:4/5; }
.work-figure img{ width:100%; height:100%; object-fit:cover; object-position:center 30%;
  filter:saturate(.62) contrast(1.08) brightness(.6) sepia(.12); transition:transform 1.4s var(--tr); }
.work-figure:hover img{ transform:scale(1.04); }
.work-figure .img-frame::after{ content:''; position:absolute; inset:0; pointer-events:none;
  box-shadow:inset 0 0 90px 16px rgba(6,4,2,.75); }
.corner{ position:absolute; width:40px; height:40px; border:1px solid var(--gold); opacity:.55; }
.corner.tl{ top:-10px; left:-10px; border-right:0; border-bottom:0; }
.corner.br{ bottom:-10px; right:-10px; border-left:0; border-top:0; }

/* ════════ 4 · WIE ICH ARBEITE ════════ */
.approach{ background:linear-gradient(180deg,transparent,rgba(8,5,3,.5),transparent); }
.approach-list{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.app{ background:var(--dark); padding:clamp(1.6rem,3vw,2.3rem); position:relative; transition:background var(--tr-s); }
.app:hover{ background:var(--earth-s); }
.app-n{ font-family:var(--f-display); font-size:.66rem; letter-spacing:.24em; color:var(--gold); }
.app h3{ font-size:clamp(1.3rem,2.6vw,1.7rem); margin:.6rem 0 .6rem; color:var(--text-lt); }
.app p{ font-size:1rem; color:var(--text); line-height:1.6; text-wrap:pretty; }
.approach-note{ margin-top:clamp(2.2rem,4vw,3rem); text-align:center; font-family:var(--f-script); font-style:italic;
  font-size:clamp(1.1rem,2.4vw,1.5rem); color:var(--gold-lt); line-height:1.55; }

/* ════════ 5 · HAUPTANGEBOT ════════ */
.ways{ display:grid; grid-template-columns:1fr; gap:1.2rem; }
.way{ border:1px solid var(--line); background:linear-gradient(180deg,var(--earth-s),var(--dark));
  padding:clamp(1.7rem,3vw,2.4rem); display:flex; flex-direction:column; transition:border-color var(--tr-s),background var(--tr-s); }
.way:hover{ border-color:var(--line-strong); }
.way.feat{ border-color:var(--gold); box-shadow:0 24px 60px -34px rgba(179,133,42,.55); }
.way-sym{ font-size:1.5rem; color:var(--gold); line-height:1; margin-bottom:1rem; }
.way h3{ font-size:clamp(1.35rem,2.6vw,1.75rem); color:var(--text-lt); }
.way-lede{ margin-top:.6rem; font-family:var(--f-script); font-style:italic; font-size:1.12rem; color:var(--gold-lt); line-height:1.45; }
.way p:not(.way-lede):not(.way-meta){ margin-top:.9rem; font-size:.99rem; color:var(--text); line-height:1.6; flex:1; }
.way-meta{ margin-top:1.4rem; padding-top:1rem; border-top:1px solid var(--line-soft);
  font-family:var(--f-display); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-lt); }
.offer-cta{ margin-top:clamp(2.4rem,5vw,3.4rem); text-align:center; }
.offer-note{ font-family:var(--f-script); font-style:italic; font-size:clamp(1.15rem,2.4vw,1.5rem);
  color:var(--gold-lt); margin-bottom:1.6rem; }

/* ════════ 6 · ORTE ════════ */
.places-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.place{ position:relative; min-height:300px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; background:var(--dark); }
.place picture{ position:absolute; inset:0; }
.place img{ width:100%; height:100%; object-fit:cover; filter:brightness(.42) saturate(.8); transition:transform 1.3s var(--tr),filter var(--tr); }
.place::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 30%,rgba(6,4,2,.94)); }
.place:hover img{ transform:scale(1.05); filter:brightness(.52) saturate(.85); }
.place .pl-in{ position:relative; z-index:2; padding:clamp(1.6rem,3vw,2.3rem); }
.place .psym{ font-size:1.4rem; color:var(--gold-glow); }
.place h3{ font-size:clamp(1.25rem,2.3vw,1.6rem); margin:.6rem 0 .4rem; color:var(--text-lt); }
.place .lede{ color:var(--gold-lt); font-style:italic; font-family:var(--f-script); font-size:1.08rem; margin-bottom:.5rem; }
.place p{ font-size:.96rem; color:var(--text); text-wrap:pretty; }
.place .where{ margin-top:.8rem; font-family:var(--f-display); font-size:.58rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-mute); }

/* ════════ 7 · SPEZIALISIERTE FORMATE (bewusst leiser) ════════ */
.fmt-group{ margin-bottom:clamp(2.6rem,5vw,4.5rem); }
.fmt-group:last-of-type{ margin-bottom:0; }
.fmt-head{ display:flex; align-items:center; gap:.9rem; margin-bottom:1.6rem;
  font-family:var(--f-display); font-size:.64rem; font-weight:600; letter-spacing:.36em;
  text-transform:uppercase; color:var(--gold-lt); }
.fmt-head::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent); }
.fmt-head .sym{ color:var(--gold); font-size:1rem; letter-spacing:0; }

.fmt-feature{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.fcard{ position:relative; background:var(--dark); overflow:hidden; min-height:320px; display:flex; flex-direction:column; justify-content:flex-end; }
.fcard picture{ position:absolute; inset:0; }
.fcard img{ width:100%; height:100%; object-fit:cover; filter:brightness(.44) saturate(.8); transition:transform 1.2s var(--tr),filter var(--tr); }
.fcard::after{ content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 28%,rgba(6,4,2,.94)); }
.fcard:hover img{ transform:scale(1.05); filter:brightness(.56) saturate(.9); }
.fcard .fc-in{ position:relative; z-index:2; padding:clamp(1.7rem,3vw,2.5rem); }
.fcard h4{ font-size:clamp(1.5rem,2.8vw,2rem); margin-bottom:.7rem; }
.fcard p{ color:var(--text); font-size:1rem; line-height:1.58; text-wrap:pretty; }

/* Kompakte Zeilen: alle Formate bleiben lesbar, nehmen aber deutlich weniger
   Raum ein als das Hauptangebot — genau das ist hier die Absicht. */
.fmt-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.fmt{ background:var(--dark); padding:.95rem 1.1rem; display:grid; grid-template-columns:1.4rem 1fr;
  column-gap:.7rem; align-items:baseline; transition:background var(--tr-s); }
.fmt:hover{ background:var(--earth-s); }
.fmt .sym{ font-size:.9rem; color:var(--gold); line-height:1.4; }
.fmt h4{ font-size:1rem; letter-spacing:.02em; color:var(--text-lt); line-height:1.35; }
.fmt p{ grid-column:2; font-size:.9rem; color:var(--text-mute); line-height:1.45; margin-top:.15rem; text-wrap:pretty; }
/* §10 — Diese Aussage muss stärker wirken als die Liste darüber, sonst liest
   sich der Abschnitt wieder wie ein Katalog zum Aussuchen. */
.fmt-close{ margin-top:clamp(3rem,6vw,4.5rem); text-align:center;
  padding-block:clamp(2rem,4vw,3rem); border-block:1px solid var(--line);
  font-family:var(--f-script); font-style:italic;
  font-size:clamp(1.45rem,3.4vw,2.4rem); line-height:1.4; color:var(--text-lt);
  max-width:26ch; margin-inline:auto; }
.fmt-close strong{ display:block; color:var(--gold-lt); font-weight:400; }

/* ════════ 8 · KLANG ════════ */
.instruments{ background:linear-gradient(180deg,transparent,rgba(7,4,2,.55),transparent); }
.sound-list{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); max-width:640px; }
.sound-list li{ background:var(--dark); padding:1.1rem 1.3rem; display:flex; align-items:baseline; flex-wrap:wrap; gap:.15rem .9rem; }
.sound-list .sym{ font-size:1rem; color:var(--gold); line-height:1; flex:none; }
.sound-list .name{ font-family:var(--f-display); font-size:1rem; letter-spacing:.02em; color:var(--text-lt); }
.sound-list .det{ font-family:var(--f-script); font-style:italic; font-size:.98rem; color:var(--gold-lt); }

/* ════════ 9 · ÜBER MICH ════════ */
.about-grid{ display:grid; grid-template-columns:1fr; gap:clamp(2.4rem,6vw,5rem); align-items:start; }
.about-figure{ position:relative; max-width:520px; margin-inline:auto; }
.about-figure .img-frame{ position:relative; overflow:hidden; aspect-ratio:3/4; }
.about-figure img{ width:100%; height:100%; object-fit:cover; filter:saturate(.7) contrast(1.05) brightness(.72) sepia(.1); transition:transform 1.4s var(--tr); }
.about-figure:hover img{ transform:scale(1.04); }
.about-figure .img-frame::after{ content:''; position:absolute; inset:0; box-shadow:inset 0 0 80px 12px rgba(6,4,2,.7); pointer-events:none; }
.about-figure .tag{ position:absolute; bottom:1.3rem; left:1.3rem; right:1.3rem; z-index:2;
  font-family:var(--f-script); font-style:italic; font-size:1.02rem; color:var(--text-lt);
  background:linear-gradient(transparent,rgba(6,4,2,.9)); padding-top:2rem; }
.about-body .sec-title{ margin-top:1.4rem; }
.about-body .lead{ margin-top:1.7rem; }
.about-body > p{ margin-bottom:1.2rem; }
.about-sub{ margin-top:2.6rem; font-family:var(--f-display); font-size:.66rem; font-weight:600;
  letter-spacing:.34em; text-transform:uppercase; color:var(--gold-lt); }

.timeline{ position:relative; margin-top:1.8rem; padding-left:clamp(1.6rem,4vw,2.4rem); }
.timeline::before{ content:''; position:absolute; left:6px; top:8px; bottom:8px; width:1px; background:linear-gradient(var(--gold),var(--line),transparent); }
.tl-item{ position:relative; padding-bottom:1.8rem; }
.tl-item:last-child{ padding-bottom:0; }
.tl-item::before{ content:''; position:absolute; left:calc(-1 * clamp(1.6rem,4vw,2.4rem)); top:.55rem;
  width:13px; height:13px; border:1px solid var(--gold); background:var(--dark); border-radius:50%;
  box-shadow:0 0 0 4px var(--dark),0 0 12px rgba(179,133,42,.45); }
.tl-item .when{ font-family:var(--f-display); font-size:.6rem; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-lt); }
.tl-item h4{ font-size:1.2rem; margin:.35rem 0 .35rem; color:var(--text-lt); }
.tl-item p:last-child{ color:var(--text); font-size:.99rem; line-height:1.6; text-wrap:pretty; }

/* Einspaltig starten: „Gestalttherapeutische Ausbildung" ist gesperrt gesetzt
   und passt auf sehr schmalen Geräten (320px) sonst in keine halbe Spalte —
   das hat die ganze Seite horizontal aufgeschoben. */
.creds{ margin-top:clamp(3rem,6vw,4.5rem); display:grid; grid-template-columns:1fr; gap:1px;
  background:var(--line-soft); border:1px solid var(--line-soft); }
.creds li{ background:var(--dark); padding:clamp(1.5rem,3vw,2.2rem) 1.3rem; text-align:center;
  min-width:0; overflow-wrap:break-word; }
.creds .num{ display:block; font-family:var(--f-display); font-size:clamp(2rem,4vw,2.9rem); color:var(--gold-lt); line-height:1; }
.creds .num .u{ font-size:.45em; color:var(--text-mute); vertical-align:super; }
.creds .lab{ display:block; margin-top:.9rem; font-family:var(--f-display); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-lt); line-height:1.5; }
.creds .det{ display:block; margin-top:.35rem; font-size:.9rem; color:var(--text-mute); font-style:italic; }
.creds-note{ margin-top:1.4rem; text-align:center; font-size:.88rem; color:var(--text-mute); font-style:italic; }

/* ════════ 10 · PREISE ════════ */
/* Empfohlener Einstieg — der einzige visuell dominante Preisblock */
.entry{ position:relative; overflow:hidden; border:1px solid var(--gold);
  background:linear-gradient(150deg, rgba(39,26,12,.9), var(--dark) 62%);
  box-shadow:0 30px 80px -40px rgba(179,133,42,.6);
  padding:clamp(2rem,5vw,3.4rem); margin-bottom:clamp(3rem,6vw,4.5rem); }
.entry-in{ position:relative; z-index:2; max-width:44rem; }
.entry-eye{ font-family:var(--f-display); font-size:.6rem; font-weight:600; letter-spacing:.34em; text-transform:uppercase; color:var(--gold); }
.entry h3{ margin-top:1rem; font-size:clamp(1.9rem,4.4vw,3rem); color:var(--text-lt); }
.entry-price{ margin-top:.6rem; font-family:var(--f-display); font-size:clamp(1.8rem,4vw,2.6rem); color:var(--gold-lt); line-height:1.1; }
.entry-dur{ display:block; margin-top:.5rem; font-family:var(--f-body); font-style:italic; font-size:1.05rem; color:var(--text); letter-spacing:0; }
.entry-txt{ margin:1.4rem 0 2rem; color:var(--text-lt); max-width:48ch; }
.entry-seal{ position:absolute; right:-3rem; top:50%; transform:translateY(-50%); width:min(320px,44%); color:var(--gold); opacity:.07; pointer-events:none; }

.price-block{ margin-bottom:clamp(2.8rem,5vw,4.5rem); }
.pb-head{ font-family:var(--f-display); font-size:.66rem; font-weight:600; letter-spacing:.34em;
  text-transform:uppercase; color:var(--gold-lt); margin-bottom:1rem; display:flex; align-items:center; gap:1rem; }
.pb-head::after{ content:''; flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent); }
.pb-sub{ margin-bottom:1.6rem; font-size:.98rem; color:var(--text-mute); font-style:italic; }

.price-grid{ display:grid; grid-template-columns:1fr; gap:1px; background:var(--line-soft); border:1px solid var(--line-soft); }
.pcard{ background:var(--dark); padding:clamp(1.6rem,3vw,2.2rem); transition:background var(--tr-s); }
.pcard:hover{ background:var(--earth-s); }
.pcard .psym{ font-size:1.3rem; color:var(--gold); display:block; margin-bottom:.8rem; line-height:1; }
.pcard h4{ font-size:1.35rem; color:var(--text-lt); margin-bottom:.3rem; }
.pcard .meta{ font-size:.8rem; color:var(--text-mute); letter-spacing:.04em; text-transform:uppercase; font-family:var(--f-display); }
.pcard .price{ font-family:var(--f-display); font-size:2.3rem; color:var(--gold-lt); margin:.9rem 0 .8rem; line-height:1; }
.pcard .price .c{ font-size:.4em; vertical-align:super; color:var(--text-mute); margin-left:.1em; }
.pcard .price.ask{ font-size:1.4rem; color:var(--sage); }
.pcard > p:last-child{ font-size:.95rem; color:var(--text); line-height:1.55; text-wrap:pretty; }

.pkg-grid{ display:grid; grid-template-columns:1fr; gap:1.2rem; }
.pkg{ border:1px solid var(--line); background:linear-gradient(180deg,var(--earth-s),var(--dark));
  padding:clamp(1.7rem,3vw,2.4rem); position:relative; display:flex; flex-direction:column; transition:border-color var(--tr-s); }
.pkg:hover{ border-color:var(--line-strong); }
.pkg.feat{ border-color:var(--line-strong); }
.pkg .badge{ position:absolute; top:-1px; right:-1px; background:var(--gold); color:var(--ink);
  font-family:var(--f-display); font-size:.54rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; padding:.55em 1em; }
.pkg .pk-name{ font-family:var(--f-display); font-size:.66rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--gold-lt); }
.pkg .pk-price{ font-family:var(--f-display); font-size:2.6rem; color:var(--text-lt); margin:.5rem 0 .2rem; line-height:1; }
.pkg .pk-price .c{ font-size:.4em; color:var(--text-mute); vertical-align:super; }
.pkg .pk-save{ font-size:.88rem; color:var(--sage); font-style:italic; margin-bottom:1.3rem; }
.pkg ul{ display:flex; flex-direction:column; gap:.65rem; margin-bottom:1.7rem; flex:1; }
.pkg li{ font-size:.97rem; color:var(--text); padding-left:1.4rem; position:relative; line-height:1.45; }
.pkg li::before{ content:'✦'; position:absolute; left:0; color:var(--gold); font-size:.68rem; top:.3em; }
.pkg li.lead{ color:var(--text-lt); font-weight:600; }
.pkg .btn{ width:100%; }

.price-orient{ margin-top:clamp(2.2rem,4vw,3rem); text-align:center;
  font-family:var(--f-script); font-style:italic; font-size:clamp(1.15rem,2.5vw,1.55rem);
  color:var(--gold-lt); line-height:1.5; }
.price-orient span{ color:var(--text-lt); }

.group-box{ margin-top:clamp(2.4rem,5vw,3.4rem); border:1px solid var(--line); background:rgba(8,5,3,.4);
  padding:clamp(1.8rem,4vw,2.8rem); display:grid; grid-template-columns:1fr; gap:1.6rem; align-items:center; }
.group-box h3{ font-size:1.5rem; color:var(--text-lt); margin-bottom:.6rem; }
.group-box p{ color:var(--text); max-width:60ch; }
.group-box .gb-num{ font-family:var(--f-display); color:var(--gold-lt); }
.price-note{ margin-top:1.6rem; text-align:center; font-size:.88rem; color:var(--text-mute); font-style:italic; }

/* ════════ 11 · STIMMEN ════════ */
.reviews-grid{ display:grid; grid-template-columns:1fr; gap:1.2rem; }
.review{ border:1px solid var(--line); background:linear-gradient(180deg,var(--earth-s),var(--dark));
  padding:clamp(1.8rem,3vw,2.4rem); position:relative; }
.review .qmark{ position:absolute; top:.8rem; right:1.5rem; font-family:var(--f-script); font-style:italic;
  font-size:3.6rem; color:var(--line-strong); line-height:1; }
.review blockquote p{ font-size:1.05rem; line-height:1.62; color:var(--text-lt); font-style:italic; text-wrap:pretty; }
.review figcaption{ margin-top:1.4rem; font-family:var(--f-display); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); }

/* ════════ 12 · FAQ ════════ */
.faq{ max-width:880px; margin-inline:auto; }
.faq-item{ border-bottom:1px solid var(--line); }
.faq-item:first-child{ border-top:1px solid var(--line); }
.faq-item h3{ margin:0; font-size:inherit; font-weight:inherit; line-height:inherit; }
.faq-q{ width:100%; text-align:left; background:none; border:0; cursor:pointer;
  padding:1.4rem 0; display:flex; align-items:center; gap:1.4rem; min-height:56px; }
.faq-q .qt{ flex:1; font-family:var(--f-display); font-size:clamp(1rem,1.9vw,1.3rem); color:var(--text-lt); line-height:1.35; transition:color var(--tr-s); }
.faq-q .qi{ flex-shrink:0; width:22px; height:22px; position:relative; }
.faq-q .qi::before,.faq-q .qi::after{ content:''; position:absolute; background:var(--gold-lt); transition:transform var(--tr-s); }
.faq-q .qi::before{ top:50%; left:0; width:100%; height:1px; transform:translateY(-50%); }
.faq-q .qi::after{ left:50%; top:0; width:1px; height:100%; transform:translateX(-50%); }
.faq-item.open .qi::after{ transform:translateX(-50%) scaleY(0); }
.faq-q:hover .qt{ color:var(--gold-glow); }
/* Antworten sind standardmäßig OFFEN: ohne JavaScript bleibt der komplette
   Inhalt lesbar. Erst das Skript klappt sie zu (Klasse .faq-js) und animiert
   danach über max-height — das funktioniert in jedem Browser, im Gegensatz zur
   Interpolation von grid-template-rows. */
.faq-a{ overflow:hidden; }
.faq-js .faq-a{ max-height:0; transition:max-height .45s cubic-bezier(.22,.61,.36,1); }
.faq-a-in{ color:var(--text); }
.faq-a-in > p{ margin-bottom:1rem; }
.faq-a-in > :last-child{ margin-bottom:1.8rem; }
.faq-a-in .note{ font-size:.92rem; color:var(--text-mute); font-style:italic; border-left:1px solid var(--line-strong); padding-left:1rem; }
.faq-a-in a{ color:var(--gold-lt); border-bottom:1px solid var(--line); }
.faq-a-in a:hover{ color:var(--gold-glow); }

/* ════════ 13 · ERSTGESPRÄCH & FORMULAR ════════ */
.booking{ background:linear-gradient(180deg,transparent,rgba(8,5,3,.6)); }
.booking-grid{ display:grid; grid-template-columns:1fr; gap:clamp(2.4rem,6vw,4.5rem); align-items:start; }
.booking-aside .sec-title{ margin-top:1.4rem; font-size:clamp(1.9rem,4.2vw,3rem); }
.booking-aside .b-note{ margin-top:1.6rem; color:var(--text-lt); }
.booking-aside .b-small{ font-size:.95rem; color:var(--text-mute); }
.b-contacts{ margin-top:2.2rem; display:flex; flex-direction:column; gap:1rem; }
.b-contacts a,.b-contacts .row{ display:flex; align-items:center; gap:1rem; color:var(--text-lt); min-height:44px; transition:color var(--tr-s); }
.b-contacts a:hover{ color:var(--gold-glow); }
.b-contacts .bsym{ width:40px; height:40px; border:1px solid var(--line-strong); display:grid; place-items:center; color:var(--gold-lt); font-size:.95rem; flex-shrink:0; }
.b-contacts .bx{ font-size:.95rem; }
.b-contacts .bx small{ display:block; font-family:var(--f-display); font-size:.54rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-mute); }

.booking-form{ border:1px solid var(--line); background:rgba(10,7,4,.5); padding:clamp(1.6rem,4vw,2.8rem); }
.field-row{ display:grid; grid-template-columns:1fr; gap:0; }
.field{ margin-bottom:1.2rem; }
.field label{ display:block; font-family:var(--f-display); font-size:.58rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-lt); margin-bottom:.55rem; }
.field label .req{ color:var(--gold); }
.field input,.field select,.field textarea{
  width:100%; background:rgba(6,4,2,.5); border:1px solid var(--line); color:var(--text-lt);
  padding:.8em 1em; min-height:48px; font-family:var(--f-body); font-size:1.05rem;
  transition:border-color var(--tr-s),background var(--tr-s);
}
.field textarea{ resize:vertical; min-height:120px; }
.field select{ appearance:none; cursor:pointer; padding-right:2.4em;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23d4a751' stroke-width='1.4' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 1em center; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-color:var(--gold); background:rgba(6,4,2,.8); }
.field input::placeholder,.field textarea::placeholder{ color:var(--text-faint); }
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{ border-color:#c96a4a; }
.field-err{ display:block; margin-top:.45rem; font-size:.88rem; color:#e79878; font-style:italic; }
.consent{ font-size:.86rem; color:var(--text-mute); line-height:1.5; margin:.4rem 0 1.5rem; }
.consent a{ color:var(--gold-lt); border-bottom:1px solid var(--line); }
.booking-form > .btn{ width:100%; }
.form-msg{ margin-top:1.2rem; font-size:.98rem; line-height:1.55; display:none; padding:1rem 1.2rem; border-left:2px solid var(--gold); background:rgba(179,133,42,.07); }
.form-msg.show{ display:block; }
.form-msg.err{ border-left-color:#c96a4a; background:rgba(201,106,74,.09); color:#f0c3ae; }
.form-msg.ok{ border-left-color:var(--sage); background:rgba(127,144,112,.1); color:var(--text-lt); }
.form-msg a{ color:var(--gold-glow); border-bottom:1px solid var(--line-strong); }

/* ════════ GIANT MARQUEE ════════ */
.giant{ overflow:hidden; border-block:1px solid var(--line); padding-block:clamp(1.2rem,2.6vw,2.2rem);
  background:linear-gradient(180deg, rgba(8,5,3,.55), rgba(8,5,3,.15)); }
.giant-track{ display:inline-flex; align-items:center; gap:2.4rem; white-space:nowrap; animation:scrollx 44s linear infinite; }
.giant:hover .giant-track{ animation-play-state:paused; }
.giant-track span{ font-family:var(--f-display); font-weight:600; font-size:clamp(2.2rem,8vw,7rem); line-height:1;
  text-transform:uppercase; letter-spacing:.03em; color:transparent; -webkit-text-stroke:1px rgba(212,167,81,.5); }
.giant-track .fill{ color:var(--gold-lt); -webkit-text-stroke:0; }
.giant-track .st{ color:var(--gold); -webkit-text-stroke:0; font-size:.42em; vertical-align:middle; }

/* ════════ 14 · FINALER CTA ════════ */
.contact{ text-align:center; padding-block:clamp(5rem,12vw,10rem); position:relative; overflow:hidden; }
.contact .seal-bg{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(560px,80vw); opacity:.05; pointer-events:none; color:var(--gold); }
.contact .ct-in{ position:relative; z-index:2; }
.contact h2{ font-size:clamp(1.9rem,5.2vw,3.6rem); line-height:1.18; margin-bottom:1.8rem; }
.contact h2 .gold{ color:var(--gold-lt); font-size:1.05em; display:inline-block; margin-top:.3em; }
.contact p{ max-width:46ch; margin:0 auto 2.4rem; color:var(--text-lt); font-size:1.14rem; }
.ct-actions{ display:flex; justify-content:center; }
.ct-alt{ margin-top:1.4rem; font-family:var(--f-display); font-size:.66rem; letter-spacing:.22em; text-transform:uppercase; color:var(--text-mute); display:flex; gap:.6rem; justify-content:center; align-items:center; }
.ct-alt a{ color:var(--gold-lt); padding:1em 1.2em; min-height:44px; display:inline-flex; align-items:center; }
.ct-alt a:hover{ color:var(--gold-glow); }

/* ════════ FOOTER ════════ */
footer{ border-top:1px solid var(--line); padding-block:clamp(3rem,6vw,4.5rem); }
.foot-grid{ display:grid; grid-template-columns:1fr; gap:2.4rem; align-items:start; }
.foot-brand .seal{ width:38px; margin-bottom:1.1rem; opacity:.9; color:var(--gold-lt); }
.foot-brand .fname{ font-family:var(--f-display); font-size:.95rem; font-weight:600; letter-spacing:.28em; text-transform:uppercase; color:var(--text-lt); }
.foot-brand .fsub{ font-family:var(--f-script); font-style:italic; color:var(--gold-lt); margin-top:.3rem; }
.foot-brand .ftag{ margin-top:.9rem; font-family:var(--f-display); font-size:.56rem; letter-spacing:.28em; text-transform:uppercase; color:var(--text-mute); }
.foot-brand > p:last-child{ margin-top:1rem; font-size:.94rem; color:var(--text-mute); max-width:38ch; }
.foot-col h2{ font-family:var(--f-display); font-size:.58rem; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-lt); margin-bottom:1.1rem; }
.foot-col a,.foot-col p{ display:block; font-size:.94rem; color:var(--text-mute); transition:color var(--tr-s); }
.foot-col a{ min-height:44px; display:flex; align-items:center; }
.foot-col p{ margin-bottom:.55rem; }
.foot-col a:hover{ color:var(--gold-glow); }
.foot-px p{ max-width:34ch; }
.px-link{ margin-top:.6rem; color:var(--gold-lt) !important; font-family:var(--f-display); font-size:.62rem !important;
  letter-spacing:.18em; text-transform:uppercase; }
.foot-bottom{ margin-top:clamp(2.4rem,5vw,3.5rem); padding-top:1rem; border-top:1px solid var(--line-soft);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:.4rem 1rem; font-size:.82rem; color:var(--text-faint); align-items:center; }
.foot-bottom a{ color:var(--text-mute); display:inline-flex; align-items:center; min-height:44px; padding-inline:.2em; }
.foot-bottom a:hover{ color:var(--gold-lt); }

/* ════════ STICKY CTA (mobil) ════════ */
.sticky-cta{
  position:fixed; left:0; right:0; bottom:0; z-index:580;
  padding:.7rem var(--pad); padding-bottom:calc(.7rem + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg, rgba(8,5,3,0), rgba(8,5,3,.97) 42%);
  transform:translateY(130%); transition:transform .4s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.sticky-cta[hidden]{ display:none; }
.sticky-cta.show{ transform:none; pointer-events:auto; }
.sticky-cta .btn{ width:100%; padding:1.05em 1rem; font-size:.68rem; letter-spacing:.16em; }

/* ════════ REVEAL ════════ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s cubic-bezier(.22,.61,.36,1),transform .9s cubic-bezier(.22,.61,.36,1); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; } .reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; } .reveal.d4{ transition-delay:.32s; }

/* Wortweiser Einlauf für Section-Titel */
.rw{ display:inline-block; overflow:hidden; vertical-align:top; }
.ri{ display:inline-block; transform:translateY(115%); transition:transform .85s cubic-bezier(.22,.61,.36,1); }
.in .ri,.reveal.in .ri{ transform:translateY(0); }

/* ════════ LEGAL PAGES ════════ */
.legal{ padding-block:clamp(7rem,12vw,11rem); max-width:820px; }
.legal h1{ font-size:clamp(2.1rem,5vw,3.2rem); margin-bottom:1rem; }
.legal .stand{ font-family:var(--f-display); font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-mute); margin-bottom:3rem; }
.legal h2{ font-size:1.45rem; color:var(--gold-lt); margin:2.5rem 0 1rem; }
.legal p,.legal li{ margin-bottom:1rem; color:var(--text); }
.legal ul{ padding-left:1.4rem; list-style:disc; }
.legal a{ color:var(--gold-lt); border-bottom:1px solid var(--line); }
.legal a:hover{ color:var(--gold-glow); }
.legal .back{ font-family:var(--f-display); font-size:.62rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-lt); display:inline-flex; gap:.6rem; margin-bottom:2.5rem; border:0; padding-block:.6rem; }
.legal strong{ color:var(--text-lt); }

/* ════════════════════════════════════════════════════════════════
   RESPONSIVE — mobile first, ab hier wird aufgebaut
   ──────────────────────────────────────────────────────────────── */
@media(min-width:400px){
  .creds{ grid-template-columns:1fr 1fr; }
}
@media(min-width:560px){
  .field-row{ grid-template-columns:1fr 1fr; gap:1.2rem; }
  .creds{ grid-template-columns:repeat(4,1fr); }
  .fmt-grid{ grid-template-columns:repeat(2,1fr); }
  .price-grid{ grid-template-columns:repeat(2,1fr); }
  .approach-list{ grid-template-columns:repeat(2,1fr); }
}
@media(min-width:821px){
  .nav-links{ display:flex; }
  .burger{ display:none !important; }
  .mobile-menu{ display:none !important; }
  .hero{ padding-top:clamp(110px,13vh,150px); }
  .places-grid{ grid-template-columns:repeat(2,1fr); }
  .fmt-feature{ grid-template-columns:repeat(2,1fr); }
  .reviews-grid{ grid-template-columns:repeat(2,1fr); }
  .pkg-grid{ grid-template-columns:repeat(3,1fr); }
  .ways{ grid-template-columns:repeat(3,1fr); }
  .price-grid{ grid-template-columns:repeat(3,1fr); }
  .fmt-grid{ grid-template-columns:repeat(3,1fr); }
  .approach-list{ grid-template-columns:repeat(3,1fr); }
  .group-box{ grid-template-columns:1fr auto; gap:2rem; }
  .foot-grid{ grid-template-columns:1.3fr 1fr 1fr 1.1fr; gap:2.5rem; }
  .work-grid{ grid-template-columns:1.1fr .9fr; }
  .about-grid{ grid-template-columns:.85fr 1.15fr; }
  .about-figure{ margin-inline:0; position:sticky; top:110px; }
  .booking-grid{ grid-template-columns:.9fr 1.1fr; }
  .sound-list{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:820px){
  .nav-links{ display:none; }      /* Desktop-Navigation aus: unterhalb 821px übernimmt das Burger-Menü */
  .burger{ display:flex; }

  /* Ohne JavaScript gibt es kein Burger-Menü — dann bleibt die Navigation
     als umbrechende Liste stehen, statt ganz zu verschwinden. */
  html:not(.js) .burger{ display:none; }
  html:not(.js) nav#nav{ flex-wrap:wrap; row-gap:.6rem; }
  html:not(.js) .nav-links{ display:flex; flex-wrap:wrap; gap:.4rem 1.1rem; width:100%; }
  html:not(.js) .nav-links a{ font-size:.6rem; }
  html:not(.js) .nav-cta{ margin-left:0; }
  .scroll-cue{ display:none; }
  .sound-toggle{ display:none; }   /* macht unten Platz für den Sticky-CTA */
  .sec{ padding-block:clamp(3.6rem,9vw,6rem); }
}
@media(min-width:1100px){
  .hero-inner{ grid-template-columns:1.3fr .7fr; align-items:center; }
  .hero-portrait{ display:block; }
  .hero h1{ font-size:clamp(2.4rem,3.5vw,3.4rem); }
}

/* ════════════════════════════════════════════════════════════════
   ATMOSPHÄRE — Effekte, die nie die Lesbarkeit beeinträchtigen
   ──────────────────────────────────────────────────────────────── */

/* ── PRELOADER: kurzer Markenmoment, keine erzwungene Wartezeit ── */
.preloader{
  position:fixed; inset:0; z-index:10000;
  background:radial-gradient(circle at 50% 46%, #1a1107 0%, #0a0603 58%, #050302 100%);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1.6rem;
  transition:opacity .5s ease, visibility .5s ease;
  animation:preEnd .5s 1.2s forwards;   /* Sicherheitsnetz ohne JavaScript */
}
@keyframes preEnd{ to{ opacity:0; visibility:hidden; } }
.preloader.done{ opacity:0; visibility:hidden; pointer-events:none; }
.pre-stage{ position:relative; width:120px; height:120px; display:grid; place-items:center; }
.pre-ring{ position:absolute; width:120px; height:120px; color:var(--gold-lt); transform:rotate(-90deg); }
.pre-ring circle{ stroke-dasharray:339; stroke-dashoffset:339; animation:ringdraw 1s cubic-bezier(.7,0,.3,1) forwards; }
@keyframes ringdraw{ to{ stroke-dashoffset:0; } }
.pre-seal{ position:relative; width:52px; height:52px; color:var(--gold-glow); opacity:0; transform:scale(.6);
  animation:sealin .7s .15s cubic-bezier(.22,.61,.36,1) forwards;
  filter:drop-shadow(0 0 12px rgba(232,192,108,.5)); }
@keyframes sealin{ to{ opacity:1; transform:scale(1); } }
.pre-word{ font-family:var(--f-script); font-style:italic; font-size:1.5rem; letter-spacing:.06em; color:var(--text-lt);
  opacity:0; animation:wordin .6s .3s ease forwards; }
@keyframes wordin{ to{ opacity:1; } }

/* ── CURSOR-AURA · der System-Cursor bleibt immer sichtbar ── */
.cursor-ring{ position:fixed; top:0; left:0; width:34px; height:34px; border-radius:50%;
  border:1px solid rgba(212,167,81,.45); pointer-events:none; z-index:9999;
  transform:translate(-50%,-50%); mix-blend-mode:screen; opacity:0;
  transition:width .28s ease,height .28s ease,background .28s ease,border-color .28s ease,opacity .4s ease; }
.cursor-ring.hot{ width:58px; height:58px; border-color:var(--gold-glow); background:rgba(212,167,81,.06); }
body.cursor-on.ready .cursor-ring{ opacity:1; }
@media (hover:none),(pointer:coarse){ .cursor-ring{ display:none !important; } }

/* ── GLUT ── */
.embers{ position:fixed; inset:0; z-index:6; pointer-events:none; }

/* ── LESEFORTSCHRITT ── */
.progress{ position:fixed; top:0; right:0; width:2px; height:100dvh; z-index:560; background:rgba(179,133,42,.10); }
.progress .bar{ position:absolute; top:0; left:0; width:100%; height:0;
  background:linear-gradient(var(--gold-glow),var(--gold)); box-shadow:0 0 14px rgba(232,192,108,.5); }

/* ── HERO-AURA + MANDALA ── */
.hero-aura{ position:absolute; z-index:1; left:50%; top:48%; width:120vmax; height:120vmax; pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle, rgba(184,137,42,.14) 0%, rgba(184,137,42,.04) 30%, transparent 55%);
  animation:breathe 10s ease-in-out infinite; }
@keyframes breathe{ 0%,100%{ opacity:.4; transform:translate(-50%,-50%) scale(.96); } 50%{ opacity:.8; transform:translate(-50%,-50%) scale(1.05); } }
.hero-mandala{ position:absolute; z-index:1; left:50%; top:50%; width:min(84vh,820px); aspect-ratio:1; pointer-events:none;
  color:var(--gold); opacity:var(--mo,.1);
  transform:translate(calc(-50% + var(--px,0px)), calc(-50% + var(--py,0px))) scale(var(--ms,1));
  transition:transform .5s cubic-bezier(.22,.61,.36,1); }
.hero-mandala svg{ width:100%; height:100%; animation:spin 140s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* ── NEBEL ── */
.fog{ position:absolute; z-index:1; pointer-events:none; border-radius:50%; filter:blur(64px); mix-blend-mode:screen; }
.fog.f1{ width:60vw; height:42vh; left:-10vw; bottom:6vh; background:radial-gradient(circle, rgba(184,137,42,.34), transparent 70%); animation:drift1 30s ease-in-out infinite; }
.fog.f2{ width:52vw; height:38vh; right:-8vw; top:16vh; background:radial-gradient(circle, rgba(120,150,110,.2), transparent 70%); animation:drift2 36s ease-in-out infinite; }
@keyframes drift1{ 0%,100%{ transform:translate(0,0) scale(1); opacity:.45; } 50%{ transform:translate(9vw,-5vh) scale(1.1); opacity:.8; } }
@keyframes drift2{ 0%,100%{ transform:translate(0,0) scale(1); opacity:.35; } 50%{ transform:translate(-7vw,6vh) scale(1.08); opacity:.65; } }

/* ── KLANG-SCHALTER ── */
.sound-toggle{ position:fixed; left:1.3rem; bottom:1.3rem; z-index:560; display:inline-flex; align-items:center; gap:.7rem;
  padding:.8rem 1.1rem; min-height:44px; background:var(--glass); backdrop-filter:blur(12px); border:1px solid var(--line-strong);
  font-family:var(--f-display); font-size:.56rem; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--gold-lt);
  cursor:pointer; transition:color var(--tr-s),border-color var(--tr-s); }
.sound-toggle:hover{ border-color:var(--gold); color:var(--gold-glow); }
.sound-toggle .ico{ position:relative; width:13px; height:13px; display:inline-grid; place-items:center; flex-shrink:0; }
.sound-toggle .ico::before{ content:''; width:6px; height:6px; border-radius:50%; background:var(--gold-lt); transition:.3s; }
.sound-toggle.on .ico::before{ background:var(--gold-glow); box-shadow:0 0 10px 2px rgba(232,192,108,.8); }
.sound-toggle.on .ico::after{ content:''; position:absolute; inset:-3px; border:1px solid var(--gold-glow); border-radius:50%; opacity:.6; animation:sonar 1.9s ease-out infinite; }
@keyframes sonar{ 0%{ transform:scale(.55); opacity:.7; } 100%{ transform:scale(1.7); opacity:0; } }

/* ── Karten-Lichtpunkt (nur Desktop, per JS gesetzt) ── */
.tiltable{ transition:transform .4s cubic-bezier(.22,.61,.36,1), box-shadow .4s ease; }
.tiltable.lift{ box-shadow:0 26px 60px -34px rgba(0,0,0,.85), 0 0 36px -22px rgba(212,167,81,.5); }
.card-glow{ position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .35s ease; z-index:4;
  mix-blend-mode:screen;
  background:radial-gradient(200px circle at var(--gx,50%) var(--gy,50%), rgba(232,192,108,.14), transparent 62%); }

/* ── Bild-Parallax über object-position (kein Transform-Konflikt) ── */
.fcard img,.place img,.about-figure img,.work-figure img{ will-change:object-position; }

/* ════════ REDUCED MOTION ════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  .reveal{ opacity:1 !important; transform:none !important; }
  .ri{ transform:none !important; }
  .hero-bg img{ animation:none; transform:scale(1.04); }
  .preloader{ display:none !important; }
  .hero-mandala,.hero-aura,.embers,.cursor-ring,.fog{ display:none !important; }
  .faq-js .faq-a{ transition:none; }
}