/* =====================================================================
   HAPPY SOUL SPACE — Feel · Heal · Live
   Achtsame energetische Körperarbeit · Bonn · Betreiberin: Julia
   Schwester-Seite zu atelier-femme — beide teilen sich EINEN Salon.
   Palette & mood aus dem echten Interieur + dem Logo abgeleitet:
   signature lime (#A4C736) · moss/forest green · warm cream ·
   sage walls · slate-blue FLUTED counter · walnut floor · brass/gold
   (mirror, bees, vases) · crystal-chandelier sparkle · amaryllis blush
   Leitmotiv: die PULS-LINIE (Sonne → Herz → Herzschlag) aus dem Logo.
   ===================================================================== */

:root{
  /* signature green */
  --lime:#A4C736;
  --lime-soft:#B4D05C;
  --lime-ink:#4E7A24;          /* lesbarer Mooston für Schrift auf hellen Flächen */
  --moss:#4E7A24;
  --moss-deep:#355417;
  --forest:#1B2712;            /* dark sections / footer */
  --forest-2:#233317;

  /* warm fields (interior cream walls) */
  --cream:#F5F7EE;
  --cream-2:#FBFCF5;
  --paper:#FFFFFF;

  /* interior bridge tones (shared salon) */
  --sage-pale:#E6EBDB;
  --sage:#A8B29A;
  --sage-deep:#5C6A51;
  --slate:#6E7890;             /* the fluted counter */
  --slate-deep:#4C567A;
  --walnut:#6A4327;
  --blush:#E8836F;             /* amaryllis accent, used sparingly */

  /* gold (mirror, bees, vases) — also the bridge to atelier-femme */
  --gold-hi:#EBD199;
  --gold:#C79A52;
  --gold-mid:#B0813B;
  --gold-deep:#8A6531;
  --gold-ink:#6E5026;
  --gold-line:rgba(176,133,66,.5);

  /* ink */
  --ink:#20261A;
  --ink-2:#454B3B;
  --ink-soft:#5E6853;
  --line:rgba(40,50,26,.15);
  --line-2:rgba(40,50,26,.08);

  /* on dark */
  --on-dark:#EEF3E4;
  --on-dark-soft:#AFB89C;
  --line-dark:rgba(255,255,255,.14);

  /* gradients — anchored on the true brand green #A4C736 */
  --lime-grad:linear-gradient(118deg,#BFD670 0%,#A4C736 44%,#83A315 100%);
  --lime-grad-soft:linear-gradient(118deg,#A4C736 0%,#6F8E1A 100%);
  --brand-grad:linear-gradient(158deg,#B4D05C 0%,#A4C736 46%,#83A315 100%);   /* the logo card, faithful */
  --brand-radial:radial-gradient(circle at 50% 60%,#C3D87B 0%,#A4C736 46%,#6F8E1A 100%);
  --leaf-grad:linear-gradient(150deg,#5C8F2A 0%,#2C4417 100%);                /* deep foil, for contrast surfaces */
  --sun-glow:radial-gradient(circle,rgba(164,199,54,.30) 0%,rgba(199,154,82,.13) 42%,transparent 68%);

  --maxw:1240px;
  --gutter:clamp(20px,5vw,68px);
  --r:4px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --ease-soft:cubic-bezier(.4,0,.2,1);
  --serif:"Cormorant Garamond",Georgia,serif;
  --caps:"Cinzel",Georgia,serif;
  --sans:"Jost","Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
body{
  margin:0;font-family:var(--sans);font-weight:300;color:var(--ink);
  background:var(--cream);line-height:1.72;letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--moss);color:#fff}

/* fine film grain, keeps large flat greens from feeling digital */
body::after{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:clamp(74px,12vw,150px);position:relative}
.section--lead{padding-top:clamp(94px,8vw,110px)}
.section--lead .split{align-items:start}
.section--lead .circle-media{margin-top:clamp(24px,2.8vw,32px)}
.bg-cream{background:var(--cream)}
.bg-paper{background:var(--cream-2)}
.bg-sage{background:var(--sage-pale)}
.bg-mist{background:linear-gradient(180deg,var(--cream) 0%,var(--sage-pale) 100%)}
.section--dark{background:var(--forest);color:var(--on-dark)}
.section--dark p{color:var(--on-dark-soft)}
.section--dark .eyebrow{color:var(--lime)}
.section--dark .eyebrow::before,.section--dark .eyebrow::after{background:rgba(164,199,54,.5)}

/* ---------- type ---------- */
.eyebrow{
  font-family:var(--caps);font-size:clamp(11px,1vw,13px);letter-spacing:.42em;text-transform:uppercase;
  color:var(--moss);font-weight:500;margin:0 0 22px;display:inline-flex;align-items:center;gap:14px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--lime-ink)}
.eyebrow--center{justify-content:center}
.eyebrow--center::after{content:"";width:34px;height:1px;background:var(--lime-ink)}

h1,h2,h3{font-weight:400;margin:0;line-height:1.08;letter-spacing:.005em}
.h-display{font-family:var(--serif);font-size:clamp(2.6rem,7vw,5.3rem);font-weight:300;line-height:1.02}
.h-section{font-family:var(--serif);font-weight:300;font-size:clamp(2.15rem,4.8vw,3.7rem);line-height:1.04}
.h-section em{font-style:italic;color:var(--moss)}
.section--dark .h-section em{color:var(--lime)}
.lead{font-family:var(--serif);font-weight:300;font-size:clamp(1.25rem,2.2vw,1.7rem);line-height:1.5;color:var(--ink-2)}
.section--dark .lead{color:var(--on-dark)}
p{margin:0 0 1.1em;max-width:62ch;color:var(--ink-2)}
.muted{color:var(--ink-soft)}
.lime-text{background:var(--lime-grad-soft);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.section--dark .lime-text,.footer .lime-text{background:var(--lime-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.script{font-family:var(--serif);font-style:italic;font-weight:300}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- buttons ---------- */
.btn{
  --pad:16px 34px;display:inline-flex;align-items:center;gap:12px;
  font-family:var(--caps);font-size:12px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;
  padding:var(--pad);border-radius:40px;position:relative;overflow:hidden;
  transition:color .5s var(--ease),background .5s var(--ease),border-color .5s var(--ease),transform .3s var(--ease),box-shadow .5s var(--ease);
  will-change:transform;
}
.btn .txt{position:relative;z-index:2}
.btn svg{position:relative;z-index:2;width:15px;height:15px}
/* .btn-primary: der Name, den der Renderer fuer den Termin-Knopf im Menue (nav.menue) erzeugt — hier dieselbe Limette. */
.btn-lime,.btn-primary{color:var(--forest);background:var(--lime);border:1px solid var(--lime);box-shadow:0 14px 34px -14px rgba(111,191,34,.7)}
.btn-lime::before,.btn-primary::before{content:"";position:absolute;inset:0;z-index:1;background:var(--lime-grad);opacity:0;transition:opacity .5s var(--ease)}
.btn-lime:hover,.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 42px -14px rgba(111,191,34,.8)}
.btn-lime:hover::before,.btn-primary:hover::before{opacity:1}
.btn-moss{color:#fff;background:var(--moss);border:1px solid var(--moss);box-shadow:0 12px 30px -14px rgba(53,84,23,.7)}
.btn-moss::before{content:"";position:absolute;inset:0;z-index:1;background:var(--forest);opacity:0;transition:opacity .5s var(--ease)}
.btn-moss:hover{transform:translateY(-2px)}
.btn-moss:hover::before{opacity:1}
.btn-ghost{color:var(--ink);background:transparent;border:1px solid var(--line)}
.btn-ghost::before{content:"";position:absolute;inset:0;z-index:1;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.btn-ghost:hover{color:var(--cream-2);border-color:var(--ink)}
.btn-ghost:hover::before{transform:scaleX(1)}
.section--dark .btn-ghost{color:var(--on-dark);border-color:var(--line-dark)}
.section--dark .btn-ghost::before{background:var(--on-dark)}
.section--dark .btn-ghost:hover{color:var(--forest)}
/* gold ghost = the atelier-femme bridge inside the partner block */
.btn-gold{color:var(--gold-ink);background:transparent;border:1px solid var(--gold-line,rgba(176,133,66,.5))}
.btn-gold::before{content:"";position:absolute;inset:0;z-index:1;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.btn-gold:hover{color:#fff;border-color:var(--gold)}
.btn-gold:hover::before{transform:scaleX(1)}

/* ---------- pulse device (sun · heart · heartbeat) ---------- */
.pulse{color:var(--lime-ink)}
.pulse path,.pulse line,.pulse rect,.pulse g{fill:currentColor;stroke:none}
.pulse--watermark{position:absolute;pointer-events:none;color:var(--lime);opacity:.07}

/* =====================================================================
   PRELOADER — draws the pulse line, then the wordmark rises
   ===================================================================== */
.loader{position:fixed;inset:0;z-index:10000;background:var(--cream);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:26px;transition:opacity .9s var(--ease),visibility .9s}
.loader__pulse{width:min(340px,72vw);height:auto;color:var(--lime-ink)}
.loader__pulse{opacity:0;transform:scale(.96);animation:fadeUp 1s var(--ease-soft) .15s forwards}
.loader__word{font-family:var(--sans);font-weight:300;letter-spacing:.34em;font-size:clamp(15px,3vw,19px);text-transform:lowercase;color:var(--ink);opacity:0;transform:translateY(8px);animation:fadeUp .8s var(--ease) 1s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fadeUp{to{opacity:1;transform:none}}
body.loaded .loader{opacity:0;visibility:hidden}
body:not(.loaded){overflow:hidden}
/* handoff arrival: skip the preloader entirely (the crossover curtain covers instead) */
body.handoff-in .loader{display:none}

/* =====================================================================
   NAV
   ===================================================================== */
.nav{position:fixed;top:0;left:0;right:0;z-index:900;display:flex;align-items:center;justify-content:space-between;
  padding:20px var(--gutter);transition:padding .5s var(--ease),background .5s var(--ease),box-shadow .5s var(--ease),border-color .5s;border-bottom:1px solid transparent}
.nav.scrolled{padding-block:12px;background:rgba(245,247,238,.86);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border-bottom:1px solid var(--line-2)}
.nav__brand{display:flex;align-items:center;gap:12px}
.nav__brand .brandmark{width:34px;height:auto;color:var(--lime-ink);flex:none}
.nav__brand .brandname{font-family:var(--sans);font-weight:400;letter-spacing:.22em;font-size:clamp(13px,1.4vw,16px);text-transform:lowercase;color:var(--ink);line-height:1}
.nav__brand .brandname small{display:block;font-family:var(--sans);font-size:.6em;letter-spacing:.2em;color:var(--moss);margin-top:5px;text-transform:uppercase;font-weight:400}
.nav__links{display:flex;align-items:center;gap:clamp(18px,2.4vw,38px)}
.nav__links a{font-family:var(--caps);font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2);position:relative;padding-block:6px;transition:color .35s var(--ease)}
.nav__links a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;background:var(--lime-grad-soft);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.nav__links a:hover{color:var(--ink)}
.nav__links a:hover::after{transform:scaleX(1);transform-origin:left}
.nav__end{display:flex;align-items:center;gap:clamp(8px,1.3vw,16px)}
.nav__cta .btn{--pad:11px 24px;font-size:11px}
.nav__burger{display:none;width:34px;height:34px;position:relative;z-index:960}
.nav__burger span{position:absolute;left:5px;right:5px;height:1.5px;background:var(--ink);transition:transform .4s var(--ease),opacity .3s var(--ease)}
.nav__burger span:nth-child(1){top:11px}.nav__burger span:nth-child(2){top:17px}.nav__burger span:nth-child(3){top:23px}
body.menu-open .nav__burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .nav__burger span:nth-child(2){opacity:0}
body.menu-open .nav__burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:940;background:var(--sage-pale);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;opacity:0;visibility:hidden;transform:translateY(-12px);transition:opacity .5s var(--ease),visibility .5s,transform .6s var(--ease)}
body.menu-open{overflow:hidden}
/* Offenes Menü: die Kopfzeile bleibt über der Menüfläche — so ist das Kreuz antippbar. */
body.menu-open .nav{z-index:950}
/* Der Wisch im Menü bleibt im Menü: kein Weiterreichen an die Seite darunter (iOS). */
.drawer{overscroll-behavior:contain;padding-top:104px}
body.menu-open main,body.menu-open footer{touch-action:none;pointer-events:none}
body.menu-open .drawer{opacity:1;visibility:visible;transform:none}
.drawer a{font-family:var(--serif);font-size:clamp(2rem,9vw,3rem);font-weight:300;color:var(--ink);padding:5px 0}
.drawer a em{font-style:italic;color:var(--moss)}
.drawer .btn{margin-top:34px;font-size:13px;letter-spacing:.2em;justify-content:center;text-align:center;padding:19px 40px;width:min(300px,84vw);white-space:nowrap}

/* =====================================================================
   HERO — rising sun, floating logo disc, chandelier sparkle
   ===================================================================== */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:96px var(--gutter) 58px;overflow:hidden}
/* the shared fluted counter — a soft slate base at the hero foot */
.hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:130px;z-index:1;pointer-events:none;-webkit-mask:linear-gradient(180deg,transparent,#000 72%);mask:linear-gradient(180deg,transparent,#000 72%);background:repeating-linear-gradient(90deg,#c3c8d6 0,#dfe2ea 7px,#b3bacd 14px,#dfe2ea 21px);opacity:.45}
.hero__bg{position:absolute;inset:0;z-index:0;background:radial-gradient(122% 92% at 50% 12%,var(--cream-2) 0%,var(--cream) 46%,var(--sage-pale) 100%)}
/* the rising sun behind the mark */
.hero__sun{position:absolute;left:50%;top:40%;width:min(86vw,820px);aspect-ratio:1;transform:translate(-50%,-50%);z-index:0;pointer-events:none;background:var(--sun-glow);filter:blur(3px);animation:breathe 7.5s var(--ease-soft) infinite}
@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.9}50%{transform:translate(-50%,-50%) scale(1.1);opacity:1}}
.hero__spark{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero__spark i{position:absolute;width:4px;height:4px;border-radius:50%;background:radial-gradient(circle,#fff,rgba(199,154,82,.6) 60%,transparent);box-shadow:0 0 8px rgba(255,251,230,.9);opacity:0;animation:twinkle 4.6s ease-in-out infinite}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:.9;transform:scale(1)}}

/* the real happy soul space logo = a landscape rounded card (like the original), NOT a circle */
.disc{position:relative;z-index:2;width:clamp(300px,44vw,520px);aspect-ratio:1.82/1;perspective:1200px;margin-bottom:0;will-change:transform,opacity;-webkit-backface-visibility:hidden;backface-visibility:hidden}
/* WOW-Auftritt: #A4C736-Glow blüht hinter der Karte auf */
.disc::before{content:"";position:absolute;inset:-16%;z-index:-1;border-radius:40px;pointer-events:none;background:radial-gradient(closest-side,rgba(164,199,54,.5),rgba(199,154,82,.14) 55%,transparent 78%);opacity:0;filter:blur(8px)}
body.loaded .disc::before{animation:discGlow 2.6s var(--ease) .35s both}
.disc__inner{position:relative;width:100%;height:100%;border-radius:clamp(22px,3vw,34px);transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform;transition:transform .3s var(--ease-soft);
  background:#A4C736;
  box-shadow:0 46px 92px -34px rgba(70,110,20,.5),0 10px 26px -14px rgba(40,60,15,.3),inset 0 0 0 1px rgba(255,255,255,.22);
  display:grid;place-items:center}
body:not(.loaded) .disc{opacity:0}
/* Auftritt auf dem ÄUSSEREN Element, Schweben auf dem INNEREN — sonst streiten sie in Safari um transform (Vibrieren) */
body.loaded .disc{animation:heroDiscIn 1.5s var(--ease) .35s both}
body.loaded .disc__inner{animation:float 6.8s var(--ease-soft) 2s infinite}
.disc__lock{display:flex;flex-direction:column;align-items:center;gap:clamp(10px,1.8vw,18px);width:70%}
.disc__mark{width:100%;height:auto;color:#fff}
/* die Puls-Linie zeichnet sich beim Auftritt selbst (Herzschlag erwacht) */
.disc__mark{opacity:0;transform:scale(.94)}
body.loaded .disc__mark{animation:fadeUp 1s var(--ease-soft) .5s forwards}
.disc__word,.disc__tag{opacity:0;transform:translateY(8px)}
body.loaded .disc__word{text-align:center;animation:fadeUp .7s var(--ease) 1.15s forwards}
body.loaded .disc__tag{animation:fadeUp .7s var(--ease) 1.3s forwards}
.disc__word{text-align:center;font-family:var(--sans);font-weight:500;letter-spacing:.14em;font-size:clamp(17px,3.2vw,30px);color:#fff;text-transform:lowercase;line-height:1;text-shadow:0 1px 4px rgba(26,52,6,.28)}
.disc__tag{font-family:var(--sans);font-weight:500;letter-spacing:.2em;font-size:clamp(11px,1.7vw,15px);text-transform:uppercase;color:#fff;display:flex;gap:.7em;text-shadow:0 1px 3px rgba(26,52,6,.26)}
@keyframes float{0%,100%{transform:translateY(0) rotateZ(0)}50%{transform:translateY(-14px) rotateZ(.4deg)}}
@keyframes heroDiscIn{0%{opacity:0;transform:translateX(72px) scale(.9) rotate(2.2deg)}55%{opacity:1;transform:translateX(0) scale(1.05) rotate(0)}100%{opacity:1;transform:none}}
@keyframes discGlow{0%{opacity:0;transform:scale(.7)}45%{opacity:1;transform:scale(1.06)}100%{opacity:.5;transform:scale(1)}}

/* two-column hero: text left, logo right (Gesicht/Botschaft gewinnt den linken Platz) */
.hero__inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(30px,5vw,74px);align-items:center}
.hero__text{text-align:left}
.hero__logo{display:flex;justify-content:center;align-items:center}
.hero__eyebrow{opacity:0;animation:fadeUp .9s var(--ease) 1.1s forwards}
.hero__title{position:relative;z-index:2;font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,5.4vw,4.4rem);line-height:1.04;letter-spacing:.01em;margin:0;max-width:15ch;opacity:0;animation:fadeUp 1s var(--ease) 1.25s forwards}
.hero__title em,.hero__title .lime-text{font-style:italic}
.hero__sub{position:relative;z-index:2;margin:26px 0 0;max-width:46ch;font-size:clamp(15px,1.4vw,18px);color:var(--ink-2);opacity:0;animation:fadeUp 1s var(--ease) 1.45s forwards}
.hero__actions{position:relative;z-index:2;margin-top:40px;display:flex;flex-wrap:wrap;gap:16px;opacity:0;animation:fadeUp 1s var(--ease) 1.65s forwards}
.hero__actions .btn{justify-content:center;white-space:nowrap}
@media(max-width:860px){
  .hero__inner{grid-template-columns:1fr;gap:clamp(26px,6vw,42px);text-align:center;max-width:520px}
  .hero__logo{order:-1}
  .hero__text{text-align:center}
  .hero__title,.hero__sub{margin-inline:auto}
  .hero__actions{justify-content:center}
}
.hero__scroll{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--caps);font-size:10px;letter-spacing:.36em;text-transform:uppercase;color:var(--ink-soft);opacity:0;animation:fadeUp 1s var(--ease) 2s forwards}
.hero__scroll .line{width:1px;height:46px;background:linear-gradient(var(--lime-ink),transparent);position:relative;overflow:hidden}
.hero__scroll .line::after{content:"";position:absolute;top:-46px;left:0;width:1px;height:46px;background:linear-gradient(transparent,var(--lime-ink));animation:scrolldot 2.2s var(--ease-soft) infinite}
@keyframes scrolldot{0%{transform:translateY(0)}60%,100%{transform:translateY(92px)}}

/* =====================================================================
   REVEAL
   ===================================================================== */
[data-reveal]{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal="right"]{transform:translateX(40px)}
[data-reveal="left"]{transform:translateX(-40px)}
[data-reveal].in{transform:none}
[data-delay="1"]{transition-delay:.1s}[data-delay="2"]{transition-delay:.2s}[data-delay="3"]{transition-delay:.3s}[data-delay="4"]{transition-delay:.4s}[data-delay="5"]{transition-delay:.5s}[data-delay="6"]{transition-delay:.6s}

/* =====================================================================
   KINETIC MARQUEE — feel · heal · live
   ===================================================================== */
.marquee{overflow:hidden;border-block:1px solid var(--line);padding-block:24px;background:var(--moss);color:var(--on-dark)}
.marquee__track{display:flex;gap:0;width:max-content;animation:scrollx 32s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee span{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,3vw,2.4rem);white-space:nowrap;display:inline-flex;align-items:center;color:var(--on-dark)}
.marquee .dot{display:inline-flex;width:clamp(26px,4vw,46px);justify-content:center;color:var(--lime)}
.marquee .pulse{width:26px;height:auto;color:var(--lime)}
@keyframes scrollx{to{transform:translateX(-50%)}}

/* =====================================================================
   AKTIONEN — Karten und Bänder unter dem Titelbild, Glieder im Laufband.
   Der Aufbau folgt der Art (Veranstaltung mit Datumsfeld, Angebot mit
   Preis, Hinweis als schmales Band), die Formatvorlage gibt den Ton.
   Töne dieses Hauses, von hell nach dunkel: Papier mit Moos · Salbei
   hell mit tiefem Moos · Forest mit Limette. Alle drei sind Flächen,
   die diese Seite ohnehin trägt. Moos als ganze Kartenfläche und der
   Markenverlauf standen hier einmal: Beide kommen sonst nirgends
   großflächig vor, und die dunkle Fläche dieses Hauses ist Forest —
   Fußbereich und dunkle Abschnitte. Limette bleibt Akzent, wofür sie
   gedacht ist.
   ===================================================================== */
[data-aktion="hinweis"]:empty{display:none}
.marquee .marquee__aktion{font-style:normal;font-weight:500;color:var(--lime)}
.aktion--hell{--fl:var(--paper);--ti:var(--ink);--tx:var(--ink-2);--az:var(--moss);--auf:#fff;border:1px solid var(--line)}
.aktion--akzent{--fl:var(--sage-pale);--ti:var(--ink);--tx:var(--ink-2);--az:var(--moss-deep);--auf:var(--on-dark)}
.aktion--dunkel{--fl:var(--forest);--ti:var(--on-dark);--tx:var(--on-dark-soft);--az:var(--lime);--auf:var(--forest)}
/* Weiter oben steht „p{color:var(--ink-2)}" für die ganze Seite. Eine
   geerbte Farbe verliert gegen jede direkt gesetzte, also trug auch der
   Absatz in einer dunklen Karte die dunkle Schrift der hellen Seite —
   Kontrast 1,8 zu 1, praktisch unlesbar. Jeder Ton bringt darum seinen
   eigenen Fließtextton mit. */
.aktion p,.aktion__zeit,.aktion__inhalt,.aktion__fakten,
.aktion__statt,.aktion__leistung{color:var(--tx)}
.aktionen{background:var(--cream)}
.aktionen__reihe{display:grid;gap:clamp(14px,2vw,22px);padding-block:clamp(26px,4.5vw,52px);
  grid-template-columns:repeat(auto-fit,minmax(min(100%,430px),1fr))}
.aktion{background:var(--fl);color:var(--ti)}
.aktion--veranstaltung,.aktion--angebot{display:flex;align-items:flex-start;gap:clamp(16px,2.4vw,28px);
  padding:clamp(22px,3vw,34px);border-radius:var(--r);box-shadow:0 26px 50px -34px rgba(40,34,20,.45)}
.aktion__datum{flex:none;display:flex;flex-direction:column;align-items:center;width:78px;padding:13px 0 11px;
  border:1px solid var(--az);border-radius:var(--r);color:var(--az);font-family:var(--caps);font-size:.66rem;
  letter-spacing:.16em;text-transform:uppercase;line-height:1}
.aktion__datum b{font-family:var(--serif);font-weight:500;font-size:2.6rem;letter-spacing:0;line-height:1;margin:6px 0 5px;color:var(--ti)}
.aktion__text{flex:1;min-width:0}
.aktion__art{display:block;margin-bottom:9px;font-family:var(--caps);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--az)}
.aktion__titel{margin:0 0 6px;font-family:var(--serif);font-weight:500;font-size:clamp(1.55rem,2.6vw,2.05rem);line-height:1.15;color:var(--ti)}
/* Abstufung über die Farbe, nicht über Durchsichtigkeit: Ein Text mit
   opacity wird gegen seinen Untergrund gerechnet, und was auf Papier
   noch ging, fiel auf Forest unter jede lesbare Schwelle. */
.aktion__zeit{margin:0 0 12px;font-size:.95rem;letter-spacing:.02em}
.aktion__inhalt{margin:0 0 14px;max-width:58ch}
.aktion__fakten{margin:0 0 16px;font-size:.86rem;letter-spacing:.04em}
.aktion__knopf{display:inline-flex;align-items:center;gap:9px;padding:11px 22px;border:1px solid var(--az);border-radius:999px;
  font-family:var(--caps);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ti);
  transition:background .3s var(--ease),color .3s var(--ease)}
.aktion__knopf:hover,.aktion__knopf:focus-visible{background:var(--az);color:var(--auf)}
.aktion__preis{flex:none;align-self:center;display:flex;flex-direction:column;align-items:flex-end;gap:3px;
  padding-left:clamp(14px,2vw,26px);border-left:1px solid var(--az);text-align:right}
.aktion__preis b{font-family:var(--serif);font-weight:500;font-size:clamp(2.1rem,3.8vw,2.9rem);line-height:1;color:var(--az)}
.aktion__statt{font-size:.9rem}
.aktion__leistung{max-width:18ch;font-size:.78rem;letter-spacing:.05em}
.aktion--hinweis{border-radius:0;border-inline:0}
.aktion--hinweis .wrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 18px;padding-block:14px}
.aktion--hinweis .aktion__titel{margin:0;font-family:var(--caps);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--az)}
.aktion--hinweis .aktion__inhalt{margin:0;max-width:none;font-size:.95rem}
@media (max-width:560px){
  .aktion--angebot{flex-direction:column}
  .aktion__preis{align-self:stretch;align-items:flex-start;text-align:left;padding:14px 0 0;border-left:0;border-top:1px solid var(--az)}
  .aktion__datum{width:66px}.aktion__datum b{font-size:2.2rem}
}

/* =====================================================================
   SECTION HEAD
   ===================================================================== */
.sec-head{max-width:60ch;position:relative}
.sec-head--center{text-align:center;margin:0 auto}
.sec-head .lead{margin-top:22px}
.sec-num{font-family:var(--caps);font-size:clamp(12px,1.1vw,14px);letter-spacing:.3em;color:var(--lime-ink);font-weight:500;display:block;margin-bottom:16px}

/* =====================================================================
   SPLIT + circular media (echoes the round mirror)
   ===================================================================== */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,92px);align-items:center}
.split--reverse .split__media{order:2}
.split__body{max-width:52ch}
.split__body .lead{margin-bottom:1.2em}

.circle-media{position:relative;width:min(88%,460px);margin-inline:auto;aspect-ratio:1}
.circle-media__art{width:100%;height:100%;border-radius:50%;overflow:hidden;background:var(--leaf-grad);display:grid;place-items:center;box-shadow:0 44px 80px -34px rgba(30,45,12,.45)}
.circle-media__art .pulse{width:58%;height:auto;color:rgba(255,255,255,.92)}
/* Das Portraet fuellt die Scheibe; im Stylesheet statt inline, weil der Renderer beim Setzen des Bildpunkts das style-Attribut ueberschreibt. */
.circle-media__art img{width:100%;height:100%;object-fit:cover;display:block}
.circle-media__art--sun{background:var(--brand-radial)}
.circle-media__art--sun .pulse{color:#fff}
/* Die Ringe liegen als Pseudo-Elemente ueber dem Foto und fingen im Editor jeden Tipp darauf ab — sie sind Zierde, keine Flaeche. */
.circle-media::before{content:"";position:absolute;inset:-16px;border-radius:50%;border:1px solid var(--lime-ink);opacity:.55;pointer-events:none}
.circle-media::after{content:"";position:absolute;inset:-30px;border-radius:50%;border:1px solid rgba(199,154,82,.35);pointer-events:none}
.circle-media .badge{--badge:clamp(96px,13vw,128px);position:absolute;right:calc(14.64% - .8536*var(--badge) + 11px);bottom:calc(14.64% - .8536*var(--badge) + 11px);z-index:1;background:var(--cream-2);border-radius:50%;width:var(--badge);height:var(--badge);display:grid;place-items:center;align-content:center;text-align:center;box-shadow:0 20px 44px -18px rgba(30,45,12,.4);transform:rotate(-6deg)}
.circle-media .badge b{font-family:var(--serif);font-size:2rem;color:var(--moss);line-height:.9;display:block}
.circle-media .badge span{font-family:var(--caps);font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:3px}

.stats{display:flex;gap:clamp(26px,5vw,60px);margin-top:42px;flex-wrap:wrap}
.stat b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(2rem,3.4vw,2.8rem);color:var(--moss);line-height:1}
.stat span{font-family:var(--caps);font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-2);margin-top:6px;display:block}

/* =====================================================================
   SIGNATURE SERVICE — Happy Soul Massage (feature)
   ===================================================================== */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,86px);align-items:center}
.feature--reverse .feature__media{order:2}
.feature__media{position:relative}
.fcard{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:4/5;background:var(--leaf-grad);color:#fff;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(26px,3.4vw,42px);box-shadow:0 50px 100px -44px rgba(30,45,12,.6)}
.fcard__pulse{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);width:78%;color:rgba(255,255,255,.9)}
.fcard__glow{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 32%,rgba(164,199,54,.35),transparent 70%);pointer-events:none}
.fcard__price{position:relative;z-index:2;font-family:var(--serif);font-size:clamp(2.6rem,5vw,3.6rem);line-height:1;font-weight:400}
.fcard__price small{display:block;font-family:var(--caps);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--lime);margin-top:12px;font-weight:500}
.feature__body h2{margin-bottom:6px}
.feature__intro{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.2rem,2vw,1.55rem);color:var(--moss);margin:0 0 20px}
.feature__list{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:2px}
.feature__list li{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid var(--line-2)}
.feature__list .pulse{width:22px;height:auto;flex:none;color:var(--lime-ink);margin-top:3px}
.feature__list b{font-family:var(--caps);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);display:block;margin-bottom:2px}
.feature__list span{font-size:14.5px;color:var(--ink-2)}
.feature__actions{margin-top:30px;display:flex;gap:14px;flex-wrap:wrap}
.feature__note{margin-top:22px;display:inline-flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-soft);font-style:italic;font-family:var(--serif)}

