:root{
  /* aus dem Salonfoto gemessen */
  --blush:#EDCBC3;
  --mint:#C9E4DA;
  --teal:#133135;
  /* Memphis-Akzente, aus den Wandformen abgeleitet */
  --sun:#F2C230;
  --coral:#E8674B;
  --cobalt:#2C5AA8;
  --paper:#FCF5F2;

  --step--1:clamp(.82rem,.8rem + .1vw,.9rem);
  --step-0:clamp(1rem,.97rem + .15vw,1.09rem);
  --step-1:clamp(1.2rem,1.1rem + .5vw,1.5rem);
  --step-2:clamp(1.6rem,1.35rem + 1.2vw,2.4rem);
  --step-3:clamp(2rem,1.5rem + 2.1vw,3.35rem);
  --gap:clamp(1.25rem,1rem + 1.5vw,2.5rem);
  --bleed:clamp(1.1rem,.6rem + 2.5vw,3rem);
}
*,*::before,*::after{box-sizing:border-box;}
body,h1,h2,h3,p,ul,ol,li,figure,blockquote{margin:0;padding:0;}
body{
  font-family:'Karla',system-ui,sans-serif;
  font-size:var(--step-0);
  line-height:1.62;
  color:var(--teal);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
a{color:inherit;}
ul,ol{list-style:none;}

.u-display{
  font-family:'Fraunces',Georgia,serif;
  font-variation-settings:'SOFT' 60,'WONK' 1;
  font-weight:700;
  line-height:1.09;
  letter-spacing:-.018em;
}
.u-mono{font-family:'Space Mono',ui-monospace,monospace;}
.u-wrap{width:min(72rem,100%);margin-inline:auto;padding-inline:var(--bleed);}
.u-eyebrow{
  font-family:'Space Mono',monospace;
  font-size:var(--step--1);
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cobalt);
}
:focus-visible{outline:3px solid var(--cobalt);outline-offset:3px;border-radius:2px;}
[id]{scroll-margin-top:5.5rem;}

/* ---------- Präsenzo-Leiste: der einzige Ort mit Präsenzo-Bezug ---------- */
.pz-bar{background:var(--teal);color:var(--paper);font-size:var(--step--1);}
.pz-bar__in{
  width:min(72rem,100%);margin-inline:auto;padding:.7rem var(--bleed);
  display:flex;flex-wrap:wrap;gap:.4rem 1rem;align-items:center;justify-content:center;
  text-align:center;
}
.pz-bar__cta{
  font-weight:700;color:var(--sun);text-decoration:underline;text-underline-offset:3px;
  white-space:nowrap;
}

/* ---------- Kopf ---------- */
.masthead{
  position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--paper) 88%,transparent);
  backdrop-filter:blur(12px);
  border-bottom:2px solid var(--teal);
}
.masthead__in{
  width:min(72rem,100%);margin-inline:auto;padding:.85rem var(--bleed);
  display:flex;align-items:center;gap:var(--gap);flex-wrap:wrap;
}
.brand{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:900;font-size:var(--step-1);letter-spacing:-.02em;text-decoration:none;}
.brand span{color:var(--coral);}
.sitenav{display:flex;gap:1.4rem;margin-inline-start:auto;flex-wrap:wrap;font-size:var(--step--1);font-weight:700;}
.sitenav a{text-decoration:none;padding-block:.2rem;border-bottom:2px solid transparent;}
.sitenav a:hover,.sitenav a[aria-current="page"]{border-bottom-color:var(--coral);}
.booking{
  background:var(--teal);color:var(--paper);text-decoration:none;
  padding:.7rem 1.15rem;border-radius:999px;font-weight:700;font-size:var(--step--1);
  white-space:nowrap;
}
.booking:hover{background:var(--cobalt);}

