@charset "UTF-8";
/* ===========================================================================
   Sinn-Kreise · Katrin Bressel
   Farben stammen aus ihren eigenen Fotos: das Waldgrün der Sächsischen
   Schweiz, das Terrakotta ihres Rocks und der Abendsonne am Kohlbornstein,
   der warme Sand der Herbstwiese. Schriften liegen lokal (DSGVO).
   =========================================================================== */

/* ---------- Schriften ---------------------------------------------------- */
@font-face{font-family:'Vollkorn';src:url('fonts/vollkorn-n-latin.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Vollkorn';src:url('fonts/vollkorn-n-latin-ext.woff2') format('woff2');
  font-weight:400 700;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Vollkorn';src:url('fonts/vollkorn-i-latin.woff2') format('woff2');
  font-weight:400 700;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Vollkorn';src:url('fonts/vollkorn-i-latin-ext.woff2') format('woff2');
  font-weight:400 700;font-style:italic;font-display:swap;unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Mulish';src:url('fonts/mulish-n-latin.woff2') format('woff2');
  font-weight:300 800;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Mulish';src:url('fonts/mulish-n-latin-ext.woff2') format('woff2');
  font-weight:300 800;font-style:normal;font-display:swap;unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:'Mulish';src:url('fonts/mulish-i-latin.woff2') format('woff2');
  font-weight:300 800;font-style:italic;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ---------- Palette ------------------------------------------------------ */
:root{
  --wald:#33452F;          /* dunkelstes Grün — Kopf, Fuß, Überschriften    */
  --wald-mittel:#5A6B4A;   /* Akzentgrün                                    */
  --wald-hell:#8C9A7B;
  --erde:#9C4F2E;          /* Terrakotta — Handlungsknöpfe, Akzente         */
  --erde-tief:#7C3D22;
  --sand:#E7DCC7;
  --sand-hell:#F3ECDF;
  --papier:#FCFAF6;
  --tinte:#2B2721;
  --tinte-weich:#5B554C;   /* ≥ 4,5:1 auf --papier und --sand-hell          */
  --linie:#DFD5C2;
  --serif:'Vollkorn',Georgia,'Times New Roman',serif;
  --sans:'Mulish',system-ui,-apple-system,'Segoe UI',sans-serif;
  --breit:1180px;
  --schmal:720px;
  --rund:4px;
  --schatten:0 14px 40px rgba(43,39,33,.10);
}

/* ---------- Grundlagen --------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{font-family:var(--sans);font-size:17.5px;line-height:1.75;color:var(--tinte-weich);
  background:var(--papier);overflow-x:hidden;padding-top:74px;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--erde-tief);text-underline-offset:3px;}
a:hover{color:var(--erde);}
h1,h2,h3,h4{font-family:var(--serif);color:var(--wald);font-weight:600;line-height:1.18;
  letter-spacing:-.005em;}
h1{font-size:clamp(2.1rem,5.2vw,3.5rem);}
h2{font-size:clamp(1.7rem,3.6vw,2.5rem);}
h3{font-size:clamp(1.2rem,2.1vw,1.5rem);}
p+p{margin-top:1.05em;}
:focus-visible{outline:3px solid var(--erde);outline-offset:3px;}

.huelle{max-width:var(--breit);margin:0 auto;padding:0 26px;}
.schmal{max-width:var(--schmal);margin-left:auto;margin-right:auto;}
.mitte{text-align:center;}

/* Sprungmarke für Tastaturbedienung */
.sprung{position:absolute;left:-9999px;top:0;z-index:2000;background:var(--wald);
  color:#fff;padding:12px 20px;text-decoration:none;}
.sprung:focus{left:0;}

/* ---------- Kopf --------------------------------------------------------- */
.kopf{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(252,250,246,.93);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;transition:border-color .35s,background .35s;}
.kopf.tief{border-bottom-color:var(--linie);background:rgba(252,250,246,.985);}
.kopf__in{max-width:var(--breit);margin:0 auto;padding:0 26px;height:74px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;}
.marke{text-decoration:none;display:block;line-height:1.05;flex-shrink:0;}
.marke__wort{font-family:var(--serif);font-size:1.42rem;font-weight:600;color:var(--wald);
  display:block;letter-spacing:.01em;}
.marke__sub{font-family:var(--sans);font-size:.63rem;letter-spacing:.3em;text-transform:uppercase;
  color:var(--wald-mittel);display:block;margin-top:3px;}
.nav{display:flex;align-items:center;gap:26px;}
.nav a{font-size:.9rem;color:var(--tinte-weich);text-decoration:none;transition:color .25s;
  white-space:nowrap;}
.nav a:hover,.nav a.hier{color:var(--wald);}
.nav a.hier{text-decoration:underline;text-decoration-color:var(--erde);text-underline-offset:7px;
  text-decoration-thickness:2px;}
.nav .knopf-klein{background:var(--erde);color:#fff;padding:10px 20px;border-radius:var(--rund);
  font-weight:600;font-size:.83rem;letter-spacing:.02em;}
.nav .knopf-klein:hover{background:var(--erde-tief);color:#fff;}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;
  padding:9px;margin-right:-9px;}
.burger span{display:block;width:25px;height:2px;background:var(--wald);border-radius:2px;
  transition:transform .3s,opacity .25s;}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
#mobilmenu{position:fixed;inset:74px 0 0;background:var(--papier);z-index:999;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  opacity:0;pointer-events:none;transition:opacity .3s;overflow-y:auto;padding:30px 24px;}
#mobilmenu.auf{opacity:1;pointer-events:all;}
#mobilmenu a{font-family:var(--serif);font-size:1.35rem;color:var(--wald);text-decoration:none;
  padding:13px 0;}
#mobilmenu a.knopf-klein{background:var(--erde);color:#fff;padding:14px 32px;margin-top:18px;
  font-family:var(--sans);font-size:.95rem;border-radius:var(--rund);}

/* ---------- Knöpfe ------------------------------------------------------- */
.knopf{display:inline-block;background:var(--erde);color:#fff;text-decoration:none;
  padding:15px 32px;border-radius:var(--rund);font-weight:600;font-size:.97rem;
  border:2px solid var(--erde);transition:background .25s,border-color .25s,transform .2s;}
.knopf:hover{background:var(--erde-tief);border-color:var(--erde-tief);color:#fff;
  transform:translateY(-2px);}
.knopf--leer{background:transparent;color:var(--wald);border-color:var(--wald-hell);}
.knopf--leer:hover{background:var(--wald);border-color:var(--wald);color:#fff;}
.knopf--hell{background:transparent;color:#fff;border-color:rgba(255,255,255,.75);}
.knopf--hell:hover{background:#fff;border-color:#fff;color:var(--wald);}
button.knopf{font-family:inherit;line-height:inherit;cursor:pointer;}
.knopfreihe{display:flex;flex-wrap:wrap;gap:14px;}
.knopfreihe.mitte{justify-content:center;}

/* ---------- Hero --------------------------------------------------------- */
.hero{background-color:#181E16;position:relative;min-height:min(84vh,720px);display:flex;align-items:flex-end;
  color:#fff;overflow:hidden;}
/* Ausschnitt auf die Person rechts: Kopf bei ~21 % Höhe, Körper bei ~72–86 % Breite.
   Vorher center 55 % — breite Schirme schnitten den Kopf ab, das Handy die ganze Person
   (Katrins Hinweis 04.10.2026: „ohne Kopf nicht so toll“). */
.hero__bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:55% 36%;}
.kopfbild--hoch{min-height:min(64vh,560px);}
.kopfbild__bild--mandala{object-position:50% 93%;}
.kopfbild__bild--weg{object-position:50% 46%;}
.ritualbild{margin:30px 0 8px;}
.ritualbild img{width:100%;height:auto;display:block;border-radius:var(--rund,0);}
.hero::after{content:'';position:absolute;inset:0;
  background:
    linear-gradient(to top,rgba(24,30,22,.88) 0%,rgba(24,30,22,.42) 46%,rgba(24,30,22,.12) 100%),
    linear-gradient(102deg,rgba(24,30,22,.55) 0%,rgba(24,30,22,.14) 42%,rgba(24,30,22,0) 66%);}
.hero__in{position:relative;z-index:2;width:100%;max-width:var(--breit);margin:0 auto;
  padding:0 26px 78px;}
.hero__text{max-width:620px;}
.hero h1{color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.35);}
.hero__spruch{font-family:var(--serif);font-style:italic;font-size:clamp(1.05rem,2vw,1.3rem);
  color:rgba(255,255,255,.94);margin-bottom:20px;text-shadow:0 2px 16px rgba(0,0,0,.55);}
.hero__lead{font-size:clamp(1.02rem,1.7vw,1.2rem);color:rgba(255,255,255,.93);
  margin:20px 0 30px;max-width:540px;text-shadow:0 1px 14px rgba(0,0,0,.35);}

/* Kleinerer Kopf für Unterseiten */
.kopfbild{background-color:#181E16;position:relative;min-height:min(52vh,420px);display:flex;align-items:flex-end;
  color:#fff;overflow:hidden;}
.kopfbild__bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.kopfbild::after{content:'';position:absolute;inset:0;
  background:linear-gradient(to top,rgba(24,30,22,.84) 0%,rgba(24,30,22,.40) 60%,rgba(24,30,22,.18) 100%);}
.kopfbild__in{position:relative;z-index:2;width:100%;max-width:var(--breit);margin:0 auto;
  padding:0 26px 52px;}
.kopfbild h1{color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.35);}
.kopfbild__lead{font-size:1.08rem;color:rgba(255,255,255,.92);margin-top:14px;max-width:560px;}
.faden{font-family:var(--sans);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;
  color:rgba(255,255,255,.8);display:block;margin-bottom:14px;}

/* ---------- Abschnitte --------------------------------------------------- */
.block{padding:clamp(64px,9vw,110px) 0;}
/* Sandflächen bekommen eine sehr leise Wärme aus der Mitte — flächiges
   Beige wirkt sonst wie Papier ohne Licht. */
.block--sand{background:
  radial-gradient(900px 420px at 50% 0%, rgba(201,150,96,.10), transparent 62%),
  var(--sand-hell);}
.block--wald{background:var(--wald);color:rgba(255,255,255,.85);}
/* Foto-Variante des Abschluss-Aufrufs: die Morgennebel-Wiese unter einem
   grünen Schleier — dasselbe Prinzip wie Hero und Band, damit der Abschluss
   nicht als flache Farbfläche endet (26.08.2026, Morgennebel-Bild). */
.block--wald.hat-bild{position:relative;overflow:hidden;isolation:isolate;background:var(--wald);}
.block--wald.hat-bild>.huelle{position:relative;z-index:2;}
.wald__bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  object-position:center 66%;z-index:0;}
/* Schleier hell genug, dass die Wiese sichtbar bleibt, dunkel genug fuer
   weissen Text: unten dichter (dort steht der Text), oben luftiger. */
.block--wald.hat-bild::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(to bottom,rgba(29,39,25,.60) 0%,rgba(29,39,25,.74) 55%,rgba(29,39,25,.86) 100%);}
.block--wald h2,.block--wald h3{color:#fff;}
.block--eng{padding:clamp(48px,6vw,76px) 0;}
/* Das Kreiszeichen: Ihre Marke heißt Sinn-Kreise, und der Kreis ist auch das
   Bild ihrer Arbeit — Menschen versammeln sich im Kreis, der Jahreskreis
   dreht sich. Er läuft als kleines Zeichen durch die ganze Seite, statt nur
   im Namen zu stehen (20.08.2026). */
.augenbraue{font-family:var(--sans);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;
  color:var(--erde);display:flex;align-items:center;gap:11px;margin-bottom:14px;}
.augenbraue::before{content:'';width:9px;height:9px;border-radius:50%;
  border:1.5px solid currentColor;flex-shrink:0;}
.blockkopf.mitte .augenbraue,.mitte>.augenbraue{justify-content:center;}
.block--wald .augenbraue{color:var(--sand);}
.blockkopf{max-width:640px;margin-bottom:46px;}
.blockkopf.mitte{margin-left:auto;margin-right:auto;}
.blockkopf p{margin-top:16px;font-size:1.06rem;}
.lead{font-size:1.13rem;color:var(--tinte);}

/* ---------- Zweispalter Text + Bild -------------------------------------- */
.paar{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,72px);align-items:center;}
.paar--schmalbild{grid-template-columns:1fr .82fr;}
.paar__bild{position:relative;}
.paar__bild img{border-radius:var(--rund);box-shadow:var(--schatten);position:relative;z-index:1;}
/* Angedeuteter Kreis hinter dem Bild — greift das Markenzeichen auf, ohne
   sich vorzudrängen. Auf schmalen Geräten weg, dort fehlt der Platz. */
.paar__bild--kreis::before{content:'';position:absolute;z-index:0;
  left:-38px;top:-38px;width:190px;height:190px;border-radius:50%;
  border:1px solid var(--wald-hell);opacity:.45;}
.paar--gedreht .paar__bild--kreis::before{left:auto;right:-38px;}
@media (max-width:900px){.paar__bild--kreis::before{display:none;}}
.paar--gedreht .paar__text{order:2;}

/* ---------- Karten ------------------------------------------------------- */
.raster{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));}
.karte{background:var(--papier);border:1px solid var(--linie);border-radius:var(--rund);
  overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;
  transition:transform .28s,box-shadow .28s,border-color .28s;}
