:root{
  /* aus dem Salonfoto gemessen: Marmor, Messing, Nussbaum, Kerzenlicht */
  --onyx:#14100E;
  --velvet:#191A1D;
  --marble:#F3F0EA;
  --greige:#CFC6BA;
  --brass:#C39A4E;
  --walnut:#6E4A2B;
  --candle:#FAEEC8;

  --s--1:clamp(.76rem,.73rem + .12vw,.84rem);
  --s-0:clamp(1rem,.97rem + .14vw,1.08rem);
  --s-1:clamp(1.1rem,1.02rem + .35vw,1.32rem);
  --s-2:clamp(1.45rem,1.15rem + 1.35vw,2.35rem);
  --s-3:clamp(2rem,1.35rem + 2.9vw,3.9rem);
  --space:clamp(1.25rem,1rem + 1.5vw,2.5rem);
  --edge:clamp(1.1rem,.6rem + 2.5vw,3rem);
}
*,*::before,*::after{box-sizing:border-box;}
body,h1,h2,h3,p,ul,ol,li,figure,dl,dd{margin:0;padding:0;}
body{
  font-family:'Jost',system-ui,sans-serif;
  font-size:var(--s-0);line-height:1.7;font-weight:300;
  color:var(--marble);background:var(--onyx);
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;}
ul,ol{list-style:none;}
a{color:inherit;}
:focus-visible{outline:2px solid var(--brass);outline-offset:4px;}
[id]{scroll-margin-top:5rem;}

.m-display{font-family:'Italiana',Didot,serif;font-weight:400;line-height:1.12;letter-spacing:.01em;}
.m-wrap{width:min(64rem,100%);margin-inline:auto;padding-inline:var(--edge);}
.m-label{
  font-size:var(--s--1);letter-spacing:.34em;text-transform:uppercase;
  color:var(--brass);font-weight:400;
}

/* ---------- Signatur: die Mittelachse des Raums ---------- */
.axis{position:relative;}
@media (min-width:52rem){
  .axis::before{
    content:"";position:absolute;inset-block:0;left:50%;width:1px;
    background:linear-gradient(var(--brass),transparent 92%);
    opacity:.3;pointer-events:none;
  }
}
/* Messingregel, die von der Mitte nach beiden Seiten laeuft */
.rule{
  display:block;width:min(18rem,60%);height:1px;margin:1.5rem auto;
  background:linear-gradient(90deg,transparent,var(--brass),transparent);
}

/* ---------- Präsenzo-Leiste ---------- */
.pz{background:var(--velvet);border-bottom:1px solid rgba(195,154,78,.28);font-size:var(--s--1);}
.pz__in{
  width:min(64rem,100%);margin-inline:auto;padding:.75rem var(--edge);
  display:flex;flex-wrap:wrap;gap:.35rem 1rem;align-items:center;justify-content:center;text-align:center;
  letter-spacing:.04em;
}
.pz__cta{color:var(--brass);text-decoration:underline;text-underline-offset:4px;white-space:nowrap;}

/* ---------- Kopf: Navigation links und rechts, Name in der Mitte ---------- */
.head{border-bottom:1px solid rgba(195,154,78,.22);}
.head__in{
  width:min(64rem,100%);margin-inline:auto;padding:1.3rem var(--edge);
  display:grid;gap:.6rem 1.5rem;grid-template-columns:1fr;justify-items:center;text-align:center;
}
@media (min-width:52rem){
  .head__in{grid-template-columns:1fr auto 1fr;align-items:center;}
  .head__nav--left{justify-self:end;}
  .head__nav--right{justify-self:start;}
}
.house{
  font-family:'Italiana',serif;font-size:var(--s-2);letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;line-height:1;
}
.head__nav{display:flex;gap:1.6rem;flex-wrap:wrap;justify-content:center;font-size:var(--s--1);letter-spacing:.18em;text-transform:uppercase;}
.head__nav a{text-decoration:none;padding-bottom:.25rem;border-bottom:1px solid transparent;color:var(--greige);}
.head__nav a:hover,.head__nav a[aria-current="page"]{color:var(--marble);border-bottom-color:var(--brass);}

/* ---------- Hero ---------- */
.opening{padding-block:clamp(2.75rem,2rem + 4vw,5.5rem) 0;text-align:center;}
.opening h1{font-size:var(--s-3);max-width:16ch;margin-inline:auto;margin-top:1.4rem;}
.opening__lede{
  max-width:44ch;margin:1.6rem auto 0;color:var(--greige);
  font-size:var(--s-1);line-height:1.6;
}
.opening__figure{margin-top:clamp(2rem,1.5rem + 2.5vw,3.5rem);}
.opening__figure img{
  width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;
  border-block:1px solid rgba(195,154,78,.35);
}
.opening__cap{
  margin-top:.9rem;font-size:var(--s--1);letter-spacing:.2em;
  text-transform:uppercase;color:var(--brass);
}