/* =====================================================================
   HAARENTFERNUNG — price grid
   ===================================================================== */
.menu__group + .menu__group{margin-top:clamp(48px,7vw,90px)}
.menu__grouphead{display:flex;align-items:baseline;gap:20px;margin-bottom:8px;padding-bottom:20px}
.menu__grouphead h3{font-family:var(--caps);font-size:clamp(15px,1.8vw,20px);letter-spacing:.2em;text-transform:uppercase;font-weight:500;color:var(--ink);white-space:nowrap}
.menu__grouphead .rule{flex:1;height:1px;background:var(--line)}
.menu__grouphead .pulse{width:26px;height:auto;color:var(--lime-ink)}
.pricegrid{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(32px,6vw,80px)}
.pricecol{min-width:0}
.prow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:13px 0}
.prow span{font-family:var(--serif);font-size:1.25rem;color:var(--ink)}
.prow b{font-family:var(--serif);font-weight:600;color:var(--moss);font-size:1.25rem}
.prow .dots{flex:1;border-bottom:1px dotted var(--line);transform:translateY(-4px);margin:0 4px}
.psub{grid-column:1/-1;margin:16px 0 2px;font-family:var(--caps);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime-ink);display:flex;align-items:center;gap:12px}
.psub:first-child{margin-top:0}
.psub .rule{flex:1;height:1px;background:var(--line-2)}
.menu__note{margin-top:30px;font-size:14px;color:var(--ink-2);display:flex;gap:12px;align-items:flex-start;font-style:italic;font-family:var(--serif)}
.menu__note .pulse{width:18px;height:auto;flex:none;margin-top:4px;color:var(--lime-ink)}