a.karte:hover{transform:translateY(-4px);box-shadow:var(--schatten);border-color:var(--wald-hell);}
.karte__bild{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--sand);}
.karte__bild img{width:100%;height:100%;object-fit:cover;
  filter:saturate(.9) brightness(1.02) contrast(1.02);transition:transform .5s,filter .5s;}
/* Zarter warmer Fuß + Haarlinie: die sechs Fotos lesen sich als eine Familie,
   und das Bild geht ruhiger in den Textteil über (26.08.2026). */
.karte__bild::after{content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,rgba(43,39,33,0) 58%,rgba(43,39,33,.15) 100%);
  box-shadow:inset 0 0 0 1px rgba(43,39,33,.06);}
a.karte:hover .karte__bild img{transform:scale(1.04);filter:saturate(1.02) brightness(1.03) contrast(1.02);}
.karte__text{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1;}
.karte__text h3{margin-bottom:10px;}
.karte__text p{font-size:.98rem;margin-bottom:16px;}
.karte__mehr{margin-top:auto;font-size:.87rem;font-weight:700;color:var(--erde-tief);
  letter-spacing:.02em;}
.marke-zeile{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--wald-mittel);margin-bottom:8px;display:block;}

/* ---------- Liste mit Haken ---------------------------------------------- */
.haken{list-style:none;display:grid;gap:13px;}
.haken li{position:relative;padding-left:34px;}
.haken li::before{content:'';position:absolute;left:2px;top:.62em;width:15px;height:8px;
  border-left:2px solid var(--erde);border-bottom:2px solid var(--erde);
  transform:rotate(-45deg);}