/* ---------- Hero ---------- */
.hero{padding-block:clamp(2rem,1rem + 4vw,4.5rem) 0;}
.hero__grid{display:grid;gap:var(--gap);grid-template-columns:1fr;}
@media (min-width:60rem){
  .hero__grid{grid-template-columns:1.02fr .98fr;align-items:center;}
}
.hero__kicker{display:block;margin-bottom:1.1rem;}
.hero h1{font-size:var(--step-3);max-width:22ch;}
.hero h1 em{font-style:normal;position:relative;white-space:nowrap;}
.squiggle{
  position:absolute;left:0;right:0;bottom:-.28em;width:100%;height:.34em;
  overflow:visible;pointer-events:none;
}
.squiggle path{
  fill:none;stroke:var(--coral);stroke-width:7;stroke-linecap:round;
  stroke-dasharray:520;stroke-dashoffset:520;
  animation:draw 1.1s .35s cubic-bezier(.22,.61,.36,1) forwards;
}
@keyframes draw{to{stroke-dashoffset:0;}}
.hero__lede{font-size:var(--step-1);line-height:1.45;max-width:34ch;margin-top:1.2rem;}
.hero__actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.8rem;}
.btn-solid{
  background:var(--coral);color:var(--paper);text-decoration:none;font-weight:700;
  padding:.9rem 1.5rem;border-radius:999px;
}
.btn-solid:hover{background:var(--teal);}
.btn-line{
  text-decoration:none;font-weight:700;padding:.9rem 1.5rem;border-radius:999px;
  border:2px solid var(--teal);
}
.btn-line:hover{background:var(--mint);}
.hero__figure{position:relative;}
.hero__figure img{
  width:100%;height:auto;aspect-ratio:5/4;
  object-fit:cover;object-position:50% 62%;
  border:3px solid var(--teal);border-radius:1.4rem;
}
.hero__tag{
  position:absolute;bottom:-.9rem;left:1.2rem;
  background:var(--mint);border:3px solid var(--teal);border-radius:999px;
  padding:.45rem 1rem;font-size:var(--step--1);font-weight:700;
}

/* ---------- Abschnittsrahmen ---------- */
.band{padding-block:clamp(3rem,2rem + 5vw,6rem);}
.band--mint{background:var(--mint);border-block:3px solid var(--teal);}
.band--blush{background:var(--blush);border-block:3px solid var(--teal);}
.band__head{max-width:46ch;margin-bottom:clamp(1.75rem,1rem + 2vw,3rem);}
.band__head h2{font-size:var(--step-2);margin-top:.7rem;}
.band__head p{margin-top:.8rem;}

/* ---------- Signatur: Lockentypologie ---------- */
.curl{display:grid;gap:var(--gap);grid-template-columns:1fr;}
@media (min-width:52rem){.curl{grid-template-columns:auto 1fr;align-items:start;}}
.curl__picker{
  display:grid;grid-template-columns:repeat(3,minmax(2.9rem,4.4rem));
  gap:.55rem;justify-content:start;
}
.curl__btn{
  font-family:'Space Mono',monospace;font-size:var(--step-0);font-weight:700;
  aspect-ratio:1;display:grid;place-items:center;cursor:pointer;
  background:var(--paper);color:var(--teal);
  border:3px solid var(--teal);border-radius:.7rem;
  transition:transform .16s,background-color .16s;
}
.curl__btn:hover{transform:translateY(-3px);background:var(--sun);}
.curl__btn[aria-selected="true"]{background:var(--cobalt);color:var(--paper);transform:translateY(-3px);}
.curl__panel{
  background:var(--paper);border:3px solid var(--teal);border-radius:1.2rem;
  padding:clamp(1.25rem,1rem + 1.5vw,2.1rem);
}
.curl__code{font-size:var(--step-2);display:block;line-height:1;}
.curl__name{font-size:var(--step-1);margin-top:.5rem;}
.curl__desc{margin-top:.9rem;max-width:48ch;}
.curl__meta{
  margin-top:1.4rem;padding-top:1.1rem;border-top:2px dashed var(--blush);
  display:grid;gap:.9rem;grid-template-columns:1fr;
}
@media (min-width:34rem){.curl__meta{grid-template-columns:1fr 1fr;}}
.curl__meta dt{font-family:'Space Mono',monospace;font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;color:var(--cobalt);}
.curl__meta dd{margin:.25rem 0 0;font-weight:700;}

/* ---------- Leistungen ---------- */
.price{border-top:3px solid var(--teal);}
.price__row{
  display:flex;flex-wrap:wrap;gap:.3rem 1.2rem;align-items:baseline;
  padding-block:1.15rem;border-bottom:2px solid color-mix(in srgb,var(--teal) 22%,transparent);
}
.price__name{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:700;font-size:var(--step-1);}
.price__note{flex:1 1 14rem;font-size:var(--step--1);}
.price__value{font-family:'Space Mono',monospace;font-weight:700;font-size:var(--step-1);margin-inline-start:auto;white-space:nowrap;}

