:root {
  --ink:#25241f;
  --cream:#f4efe8;
  --paper:#fbf9f5;
  --taupe:#b6aa92;
  --rose:#b87671;
  --line:#25241f29;
  --display:"Italiana",Georgia,serif;
  --sans:"DM Sans",Arial,sans-serif;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  margin: 0;
  font-size: 16px;
  line-height: 1.6;
  overflow-x: hidden;
}
a {
  color: inherit;
  text-decoration: none;
}
img {
  max-width: 100%;
  display: block;
}
.skip-link {
  z-index: 99;
  background: #fff;
  padding: .75rem 1rem;
  position: fixed;
  top: -5rem;
  left: 1rem;
}
.skip-link:focus {
  top: 1rem;
}
.sr-only {
  clip: rect(0, 0, 0, 0);
  width: 1px;
  height: 1px;
  position: absolute;
  overflow: hidden;
}
.site-header {
  z-index: 10;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100px;
  padding: 0 clamp(1.25rem, 5vw, 5rem);
  display: flex;
  position: absolute;
}
.brand {
  width: 180px;
}
.brand img {
  width: 100%;
  height: auto;
}
.site-header nav {
  text-transform: uppercase;
  letter-spacing: .12em;
  align-items: center;
  gap: 2rem;
  font-size: .82rem;
  display: flex;
}
.site-header nav > a:not(.nav-cta) {
  position: relative;
}
.site-header nav > a:not(.nav-cta):after {
  content: "";
  background: currentColor;
  width: 0;
  height: 1px;
  transition: all .3s;
  position: absolute;
  bottom: -4px;
  left: 0;
}
.site-header nav > a:hover:after {
  width: 100%;
}
.nav-cta,
.button {
  border-radius: 100px;
  justify-content: space-between;
  align-items: center;
  gap: 1.5rem;
  transition: all .25s;
  display: inline-flex;
}
.nav-cta {
  background: var(--ink);
  color: #fff;
  padding: .85rem 1.25rem;
}
.button {
  min-width: 210px;
  padding: 1rem 1.3rem;
  font-size: .9rem;
  font-weight: 600;
}
.button:hover {
  transform: translateY(-2px);
}
.button-primary {
  background: var(--ink);
  color: #fff;
}
.button-light {
  background: var(--cream);
  color: var(--ink);
}
.menu-toggle {
  background: 0 0;
  border: 0;
  padding: .5rem;
  display: none;
}
.hero {
  background: var(--cream);
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(2rem, 6vw, 7rem);
  min-height: 100vh;
  padding: 140px clamp(1.25rem, 5vw, 5rem) 70px;
  display: grid;
  position: relative;
}
.hero:before {
  content: "";
  border: 1px solid #b876714d;
  border-radius: 50%;
  width: 190px;
  height: 190px;
  position: absolute;
  top: 14%;
  left: 52%;
}
.eyebrow {
  text-transform: uppercase;
  letter-spacing: .25em;
  color: #746b5d;
  margin: 0 0 1.4rem;
  font-size: .72rem;
  font-weight: 600;
}
.hero h1,
.section h2,
.contact h2 {
  font-family: var(--display);
  letter-spacing: -.02em;
  margin: 0;
  font-weight: 400;
  line-height: .94;
}
.hero h1 {
  font-size: clamp(4.1rem, 7vw, 8rem);
}
em {
  color: var(--rose);
  font-weight: 400;
}
.intro {
  color: #5f5a50;
  max-width: 540px;
  margin: 2rem 0;
  font-size: clamp(1rem, 1.4vw, 1.25rem);
}
.hero-actions {
  align-items: center;
  gap: 2rem;
  display: flex;
}
.text-link {
  border-bottom: 1px solid;
  padding-bottom: .25rem;
  font-size: .82rem;
}
.hero-visual {
  justify-self: center;
  width: min(100%, 570px);
  position: relative;
}
.portrait-frame {
  aspect-ratio: .79;
  border-radius: 48% 48% 10px 10px;
  overflow: hidden;
}
.portrait-frame img {
  object-fit: cover;
  object-position: center 30%;
  width: 100%;
  height: 100%;
}
.hero-note {
  background: var(--rose);
  color: #fff;
  text-align: center;
  border-radius: 50%;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 160px;
  height: 160px;
  display: flex;
  position: absolute;
  bottom: 10%;
  right: -8%;
  transform: rotate(5deg);
}
.hero-note span {
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .65rem;
}
.hero-note strong {
  font-family: var(--display);
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1.15;
}
.marquee {
  white-space: nowrap;
  background: var(--ink);
  color: #fff;
  font-family: var(--display);
  letter-spacing: .05em;
  padding: 1rem 0;
  font-size: 1.3rem;
  overflow: hidden;
}
.marquee div {
  width: max-content;
  animation: 25s linear infinite move;
}
.marquee span {
  color: var(--rose);
  margin: 0 2rem;
}
@keyframes move {
  to {
    transform: translate(-40%);
  }
}
.section {
  padding: clamp(5rem, 10vw, 10rem) clamp(1.25rem, 7vw, 7rem);
}
.section-label {
  text-transform: uppercase;
  letter-spacing: .18em;
  color: #777064;
  gap: 1rem;
  font-size: .72rem;
  display: flex;
}
.section-label span {
  color: var(--rose);
}
.about {
  grid-template-columns: .65fr 1.45fr .9fr;
  align-items: start;
  gap: clamp(2rem, 5vw, 6rem);
  display: grid;
}
.about h2,
.services h2 {
  font-size: clamp(3.3rem, 6vw, 6.6rem);
}
.about-copy > p:not(.eyebrow) {
  color: #686156;
  max-width: 680px;
  margin: 2.2rem 0 0;
  font-size: 1.1rem;
}
.signature {
  color: var(--rose);
  margin-top: 2rem;
  font-family: cursive;
  font-size: 2.5rem;
  display: inline-block;
  transform: rotate(-7deg);
}
.promise {
  border-top: 1px solid var(--line);
  margin-top: 6rem;
  padding-top: 2rem;
}
.promise-mark {
  border: 1px solid var(--taupe);
  width: 55px;
  height: 55px;
  font-family: var(--display);
  color: var(--rose);
  border-radius: 50%;
  place-items: center;
  display: grid;
}
.promise p {
  font-family: var(--display);
  font-size: 1.35rem;
  line-height: 1.45;
}
.services {
  background: var(--cream);
  grid-template-columns: .55fr 1.6fr;
  column-gap: 6vw;
  display: grid;
}
.services-head,
.service-list,
.services-note {
  grid-column: 2;
}
.service-list {
  border-top: 1px solid var(--line);
  margin-top: 4rem;
}
.service {
  border-bottom: 1px solid var(--line);
  grid-template-columns: 50px 1fr 40px;
  align-items: start;
  gap: 1.5rem;
  padding: 2rem 0;
  display: grid;
}
.service > span {
  color: var(--rose);
  font-size: .75rem;
}
.service h3 {
  font-family: var(--display);
  margin: 0;
  font-size: clamp(1.9rem, 3vw, 3rem);
  font-weight: 400;
}
.service p {
  color: #70695e;
  max-width: 520px;
  margin: .35rem 0 0;
}
.service i {
  font-size: 1.4rem;
  font-style: normal;
  transition: all .25s;
}
.service:hover i {
  transform: translate(4px, -4px);
}
.services-note {
  color: #716b60;
  margin-top: 2rem;
  font-size: .82rem;
}
.contact {
  background: var(--ink);
  color: #fff;
  grid-template-columns: 1fr 1.2fr;
  gap: 8vw;
  padding: clamp(5rem, 9vw, 9rem) clamp(1.25rem, 7vw, 7rem);
  display: grid;
}
.contact .eyebrow {
  color: #bbb2a3;
}
.contact h2 {
  font-size: clamp(3.5rem, 6vw, 6.5rem);
}
.contact-intro > p:not(.eyebrow) {
  color: #c9c3b9;
  max-width: 450px;
  margin: 2rem 0;
}
.contact-grid {
  background: #ffffff2e;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  display: grid;
}
.contact-grid a {
  background: var(--ink);
  flex-direction: column;
  min-height: 220px;
  padding: 2rem;
  transition: all .25s;
  display: flex;
}
.contact-grid a:hover {
  background: #302f29;
}
.contact-grid a:last-child {
  grid-column: 1/-1;
}
.contact-grid small {
  text-transform: uppercase;
  letter-spacing: .2em;
  color: #aaa294;
}
.contact-grid strong {
  font-family: var(--display);
  margin: auto 0;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.25;
}
.contact-grid span {
  color: #c2bbaf;
  font-size: .72rem;
}
footer {
  text-transform: uppercase;
  letter-spacing: .1em;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  padding: 2rem clamp(1.25rem, 5vw, 5rem);
  font-size: .75rem;
  display: flex;
}
footer img {
  width: 130px;
}
footer div {
  gap: 1.5rem;
  display: flex;
}
.mobile-call {
  display: none;
}
.reveal {
  opacity: 0;
  transition: opacity .8s, transform .8s;
  transform: translateY(24px);
}
.reveal.visible {
  opacity: 1;
  transform: none;
}
@media (max-width: 900px) {
  .site-header {
    height: 82px;
  }
  .brand {
    width: 145px;
  }
  .menu-toggle {
    z-index: 2;
    gap: 5px;
    display: grid;
  }
  .menu-toggle span:not(.sr-only) {
    background: var(--ink);
    width: 26px;
    height: 1px;
    transition: all .25s;
    display: block;
  }
  .menu-toggle[aria-expanded=true] span:first-child {
    transform: translateY(6px)rotate(45deg);
  }
  .menu-toggle[aria-expanded=true] span:nth-child(2) {
    opacity: 0;
  }
  .menu-toggle[aria-expanded=true] span:nth-child(3) {
    transform: translateY(-6px)rotate(-45deg);
  }
  .site-header nav {
    background: var(--cream);
    font-family: var(--display);
    text-transform: none;
    opacity: 0;
    visibility: hidden;
    flex-direction: column;
    justify-content: center;
    font-size: 2rem;
    transition: all .25s;
    display: flex;
    position: fixed;
    inset: 0;
  }
  .site-header nav.open {
    opacity: 1;
    visibility: visible;
  }
  .nav-cta {
    font-family: var(--sans);
    text-transform: uppercase;
    font-size: .8rem;
  }
  .hero {
    grid-template-columns: 1fr;
    padding-top: 120px;
  }
  .hero:before {
    display: none;
  }
  .hero h1 {
    font-size: clamp(3.8rem, 15vw, 6.5rem);
  }
  .hero-visual {
    width: 88%;
    margin-top: 1rem;
  }
  .hero-note {
    width: 125px;
    height: 125px;
    right: -8%;
  }
  .about {
    grid-template-columns: 1fr;
  }
  .about-copy {
    margin-top: 2rem;
  }
  .promise {
    margin-top: 1rem;
  }
  .services {
    display: block;
  }
  .services-head {
    margin-top: 2rem;
  }
  .contact {
    grid-template-columns: 1fr;
  }
  .contact-grid {
    margin-top: 2rem;
  }
}
@media (max-width: 600px) {
  body {
    padding-bottom: 70px;
  }
  .hero {
    min-height: auto;
    padding-bottom: 4rem;
  }
  .hero-actions {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }
  .portrait-frame {
    border-radius: 46% 46% 6px 6px;
  }
  .hero-note {
    width: 110px;
    height: 110px;
    bottom: 5%;
    right: -5%;
  }
  .hero-note strong {
    font-size: 1.05rem;
  }
  .section {
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
  .about h2,
  .services h2,
  .contact h2 {
    font-size: 3.3rem;
  }
  .service {
    grid-template-columns: 30px 1fr 20px;
    gap: .7rem;
  }
  .service h3 {
    font-size: 1.85rem;
  }
  .contact-grid {
    grid-template-columns: 1fr;
  }
  .contact-grid a:last-child {
    grid-column: auto;
  }
  .contact-grid a {
    min-height: 190px;
    padding: 1.5rem;
  }
  footer {
    flex-direction: column;
    align-items: flex-start;
  }
  footer div {
    flex-wrap: wrap;
  }
  .mobile-call {
    background: var(--rose);
    color: #fff;
    z-index: 20;
    border-radius: 100px;
    justify-content: space-between;
    align-items: center;
    padding: .9rem 1.2rem;
    font-size: .85rem;
    font-weight: 600;
    display: flex;
    position: fixed;
    bottom: 10px;
    left: 12px;
    right: 12px;
    box-shadow: 0 8px 30px #00000040;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  .marquee div {
    animation: none;
  }
  .reveal {
    opacity: 1;
    transition: none;
    transform: none;
  }
}
.appointment {
  grid-template-columns: .55fr 1fr 1fr;
  align-items: start;
  gap: clamp(2rem, 5vw, 6rem);
  display: grid;
}
.appointment-intro h2 {
  font-family: var(--display);
  margin: 0;
  font-size: clamp(3.3rem, 5vw, 5.8rem);
  font-weight: 400;
  line-height: .96;
}
.appointment-intro > p:last-child {
  color: #6d665b;
  max-width: 510px;
  margin-top: 2rem;
}
.appointment-form {
  background: var(--cream);
  border-radius: 4px;
  gap: 1.5rem;
  padding: clamp(1.5rem, 4vw, 3rem);
  display: grid;
}
.field-row {
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  display: grid;
}
.appointment-form label {
  gap: .5rem;
  display: grid;
}
.appointment-form label > span {
  text-transform: uppercase;
  letter-spacing: .15em;
  font-size: .7rem;
  font-weight: 600;
}
.appointment-form input,
.appointment-form select {
  width: 100%;
  color: var(--ink);
  font: inherit;
  background: 0 0;
  border: 0;
  border-bottom: 1px solid #9f9687;
  border-radius: 0;
  outline: none;
  padding: .75rem .1rem;
}
.appointment-form input:focus,
.appointment-form select:focus {
  border-bottom-color: var(--rose);
  box-shadow: 0 1px 0 var(--rose);
}
.appointment-form select {
  cursor: pointer;
}
.appointment-form .button {
  cursor: pointer;
  border: 0;
  width: 100%;
  margin-top: .5rem;
}
.form-note {
  color: #766e62;
  margin: 0;
  font-size: .72rem;
  line-height: 1.5;
}
.form-status {
  color: var(--rose);
  min-height: 1.2em;
  margin: 0;
  font-size: .8rem;
  font-weight: 600;
}
@media (max-width: 900px) {
  .appointment {
    grid-template-columns: 1fr;
  }
  .appointment-intro {
    margin-top: 1rem;
  }
  .appointment-form {
    max-width: 680px;
  }
}
@media (max-width: 600px) {
  .appointment-intro h2 {
    font-size: 3.3rem;
  }
  .field-row {
    grid-template-columns: 1fr;
  }
}
:root {
  --display:var(--font-italiana),Georgia,serif;
  --sans:var(--font-dm),Arial,sans-serif;
}

.hero-actions .button,.contact-intro .button{min-width:0;width:max-content;gap:.9rem;padding-left:1.15rem;padding-right:1.15rem}

/* Wohlfühloase */
.oasis{background:#eee7e0}.oasis-head{display:grid;grid-template-columns:1.35fr .8fr;gap:6vw;align-items:end;margin-bottom:clamp(2.5rem,6vw,5rem)}.oasis h2{font-family:var(--display);font-size:clamp(3.5rem,7vw,7.5rem);font-weight:400;line-height:.9;letter-spacing:-.025em;margin:0}.oasis-copy{max-width:470px;color:#655f55;padding-bottom:.7rem}.oasis-copy p{font-size:1.05rem;margin:0 0 1.8rem}.oasis-gallery{display:grid;grid-template-columns:1.15fr .85fr 1fr;grid-template-rows:minmax(260px,34vw) minmax(220px,28vw);gap:clamp(.65rem,1.4vw,1.25rem)}.oasis-image{margin:0;overflow:hidden;background:#ddd4cb;position:relative}.oasis-image-main{grid-row:span 2}.oasis-image-wide{grid-column:3;grid-row:span 2}.oasis-image img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}.oasis-image:hover img{transform:scale(1.025)}.oasis-image-detail img{object-position:center 42%}.oasis-image-wide img{object-position:center center}@media(max-width:900px){.oasis-head{grid-template-columns:1fr}.oasis-gallery{grid-template-columns:1.1fr .9fr;grid-template-rows:repeat(3,minmax(260px,55vw))}.oasis-image-main{grid-row:span 2}.oasis-image-wide{grid-column:1/-1;grid-row:auto}.oasis-image-wide img{object-position:center 55%}}@media(max-width:600px){.oasis-gallery{grid-template-columns:1fr 1fr;grid-template-rows:90vw 58vw 58vw}.oasis-image-main{grid-column:1/-1;grid-row:auto}.oasis-image-wide{grid-column:1/-1}.oasis h2{font-size:3.7rem}.oasis-copy p{font-size:1rem}}
/* Three-image Wohlfühloase layout */
.oasis-gallery{grid-template-columns:1.15fr .85fr}
/* Service rows without decorative arrows */
.service{grid-template-columns:50px 1fr}.service i{display:none}@media(max-width:600px){.service{grid-template-columns:30px 1fr}}
@media(max-width:900px){.oasis-gallery{grid-template-rows:repeat(2,minmax(260px,55vw))}}
@media(max-width:600px){.oasis-gallery{grid-template-rows:90vw 58vw}}
.services .service .service-toggle{right:.25rem;top:2.35rem;width:auto;height:auto;display:block;font-size:.66rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;transition:color .25s ease}.services .service.is-open .service-toggle{transform:none}.services .service:hover .service-toggle,.services .service.is-open .service-toggle{color:var(--ink)}
.services .service .service-detail{grid-template-columns:minmax(0,1fr) minmax(280px,440px)}.services .service.is-open .service-detail{max-height:680px}.services .service .service-detail img{height:300px}@media(max-width:600px){.services .service .service-detail{grid-template-columns:1fr}.services .service.is-open .service-detail{max-height:900px}.services .service .service-detail img{height:78vw;max-height:420px}}
@media(max-width:600px){.services .service .service-toggle{position:static;grid-column:2;justify-self:start;margin-top:.45rem;width:auto;height:auto}.services .service .service-detail{grid-column:1/-1}}
.cookie-notice{position:fixed;z-index:60;left:1rem;right:1rem;bottom:1rem;max-width:780px;margin:auto;background:var(--ink);color:#fff;padding:1rem 1.1rem;box-shadow:0 12px 35px rgba(0,0,0,.25);display:flex;align-items:center;gap:1rem}.cookie-notice p{margin:0;flex:1;font-size:.84rem;line-height:1.5}.cookie-notice a{text-decoration:underline;text-underline-offset:3px}.cookie-notice button{border:0;border-radius:100px;padding:.7rem 1rem;background:var(--rose);color:#fff;font-weight:700;white-space:nowrap;cursor:pointer}@media(max-width:600px){.cookie-notice{bottom:5.2rem;align-items:flex-start;flex-direction:column}.cookie-notice button{width:100%}}
.honeypot-fields{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important}
.site-header nav{gap:clamp(.8rem,1.7vw,2rem)}@media(min-width:901px) and (max-width:1120px){.site-header{padding-inline:1.5rem}.brand{width:145px}.site-header nav{font-size:.72rem}.nav-cta{padding:.75rem 1rem}}
.marquee>div{display:flex;width:max-content;animation:marquee-seamless 32s linear infinite}.marquee .marquee-track{display:block;flex:none;color:#fff;margin:0}.marquee .marquee-track b{font-weight:400;color:var(--rose);margin:0 2rem}@keyframes marquee-seamless{to{transform:translateX(-25%)}}@media(prefers-reduced-motion:reduce){.marquee>div{animation:none}}
.service{position:relative;cursor:pointer}.service:focus-visible{outline:2px solid var(--rose);outline-offset:6px}.service-toggle{position:absolute;right:.25rem;top:2rem;width:2rem;height:2rem;display:grid;place-items:center;font-family:var(--sans);font-size:1.35rem;color:var(--rose);transition:transform .3s ease}.service.is-open .service-toggle{transform:rotate(45deg)}.service-detail{grid-column:2/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,340px);gap:clamp(1.5rem,4vw,4rem);max-height:0;opacity:0;overflow:hidden;transition:max-height .55s ease,opacity .35s ease,padding .55s ease;padding-top:0}.service.is-open .service-detail{max-height:520px;opacity:1;padding-top:1.6rem}.service-detail-copy small{display:block;text-transform:uppercase;letter-spacing:.2em;font-size:.65rem;color:var(--rose);margin-bottom:.7rem}.service-detail-copy p{max-width:590px;font-size:1rem;line-height:1.75;margin:0}.service-detail figure{margin:0}.service-detail img{width:100%;height:220px;object-fit:cover}.service-detail figcaption{font-size:.65rem;color:#8a8175;margin-top:.45rem;letter-spacing:.04em}@media(max-width:600px){.service-toggle{right:0;top:1.8rem}.service-detail{grid-column:1/-1;grid-template-columns:1fr}.service.is-open .service-detail{max-height:760px;padding-top:1.25rem}.service-detail img{height:65vw;max-height:320px}}