/* shared offering note — "Ein Angebot, zwei Spezialistinnen" (waxing is offered by both) */
.shared-note{display:flex;gap:clamp(16px,2.5vw,26px);align-items:center;margin:clamp(32px,4.5vw,48px) 0;padding:0}
.shared-note__marks{display:flex;align-items:center;gap:14px;flex:none}
.shared-note__marks .seal{width:clamp(44px,5.5vw,52px);height:clamp(44px,5.5vw,52px);border-radius:50%;object-fit:cover;flex:none;box-shadow:0 8px 18px -12px rgba(60,45,25,.35)}
.shared-note__marks .disc{width:clamp(60px,7vw,74px);height:clamp(44px,5.5vw,52px);border-radius:12px;flex:none;display:grid;place-items:center;background:#A4C736;box-shadow:0 8px 18px -12px rgba(70,110,20,.4),inset 0 0 0 1px rgba(255,255,255,.22)}
.shared-note__marks .disc .pulse{width:74%;height:auto;color:#fff}
.shared-note__marks .plus{font-family:var(--serif);font-size:1.4rem;color:var(--ink-soft);line-height:1}
.shared-note p{margin:0;font-size:clamp(14px,1.3vw,15.5px);color:var(--ink-2);line-height:1.62}
.shared-note b{color:var(--moss);font-weight:500}
.shared-note em{font-style:normal;color:var(--ink);font-weight:400}
@media(max-width:560px){.shared-note{flex-direction:column;align-items:flex-start;gap:14px}}

/* =====================================================================
   PARTNER — "Im selben Raum" (cross-brand → atelier femme)
   The block gently borrows atelier's cream+gold identity: a window into
   the other brand, honoured but clearly distinct.
   ===================================================================== */
.partner{background:linear-gradient(180deg,var(--cream) 0%,#F3EFE6 100%);position:relative;overflow:hidden}
.partner__head{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(28px,4vw,60px);align-items:end}
@media(max-width:820px){.partner__head{grid-template-columns:1fr;gap:22px}}
.partner .sec-num{color:var(--gold-ink)}
.partner .eyebrow{color:var(--gold-mid)}
.partner .eyebrow::before,.partner .eyebrow::after{background:rgba(176,133,66,.5)}
.partner__lockup{display:flex;flex-direction:column;gap:14px}
/* real atelier-femme logo instead of a pill */
.partner__logo{display:inline-flex;align-items:center;gap:16px;align-self:start}
.partner__logo-seal{width:clamp(62px,7.5vw,82px);height:clamp(62px,7.5vw,82px);border-radius:50%;object-fit:cover;flex:none;box-shadow:0 16px 32px -16px rgba(60,45,25,.45);border:1px solid rgba(176,133,66,.22)}
.partner__logo-txt{display:flex;flex-direction:column;gap:4px}
.partner__logo-txt b{font-family:var(--sans);font-weight:400;font-size:clamp(16px,1.8vw,19px);letter-spacing:.05em;text-transform:lowercase;color:var(--ink)}
.partner__logo-txt small{font-family:var(--caps);font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.partner__note{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.15rem,1.8vw,1.5rem);color:var(--gold-ink);line-height:1.4}
.twins{display:flex;align-items:center;gap:14px;margin-top:18px;font-family:var(--caps);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft)}
.twins .knot{width:40px;height:1px;background:linear-gradient(90deg,var(--lime-ink),var(--gold));position:relative}
.twins .knot::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;border-radius:50%;background:var(--gold);transform:translate(-50%,-50%)}
/* duo — makes the complementarity explicit: innen (Seele) ↔ außen (Haut) */
.duo{display:flex;align-items:center;justify-content:center;gap:clamp(14px,2.6vw,30px);margin:clamp(30px,4.5vw,52px) auto 0;flex-wrap:wrap}
.duo__side{display:flex;flex-direction:column;gap:5px}
.duo__side:first-child{text-align:right;align-items:flex-end}
.duo__side:last-child{text-align:left;align-items:flex-start}
.duo__side b{font-family:var(--sans);font-weight:400;font-size:13px;letter-spacing:.12em;text-transform:lowercase;color:var(--ink)}
.duo__side span{font-family:var(--caps);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.duo__knot{flex:none;width:clamp(38px,5vw,58px);height:1px;background:linear-gradient(90deg,var(--lime-ink),var(--gold));position:relative}
.duo__knot::after{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;border-radius:50%;background:radial-gradient(circle at 30% 30%,var(--lime),var(--gold));transform:translate(-50%,-50%)}
.partner__note strong{font-weight:600;font-style:italic;color:var(--gold-deep)}

.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:clamp(38px,5vw,58px)}
.pcard-x{position:relative;text-align:left;display:flex;flex-direction:column;overflow:hidden;background:var(--cream-2);border:1px solid rgba(176,133,66,.22);border-radius:14px;cursor:pointer;
  box-shadow:0 22px 46px -32px rgba(60,45,25,.5);transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.pcard-x:hover,.pcard-x:focus-visible{transform:translateY(-5px);box-shadow:0 34px 62px -30px rgba(60,45,25,.6);border-color:var(--gold)}
.pcard-x:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px}
.pcard-x__media{position:relative;aspect-ratio:16/10;background:radial-gradient(120% 100% at 30% 20%,#FBF8F1 0%,#EEE9DC 70%,#E4DECE 100%);overflow:hidden;display:grid;place-items:center}
.pcard-x__seal{width:clamp(78px,11vw,104px);height:clamp(78px,11vw,104px);border-radius:50%;object-fit:cover;box-shadow:0 14px 28px -16px rgba(60,45,25,.4)}
.pcard-x__b{padding:clamp(26px,3vw,34px) clamp(22px,2.6vw,30px) clamp(22px,2.6vw,28px);display:flex;flex-direction:column;flex:1}
.pcard-x__name{font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.1;color:var(--ink)}
.pcard-x__desc{font-size:13.5px;color:var(--ink-2);margin:8px 0 0}
.pcard-x__foot{margin-top:auto;padding-top:18px;border-top:1px solid var(--line-2);display:flex;align-items:center;justify-content:space-between;gap:12px}
.pcard-x__price{font-family:var(--serif);font-weight:600;font-size:1.2rem;color:var(--gold-ink)}
.pcard-x__go{display:inline-flex;align-items:center;gap:7px;font-family:var(--caps);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-mid)}
.pcard-x__go svg{width:14px;height:14px;transition:transform .4s var(--ease)}
.pcard-x:hover .pcard-x__go svg{transform:translateX(4px)}
.partner__cta{margin-top:clamp(30px,4vw,46px);display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.partner__cta .hint{font-size:13px;color:var(--ink-soft);font-style:italic;font-family:var(--serif)}
/* volles Partner-Menü (Gesamtheit der Behandlungen) — je Zeile ein Deep-Link */
.pmenu{margin-top:clamp(34px,5vw,54px)}
.pmenu__group + .pmenu__group{margin-top:clamp(30px,4vw,46px)}
.pmenu__head{display:flex;align-items:baseline;gap:14px;font-family:var(--caps);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);font-weight:500;margin-bottom:4px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.pmenu__head span{color:var(--ink-soft);font-size:.82em;letter-spacing:.16em}
.pmenu__row{display:flex;align-items:baseline;gap:14px;width:100%;text-align:left;padding:17px 6px;border-bottom:1px solid var(--line-2);cursor:pointer;transition:translate .4s var(--ease),color .35s var(--ease)}
@media (hover:hover){.pmenu__row:hover{translate:8px 0}}
.pmenu__name{font-family:var(--serif);font-weight:400;font-size:clamp(1.12rem,1.9vw,1.4rem);color:var(--ink);display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
.pmenu__name em{font-style:normal;font-family:var(--caps);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-mid);border:1px solid var(--gold-line);padding:3px 8px;border-radius:2px;transform:translateY(-2px)}
.pmenu__dots{flex:1;min-width:20px;border-bottom:1px dotted var(--line);transform:translateY(-5px)}
.pmenu__price{font-family:var(--serif);font-weight:600;font-size:clamp(1.05rem,1.7vw,1.25rem);color:var(--gold-ink);white-space:nowrap}
.pmenu__go{width:17px;height:17px;flex:none;color:var(--gold-mid);transform:translateX(-2px);opacity:.6;transition:transform .4s var(--ease),opacity .35s var(--ease);align-self:center}
.pmenu__row:hover .pmenu__go,.pmenu__row:focus-visible .pmenu__go{transform:translateX(2px);opacity:1}
.pmenu__row:hover .pmenu__name{color:var(--gold-ink)}
.pmenu__row:focus-visible{outline:2px solid var(--gold-deep);outline-offset:3px;border-radius:4px}
@media(max-width:440px){.pmenu__go{display:none}.pmenu__row{padding-inline:0}}
@media(max-width:820px){.pcards{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pcards{grid-template-columns:1fr}}

/* =====================================================================
   QUOTE BAND — "du bist genug."
   ===================================================================== */
.band{position:relative;text-align:center;overflow:hidden;background:var(--moss);color:var(--on-dark)}
.band .pulse--watermark{width:min(70vw,540px);height:auto;left:50%;top:50%;transform:translate(-50%,-50%);opacity:.12;color:var(--lime)}
.band__quote{position:relative;z-index:1;max-width:20ch;margin:0 auto;font-family:var(--serif);font-weight:300;font-size:clamp(2.4rem,6vw,4.4rem);line-height:1.05;color:#fff}
.band__sub{position:relative;z-index:1;margin:18px auto 0;font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.4rem,3vw,2.1rem);color:var(--lime)}
.band__by{position:relative;z-index:1;margin-top:30px;font-family:var(--caps);letter-spacing:.32em;text-transform:uppercase;font-size:11px;color:var(--on-dark-soft)}

/* =====================================================================
   CONTACT + MAP
   ===================================================================== */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,80px);align-items:stretch}
.contact__card{background:var(--cream-2);border:1px solid var(--line-2);border-radius:var(--r);padding:clamp(32px,4vw,52px);box-shadow:0 40px 80px -46px rgba(30,45,12,.32);display:flex;flex-direction:column}
.cinfo{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-direction:column;gap:22px}
.cinfo li{display:flex;gap:18px;align-items:flex-start}
.cinfo .ic{width:42px;height:42px;flex:none;border:1px solid var(--lime-ink);border-radius:50%;display:grid;place-items:center;color:var(--moss)}
.cinfo .ic svg{width:18px;height:18px}
.cinfo b{display:block;font-family:var(--caps);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-2);margin-bottom:4px;font-weight:500}
.cinfo a,.cinfo span{color:var(--ink);font-size:16px}
.cinfo a:hover{color:var(--moss)}
.contact__actions{margin-top:auto;padding-top:32px;display:flex;gap:14px;flex-wrap:wrap}
.map{border-radius:var(--r);overflow:hidden;min-height:360px;box-shadow:0 40px 80px -46px rgba(30,45,12,.32);position:relative;border:1px solid var(--line-2);background:var(--sage-pale)}
.map iframe{width:100%;height:100%;min-height:360px;border:0;filter:grayscale(.4) sepia(.22) hue-rotate(48deg) saturate(.9) contrast(.95) brightness(1.04)}
.map__pin{position:absolute;left:50%;top:50%;transform:translate(-50%,-100%);z-index:3;pointer-events:none;color:var(--moss);filter:drop-shadow(0 6px 8px rgba(0,0,0,.3))}
.map__pin svg{width:38px;height:38px}
.map__pin::after{content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);width:14px;height:5px;border-radius:50%;background:rgba(0,0,0,.25);filter:blur(2px)}
.map__route{position:absolute;right:16px;bottom:16px;z-index:4;display:inline-flex;align-items:center;gap:9px;background:rgba(251,252,245,.94);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:11px 18px;border-radius:40px;border:1px solid var(--line-2);font-family:var(--caps);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);box-shadow:0 12px 30px -14px rgba(30,45,12,.4);transition:color .35s var(--ease),transform .35s var(--ease)}
.map__route svg{width:14px;height:14px;color:var(--moss)}
.map__route:hover{color:var(--moss);transform:translateY(-2px)}
.map__consent{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;padding:clamp(24px,5vw,44px);text-align:center;background:linear-gradient(160deg,var(--cream-2),var(--sage-pale));transition:opacity .55s var(--ease),visibility .55s}
.map__consent.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.map__consent-mark{width:46px;height:auto;color:var(--lime-ink);opacity:.6}
.map__consent-txt{max-width:44ch;margin:0;font-size:14px;line-height:1.6;color:var(--ink-2)}
.map__consent-txt b{color:var(--ink);font-weight:500}
.map__consent-alt{font-family:var(--caps);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);border-bottom:1px solid var(--line-2);padding-bottom:2px;transition:color .3s var(--ease),border-color .3s var(--ease)}
.map__consent-alt:hover{color:var(--moss);border-color:var(--lime-ink)}

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer{background:var(--forest);color:var(--on-dark);position:relative;overflow:hidden}
.footer .pulse--watermark{right:-30px;bottom:-40px;width:420px;height:auto;color:#fff;opacity:.05}
.footer__top{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:48px;padding-block:clamp(56px,8vw,92px)}
.footer__brand .mark{display:flex;align-items:center;gap:12px}
.footer__brand .mark .brandmark{width:36px;color:var(--lime)}
.footer__brand .mark .brandname{font-family:var(--sans);font-weight:400;letter-spacing:.2em;text-transform:lowercase;font-size:1.3rem;color:#fff}
.footer__brand .mark .brandname small{display:block;font-family:var(--caps);font-size:.42em;letter-spacing:.4em;color:var(--lime);margin-top:5px;text-transform:uppercase}
.footer__brand p{color:var(--on-dark-soft);max-width:36ch;margin-top:18px}
.footer h3{font-family:var(--caps);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--lime);margin:0 0 20px;font-weight:500}
.footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.footer ul a,.footer ul span{color:var(--on-dark-soft);font-size:15px}
.footer ul a:hover{color:#fff}
.footer__partner{margin-top:16px;display:inline-flex;align-items:center;gap:9px;font-family:var(--caps);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-soft);border:1px solid var(--line-dark);border-radius:30px;padding:8px 14px;transition:color .35s var(--ease),border-color .35s var(--ease)}
.footer__partner:hover{color:var(--gold-hi);border-color:rgba(235,209,153,.4)}
.footer__partner .seal{width:24px;height:24px;border-radius:50%;object-fit:cover;flex:none}
.footer__bottom{border-top:1px solid var(--line-dark);padding-block:24px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:var(--on-dark-soft);letter-spacing:.04em}
.footer__bottom a{color:var(--on-dark-soft)}
.footer__bottom a:hover{color:#fff}

/* =====================================================================
   MASSAGE DETAIL MODAL
   ===================================================================== */
.tmodal{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:clamp(14px,4vw,48px);opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
.tmodal.open{opacity:1;visibility:visible}
.tmodal__backdrop{position:absolute;inset:0;background:rgba(18,26,10,.55);-webkit-backdrop-filter:blur(9px) saturate(120%);backdrop-filter:blur(9px) saturate(120%)}
.tmodal__card{position:relative;z-index:2;width:min(940px,100%);max-height:calc(100svh - 28px);overflow:hidden;display:grid;grid-template-columns:minmax(0,44%) 1fr;background:var(--cream-2);border-radius:14px;box-shadow:0 60px 130px -40px rgba(12,18,6,.72);transform:translateY(28px) scale(.985);opacity:0;transition:transform .6s var(--ease),opacity .5s var(--ease)}
.tmodal.open .tmodal__card{transform:none;opacity:1}
.tmodal__media{position:relative;min-height:100%;background:var(--leaf-grad);overflow:hidden;display:grid;place-items:center;color:#fff}
.tmodal__media .pulse{width:70%;height:auto;color:rgba(255,255,255,.92);position:relative;z-index:1}
.tmodal__media .glow{position:absolute;inset:0;background:radial-gradient(60% 46% at 50% 34%,rgba(164,199,54,.4),transparent 70%)}
.tmodal__body{position:relative;z-index:1;padding:clamp(24px,3.4vw,46px);min-width:0;display:flex;flex-direction:column;overflow-y:auto}
.tmodal__line{font-family:var(--caps);font-size:10.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--lime-ink);display:block;margin-bottom:14px}
.tmodal__name{font-family:var(--serif);font-weight:300;font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.05;color:var(--ink)}
.tmodal__price{font-family:var(--serif);font-weight:600;font-size:1.5rem;color:var(--moss);margin:6px 0 12px}
.tmodal__desc{color:var(--ink-2);font-size:15.5px;line-height:1.7;margin:0}
.tmodal__meta{margin:18px 0 0;padding:18px 0 0;border-top:1px solid var(--line-2);display:grid;grid-template-columns:1fr 1fr;gap:14px 26px}
.tmodal__meta dt{font-family:var(--caps);font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 4px}
.tmodal__meta dd{margin:0;font-size:14px;color:var(--ink);line-height:1.5}
.tmodal__meta .full{grid-column:1/-1}
.tmodal__actions{margin-top:auto;padding-top:24px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.tmodal__close{position:absolute;top:14px;right:14px;z-index:5;width:44px;height:44px;border-radius:50%;background:rgba(251,252,245,.92);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:grid;place-items:center;color:var(--ink);box-shadow:0 6px 20px -8px rgba(0,0,0,.45);transition:transform .4s var(--ease),background .3s}
.tmodal__close:hover{transform:rotate(90deg);background:#fff}
.tmodal__close svg{width:18px;height:18px}
body.tmodal-open{overflow:hidden}
@media(max-width:720px){
  .tmodal__card{grid-template-columns:1fr;max-height:calc(100svh - 20px);overflow-y:auto}
  .tmodal__media{height:180px;min-height:180px}
  .tmodal__meta{grid-template-columns:1fr}
  .tmodal__actions{flex-direction:column-reverse;align-items:stretch}
  .tmodal__actions .btn{justify-content:center}
}

/* =====================================================================
   CROSSOVER / HANDOFF — the shared "curtain" between the two sites.
   Vertical slats echo the FLUTED counter both partners stand behind,
   sweeping across in the TARGET brand's colour so the two documents
   feel like one continuous motion.
   ===================================================================== */
.xo{position:fixed;inset:0;z-index:12000;pointer-events:none;display:flex;visibility:hidden;opacity:1}
.xo.is-active{visibility:visible;pointer-events:auto}
.xo__slats{position:absolute;inset:0;display:flex}
.xo__slat{flex:1 1 0;height:100%;transform:scaleY(0);transform-origin:top;
  transition:transform .62s var(--ease);
  background:#A4C736}
/* leaving TO atelier femme → gold/cream slats */
.xo[data-to="atelier"] .xo__slat{background:#5C6A51}
.xo__mark{position:absolute;inset:0;display:grid;place-items:center;z-index:2;opacity:0;transform:translateY(12px) scale(.96);transition:opacity .5s var(--ease) .12s,transform .6s var(--ease) .12s}
.xo__mark svg{width:min(58vw,360px);height:auto}
/* happy soul mark in the curtain = full original logo (white on lime), symmetric to the atelier seal */
.to-hs{display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2vw,20px);color:#fff}
.to-hs .pulse{width:min(52vw,340px);height:auto;color:#fff}
.to-hs__word{font-family:var(--sans);font-weight:500;letter-spacing:.14em;font-size:clamp(22px,4.4vw,40px);text-transform:lowercase;color:#fff;line-height:1}
.to-hs__tag{font-family:var(--sans);font-weight:500;letter-spacing:.2em;font-size:clamp(11px,1.8vw,17px);text-transform:uppercase;color:#fff;display:flex;gap:.7em}
.xo__mark img.to-atelier{width:min(46vw,300px);height:auto;border-radius:50%;box-shadow:0 24px 70px -20px rgba(0,0,0,.45)}
.xo__mark .label{margin-top:20px;font-family:var(--caps);font-size:11px;letter-spacing:.34em;text-transform:uppercase;text-align:center}
.xo[data-to="hs"] .xo__mark .label{color:var(--forest)}
.xo[data-to="atelier"] .xo__mark .label{color:#F0EBE0}
/* COVER state: slats fill the screen, mark shows */
.xo.cover .xo__slat{transform:scaleY(1)}
.xo.cover .xo__mark{opacity:1;transform:none}
/* staggered slats (left→right sweep) */
.xo__slat:nth-child(1){transition-delay:0s}
.xo__slat:nth-child(2){transition-delay:.05s}
.xo__slat:nth-child(3){transition-delay:.1s}
.xo__slat:nth-child(4){transition-delay:.15s}
.xo__slat:nth-child(5){transition-delay:.2s}
.xo__slat:nth-child(6){transition-delay:.25s}
.xo__slat:nth-child(7){transition-delay:.3s}
.xo__slat:nth-child(8){transition-delay:.35s}
/* which brand mark shows during the crossover (set via data-to) */
.xo[data-to="hs"] .to-atelier,.xo[data-to="atelier"] .to-hs{display:none}
/* pre-paint arrival cover — set by an inline <head> script so the curtain
   is already down before the incoming page paints (no flash), then JS retracts it */
html.xo-arriving .loader{display:none}
html.xo-arriving .xo{visibility:visible;pointer-events:auto}
html.xo-arriving .xo__slat{transform:scaleY(1)}
html.xo-arriving .xo__mark{opacity:1;transform:none}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:1024px){
  .footer__top{grid-template-columns:1fr 1fr}
  .footer__brand{grid-column:1/-1}
}
@media(max-width:920px){.nav__links{display:none}.nav__cta{display:none}.nav__burger{display:block}}
@media(max-width:860px){.feature{grid-template-columns:1fr;gap:40px}.feature__media{max-width:440px;margin-inline:auto;width:100%}.feature--reverse .feature__media{order:-1}}
@media(max-width:760px){
  .split,.contact{grid-template-columns:1fr}
  .split--reverse .split__media{order:0}
  .pricegrid{grid-template-columns:1fr}
  .map{min-height:300px}
  .circle-media{width:min(80%,360px)}
}
a:focus-visible,button:focus-visible,.btn:focus-visible{outline:2px solid var(--moss);outline-offset:3px;border-radius:3px}
.section--dark a:focus-visible,.footer a:focus-visible,.marquee a:focus-visible,.band a:focus-visible{outline-color:var(--lime)}
@media(max-width:560px){.menu__grouphead{flex-wrap:wrap}.menu__grouphead h3{white-space:normal}.menu__grouphead .pulse{display:none}}
@media(max-width:520px){.hero__actions{flex-direction:column;width:100%;max-width:360px;margin-inline:auto}.hero__actions .btn{width:100%}}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.2s!important;scroll-behavior:auto!important}
  .disc,.disc__inner,.marquee__track{animation:none}
  .disc,.disc__inner{opacity:1!important;transform:none!important}
  .disc__word,.disc__tag{opacity:1!important;transform:none!important}
  .disc__mark{opacity:1!important;transform:none!important}
  .disc::before{display:none}
  [data-reveal]{opacity:1;transform:none}
  .loader__pulse{opacity:1!important;transform:none!important}
  .loader__word,.hero__eyebrow,.hero__title,.hero__sub,.hero__actions,.hero__scroll{opacity:1;animation:none}
}

/* ---------------------------------------------------------------------
   BEWEGUNG REDUZIEREN — derselbe Vorhang, nur ohne Fahrbewegung.
   Die acht Lamellen stehen bereits in voller Höhe und blenden nacheinander
   von links nach rechts auf. Der Sweep bleibt lesbar, es bewegt sich aber
   nichts: reine Deckkraft, kein transform, kein Verschieben.
   Ein feiner Vertikalverlauf pro Lamelle gibt der Fläche Tiefe, damit die
   Aufblendung nicht flach wirkt.
   --------------------------------------------------------------------- */
@media(prefers-reduced-motion:reduce){
  .xo__slat{
    transform:scaleY(1)!important;
    opacity:0;
    transition:opacity .42s var(--ease)!important;
    background-image:linear-gradient(180deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,0) 46%,rgba(0,0,0,.12) 100%);
  }
  /* Lamellen-Kanten sichtbar halten, sonst verschmilzt die Fläche beim Aufblenden */
  .xo__slat + .xo__slat{box-shadow:inset 1px 0 0 rgba(255,255,255,.16)}
  .xo.cover .xo__slat{opacity:1}
  .xo__slat:nth-child(1){transition-delay:0s!important}
  .xo__slat:nth-child(2){transition-delay:.05s!important}
  .xo__slat:nth-child(3){transition-delay:.1s!important}
  .xo__slat:nth-child(4){transition-delay:.15s!important}
  .xo__slat:nth-child(5){transition-delay:.2s!important}
  .xo__slat:nth-child(6){transition-delay:.25s!important}
  .xo__slat:nth-child(7){transition-delay:.3s!important}
  .xo__slat:nth-child(8){transition-delay:.35s!important}
  /* Zeichen: nur einblenden, nicht heranfahren */
  .xo__mark{transform:none!important;transition:opacity .5s var(--ease) .24s!important}
  .xo.cover .xo__mark{opacity:1;transform:none!important}
  /* Ankunft: Vorhang liegt schon vor dem ersten Paint deckend auf */
  html.xo-arriving .xo__slat{opacity:1}
}
@media(max-height:780px){.hero__scroll{display:none}}

/* =====================================================================
   MULTI-PAGE, aber smooth wie ein One-Pager:
   Cross-Document View Transitions (echte Unterseiten, animierter Wechsel)
   ===================================================================== */
@view-transition{navigation:auto}
::view-transition-old(root){animation:vtOut .34s var(--ease) both}
::view-transition-new(root){animation:vtIn .46s var(--ease) both}
@keyframes vtOut{to{opacity:0;transform:translateY(-8px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(10px)}}
/* Nav & Footer bleiben beim Seitenwechsel ruhig stehen (One-Pager-Gefühl) */
.nav{view-transition-name:site-nav}
.footer{view-transition-name:site-footer}
@media(prefers-reduced-motion:reduce){
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}

/* Sub-Seiten-Hero (schlanker als der Home-Hero) */
.subhero{position:relative;padding:clamp(90px,11vh,116px) var(--gutter) clamp(22px,2.8vw,36px);text-align:center;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,var(--cream-2) 0%,var(--cream) 50%,var(--sage-pale) 100%)}
.subhero__sun{position:absolute;left:50%;top:-10%;width:min(70vw,640px);aspect-ratio:1;transform:translateX(-50%);z-index:0;pointer-events:none;background:var(--sun-glow);filter:blur(3px)}
.subhero__in{position:relative;z-index:1;max-width:760px;margin:0 auto}
.subhero .eyebrow{justify-content:center}
.subhero .eyebrow::after{content:"";width:34px;height:1px;background:var(--lime-ink)}
.subhero__title{font-family:var(--serif);font-weight:300;font-size:clamp(1.95rem,4.6vw,3.25rem);line-height:1.06;margin:0}
.subhero__title em,.subhero__title .lime-text{font-style:italic}
.subhero__sub{margin:15px auto 0;max-width:54ch;font-size:clamp(14.5px,1.4vw,17px);color:var(--ink-2)}
.subhero__actions{margin-top:34px;display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.crumb{font-family:var(--caps);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:20px;display:flex;gap:9px;justify-content:center;align-items:center;flex-wrap:wrap}
.crumb a{color:var(--moss)}.crumb a:hover{color:var(--lime-ink)}
.crumb span{opacity:.5}
/* Overview-Karten auf der Startseite (verlinken auf die Unterseiten) */
.ov{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(18px,2.5vw,26px);margin-top:clamp(38px,5vw,58px)}
.ov__card{position:relative;display:flex;flex-direction:column;background:var(--cream-2);border:1px solid var(--line-2);border-radius:16px;overflow:hidden;padding:clamp(26px,3vw,34px);box-shadow:0 22px 46px -34px rgba(30,45,12,.4);transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease)}
.ov__card:hover,.ov__card:focus-visible{transform:translateY(-5px);box-shadow:0 34px 62px -32px rgba(30,45,12,.5);border-color:var(--lime-ink)}
.ov__card:focus-visible{outline:2px solid var(--moss);outline-offset:3px}
.ov__mark{width:clamp(40px,5vw,52px);height:auto;color:var(--lime-ink);margin-bottom:16px}
.ov__name{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.4vw,1.9rem);color:var(--ink);line-height:1.05}
.ov__desc{font-size:14.5px;color:var(--ink-2);margin:10px 0 0}
.ov__foot{margin-top:auto;padding-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.ov__price{font-family:var(--serif);font-weight:600;font-size:1.25rem;color:var(--moss)}
.ov__go{display:inline-flex;align-items:center;gap:7px;font-family:var(--caps);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--lime-ink)}
.ov__go svg{width:14px;height:14px;transition:transform .4s var(--ease)}
.ov__card:hover .ov__go svg{transform:translateX(4px)}

/* ===== Standortübergreifende Suche ===== */
.nav__search{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:var(--ink-2);border:1px solid transparent;background:none;cursor:pointer;transition:color .3s var(--ease),background .3s var(--ease)}
.nav__search svg{width:19px;height:19px}
.nav__search:hover{color:var(--moss);background:rgba(164,199,54,.14)}
.nav__search:focus-visible{outline:2px solid var(--moss);outline-offset:2px}
.search{position:fixed;inset:0;z-index:1200;display:flex;justify-content:center;align-items:flex-start;padding:clamp(14px,7vh,88px) clamp(14px,4vw,48px) 24px;opacity:0;visibility:hidden;transition:opacity .35s var(--ease),visibility .35s}
.search.open{opacity:1;visibility:visible}
.search__backdrop{position:absolute;inset:0;background:rgba(24,40,10,.5);-webkit-backdrop-filter:blur(9px) saturate(120%);backdrop-filter:blur(9px) saturate(120%)}
.search__panel{position:relative;z-index:1;width:min(680px,100%);max-height:calc(100svh - clamp(28px,14vh,150px));display:flex;flex-direction:column;background:var(--cream-2);border-radius:14px;box-shadow:0 60px 130px -40px rgba(20,30,8,.6);overflow:hidden;transform:translateY(-16px) scale(.99);opacity:0;transition:transform .4s var(--ease),opacity .35s var(--ease)}
.search.open .search__panel{transform:none;opacity:1}
.search__bar{display:flex;align-items:center;gap:14px;padding:16px clamp(18px,3vw,26px);border-bottom:1px solid var(--line-2)}
.search__ico{width:22px;height:22px;color:var(--moss);flex:none}
.search__input{flex:1;min-width:0;border:none;background:transparent;font-family:var(--serif);font-size:clamp(1.3rem,3vw,1.7rem);color:var(--ink);font-weight:400}
.search__input::placeholder{color:var(--ink-soft);opacity:.75}
.search__input:focus{outline:none}
.search__input::-webkit-search-cancel-button,.search__input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
.search__close{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--ink-soft);flex:none;background:none;cursor:pointer;transition:color .3s,background .3s}
.search__close:hover{color:var(--ink);background:var(--cream)}
.search__close svg{width:17px;height:17px}
.search__results{flex:0 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px 0}
.search__group{font-family:var(--caps);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--moss);padding:14px clamp(18px,3vw,26px) 8px}
.sres{display:flex;align-items:center;gap:15px;width:100%;text-align:left;padding:10px clamp(18px,3vw,26px);cursor:pointer;background:none;border:none;transition:background .2s var(--ease)}
.sres:hover,.sres.active{background:var(--cream)}
.sres__b{min-width:0;flex:1}
.sres__name{display:block;font-family:var(--serif);font-size:1.15rem;color:var(--ink);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sres__meta{display:block;font-family:var(--caps);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sres__price{font-family:var(--serif);font-weight:600;font-size:1.05rem;color:var(--moss);flex:none;margin-left:8px}
.sres mark{background:rgba(164,199,54,.32);color:inherit;border-radius:2px;padding:0 1px}
.search__empty{padding:32px clamp(18px,3vw,26px);text-align:center;color:var(--ink-soft);font-size:15px}
body.search-open{overflow:hidden}
.sres__mk{width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden}
.sres__mk--hs{background:#A4C736}
.sres__mk--hs svg{width:76%;height:auto;color:#fff}
.sres__mk--af{background:#fff;border:1px solid rgba(58,48,32,.1)}
.sres__mk--af img{width:82%;height:82%;object-fit:contain}
.sres__partner{flex:none;margin-left:8px;font-family:var(--caps);font-size:8.5px;letter-spacing:.1em;padding:3px 9px;border-radius:20px;text-transform:none;white-space:nowrap;background:rgba(199,154,82,.16);color:#8a6531}
.sres__partner::before{content:"→ "}
@media(max-width:560px){.search__panel{max-height:calc(100svh - 28px)}.sres__partner{display:none}}

/* ===== Partner-Bereich: großes klickbares Partner-Logo ===== */
.partner__split{display:grid;grid-template-columns:minmax(220px,.9fr) 1.15fr;gap:clamp(30px,5vw,68px);align-items:center;margin-top:clamp(34px,5vw,54px)}
.partner__logobig{display:flex;flex-direction:column;align-items:center;gap:18px;background:none;border:none;cursor:pointer;padding:0;width:100%}
.partner__logobig img{width:100%;max-width:300px;aspect-ratio:1;height:auto;object-fit:cover;border-radius:50%;box-shadow:0 32px 64px -30px rgba(60,45,25,.34),0 0 0 1px rgba(58,48,32,.06);transition:transform .5s var(--ease)}
.partner__logobig:hover img,.partner__logobig:focus-visible img{transform:scale(1.03)}
.partner__logobig:focus-visible{outline:none}
.partner__logobig:focus-visible img{outline:2px solid #c79a52;outline-offset:6px;border-radius:50%}
.partner__logobig__hint{display:inline-flex;align-items:center;gap:8px;font-family:var(--caps);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#9a7433}
.partner__logobig__hint svg{width:15px;height:15px;transition:transform .35s var(--ease)}
.partner__logobig:hover .partner__logobig__hint svg{transform:translateX(4px)}
@media(max-width:760px){.partner__split{grid-template-columns:1fr;gap:26px;justify-items:center;text-align:center}.partner__split .partner__note{text-align:left}}

/* ===== Partner: Logo + kurzer Text links, Behandlungen rechts ===== */
.partner__cols{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(32px,5vw,68px);align-items:center;margin-top:0}
.partner__aside{display:flex;flex-direction:column;align-items:center;gap:18px}
.partner__note--short{text-align:center;max-width:38ch;margin:0;font-size:clamp(14.5px,1.35vw,16px);line-height:1.6}
@media(max-width:860px){.partner__cols{grid-template-columns:1fr;gap:26px}.partner__cols .pmenu{width:100%}}

/* Partner: Text in die Überschrift, Tabelle bündig zur Logo-Oberkante, nichts unter dem Logo */
.partner__eyebrow{text-align:center;margin:0 auto clamp(30px,4.5vw,54px)}
.partner__duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,6vw,90px);align-items:start}
.partner__col{display:flex;flex-direction:column;align-items:center;gap:clamp(24px,3.2vw,40px)}
.partner__col .pmenu{width:100%;margin-top:0}
.partner__col .partner__logobig{align-self:center}
.partner__logobig--static{cursor:default}
.partner__logobig:hover img,.partner__logobig:focus-visible img{transform:scale(1.03)}
.partner__duo .partner__logobig img{width:100%;max-width:200px;aspect-ratio:1;height:auto;object-fit:cover;border-radius:50%;box-shadow:0 32px 64px -30px rgba(60,45,25,.34),0 0 0 1px rgba(58,48,32,.06);transition:transform .5s var(--ease)}
.partner__logobig--hs .hs-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(10px,1.4vw,15px);background:#A4C736;border-radius:clamp(20px,2.6vw,30px);padding:clamp(22px,3vw,36px);width:100%;max-width:332px;aspect-ratio:1.66/1;box-shadow:0 34px 66px -34px rgba(70,110,20,.55),inset 0 0 0 1px rgba(255,255,255,.18);transition:transform .5s var(--ease)}
.partner__logobig--hs:hover .hs-card,.partner__logobig--hs:focus-visible .hs-card{transform:scale(1.03)}
.hs-card__mark{width:74%;height:auto;color:#fff}
.hs-card__word{font-family:var(--sans);font-weight:500;letter-spacing:.14em;text-transform:lowercase;font-size:clamp(18px,2.3vw,25px);color:#fff;line-height:1;white-space:nowrap}
.hs-card__tag{font-family:var(--sans);font-weight:500;letter-spacing:.2em;text-transform:uppercase;font-size:clamp(10px,1.3vw,13px);color:rgba(255,255,255,.94)}
.partner__col--af .pmenu__head,.partner__col--af .pmenu__price{color:var(--gold-ink)}
.partner__col--af .pmenu__name em{color:var(--gold-mid);border-color:var(--gold-line)}
.partner__col--af .pmenu__go{color:var(--gold-mid)}
.partner__col--af .pmenu__row:hover .pmenu__name,.partner__col--af .pmenu__row:hover .pmenu__go{color:var(--gold-ink)}
.partner__col--hs .pmenu__head,.partner__col--hs .pmenu__price{color:#4E7A24}
.partner__col--hs .pmenu__name em{color:#6F8E1A;border-color:rgba(111,191,34,.4)}
.partner__col--hs .pmenu__go{color:#6F8E1A}
.partner__col--hs .pmenu__row:hover .pmenu__name,.partner__col--hs .pmenu__row:hover .pmenu__go{color:#4E7A24}
.partner__unify{text-align:center;max-width:56ch;margin:clamp(40px,5.5vw,70px) auto 0}
@media(max-width:820px){.partner__duo{grid-template-columns:1fr;gap:clamp(44px,9vw,60px)}}

/* ===== Haarentfernung: Zweispalter wie atelier — Text links, Preiskarte rechts ===== */
.wax{position:relative;overflow:hidden;padding-top:clamp(104px,14vh,140px);padding-bottom:clamp(44px,6vw,76px)}
.wax__sun{top:-24%;width:min(66vw,720px);opacity:.85}
.wax__grid{position:relative;z-index:1;display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(34px,5.5vw,74px);align-items:center}
.wax__text .crumb{justify-content:flex-start;margin-bottom:16px}
.wax__text .eyebrow{justify-content:flex-start}
.wax__title{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,4.4vw,3.35rem);line-height:1.05;margin:14px 0 0;color:var(--ink)}
.wax__title em{font-style:italic}
.wax__text .lead{margin-top:18px}
.wax__actions{justify-content:flex-start;margin-top:30px}
.wax__prices{position:relative;z-index:1;background:var(--cream-2);border:1px solid var(--line-2);border-radius:18px;padding:clamp(24px,3.2vw,38px) clamp(26px,3.4vw,44px);box-shadow:0 34px 66px -36px rgba(40,60,20,.34)}
.wax__prices .pricegrid{grid-template-columns:1fr;gap:0}
.pricegrid--zones{align-items:start}
.wax__note{position:relative;z-index:1;margin:clamp(36px,5vw,58px) auto 0;max-width:770px}
@media(max-width:820px){.wax__grid{grid-template-columns:1fr;gap:28px}.wax__prices{max-width:520px}}
/* Massage: Waxing-Zweispalter mit Detail-Karte (Preis + Ablauf) */
.wax__intro{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.15rem,1.9vw,1.5rem);color:var(--moss);margin:12px 0 0}
.wax__text .wax__intro + .lead{margin-top:12px}
.wax__card .wcard__price{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,4.4vw,3.1rem);line-height:1;color:var(--moss)}
.wax__card .wcard__price small{display:block;font-family:var(--caps);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--lime-ink);margin-top:clamp(18px,2.6vw,26px);font-weight:500}
.wax__card .feature__list{margin-top:18px}
.wax__card .feature__list li:first-child{padding-top:0}
.wax__card .feature__list li:last-child{border-bottom:none;padding-bottom:0}
.wax__fornote{margin:clamp(28px,4vw,44px) auto 0;align-items:flex-start;gap:12px}
.wax__fornote .pulse{width:30px;height:auto;flex:none;color:var(--lime-ink);margin-top:2px}
.wax__fornote b{font-family:var(--caps);font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-style:normal;color:var(--ink)}

/* === wirkung-fuerwen-cards: ruhige Karten fuer Wirkung / Fuer wen (keine Icons) === */
.info-card{background:var(--cream-2);border:1px solid var(--line-2);border-radius:18px;padding:clamp(24px,3.2vw,38px) clamp(26px,3.4vw,44px);box-shadow:0 34px 66px -36px rgba(40,60,20,.34)}
.info-card > h2{margin:0 0 clamp(18px,2.2vw,26px)}
.info-list{list-style:disc;margin:0;padding:0 0 0 1.25em}
.info-list li{font-size:clamp(1.02rem,1.35vw,1.14rem);line-height:1.55;color:var(--ink);margin-bottom:clamp(10px,1.4vw,14px)}
.info-list li:last-child{margin-bottom:0}
.info-list li::marker{color:var(--lime-ink)}
.info-list li b{color:var(--moss);font-weight:600}

/* Auslieferung: genug Abstand zwischen Marke, Menü und Aktionen. */
.nav{gap:20px}
.nav__brand,.nav__end{flex-shrink:0}
.nav__brand{white-space:nowrap}
@media(max-width:1320px){.nav__links{display:none}.nav__cta{display:none}.nav__burger{display:block}}
@media(min-width:1321px){.nav__links{gap:clamp(12px,1.2vw,24px)}.nav__links a{font-size:11px;letter-spacing:.12em}.nav__brand .brandname{font-size:14px}}

/* Vorhang zwischen den Häusern (23.09.2026): Wortmarke als Pfad statt Schrift —
   dieselbe Größe wie vorher, aber ohne Nachladen und Umspringen der Schrift beim Ankommen.
   Beide Seiten tragen dasselbe Markup und diese Regeln. */
.xo .xo__mark svg.xo__word{display:block;width:auto;height:calc(clamp(22px,4.4vw,40px) * 1.445);color:#fff}
.xo .xo__mark img.to-atelier{aspect-ratio:1/1}

/* ===== Klappmenü „Massagen" (23.09.2026) — Aufbau wie bei Maria, in Julias Farben ===== */
.nav__drop{position:relative;display:inline-flex;align-items:center}
.nav__droplink{display:inline-flex;align-items:center;gap:4px}
.nav__chev{width:11px;height:11px;flex:none;transition:transform .3s var(--ease)}
.nav__drop:hover .nav__chev,.nav__drop:focus-within .nav__chev{transform:rotate(180deg)}
.nav__drop::after{content:"";position:absolute;top:100%;left:-14px;right:-14px;height:16px}
.nav__menu{position:absolute;top:calc(100% + 12px);left:50%;transform:translateX(-50%) translateY(8px);min-width:300px;background:var(--cream-2);border-radius:14px;box-shadow:0 36px 72px -26px rgba(40,55,25,.42),0 0 0 1px var(--line-2);padding:8px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s;z-index:950}
.nav__drop:hover .nav__menu,.nav__drop:focus-within .nav__menu{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.nav__links .nav__menu a{display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:11px 16px;border-radius:9px;font-family:var(--serif);font-size:16px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);white-space:nowrap;transition:background .2s,color .2s}
.nav__links .nav__menu a::after{display:none}
.nav__links .nav__menu a:hover,.nav__links .nav__menu a:focus-visible{background:var(--cream);color:var(--moss)}
.nav__menu a em{font-family:var(--caps);font-style:normal;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime-ink);flex:none}

/* Handymenü: Unterpunkte kleiner und eingerückt. Ist das Menü länger als
   der Bildschirm, rollt es — oben wird nichts abgeschnitten. */
.drawer{justify-content:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:calc(36px + env(safe-area-inset-bottom))}
.drawer > :first-child{margin-top:auto}
.drawer > :last-child{margin-bottom:auto}
.drawer .drawer__sub{font-size:clamp(1.2rem,4.5vw,1.7rem);letter-spacing:.16em;color:var(--ink-2);padding-left:26px;position:relative}
.drawer .drawer__sub::before{content:"";position:absolute;left:2px;top:50%;width:14px;height:1px;background:var(--lime)}