/* fraunces-vietnamese-wght-normal */
@font-face {
  font-family: 'Fraunces Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/_astro/fraunces-vietnamese-wght-normal.CnvboYUG.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* fraunces-latin-ext-wght-normal */
@font-face {
  font-family: 'Fraunces Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/_astro/fraunces-latin-ext-wght-normal.Ca2vKHc0.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* fraunces-latin-wght-normal */
@font-face {
  font-family: 'Fraunces Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url(/_astro/fraunces-latin-wght-normal.ukD16Tqj.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* source-sans-3-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-cyrillic-ext-wght-normal.DzyfIafT.woff2) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* source-sans-3-cyrillic-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-cyrillic-wght-normal.BMDVbyM7.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* source-sans-3-greek-ext-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-greek-ext-wght-normal.BWSLJLk6.woff2) format('woff2-variations');
  unicode-range: U+1F00-1FFF;
}

/* source-sans-3-greek-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-greek-wght-normal.C9H9m1vD.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* source-sans-3-vietnamese-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-vietnamese-wght-normal.C1uRvKPU.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* source-sans-3-latin-ext-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-latin-ext-wght-normal.C8iNium2.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* source-sans-3-latin-wght-normal */
@font-face {
  font-family: 'Source Sans 3 Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/_astro/source-sans-3-latin-wght-normal.BqRLTx4X.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}/* ==========================================================================
   Andiamo – Psychiatrische Spitex Peter Stöckli
   Design-System: warm, ruhig, elegant.

   Farbregel 60/30/10:
     60%  Papier/Sand    (Flächen, Ruhe)
     30%  Pflaume        (Text, Header/Footer, Tiefe)
     10%  Messing        (Akzente, Handlungsaufforderungen, Wärme)

   Die Töne sind in OKLCH konstruiert: die Pflaume-Familie liegt auf 308°,
   die hellen Papiere auf 338° (ein Hauch wärmer, damit die Fläche nicht
   kühl wirkt), der Messing-Akzent auf 82° – dem Split-Komplementär zur
   Pflaume. Jede Paarung, die im Layout vorkommt, erfüllt mindestens
   WCAG AA; der schwächste Wert liegt bei 4.94:1.

   Typografie: Fraunces (Display-Serif) + Source Sans 3 (Fliesstext).
   Die Grössen-Skala orientiert sich am goldenen Schnitt (Basis 17px,
   Hero ≈ Basis × φ², Zwischenstufen harmonisch interpoliert).
   ========================================================================== */

:root {
  /* Farben */
  --c-paper: #FCF7FA;
  --c-paper-2: #F7EDF4;
  --c-karte: #FEFBFD;
  --c-ink: #3C2D45;
  --c-ink-soft: #6F6376;
  --c-pflaume: #53316E;
  --c-pflaume-tief: #361A4C;
  --c-pflaume-linie: #6A4B84;
  --c-licht: #FAF1F7;
  --c-licht-dim: rgba(250, 241, 247, 0.78);
  --c-akzent: #E0B35B;
  --c-akzent-hover: #D0A140;
  --c-akzent-tief: #855E15;
  --c-akzent-schimmer: rgba(224, 179, 91, 0.16);
  --c-line: rgba(60, 45, 69, 0.14);
  --c-line-soft: rgba(60, 45, 69, 0.08);

  /* Typografie */
  --font-display: 'Fraunces Variable', Georgia, 'Times New Roman', serif;
  --font-text: 'Source Sans 3 Variable', 'Segoe UI', system-ui, sans-serif;
  --fs-xs: 0.8125rem;
  --fs-s: 0.9375rem;
  --fs-base: 1.0625rem;
  --fs-lead: clamp(1.125rem, 1.05rem + 0.4vw, 1.3125rem);
  --fs-h3: 1.375rem;
  --fs-h2: clamp(1.75rem, 1.45rem + 1.5vw, 2.375rem);
  --fs-h1: clamp(2.375rem, 1.85rem + 2.6vw, 3.5rem);
  --fs-hero: clamp(2.5rem, 1.9rem + 3.2vw, 4.125rem);

  /* Abstände (Skala ≈ ×1.5) */
  --s-1: 0.5rem;
  --s-2: 0.75rem;
  --s-3: 1.125rem;
  --s-4: 1.75rem;
  --s-5: 2.625rem;
  --s-6: 4rem;
  --abschnitt: clamp(4.25rem, 3rem + 5vw, 7rem);

  /* Form */
  --r-s: 10px;
  --r-m: 16px;
  --r-l: 26px;
  --schatten-s: 0 1px 2px rgba(54, 26, 76, 0.05), 0 6px 18px -8px rgba(54, 26, 76, 0.12);
  --schatten-m: 0 2px 4px rgba(54, 26, 76, 0.05), 0 18px 44px -18px rgba(54, 26, 76, 0.22);
  --uebergang: 180ms ease;

  /* Layout: Inhaltsbreite; Hero teilt 1.618fr / 1fr (goldener Schnitt) */
  --breite: 71.25rem;
}

/* --------------------------------------------------------------------------
   Reset und Grundlagen
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
}

html {
  scroll-behavior: smooth;
  /* Hält iOS Safari davon ab, Text beim Drehen ins Querformat aufzublasen.
     Dort wirkt ausschliesslich die -webkit-Form, die Standardform deckt
     Chromium ab – darum beide, Standard zuletzt. 100% statt none, weil none
     in altem WebKit das Aufziehen mit zwei Fingern blockierte. */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  background: var(--c-paper);
  color: var(--c-ink);
  font-family: var(--font-text);
  font-size: var(--fs-base);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img,
picture,
svg {
  display: block;
  max-width: 100%;
}

/* Die width/height-Attribute am <img> sind nur da, damit der Browser den
   Platz vorab kennt (kein Layout-Sprung). Ohne height: auto gilt die
   Attributhöhe aber als echte Höhe, während max-width die Breite staucht –
   das Bild wird gequetscht. Die Höhe folgt darum immer der Breite. */
img {
  height: auto;
}

/* text-wrap ist bewusst reine Draufgabe: balance verteilt Überschriften
   gleichmässig auf die Zeilen, pretty verhindert Schusterjungen im Fliesstext.
   Wer es nicht kennt (Firefox kann pretty bis heute nicht), verwirft genau
   diese eine Deklaration und bricht normal um – nichts geht kaputt. Die
   Kurzform ist Absicht, text-wrap-style kam später und kann weniger. */
h1,
h2,
h3,
h4 {
  font-family: var(--font-display);
  font-weight: 540;
  line-height: 1.16;
  color: var(--c-pflaume);
  text-wrap: balance;
}

h1 {
  font-size: var(--fs-h1);
}

h2 {
  font-size: var(--fs-h2);
}

h3 {
  font-size: var(--fs-h3);
  line-height: 1.3;
}

p {
  text-wrap: pretty;
}

a {
  color: var(--c-akzent-tief);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color var(--uebergang);
}

a:hover {
  color: var(--c-pflaume);
}

ul,
ol {
  padding-inline-start: 1.25rem;
}

:focus-visible {
  outline: 2px solid var(--c-akzent-tief);
  outline-offset: 3px;
  border-radius: 2px;
}

::selection {
  background: var(--c-akzent);
  color: var(--c-pflaume-tief);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* --------------------------------------------------------------------------
   Primitives (seitenübergreifend verwendet)
   -------------------------------------------------------------------------- */

.behaelter {
  width: min(var(--breite), 100% - 2.5rem);
  margin-inline: auto;
}

.abschnitt {
  padding-block: var(--abschnitt);
}

.abschnitt--sand {
  background: var(--c-paper-2);
}

.abschnitt--dunkel {
  background: var(--c-pflaume-tief);
  color: var(--c-licht);
}

.abschnitt--dunkel h1,
.abschnitt--dunkel h2,
.abschnitt--dunkel h3 {
  color: var(--c-licht);
}

/* Vorspann über Überschriften */
.vorspann {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  font-size: var(--fs-xs);
  font-weight: 640;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-akzent-tief);
  margin-bottom: var(--s-3);
}

.vorspann::before {
  content: '';
  width: 1.75rem;
  height: 2px;
  border-radius: 2px;
  background: var(--c-akzent);
}

.abschnitt--dunkel .vorspann {
  color: var(--c-akzent);
}

.einleitung {
  font-size: var(--fs-lead);
  line-height: 1.65;
  color: var(--c-ink-soft);
  max-width: 46rem;
}

.abschnitt--dunkel .einleitung {
  color: var(--c-licht-dim);
}

/* Knöpfe */
.knopf {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  padding: 0.8rem 1.5rem;
  border-radius: 999px;
  border: 1.5px solid transparent;
  font-family: var(--font-text);
  font-size: 1rem;
  font-weight: 640;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
  transition: background var(--uebergang), color var(--uebergang),
    border-color var(--uebergang), transform var(--uebergang), box-shadow var(--uebergang);
}

.knopf:hover {
  transform: translateY(-1px);
}

.knopf:active {
  transform: translateY(0);
}

.knopf--akzent {
  background: var(--c-akzent);
  color: var(--c-pflaume-tief);
  box-shadow: var(--schatten-s);
}

.knopf--akzent:hover {
  background: var(--c-akzent-hover);
  color: var(--c-pflaume-tief);
}

.knopf--kontur {
  border-color: var(--c-pflaume);
  color: var(--c-pflaume);
  background: transparent;
}

.knopf--kontur:hover {
  background: var(--c-pflaume);
  color: var(--c-licht);
}

.abschnitt--dunkel .knopf--kontur,
.knopf--kontur-hell {
  border-color: rgba(250, 241, 247, 0.55);
  color: var(--c-licht);
  background: transparent;
}

.abschnitt--dunkel .knopf--kontur:hover,
.knopf--kontur-hell:hover {
  background: var(--c-licht);
  color: var(--c-pflaume-tief);
  border-color: var(--c-licht);
}

/* Karten */
.karte {
  background: var(--c-karte);
  border: 1px solid var(--c-line-soft);
  border-radius: var(--r-m);
  box-shadow: var(--schatten-s);
}

/* Kennzahlen/Vertrauens-Chips */
.chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.95rem;
  border-radius: 999px;
  font-size: var(--fs-s);
  font-weight: 600;
  background: rgba(250, 241, 247, 0.12);
  border: 1px solid rgba(250, 241, 247, 0.25);
  color: var(--c-licht-dim);
}

.chip svg {
  color: var(--c-akzent);
  flex-shrink: 0;
}

/* Sanftes Einblenden beim Scrollen (JS setzt .sichtbar; ohne JS sichtbar) */
@media (prefers-reduced-motion: no-preference) {
  html.js .einblenden {
    opacity: 0;
    translate: 0 14px;
    transition: opacity 480ms ease, translate 480ms ease;
  }

  html.js .einblenden.sichtbar {
    opacity: 1;
    translate: 0 0;
  }
}

/* Nur für Screenreader */
.nur-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

.sprung-link {
  position: absolute;
  left: 1rem;
  top: -3.5rem;
  z-index: 100;
  background: var(--c-pflaume-tief);
  color: var(--c-licht);
  padding: 0.6rem 1.1rem;
  border-radius: 0 0 var(--r-s) var(--r-s);
  text-decoration: none;
  transition: top var(--uebergang);
}

.sprung-link:focus-visible {
  top: 0;
  color: var(--c-licht);
}
.kopf[data-astro-cid-3ef6ksr2]{position:sticky;top:0;z-index:50;background:var(--c-paper);border-bottom:1px solid var(--c-line-soft)}.kopf__zeile[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:var(--s-4);padding-block:0.85rem}.marke[data-astro-cid-3ef6ksr2]{display:flex;flex-direction:column;text-decoration:none;line-height:1.15}.marke__name[data-astro-cid-3ef6ksr2]{font-family:var(--font-display);font-weight:600;font-size:1.6rem;color:var(--c-pflaume);letter-spacing:0.01em}.marke__zusatz[data-astro-cid-3ef6ksr2]{font-size:0.72rem;font-weight:640;letter-spacing:0.16em;text-transform:uppercase;color:var(--c-akzent-tief)}.nav[data-astro-cid-3ef6ksr2]{margin-inline-start:auto}.nav__liste[data-astro-cid-3ef6ksr2]{display:flex;align-items:center;gap:clamp(0.25rem,1vw,0.9rem);list-style:none;padding:0}.nav__link[data-astro-cid-3ef6ksr2]{display:inline-block;padding:0.45rem 0.65rem;font-weight:600;font-size:1rem;color:var(--c-ink);text-decoration:none;border-radius:var(--r-s);transition:color var(--uebergang),background var(--uebergang)}.nav__link[data-astro-cid-3ef6ksr2]:hover{color:var(--c-pflaume);background:var(--c-paper-2)}.nav__link[data-astro-cid-3ef6ksr2][aria-current=page]{color:var(--c-pflaume);text-decoration:underline;text-decoration-color:var(--c-akzent);text-decoration-thickness:2.5px;text-underline-offset:6px}.nav__schalter[data-astro-cid-3ef6ksr2]{display:none}.nav__telefon-mobil[data-astro-cid-3ef6ksr2]{display:none}.kopf__telefon[data-astro-cid-3ef6ksr2]{flex-shrink:0}@media (max-width: 56rem){.kopf__telefon[data-astro-cid-3ef6ksr2]{display:none}.nav__schalter[data-astro-cid-3ef6ksr2]{display:inline-flex;align-items:center;gap:0.6rem;padding:0.55rem 1rem;background:transparent;border:1.5px solid var(--c-line);border-radius:999px;font:inherit;font-weight:640;color:var(--c-pflaume);cursor:pointer}.nav__schalter-balken[data-astro-cid-3ef6ksr2],.nav__schalter-balken[data-astro-cid-3ef6ksr2]::before,.nav__schalter-balken[data-astro-cid-3ef6ksr2]::after{display:block;width:16px;height:2px;border-radius:2px;background:currentColor;transition:transform var(--uebergang),opacity var(--uebergang)}.nav__schalter-balken[data-astro-cid-3ef6ksr2]{position:relative}.nav__schalter-balken[data-astro-cid-3ef6ksr2]::before,.nav__schalter-balken[data-astro-cid-3ef6ksr2]::after{content:"";position:absolute;left:0}.nav__schalter-balken[data-astro-cid-3ef6ksr2]::before{top:-5px}.nav__schalter-balken[data-astro-cid-3ef6ksr2]::after{top:5px}.nav[data-astro-cid-3ef6ksr2][data-offen] .nav__schalter-balken[data-astro-cid-3ef6ksr2]{background:transparent}.nav[data-astro-cid-3ef6ksr2][data-offen] .nav__schalter-balken[data-astro-cid-3ef6ksr2]::before{transform:translateY(5px) rotate(45deg)}.nav[data-astro-cid-3ef6ksr2][data-offen] .nav__schalter-balken[data-astro-cid-3ef6ksr2]::after{transform:translateY(-5px) rotate(-45deg)}.nav__liste[data-astro-cid-3ef6ksr2]{display:none;position:absolute;inset-inline:0;top:100%;flex-direction:column;align-items:stretch;gap:0.25rem;background:var(--c-paper);border-bottom:1px solid var(--c-line-soft);box-shadow:var(--schatten-m);padding:1rem 1.25rem 1.5rem}.nav[data-astro-cid-3ef6ksr2][data-offen] .nav__liste[data-astro-cid-3ef6ksr2]{display:flex}.nav__link[data-astro-cid-3ef6ksr2]{display:block;padding:0.75rem 0.9rem;font-size:1.1rem}.nav__telefon-mobil[data-astro-cid-3ef6ksr2]{display:block;margin-top:0.75rem}.nav__telefon-mobil[data-astro-cid-3ef6ksr2] .knopf[data-astro-cid-3ef6ksr2]{width:100%}}.fuss[data-astro-cid-sz7xmlte]{background:var(--c-pflaume-tief);color:var(--c-licht-dim);padding-block:var(--s-6) var(--s-4);font-size:var(--fs-s)}.fuss__spalten[data-astro-cid-sz7xmlte]{display:grid;grid-template-columns:1.5fr 0.8fr 1.2fr 1fr;gap:var(--s-5);padding-bottom:var(--s-5);border-bottom:1px solid rgba(250,241,247,0.16)}.fuss__name[data-astro-cid-sz7xmlte]{font-family:var(--font-display);font-weight:600;font-size:1.5rem;color:var(--c-licht);line-height:1.2}.fuss__zusatz[data-astro-cid-sz7xmlte]{font-size:0.72rem;font-weight:640;letter-spacing:0.16em;text-transform:uppercase;color:var(--c-akzent);margin-bottom:var(--s-3)}.fuss__text[data-astro-cid-sz7xmlte]{max-width:30rem}.fuss__titel[data-astro-cid-sz7xmlte]{font-weight:700;color:var(--c-licht);margin-bottom:var(--s-2)}.fuss[data-astro-cid-sz7xmlte] ul[data-astro-cid-sz7xmlte]{list-style:none;padding:0;display:grid;gap:0.55rem}.fuss[data-astro-cid-sz7xmlte] a[data-astro-cid-sz7xmlte]{color:var(--c-licht-dim);text-decoration-color:rgba(250,241,247,0.4)}.fuss[data-astro-cid-sz7xmlte] a[data-astro-cid-sz7xmlte]:hover{color:var(--c-akzent)}.fuss__kontakt[data-astro-cid-sz7xmlte] li[data-astro-cid-sz7xmlte]{display:flex;gap:0.65rem;align-items:flex-start}.fuss__kontakt[data-astro-cid-sz7xmlte] svg[data-astro-cid-sz7xmlte]{color:var(--c-akzent);margin-top:0.2rem;flex-shrink:0}.fuss__kontakt[data-astro-cid-sz7xmlte] small[data-astro-cid-sz7xmlte]{opacity:0.75}.fuss__zeile[data-astro-cid-sz7xmlte]{padding-top:var(--s-4);display:flex;justify-content:space-between;gap:var(--s-3);flex-wrap:wrap;font-size:0.85rem;opacity:0.85}.fuss__credit[data-astro-cid-sz7xmlte]{text-align:end}.fuss__herz[data-astro-cid-sz7xmlte]{color:var(--c-akzent)}@media (max-width: 62rem){.fuss__spalten[data-astro-cid-sz7xmlte]{grid-template-columns:1fr 1fr}}@media (max-width: 38rem){.fuss__spalten[data-astro-cid-sz7xmlte]{grid-template-columns:1fr;gap:var(--s-4)}}