/* Oktober 2026: Originalfarben, vier Inhaltsgrössen und ein grosszügiges Hero-Zitat.
   Gilt für Christies Kundenfassung; die anderen Praxistexte bleiben eigenständig. */
html.kundenfassung {
  --f-serif:"Alasassy Caps","Source Sans 3",sans-serif;
  --t-hero:4rem; --t-h1:3rem; --t-h2:3rem; --t-h3:2rem;
  --t-body:1.125rem; --t-klein:1rem; --t-mini:1rem;
  --linie:#C5C5B4; --kreis:clamp(15rem,24vw,20rem); --spaltenabstand:4.5rem;
}
html.kundenfassung h1,html.kundenfassung h2 {
  font-size:var(--t-h2); line-height:1.2; letter-spacing:0;
  font-weight:400; margin-bottom:1.25rem; text-wrap:pretty;
}
html.kundenfassung h3,html.kundenfassung h4 {
  font-size:var(--t-h3); line-height:1.3; letter-spacing:0;
  font-family:var(--f-serif); font-weight:400;
}
html.kundenfassung p,html.kundenfassung li,html.kundenfassung address,
html.kundenfassung .long-copy p,html.kundenfassung .about-copy>p,
html.kundenfassung .emergency-info :is(p,li),html.kundenfassung .arrival-options p,
html.kundenfassung details :is(p,li),html.kundenfassung .contact-intro>p,
html.kundenfassung .contact-email {font-size:var(--t-body);line-height:1.7}
html.kundenfassung :is(.eyebrow,.quote-source,.qualification,.quiet-note),
html.kundenfassung .studio-brand>span:last-child,
html.kundenfassung .studio-nav :is(.nav a,.menu-toggle),
html.kundenfassung :is(.knopf,.text-link,summary,figcaption,.map-external,.enlarge-hint,.gallery-status),
html.kundenfassung .formular :is(label,.einwilligung,.form-note,.form-emergency,.knopf),
html.kundenfassung .map-placeholder :is(p,strong,.map-privacy,.knopf),
html.kundenfassung .image-dialog :is(button,figcaption,.dialog-navigation),
html.kundenfassung .fuss :is(p,strong,a,.footer-bottom) {
  font-size:var(--t-klein);line-height:1.6;
}
html.kundenfassung .eyebrow {letter-spacing:.025em;text-transform:none;margin-bottom:1rem}
html.kundenfassung .studio-brand>span:last-child {margin-top:.25rem}
html.kundenfassung .studio-nav {min-height:106px;gap:2rem}
html.kundenfassung .studio-nav .nav ul {gap:1.5rem}
html.kundenfassung .studio-header {border-top:5px solid var(--olive)}
html.kundenfassung .feedback-hero {
  grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:3.5rem;
  padding-block:3.5rem 4rem;align-items:center;
}
html.kundenfassung .hero-word .hero-quote {
  font-size:var(--t-hero);max-width:none;line-height:1.13;
  letter-spacing:0;margin-bottom:1rem;text-wrap:balance;
}
html.kundenfassung .hero-word .quote-source {margin-bottom:2rem}
html.kundenfassung .customer-logo-hero {padding:0;max-width:440px}
html.kundenfassung .feedback-hero .hero-person {gap:1.5rem;margin-block:2rem}
html.kundenfassung .feedback-hero .hero-person .portrait-enlarge img {
  width:var(--kreis);height:var(--kreis);max-width:100%;border:0;
}
html.kundenfassung .feedback-hero .hero-person strong {
  font-family:var(--f-sans);font-size:1.5rem;font-weight:400;letter-spacing:-.015em;line-height:1.3;margin-bottom:.65rem;
}
html.kundenfassung .feedback-hero .hero-person div>span {font-size:var(--t-klein);line-height:1.6;color:var(--tinte)}
html.kundenfassung .portrait-enlarge>span {width:36px;height:36px;font-size:var(--t-klein);right:10px;bottom:10px}
html.kundenfassung :is(.studio-section,.studio-about,.studio-contact) {padding-block:5rem}
html.kundenfassung .feedback-offer {border-top:1px solid var(--linie);gap:var(--spaltenabstand);grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
html.kundenfassung .feedback-offer .section-copy p {max-width:48ch}
html.kundenfassung .feedback-offer .offer-topics {padding-top:0}
html.kundenfassung .feedback-offer .offer-topics h3 {
  font-size:var(--t-h2);line-height:1.2;letter-spacing:0;
  margin-bottom:1.25rem;text-wrap:pretty;
}
/* Alasassy zeichnet diesen Titel 2 px höher; nebeneinander optisch ausgleichen. */
@media(min-width:761px) {
  html.kundenfassung .feedback-offer .offer-topics h3 {transform:translateY(2px)}
}
html.kundenfassung .treatment-list {margin-bottom:1.2rem}
html.kundenfassung .treatment-list li {padding-block:.9rem;font-size:var(--t-body);color:var(--tinte)}
html.kundenfassung .treatment-list li:after {background:var(--olive);width:7px;height:7px}
html.kundenfassung .studio-about {background:var(--gruen-zart)}
html.kundenfassung .feedback-about {gap:var(--spaltenabstand);align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
html.kundenfassung .feedback-art,
html.kundenfassung .feedback-offer .section-copy .feedback-art,
html.kundenfassung .feedback-about>.feedback-art {
  width:var(--kreis);max-width:100%;justify-self:center;margin-inline:auto;
}
html.kundenfassung .feedback-offer .section-copy .feedback-art {margin-inline:0;justify-self:start}
html.kundenfassung .feedback-art img {width:100%;height:auto;aspect-ratio:1;object-fit:cover}
html.kundenfassung .feedback-about>.feedback-art {margin-top:0}
@media(min-width:761px) {
  html.kundenfassung .feedback-about>.about-copy {grid-column:2;grid-row:1}
  html.kundenfassung .feedback-about>.feedback-art {grid-column:1;grid-row:1;justify-self:start;margin-inline:0}
}
html.kundenfassung .profile-details {margin-top:2rem}
html.kundenfassung .profile-languages {margin-top:1.5rem}
html.kundenfassung .about-copy>p:not(.eyebrow):not(.qualification) {font-size:var(--t-body)}
html.kundenfassung .transit-links {font-size:var(--t-klein)}
html.kundenfassung .gallery-arrows button,html.kundenfassung .map-pin {font-size:var(--t-h3)}
html.kundenfassung .working-method {
  display:block;width:min(100% - 2 * var(--rand),var(--wrap));
  margin-top:4rem;padding-top:3rem;
}
html.kundenfassung .working-method h3 {
  font-size:var(--t-h2);max-width:none;line-height:1.2;
  margin-bottom:1.75rem;letter-spacing:0;
}
html.kundenfassung .working-method .long-copy {max-width:44rem}
html.kundenfassung .working-method .long-copy p {max-width:none}
html.kundenfassung .first-step-layout {
  width:100%;max-width:none;margin:0;
  padding-inline:max(var(--rand),calc((100% - var(--wrap)) / 2));
  background:var(--blau-zart);gap:var(--spaltenabstand);grid-template-columns:minmax(0,1fr) minmax(0,1fr);
}
html.kundenfassung .first-step-copy>.knopf {margin-top:1.75rem}
html.kundenfassung .feedback-about>.feedback-art,
html.kundenfassung .first-step-layout>.feedback-art {position:sticky;top:8rem;margin-top:0}
html.kundenfassung .feedback-rooms {background:var(--sand-hell)}
html.kundenfassung .rooms-heading {gap:2rem;margin-bottom:2.5rem}
html.kundenfassung .rooms-heading a {color:var(--blau-mittel)}
html.kundenfassung .gallery-status {color:var(--blau-mittel)}
/* Reserve space for the sticky header, section title and gallery controls.
   The same image height across slides keeps the controls from jumping. */
@media screen {
  html.kundenfassung .studio-section.feedback-rooms {padding-block:2rem}
  html.kundenfassung .feedback-rooms>.wrap {max-width:var(--wrap)}
  html.kundenfassung .feedback-rooms .rooms-heading {display:block;margin-bottom:1.5rem}
  html.kundenfassung .feedback-rooms .rooms-heading h2 {margin-bottom:0}
  html.kundenfassung .photo-gallery.is-ready .gallery-item img {
    height:clamp(18rem,calc(100svh - 20rem),40rem);
    aspect-ratio:auto;object-fit:contain;
  }
  html.kundenfassung .photo-gallery.is-ready .gallery-toolbar {margin-block:.75rem;gap:1rem}
  html.kundenfassung .gallery-arrows button {width:44px;height:44px}
  html.kundenfassung .photo-gallery.is-ready .gallery-thumbnails {
    grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:5.5rem;
    justify-content:start;gap:.5rem;overflow-x:auto;padding-block:.25rem .6rem;
    scrollbar-width:thin;scrollbar-color:var(--olive) var(--sand-hell);
  }
  html.kundenfassung .gallery-thumbnails button {padding:3px;min-height:44px}
  html.kundenfassung .gallery-thumbnails img {height:52px;aspect-ratio:auto;object-fit:cover}
}
html.kundenfassung .studio-contact {background:var(--sand-hell)}
html.kundenfassung .feedback-contact {gap:var(--spaltenabstand)}
html.kundenfassung .contact-email {margin-top:0;margin-bottom:1.8rem}
html.kundenfassung .arrival {border-color:var(--linie);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1.75rem var(--spaltenabstand)}
html.kundenfassung .arrival-heading {grid-column:1/-1}
html.kundenfassung .arrival-heading h3 {margin-bottom:0}
html.kundenfassung .arrival-visuals {display:block}
html.kundenfassung .arrival-options {grid-template-columns:1fr;gap:2rem;margin-top:0}
html.kundenfassung .map-placeholder .map-privacy {max-width:34ch}
html.kundenfassung .map-stage {height:410px;min-height:0;aspect-ratio:auto}
html.kundenfassung .map-stage iframe {min-height:0}
html.kundenfassung .arrival-visuals figure>img {aspect-ratio:1.3}
html.kundenfassung .enlarge-hint {padding:.4rem .8rem}
html.kundenfassung .fuss {background:var(--blau-mittel)}
html.kundenfassung .fuss p,html.kundenfassung .fuss .footer-bottom {opacity:1}
@media(max-width:1100px) and (min-width:761px) {
  html.kundenfassung {--t-hero:3.5rem;--spaltenabstand:3rem}
  html.kundenfassung .feedback-hero {grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:2rem}
  html.kundenfassung .feedback-hero .hero-person {gap:1.1rem;flex-wrap:wrap}
  html.kundenfassung .studio-nav {gap:1rem;flex-wrap:wrap;padding-block:1rem}
  html.kundenfassung .studio-nav .nav {margin-left:auto}
  html.kundenfassung .studio-nav .nav ul {gap:1rem}
  html.kundenfassung .feedback-about,html.kundenfassung .working-method,
  html.kundenfassung .first-step-layout,html.kundenfassung .feedback-contact {gap:3rem}
}
@media(max-width:760px) {
  html.kundenfassung {--t-hero:3.5rem;--t-h1:2.5rem;--t-h2:2.5rem;--kreis:15rem;--spaltenabstand:2rem;--rand:1.25rem}
  html.kundenfassung .studio-nav {min-height:91px;gap:0}
  html.kundenfassung .studio-brand>span:last-child {display:none}
  html.kundenfassung .studio-nav .nav ul {gap:.3rem 1rem}
  html.kundenfassung .feedback-hero {grid-template-columns:1fr;gap:2.5rem;padding-block:2.4rem 3rem}
  html.kundenfassung .customer-logo-hero {grid-row:auto;width:250px;max-width:85%;justify-self:center}
  html.kundenfassung .hero-word .hero-quote {max-width:none}
  html.kundenfassung .feedback-hero .hero-person {flex-direction:column;align-items:center;gap:1rem;margin-block:1.75rem}
  html.kundenfassung .feedback-hero .hero-person div>span {max-width:35ch}
  html.kundenfassung .knoepfe {gap:1rem 1.5rem}
  html.kundenfassung :is(.studio-section,.studio-about,.studio-contact) {padding-block:3.5rem}
  html.kundenfassung .feedback-offer {gap:2.5rem;grid-template-columns:minmax(0,1fr)}
  html.kundenfassung .feedback-about,html.kundenfassung .first-step-layout {grid-template-columns:minmax(0,1fr)}
  html.kundenfassung .feedback-about,html.kundenfassung .working-method,
  html.kundenfassung .first-step-layout,html.kundenfassung .feedback-contact {gap:2rem}
  html.kundenfassung .working-method {padding-top:2.5rem;margin-top:2.5rem}
  html.kundenfassung .working-method h3 {margin-bottom:1.5rem}
  html.kundenfassung .feedback-about>.feedback-art,
  html.kundenfassung .first-step-layout>.feedback-art {position:static}
  html.kundenfassung .gallery-toolbar {flex-wrap:wrap}
  html.kundenfassung .gallery-status {flex:1;min-width:12ch}
  html.kundenfassung .studio-section.feedback-rooms {padding-block:1.5rem}
  html.kundenfassung .feedback-rooms .rooms-heading {margin-bottom:1.25rem}
  html.kundenfassung .photo-gallery.is-ready .gallery-toolbar {min-height:3.2rem}
  html.kundenfassung .photo-gallery.is-ready .gallery-item img {
    height:clamp(18rem,min(calc(100svh - 20rem),calc((100vw - 2 * var(--rand)) * 4 / 3)),32.5rem);
  }
  html.kundenfassung .photo-gallery.is-ready .gallery-thumbnails {grid-template-columns:none;grid-auto-columns:4rem;gap:.35rem}
  html.kundenfassung .gallery-thumbnails img {height:44px}
  html.kundenfassung .arrival {grid-template-columns:minmax(0,1fr)}
  html.kundenfassung .map-placeholder {padding:1.3rem}
  html.kundenfassung .map-stage {height:370px;min-height:0}
  html.kundenfassung .map-stage iframe {min-height:0}
}
@media print {
  html.kundenfassung {--kreis:140px}
  html.kundenfassung .feedback-about>.feedback-art,
  html.kundenfassung .first-step-layout>.feedback-art {position:static}
}

/* Semantische Hauptüberschrift; sichtbare Gestaltung bleibt erhalten. */
html.kundenfassung .hero-word h1.eyebrow {font-family:var(--f-sans);font-size:var(--t-klein);font-weight:400;line-height:1.6;letter-spacing:.025em;margin:0 0 1rem;font-variation-settings:normal;text-wrap:wrap}
html.kundenfassung .hero-word .hero-quote {font-family:var(--f-serif);font-weight:400;font-variation-settings:"SOFT" 0,"WONK" 0,"opsz" 72;color:var(--akzent);margin-top:0}

/* Live-Fassung, 29. Oktober: Bildzeichen am Einstieg und Illustrationen vor den mobilen Titeln. */
html.kundenfassung .feedback-hero {display:block}
html.kundenfassung .hero-symbol {width:min(100%,calc(var(--t-hero) * 5.15));height:auto;margin:0 0 1.5rem;display:block}
html.kundenfassung .hero-word .hero-quote {max-width:70rem;text-wrap:wrap}
html.kundenfassung .feedback-offer .section-copy {display:flex;flex-direction:column;align-items:flex-start}
html.kundenfassung .feedback-offer .section-copy>.feedback-art {order:1}
html.kundenfassung .working-method {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--spaltenabstand);align-items:start}
html.kundenfassung .working-method>.method-copy {grid-column:1;grid-row:1;min-width:0}
html.kundenfassung .working-method>.feedback-art {grid-column:2;grid-row:1;position:sticky;top:8rem;margin-top:0}
html.kundenfassung .first-step-layout>.first-step-copy {grid-column:1;grid-row:1}
html.kundenfassung .first-step-layout>.feedback-art {grid-column:2;grid-row:1}
@media(max-width:760px) {
 html.kundenfassung .feedback-offer .section-copy>.feedback-art {order:0;margin:0 auto 2rem;align-self:center}
 html.kundenfassung .feedback-about>.feedback-art,
 html.kundenfassung .first-step-layout>.feedback-art,
 html.kundenfassung .working-method>.feedback-art {grid-column:1;grid-row:1;position:static;margin:0 auto;justify-self:center}
 html.kundenfassung .feedback-about>.about-copy,
 html.kundenfassung .first-step-layout>.first-step-copy,
 html.kundenfassung .working-method>.method-copy {grid-column:1;grid-row:2}
 html.kundenfassung .working-method {grid-template-columns:minmax(0,1fr)}
 /* Der Einstieg sitzt als Block mittig; seine Texte bleiben linksbündig. */
 html.kundenfassung .feedback-hero .hero-word {width:min(100%,20rem);margin-inline:auto;text-align:left}
 html.kundenfassung .feedback-hero .hero-symbol {margin-inline:auto}
 html.kundenfassung .feedback-hero .hero-person>div {width:100%;text-align:left}
 html.kundenfassung .feedback-hero .knoepfe {justify-content:center}
}
@media print {html.kundenfassung .working-method>.feedback-art {position:static}}