.block--wald .haken li::before{border-color:var(--sand);}

/* ---------- Eckdaten-Kasten ---------------------------------------------- */
.eckdaten{background:var(--sand-hell);border:1px solid var(--linie);border-left:4px solid var(--wald-mittel);
  border-radius:var(--rund);padding:30px 32px;}
.eckdaten dl{display:grid;grid-template-columns:auto 1fr;gap:12px 24px;margin:0;}
.eckdaten dt{font-weight:800;color:var(--wald);font-size:.83rem;letter-spacing:.1em;
  text-transform:uppercase;padding-top:3px;}
.eckdaten dd{margin:0;}
.eckdaten__fuss{margin-top:22px;padding-top:18px;border-top:1px solid var(--linie);font-size:.94rem;}

/* ---------- Die Herzfrage ------------------------------------------------
   „Wofür schlägt Dein Herz?" ist ihr eigener Satz und die Einladung, um die
   sich alles dreht. Er stand bisher am Ende eines Absatzes und ging unter.
   Hier bekommt er einen eigenen Ort — mit dem Kreis als Rahmen. */
/* Der Abschnitt bekommt eine Mindesthöhe, die den Kreis sicher fasst, und
   zentriert seinen Inhalt darin. Mit blossen Abständen zu arbeiten ging
   schief: Der Kreis ragte je nach Breite in den Absatz darüber (20.08.2026).
   Mindesthöhe = Kreisdurchmesser + Luft, deshalb dieselbe clamp-Kurve. */
