:root {
  --paper: #fff9f6;
  --paper-2: #fdf0eb;
  --ink: #302b2a;
  --muted: #6d605d;
  --rose: #a9585d;
  --rose-dark: #654044;
  --clay: #d88d85;
  --line: rgba(48,43,42,.16);
  --serif: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, Georgia, serif;
  --sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }

.site-header {
  width: min(1400px, calc(100% - 48px));
  margin: 0 auto;
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  padding-block: 12px;
  position: relative;
  z-index: 20;
}
.brand { grid-column:2; display:flex; align-items:center; width:max-content; max-width:100%; text-decoration:none; transform:translateY(40px); }
.brand-logo { display:block; width:375px; height:auto; margin-block:-12px; mix-blend-mode:multiply; }
.nav { grid-column:3; justify-self:end; display:flex; gap:26px; align-items:center; }
.nav a { text-decoration:none; font-size:13px; letter-spacing:.045em; position:relative; }
.nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-7px; height:1px; background:var(--ink); transition:right .25s ease; }
.nav a:hover::after { right:0; }
.nav-toggle { display:none; border:0; background:none; font:inherit; color:inherit; }

.section-shell { width:min(1400px, calc(100% - 48px)); margin-inline:auto; }
.hero { min-height: calc(100vh - 260px); display:grid; grid-template-columns: 1.03fr .97fr; gap:60px; align-items:center; padding-block:72px; }
.hero-copy { align-self:start; }
.eyebrow { margin:0 0 26px; font-size:11px; font-weight:700; letter-spacing:.19em; text-transform:uppercase; color:var(--rose-dark); }
.hero h1, h2 { font-family:var(--serif); font-weight:400; letter-spacing:-.045em; }
.hero h1 { margin:0; font-size:clamp(4.3rem, 8vw, 9rem); line-height:.82; }
.hero h1 em { font-weight:400; color:var(--rose); }
.hero-lead { max-width:620px; margin:42px 0 0; font-size:clamp(1.05rem, 1.8vw, 1.35rem); color:var(--muted); }
.hero-links { margin-top:42px; display:flex; flex-wrap:wrap; gap:26px; }
.text-link { display:inline-flex; align-items:center; gap:14px; text-decoration:none; padding-bottom:5px; border-bottom:1px solid var(--ink); font-size:13px; font-weight:600; letter-spacing:.035em; }
.text-link span { font-size:18px; transition:transform .2s ease; }
.text-link:hover span { transform:translate(3px, 3px); }
.text-link.muted { border-color:transparent; color:var(--muted); }
.hero-visual { min-height:640px; position:relative; }
.hero-image {
  position:absolute; inset:0; border-radius: 48% 48% 18px 18px / 18% 18% 18px 18px;
  background:
    linear-gradient(180deg, rgba(48,43,42,.04), rgba(48,43,42,.15)),
    url("bilder/collage.png") center/cover no-repeat,
    linear-gradient(135deg,#e9c4bc,#f8e7e1);
  box-shadow:0 25px 70px rgba(84,55,55,.14);
}
.floating-note { position:absolute; right:-12px; bottom:38px; background:var(--paper-2); padding:16px 20px; font-family:var(--serif); font-style:italic; font-size:22px; letter-spacing:-.025em; color:var(--rose-dark); box-shadow:0 15px 40px rgba(84,55,55,.1); }

.intro { display:grid; grid-template-columns:1fr 1fr; gap:90px; padding-block:150px; border-top:1px solid var(--line); }
.intro h2, .section-head h2, .about h2, .principles h2, .flow h2, .contact h2 { margin:0; font-size:clamp(3.3rem,6.2vw,7rem); line-height:.92; }
.intro-copy { padding-top:46px; max-width:640px; }
.intro-copy p { font-size:clamp(1.05rem,1.7vw,1.3rem); margin:0 0 24px; }

.treatments { background:var(--paper-2); padding:145px 0 160px; }
.section-head { margin-bottom:70px; }
.treatment-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.treatment-card { min-height:365px; margin:0; padding:0; border:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .3s ease, transform .3s ease; }
.treatment-card:hover { background:#fff; transform:translateY(-4px); }
.treatment-card.featured { background:var(--rose-dark); color:#fff9f6; }
.treatment-card summary { min-height:365px; padding:34px; display:flex; flex-direction:column; justify-content:space-between; gap:24px; list-style:none; font-size:inherit; font-weight:inherit; letter-spacing:normal; }
.treatment-card summary::-webkit-details-marker { display:none; }
.treatment-card summary:focus-visible { outline:2px solid var(--clay); outline-offset:-4px; }
.card-action { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-top:18px; border-top:1px solid currentColor; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; opacity:.8; }
.card-action span { font-size:20px; font-weight:400; line-height:1; transition:transform .2s ease; }
.treatment-card[open] .card-action span { transform:rotate(45deg); }
.card-more { padding:0 34px 34px; }
.card-more img { display:block; width:100%; aspect-ratio:4 / 3; margin-bottom:20px; object-fit:cover; border-radius:4px; }
.card-more p { max-width:38ch; margin:0; font-size:14px; line-height:1.7; opacity:.85; }
.card-more p + p { margin-top:14px; }
.card-more h4 { margin:24px 0 10px; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.card-more ul { margin:0; padding-left:20px; color:inherit; font-size:14px; line-height:1.7; opacity:.85; }
.card-more li + li { margin-top:5px; }
.card-number { font-family:var(--serif); font-style:italic; opacity:.65; }
.card-kicker { margin:0 0 13px; font-size:10px; letter-spacing:.17em; text-transform:uppercase; opacity:.72; }
.treatment-card h3 { margin:0 0 16px; font-family:var(--serif); font-size:clamp(1.8rem,3vw,2.8rem); font-weight:400; line-height:1; letter-spacing:-.025em; }
.treatment-card summary p:last-child { max-width:360px; margin:0; font-size:14px; opacity:.78; }

.about { display:grid; grid-template-columns:.9fr 1.1fr; gap:9vw; align-items:center; padding-block:160px; }
.portrait-photo { display:block; width:100%; height:690px; object-fit:cover; border-radius:260px 260px 20px 20px; }
.about-copy { max-width:670px; }
.about h2 { color:var(--rose-dark); }
.large-copy { margin:38px 0 20px; font-family:var(--serif); font-size:clamp(1.45rem,2.5vw,2rem); line-height:1.35; }
details { margin-top:32px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px 0; }
summary { cursor:pointer; font-size:13px; font-weight:700; letter-spacing:.04em; }
details ul { padding-left:20px; margin:22px 0 6px; color:var(--muted); }

.principles { background:#f5ded8; padding:145px 0; }
.principles-grid { display:grid; grid-template-columns:1.35fr repeat(3,1fr); gap:0; }
.principles-title { padding-right:60px; }
.principle { border-left:1px solid rgba(48,43,42,.18); padding:0 28px; }
.principle span { font-family:var(--serif); font-style:italic; opacity:.6; }
.principle h3 { margin:55px 0 18px; font-family:var(--serif); font-size:2rem; font-weight:400; }
.principle p { margin:0; color:var(--muted); }

.flow { display:grid; grid-template-columns:1fr 1fr; gap:100px; padding-block:155px; }
.flow-copy p:not(.eyebrow) { max-width:570px; margin:35px 0; font-size:18px; color:var(--muted); }
.flow-links { display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px; }
.pdf-preview { align-self:start; min-width:0; border:1px solid var(--line); background:#fff; }
.pdf-preview-label { display:block; padding:12px 16px; border-bottom:1px solid var(--line); font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.pdf-preview object { display:block; width:100%; height:620px; }

.contact { background:var(--rose-dark); color:#fff9f6; padding:145px 0; }
.contact-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:90px; }
.eyebrow.light { color:#f6dcd5; }
.contact-intro { max-width:480px; margin:34px 0 0; color:#f6dcd5; font-size:clamp(1rem,1.5vw,1.2rem); }
.contact-details { padding-top:52px; display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
.contact-details a { text-decoration:none; font-family:var(--serif); font-size:clamp(1.35rem,2.5vw,2.25rem); }
.contact-details a[href^="mailto:"] { overflow-wrap:anywhere; }
.contact-details > p { margin:14px 0; }
.hours { width:min(440px,100%); margin-top:20px; display:grid; grid-template-columns:1fr 1fr; gap:9px 28px; border-top:1px solid rgba(255,255,255,.2); padding-top:20px; font-size:13px; }

.legal-page { padding-block:110px 145px; }
.legal-intro { margin-bottom:70px; }
.legal-intro h1 { margin:0; font-family:var(--serif); font-size:clamp(4rem,7vw,7rem); font-weight:400; line-height:1; letter-spacing:-.045em; }
.legal-intro > p:last-child { max-width:32ch; margin-top:28px; color:var(--muted); font-size:18px; }
.legal-details { max-width:860px; }
.legal-details section { padding:26px 0; border-bottom:1px solid var(--line); }
.legal-details section:first-child { padding-top:0; }
.legal-details h2 { margin:0 0 12px; font-family:var(--serif); font-size:clamp(1.55rem,2vw,2rem); font-weight:400; line-height:1.2; letter-spacing:-.02em; }
.legal-details p { margin:0; color:var(--muted); }
.legal-details p + p { margin-top:18px; }
.legal-details strong { color:var(--ink); }
.legal-details a { text-underline-offset:3px; }

.site-footer { width:min(1400px, calc(100% - 48px)); margin:auto; min-height:150px; display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:40px; }
.footer-brand { font-family:var(--sans); font-size:18px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--rose-dark); }
.footer-links { display:flex; gap:22px; }
.site-footer a { text-decoration:none; font-size:12px; }
.site-footer p { margin:0; font-size:12px; color:var(--muted); }

.reveal { opacity:0; transform:translateY(28px); transition:opacity .75s ease, transform .75s ease; }
.reveal.visible { opacity:1; transform:none; }

@media (min-width:981px) and (max-width:1200px) {
  .site-header { min-height:270px; }
  .brand-logo { width:310px; }
  .nav { gap:8px; }
  .nav a { font-size:11px; }
}

@media (max-width: 980px) {
  .site-header { min-height:230px; gap:16px; }
  .brand-logo { width:255px; margin-block:-9px; }
  .nav-toggle { grid-column:3; justify-self:end; display:block; cursor:pointer; }
  .nav { position:absolute; top:100%; left:-24px; right:-24px; padding:28px 24px 34px; background:var(--paper); border-bottom:1px solid var(--line); display:none; flex-direction:column; align-items:flex-start; gap:19px; }
  .nav.open { display:flex; }
  .hero { grid-template-columns:1fr; padding-top:70px; }
  .hero-visual { min-height:560px; }
  .intro, .about, .flow, .contact-grid { grid-template-columns:1fr; gap:55px; }
  .treatment-grid { grid-template-columns:repeat(2,1fr); }
  .principles-grid { grid-template-columns:1fr 1fr; row-gap:70px; }
  .principles-title { grid-column:1/-1; }
  .principle:nth-child(2) { border-left:0; padding-left:0; }
  .portrait-photo { height:580px; }
}

@media (max-width: 620px) {
  .site-header, .section-shell, .site-footer { width:min(100% - 32px, 1400px); }
  .site-header { min-height:200px; }
  .nav { left:-16px; right:-16px; }
  .brand-logo { width:210px; margin-block:-8px; }
  .hero { min-height:auto; padding-block:64px 90px; gap:52px; }
  .hero h1 { font-size:clamp(2.9rem,12vw,4.5rem); white-space:normal; }
  .hero-visual { min-height:440px; }
  .floating-note { right:-4px; bottom:20px; font-size:17px; }
  .intro, .about, .flow { padding-block:100px; }
  .legal-page { padding-block:80px 100px; }
  .legal-intro { margin-bottom:50px; }
  .treatments, .principles, .contact { padding-block:100px; }
  .treatment-grid { grid-template-columns:1fr; border-left:0; }
  .treatment-card { border-left:1px solid var(--line); min-height:300px; }
  .treatment-card summary { min-height:300px; }
  .principles-grid { grid-template-columns:1fr; }
  .principles-title { grid-column:auto; }
  .principle, .principle:nth-child(2) { border-left:0; border-top:1px solid rgba(48,43,42,.18); padding:28px 0 0; }
  .principle h3 { margin-top:24px; }
  .portrait-photo { height:500px; }
  .pdf-preview object { height:460px; }
  .site-footer { grid-template-columns:1fr; gap:18px; padding-block:42px; }
  .footer-links { flex-wrap:wrap; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .reveal { opacity:1; transform:none; transition:none; }
}