/* ---------- Erstbesuch: echte Reihenfolge, darum nummeriert ---------- */
.steps{display:grid;gap:var(--gap);grid-template-columns:1fr;counter-reset:s;}
@media (min-width:48rem){.steps{grid-template-columns:repeat(3,1fr);}}
.step{background:var(--paper);border:3px solid var(--teal);border-radius:1.1rem;padding:1.5rem;counter-increment:s;}
.step::before{
  content:counter(s);
  font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:900;
  font-size:var(--step-2);line-height:1;color:var(--coral);display:block;margin-bottom:.5rem;
}
.step h3{font-size:var(--step-1);font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;}
.step p{margin-top:.5rem;font-size:var(--step--1);}

/* ---------- Termin ---------- */
.visit{display:grid;gap:var(--gap);grid-template-columns:1fr;}
@media (min-width:48rem){.visit{grid-template-columns:1fr 1fr;}}
.visit__card{background:var(--paper);border:3px solid var(--teal);border-radius:1.1rem;padding:1.6rem;}
.visit__card h3{font-size:var(--step--1);letter-spacing:.14em;text-transform:uppercase;font-family:'Space Mono',monospace;color:var(--cobalt);}
.visit__list{margin-top:1rem;display:grid;gap:.45rem;}
.visit__line{display:flex;justify-content:space-between;gap:1rem;font-size:var(--step--1);}
.visit__line span:last-child{font-family:'Space Mono',monospace;}
.visit__big{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:700;font-size:var(--step-1);margin-top:.9rem;}

.pagefoot{background:var(--teal);color:var(--paper);padding-block:2.5rem;font-size:var(--step--1);}
.pagefoot a{color:var(--sun);}
.pagefoot p + p{margin-top:.6rem;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .squiggle path{stroke-dashoffset:0;}
}

/* ================= Unterseiten ================= */
.pagehead{padding-block:clamp(2.25rem,1.5rem + 3vw,4rem) clamp(1.5rem,1rem + 2vw,2.5rem);}
.pagehead h1{font-size:var(--step-2);max-width:20ch;margin-top:.7rem;}
.pagehead p{margin-top:.9rem;max-width:52ch;font-size:var(--step-1);line-height:1.45;}

/* Team: Zuständigkeit nach Lockentyp, greift die Typologie der Startseite auf */
.team{display:grid;gap:var(--gap);grid-template-columns:1fr;}
@media (min-width:40rem){.team{grid-template-columns:1fr 1fr;}}
@media (min-width:64rem){.team{grid-template-columns:repeat(3,1fr);}}
.member{border:3px solid var(--teal);border-radius:1.1rem;padding:1.4rem;background:var(--paper);}
.member h3{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:700;font-size:var(--step-1);}
.member__role{font-size:var(--step--1);margin-top:.15rem;}
.member__range{
  margin-top:1rem;padding-top:.85rem;border-top:2px dashed var(--blush);
  font-family:'Space Mono',monospace;font-size:var(--step--1);font-weight:700;color:var(--cobalt);
  letter-spacing:.06em;
}

/* Was wir nicht tun */
.nope{display:grid;gap:.9rem;max-width:44ch;}
.nope li{display:flex;gap:.8rem;align-items:flex-start;}
.nope li::before{
  content:"×";flex:none;width:1.6rem;height:1.6rem;display:grid;place-items:center;
  background:var(--coral);color:var(--paper);border-radius:999px;
  font-weight:700;font-size:var(--step-0);line-height:1;margin-top:.1rem;
}

/* Fragen */
.faq{display:grid;gap:1.4rem;max-width:56ch;}
.faq h3{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:700;font-size:var(--step-1);}
.faq p{margin-top:.4rem;}

/* Vorbereitung */
.prep{display:grid;gap:.85rem;max-width:46ch;}
.prep li{display:flex;gap:.8rem;align-items:flex-start;}
.prep li::before{
  content:"✓";flex:none;width:1.6rem;height:1.6rem;display:grid;place-items:center;
  background:var(--cobalt);color:var(--paper);border-radius:999px;
  font-weight:700;font-size:var(--step--1);line-height:1;margin-top:.1rem;
}

/* Preis buendig links, sobald er auf eine eigene Zeile rutscht */
@media (max-width:44rem){
  .price__row{gap:.15rem;}
  .price__name{flex:1 1 100%;}
  .price__note{flex:1 1 100%;order:3;}
  .price__value{margin-inline-start:0;order:2;font-size:var(--step-0);}
}

/* Pflichtangabe nach PAngV: Endpreise fuer Verbraucher */
.tax-note{margin-top:1.1rem;font-size:var(--step--1);color:var(--teal);opacity:.72;}