.herzfrage{position:relative;text-align:center;
  min-height:calc(min(420px,66vw) + 96px);
  display:flex;flex-direction:column;justify-content:center;
  padding:44px 0;}
.herzfrage__kreis{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:min(420px,66vw);aspect-ratio:1;border-radius:50%;
  border:1px solid var(--linie);pointer-events:none;}
.herzfrage__kreis::after{content:'';position:absolute;inset:30px;border-radius:50%;
  border:1px solid var(--linie);opacity:.5;}
.block--wald .herzfrage__kreis,.block--wald .herzfrage__kreis::after{border-color:rgba(255,255,255,.22);}
.herzfrage p.herzfrage__frage{position:relative;font-family:var(--serif);font-style:italic;
  font-size:clamp(1.7rem,4.4vw,2.65rem);line-height:1.25;color:var(--wald);
  max-width:13ch;margin:0 auto;}
.block--wald .herzfrage p.herzfrage__frage{color:#fff;}
/* Spezifitaet: .herzfrage p ist staerker als .herzfrage__zusatz allein —
   ohne das Element im Selektor erbt der Zusatz die grosse Kursive und wird
   zur zweiten Ueberschrift (20.08.2026 im Screenshot gesehen). */
.herzfrage p.herzfrage__zusatz{position:relative;margin:24px auto 0;font-family:var(--sans);
  font-style:normal;font-size:.95rem;line-height:1.65;color:var(--tinte-weich);max-width:36ch;}
.block--wald .herzfrage p.herzfrage__zusatz{color:rgba(255,255,255,.78);}

/* ---------- Zitat -------------------------------------------------------- */
.spruch{font-family:var(--serif);font-style:italic;font-size:clamp(1.35rem,3vw,2rem);
  line-height:1.45;color:var(--wald);text-align:center;max-width:800px;margin:0 auto;}
.block--wald .spruch{color:#fff;}
.spruch__quelle{display:block;font-family:var(--sans);font-style:normal;font-size:.83rem;
  letter-spacing:.16em;text-transform:uppercase;color:var(--wald-mittel);margin-top:24px;}
.block--wald .spruch__quelle{color:var(--sand);}

/* ---------- Bildband ----------------------------------------------------- */
.band{background-color:#181E16;position:relative;min-height:340px;display:flex;align-items:center;color:#fff;
  overflow:hidden;}
.band__bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.band::after{content:'';position:absolute;inset:0;background:rgba(30,38,27,.58);}
.band__in{position:relative;z-index:2;width:100%;max-width:var(--breit);margin:0 auto;
  padding:64px 26px;text-align:center;}
.band h2{color:#fff;}
/* .spruch ist standardmäßig dunkelgrün — im Bildband liegt es auf einem Foto
   und muss hell sein. Ohne diese Regel steht Dunkelgrün auf dunklem Wald und
   ist praktisch unsichtbar (20.08.2026, im Screenshot aufgefallen). */
.band .spruch{color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.55);}
.band .spruch__quelle{color:var(--sand);}

/* ---------- Termin-Modul: Kundenpalette ---------------------------------- */
:root{
  --termine-akzent:#5A6B4A;
  --termine-akzent-tief:#33452F;
  --termine-akzent-text:#FFFFFF;
  --termine-flaeche:#FCFAF6;
  --termine-linie:#DFD5C2;
  --termine-text:#2B2721;
  --termine-datum-bg:#33452F;
}
#termine-liste{margin-top:8px;}

/* ---------- Formular ----------------------------------------------------- */
.formular{display:grid;gap:18px;}
.feld{display:grid;gap:7px;}
.feld label{font-size:.88rem;font-weight:700;color:var(--wald);}
.feld input,.feld textarea,.feld select{font-family:var(--sans);font-size:1rem;
  padding:13px 15px;border:1px solid var(--linie);border-radius:var(--rund);
  background:#fff;color:var(--tinte);width:100%;}
.feld input:focus,.feld textarea:focus,.feld select:focus{border-color:var(--wald-mittel);outline:none;
  box-shadow:0 0 0 3px rgba(90,107,74,.16);}
.feld textarea{min-height:150px;resize:vertical;}
.feld--paar{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.hp-feld{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.zustimmung{display:flex;gap:12px;align-items:flex-start;font-size:.92rem;}
.zustimmung input{width:auto;margin-top:5px;flex-shrink:0;}
.hinweis{padding:15px 18px;border-radius:var(--rund);font-size:.96rem;}
.hinweis--gut{background:#EAF1E6;border:1px solid #B9CDB0;color:#2F5124;}
.hinweis--schlecht{background:#FBEBE6;border:1px solid #E5BCAC;color:#8A3B1E;}

/* ---------- Fuß ---------------------------------------------------------- */
.fuss{background:var(--wald);color:rgba(255,255,255,.74);padding:70px 0 30px;font-size:.95rem;}
.fuss a{color:rgba(255,255,255,.86);text-decoration:none;}
.fuss a:hover{color:#fff;text-decoration:underline;}
.fuss__raster{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:44px;margin-bottom:44px;}
.fuss h2{color:#fff;font-family:var(--sans);font-size:.76rem;letter-spacing:.2em;
  text-transform:uppercase;margin-bottom:18px;font-weight:800;}
.fuss ul{list-style:none;display:grid;gap:10px;}
.fuss .marke__wort{color:#fff;}
.fuss .marke__sub{color:var(--sand);}
.fuss__unten{border-top:1px solid rgba(255,255,255,.16);padding-top:24px;
  display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center;justify-content:space-between;
  font-size:.86rem;}
.fuss__unten nav{display:flex;flex-wrap:wrap;gap:8px 22px;}
.fuss .credit{opacity:.7;font-size:.92em;}
.fuss .credit:hover{opacity:1;}

/* Entwurfs-Plakette — vor Go-Live entfernen */
.entwurf{position:fixed;left:0;bottom:0;z-index:1500;background:var(--wald);color:#fff;
  font-size:10px;letter-spacing:.22em;text-transform:uppercase;padding:6px 13px;
  border-top-right-radius:var(--rund);text-decoration:none;}
.entwurf:hover{color:#fff;}

/* ---------- Sanft einblenden --------------------------------------------- */
.auf{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s ease;}
.auf.da{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important;}
  .auf{opacity:1;transform:none;}
  html{scroll-behavior:auto;}
}

/* ---------- Druck --------------------------------------------------------
   Jede Angebotsseite soll sich als sauberes Blatt ausdrucken lassen. Damit
   ist die Seite selbst der Flyer — und anders als ein PDF ist sie immer
   aktuell, weil die Termine aus dem Modul kommen. Weg müssen: Kopfleiste,
   Menü, Knöpfe, Bildbänder, Fußzeile, Entwurfs-Plakette. Dazu die Anschrift
   ans Ende, damit auf dem Papier steht, wer das anbietet (20.08.2026). */
@media print{
  .kopf,#mobilmenu,.burger,.sprung,.entwurf,.knopf,.knopfreihe,.band,
  .fuss__raster,.fuss__unten nav,.karte__mehr,.herzfrage__kreis{display:none !important;}
  body{padding-top:0;background:#fff;color:#000;font-size:11pt;line-height:1.5;}
  .block,.block--eng{padding:14pt 0;}
  .block--sand,.block--wald{background:#fff !important;color:#000 !important;}
  .block--wald h2,.block--wald h3{color:#000 !important;}
  .huelle,.schmal{max-width:none;padding:0;}
  h1{font-size:22pt;margin-bottom:6pt;}
  h2{font-size:15pt;margin-top:10pt;}
  h3{font-size:12pt;}
  .kopfbild,.hero{min-height:0;color:#000;display:block;}
  .kopfbild__bild,.hero__bild{position:static;width:100%;height:150pt;object-fit:cover;}
  .kopfbild::after,.hero::after{display:none;}
  .kopfbild__in,.hero__in{position:static;padding:8pt 0 0;}
  .kopfbild h1,.hero h1{color:#000;text-shadow:none;}
  .kopfbild__lead,.hero__lead{color:#000;text-shadow:none;}
  .faden,.augenbraue{color:#555 !important;}
  .eckdaten{border:1pt solid #999;border-left-width:3pt;padding:10pt 12pt;
    background:#fff;break-inside:avoid;}
  .raster{display:block;}
  .karte{border:1pt solid #bbb;margin-bottom:8pt;break-inside:avoid;}
  .karte__bild{display:none;}
  .paar{display:block;}
  .paar__bild{display:none;}
  .auf{opacity:1 !important;transform:none !important;}
  a{color:#000;text-decoration:none;}
  /* Adressen ausgeschriebener Links, damit auf Papier nichts verlorengeht */
  .block a[href^="http"]::after{content:" (" attr(href) ")";font-size:8.5pt;color:#555;}
  .fuss{background:#fff;color:#000;padding:10pt 0 0;border-top:1pt solid #999;}
  .fuss::after{content:"Katrin Bressel · Eduard-Bilz-Straße 3 · 01445 Radebeul · 0163 3704390 · info@sinn-kreise.de · sinn-kreise.de";
    display:block;font-size:9.5pt;color:#333;}
  @page{margin:16mm 15mm;}
}

/* ---------- Schmale Geräte ----------------------------------------------- */
@media (max-width:900px){
  .nav{display:none;}
  .burger{display:flex;}
  .paar,.paar--schmalbild{grid-template-columns:1fr;gap:34px;}
  .paar--gedreht .paar__text{order:0;}
  .fuss__raster{grid-template-columns:1fr;gap:34px;}
}
@media (max-width:560px){
  body{font-size:16.5px;}
  .huelle,.kopf__in,.hero__in,.kopfbild__in,.band__in{padding-left:20px;padding-right:20px;}
  .hero__in{padding-bottom:54px;}
  .eckdaten{padding:24px 22px;}
  .eckdaten dl{grid-template-columns:1fr;gap:4px 0;}
  .eckdaten dt{padding-top:12px;}
  .eckdaten dt:first-child{padding-top:0;}
  .feld--paar{grid-template-columns:1fr;}
  .knopfreihe .knopf{width:100%;text-align:center;}
}