/* ---------- Abschnitte ---------- */
.chapter{padding-block:clamp(3rem,2.25rem + 4vw,6rem);}
.chapter--pale{background:var(--marble);color:var(--onyx);}
.chapter--pale .m-label{color:var(--walnut);}
.chapter--pale .rule{background:linear-gradient(90deg,transparent,var(--walnut),transparent);}
.chapter__head{text-align:center;max-width:44ch;margin-inline:auto;}
.chapter__head h2{font-size:var(--s-2);margin-top:1rem;}
.chapter__head p{margin-top:1rem;color:var(--greige);}
.chapter--pale .chapter__head p{color:#5A5148;}

/* Leistungen: zwei gespiegelte Spalten an der Achse */
.pair{display:grid;gap:var(--space);grid-template-columns:1fr;margin-top:clamp(2rem,1.5rem + 2vw,3.25rem);}
@media (min-width:52rem){.pair{grid-template-columns:1fr 1fr;column-gap:clamp(3rem,6vw,6rem);}}
.offer{padding-block:1.4rem;border-top:1px solid rgba(195,154,78,.3);}
.chapter--pale .offer{border-top-color:rgba(110,74,43,.3);}
.offer h3{font-family:'Italiana',serif;font-size:var(--s-1);letter-spacing:.08em;text-transform:uppercase;}
.offer p{margin-top:.5rem;color:var(--greige);font-size:var(--s--1);line-height:1.75;}
.chapter--pale .offer p{color:#5A5148;}
@media (min-width:52rem){
  .pair--mirror .offer:nth-child(odd){text-align:right;}
}

/* Knopf */
.btn-brass{
  display:inline-block;text-decoration:none;font-size:var(--s--1);
  letter-spacing:.22em;text-transform:uppercase;
  border:1px solid var(--brass);color:var(--brass);
  padding:.95rem 2.2rem;
}
.btn-brass:hover{background:var(--brass);color:var(--onyx);}
.chapter--pale .btn-brass{border-color:var(--walnut);color:var(--walnut);}
.chapter--pale .btn-brass:hover{background:var(--walnut);color:var(--marble);}

/* Sprechstunde */
.hours{display:grid;gap:var(--space);grid-template-columns:1fr;max-width:46rem;margin-inline:auto;}
@media (min-width:44rem){.hours{grid-template-columns:1fr 1fr;}}
.hours__col h3{font-size:var(--s--1);letter-spacing:.24em;text-transform:uppercase;color:var(--brass);margin-bottom:1rem;}
.chapter--pale .hours__col h3{color:var(--walnut);}
.hours__line{display:flex;justify-content:space-between;gap:1rem;padding-block:.45rem;border-bottom:1px solid rgba(195,154,78,.18);font-size:var(--s--1);}
.chapter--pale .hours__line{border-bottom-color:rgba(110,74,43,.18);}

/* Preise */
.tariff{max-width:46rem;margin-inline:auto;}
.tariff__row{
  display:flex;flex-wrap:wrap;gap:.3rem 1.5rem;align-items:baseline;
  padding-block:1.3rem;border-bottom:1px solid rgba(195,154,78,.22);
}
.tariff__name{font-family:'Italiana',serif;font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;}
.tariff__note{flex:1 1 15rem;font-size:var(--s--1);color:var(--greige);}
.tariff__fee{margin-inline-start:auto;letter-spacing:.1em;white-space:nowrap;}
@media (max-width:40rem){
  .tariff__name{flex:1 1 100%;}
  .tariff__note{flex:1 1 100%;order:3;}
  .tariff__fee{margin-inline-start:0;order:2;color:var(--brass);}
}

/* Unterseiten */
.pagetop{padding-block:clamp(2.5rem,2rem + 3vw,4.5rem) 0;text-align:center;}
.pagetop h1{font-size:var(--s-2);max-width:20ch;margin:1rem auto 0;}
.pagetop p{max-width:46ch;margin:1.2rem auto 0;color:var(--greige);}

.folio{display:grid;gap:var(--space);grid-template-columns:1fr;margin-top:clamp(2rem,1.5rem + 2vw,3rem);}
@media (min-width:46rem){.folio{grid-template-columns:1fr 1fr;}}
@media (min-width:64rem){.folio{grid-template-columns:repeat(3,1fr);}}
.person{text-align:center;padding:1.75rem 1.25rem;border:1px solid rgba(195,154,78,.28);}
.person h3{font-family:'Italiana',serif;font-size:var(--s-1);letter-spacing:.1em;text-transform:uppercase;}
.person__rank{margin-top:.4rem;font-size:var(--s--1);color:var(--brass);letter-spacing:.16em;text-transform:uppercase;}
.person__note{margin-top:.9rem;font-size:var(--s--1);color:var(--greige);}

.notice{max-width:46rem;margin-inline:auto;display:grid;gap:1.75rem;}
.notice h3{font-family:'Italiana',serif;font-size:var(--s-1);letter-spacing:.06em;text-transform:uppercase;}
.notice p{margin-top:.5rem;color:var(--greige);}
.chapter--pale .notice p{color:#5A5148;}

.foot{border-top:1px solid rgba(195,154,78,.22);padding-block:2.5rem;text-align:center;font-size:var(--s--1);color:var(--greige);}
.foot a{color:var(--brass);}
.foot p + p{margin-top:.6rem;}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important;}
}

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