/* weltseite-winterfeld.css — Zusatz für die Welt-Seite „Gesund Erwachsen Werden" (Julian Winterfeld), 11.09.2026
   Wird nur von welt/gesund-erwachsen-werden/ geladen (YAML zusatz_css). Gegenstück zur dunklen Falk-Seite:
   helles Aquarellpapier, Tinte statt Gold. --tint wandert beim Scrollen durch die fünf Coverfarben
   (Blau → Grün → Violett → Orange → Rot, gesetzt von WF_JS); ohne Skript bleibt es beim Blau von Band 1. */
.t-winterfeld{--nacht:#fbf8f2;--nacht2:#f4efe5;--schiefer:#ffffff;--linie:rgba(38,48,58,.13);
  --text:#28313b;--text2:#5d6671;--tinte:#1f2a35;--papier:#fbf8f2;--papier2:#f3eee3;
  --tint:#4d9ace;--gold:#3d6f93;--gold-hell:#2e5f84;--radius:10px;
  --tint-text:#2f5f80;--tint-text:color-mix(in srgb,var(--tint) 58%,#1a2430);
  --tint-weich:rgba(77,154,206,.12);--tint-weich:color-mix(in srgb,var(--tint) 13%,transparent)}
.t-winterfeld body,body.t-winterfeld{background:var(--papier);color:var(--text)}
body.t-winterfeld{background-image:radial-gradient(ellipse at 50% 0%,var(--tint-weich),transparent 70%);background-attachment:fixed;transition:background-color .6s}
.t-winterfeld [hidden]{display:none !important}
.t-winterfeld ::selection{background:var(--tint);color:#fff}
.t-winterfeld a{color:var(--tint-text)}
.t-winterfeld h2{color:var(--tinte)}
.t-winterfeld .kicker{color:var(--tint-text);transition:color .6s}
.t-winterfeld .sek-kopf p,.t-winterfeld .fussnote{color:var(--text2)}
.t-winterfeld .orn{color:var(--tint-text)}

/* Kopfleiste */
.t-winterfeld .w-nav.fest{background:rgba(251,248,242,.93);border-bottom-color:var(--linie);box-shadow:0 4px 22px rgba(30,40,50,.08)}
.t-winterfeld .w-nav.fest .brand,.t-winterfeld .w-nav.fest a.zur{color:var(--tinte);text-shadow:none}
.t-winterfeld .w-nav.fest img{filter:brightness(.35)}

/* Knöpfe */
.t-winterfeld .knopf.voll{background:var(--tinte);color:#fff;box-shadow:0 6px 22px rgba(31,42,53,.18)}
.t-winterfeld .knopf.voll:hover{background:var(--tint-text);color:#fff}
.t-winterfeld .knopf.leer{border-color:rgba(31,42,53,.35);color:var(--tinte)}
.t-winterfeld .knopf.leer:hover{border-color:var(--tint);color:var(--tint-text)}
.t-winterfeld button.knopf{font:inherit;font-family:'Cinzel',serif;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;background:none}
.t-winterfeld button.knopf.voll{background:var(--tinte)}

/* Hero: Himmel bleibt frei, Text links auf leichtem Blau-Schleier, unten weich ins Papier */
.t-winterfeld .w-hero{background:var(--papier);min-height:clamp(560px,90vh,880px)}
.t-winterfeld .w-hero-img{object-position:62% 60%;animation-duration:46s}
.t-winterfeld .w-hero::after{background:
  linear-gradient(to top,var(--papier) 0%,rgba(251,248,242,.55) 9%,rgba(251,248,242,0) 22%),
  linear-gradient(to right,rgba(16,40,66,.62) 0%,rgba(16,40,66,.42) 32%,rgba(16,40,66,.08) 58%,rgba(16,40,66,0) 70%)}
.t-winterfeld .w-hero-txt{padding-bottom:110px}
.t-winterfeld .w-hero h1{font-size:clamp(2.8rem,7.6vw,5.6rem);line-height:1.02;max-width:760px;text-wrap:balance;text-shadow:0 3px 30px rgba(10,30,55,.45)}
.t-winterfeld .w-hero .kicker{color:#fff;text-shadow:0 1px 10px rgba(10,30,55,.6)}
.t-winterfeld .w-hero .unter{color:#fff;text-shadow:0 2px 16px rgba(10,30,55,.65)}
.t-winterfeld .w-hero blockquote{border-left-color:#fff}
.t-winterfeld .w-hero blockquote p{text-shadow:0 2px 14px rgba(10,30,55,.6)}
.t-winterfeld .w-hero blockquote cite{color:#fff;opacity:.9}
.t-winterfeld .w-hero .knopf.voll{background:#fff;color:var(--tinte)}
.t-winterfeld .w-hero .knopf.voll:hover{background:#eef5fb;color:var(--tinte)}
.t-winterfeld .w-hero .knopf.leer{border-color:rgba(255,255,255,.75);color:#fff}
.t-winterfeld .w-scroll{background:linear-gradient(var(--tinte),transparent)}

/* Sprungleiste */
.t-winterfeld .w-sprung{background:rgba(251,248,242,.94);border-color:var(--linie)}
.t-winterfeld .w-sprung a{color:var(--text2)}
.t-winterfeld .w-sprung a:hover,.t-winterfeld .w-sprung a.an{color:var(--tinte);border-bottom-color:var(--tint)}

/* Einleitung */
.t-winterfeld .w-intro p{color:var(--text)}
.t-winterfeld .w-intro p:first-of-type::first-letter{color:var(--tint-text)}

/* Bildbänder: Aquarell bleibt hell, Schrift auf eigenem Schleier */
.t-winterfeld .band::after{background:linear-gradient(to bottom,var(--papier) 0%,rgba(251,248,242,0) 16%,rgba(251,248,242,0) 84%,var(--papier) 100%),
  radial-gradient(ellipse at 50% 50%,rgba(14,28,44,.42) 0%,rgba(14,28,44,.12) 60%,transparent 80%)}
.t-winterfeld .band cite{color:#fff}

/* Pinterest-Merken (wie Falk, helle Fassung) */
.t-winterfeld .pin{position:absolute;top:12px;right:12px;z-index:3;font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tinte);text-decoration:none;background:rgba(255,255,255,.85);border:1px solid rgba(31,42,53,.2);border-radius:999px;padding:6px 12px 5px;
  backdrop-filter:blur(6px);opacity:0;transition:opacity .3s}
.t-winterfeld .tg-bild:hover .pin,.t-winterfeld .pin:focus-visible{opacity:1}
@media (hover:none){.t-winterfeld .pin{opacity:1}}
.t-winterfeld .pin-k{position:static;opacity:1;display:inline-flex;margin:18px auto 0}
.t-winterfeld .f-ue .pin-k{display:flex;width:max-content;margin:18px auto 0}

/* ---------------------------------------------------------------- Ein ganz normaler Tag */
.f-tag{--tag:0;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.55) 30%,transparent)}
.tg-leiste{position:relative;margin:0 0 26px;padding-top:54px}
.tg-sonne{position:absolute;left:3%;right:3%;top:0;height:54px;pointer-events:none}
.tg-sonne::before{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(to right,transparent,var(--linie) 12%,var(--linie) 88%,transparent)}
.tg-sonne span{position:absolute;left:0;bottom:0;width:26px;height:26px;margin:0 0 -13px -13px;border-radius:50%;
  background:radial-gradient(circle,#fff6d8 0%,#ffd27a 45%,rgba(255,190,90,0) 72%);box-shadow:0 0 30px 10px rgba(255,200,110,.45);transition:left .7s cubic-bezier(.3,.7,.3,1),bottom .7s cubic-bezier(.3,.7,.3,1)}
.tg-knoepfe{list-style:none;margin:0;padding:0 0 6px;display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px}
.tg-k{width:100%;border:1px solid var(--linie);background:rgba(255,255,255,.7);border-radius:12px;padding:10px 6px 9px;cursor:pointer;font:inherit;color:var(--text);
  display:flex;flex-direction:column;align-items:center;gap:2px;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s}
.tg-k:hover{transform:translateY(-2px);border-color:var(--tint)}
.tg-k:focus-visible{outline:2px solid var(--tint-text);outline-offset:2px}
.tg-z{font-family:'Cinzel',serif;font-size:.8rem;letter-spacing:.06em;color:var(--tinte)}
.tg-t{font-size:.72rem;line-height:1.25;color:var(--text2);text-align:center}
.tg-k[aria-pressed="true"]{background:var(--tinte);border-color:var(--tinte);box-shadow:0 10px 24px rgba(31,42,53,.2)}
.tg-k[aria-pressed="true"] .tg-z,.tg-k[aria-pressed="true"] .tg-t{color:#fff}
.tg-buehne{outline:none}
.tg-blatt{background:#fff;border:1px solid var(--linie);border-radius:16px;overflow:hidden;box-shadow:0 30px 70px rgba(31,42,53,.1);animation:tgEin .5s ease}
.tg-blatt.mit-bild{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
@keyframes tgEin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.tg-bild{position:relative;background:var(--papier2)}
.tg-bild img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/5;max-height:560px;object-position:50% 60%}
.tg-tx{padding:clamp(24px,4vw,46px)}
.tg-kopf{font-family:'Playfair Display',serif;font-size:1.7rem;color:var(--tinte);margin:0 0 18px;line-height:1.2}
.tg-uhr{display:inline-block;font-family:'Cinzel',serif;font-size:.9rem;letter-spacing:.08em;color:#fff;background:var(--tint);border-radius:999px;padding:4px 12px 3px;vertical-align:middle;margin-right:6px;transition:background .6s}
.tg-lbl{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tint-text);margin:18px 0 4px}
.tg-tx p{margin:0 0 6px}
.tg-szene{font-style:italic}
.tg-tx blockquote{margin:22px 0 0;padding:16px 18px;border-left:3px solid var(--tint);background:var(--tint-weich);border-radius:0 10px 10px 0}
.tg-tx blockquote p{font-family:'Playfair Display',serif;font-style:italic;font-size:1.26rem;line-height:1.4;color:var(--tinte);margin:0}
.tg-tx cite{display:block;margin-top:8px;font-style:normal;font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--text2)}
.tg-nav{display:flex;justify-content:center;gap:12px;margin:22px 0 0}
.tg-blatt[data-band="1"]{--bt:#4d9ace}.tg-blatt[data-band="2"]{--bt:#5abf89}.tg-blatt[data-band="3"]{--bt:#9a76e3}.tg-blatt[data-band="4"]{--bt:#f59f3d}.tg-blatt[data-band="5"]{--bt:#f24b51}
.tg-blatt{border-top:5px solid var(--bt,var(--tint))}

/* ---------------------------------------------------------------- Was ankommt */
.ue-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ue{display:flex}
.ue-karte{position:relative;width:100%;display:flex;flex-direction:column;perspective:1400px}
.ue-dreh{position:relative;flex:1;min-height:300px;border:0;padding:0;background:none;font:inherit;color:inherit;cursor:pointer;text-align:left;
  transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ue.um .ue-dreh{transform:rotateY(180deg)}
.ue-dreh:focus-visible{outline:2px solid var(--tint-text);outline-offset:4px;border-radius:14px}
.ue-vo,.ue-ru{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;border:1px solid var(--linie);
  padding:24px 22px;display:flex;flex-direction:column;overflow:hidden;background:#fff;box-shadow:0 14px 36px rgba(31,42,53,.07)}
.ue-vo::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bk,var(--tint))}
.ue[data-band="1"]{--bk:#4d9ace}.ue[data-band="2"]{--bk:#5abf89}.ue[data-band="3"]{--bk:#9a76e3}.ue[data-band="4"]{--bk:#f59f3d}.ue[data-band="5"]{--bk:#f24b51}
.ue-q{font-family:'Playfair Display',serif;font-size:1.42rem;line-height:1.28;color:var(--tinte);margin:auto 0 12px}
.ue-gm{font-size:.9rem;color:var(--text2)}
.ue-gm b{font-weight:500;color:var(--text)}
.t-winterfeld .fk-dreh{margin-top:16px;font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tint-text);opacity:.8}
.t-winterfeld .fk-dreh::after{content:' ↻'}
.ue-ru{transform:rotateY(180deg);background:linear-gradient(to bottom,#fff,var(--papier));gap:2px}
.ue-lbl{font-family:'Cinzel',serif;font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text2);margin-top:4px}
.ue-lbl+.ue-an{margin-top:2px}
.ue-an{font-family:'Playfair Display',serif;font-style:italic;font-size:1.05rem;line-height:1.35;color:#8a3b3f}
.ue-tr{font-family:'Playfair Display',serif;font-style:italic;font-size:1.05rem;line-height:1.35;color:#2c6a4e}
.ue-qu{font-size:.74rem;color:var(--text2);margin-bottom:10px}
.ue-kenn{margin-top:10px;align-self:flex-start;border:1px solid var(--linie);background:rgba(255,255,255,.8);border-radius:999px;padding:7px 14px 6px 34px;position:relative;
  font:inherit;font-size:.84rem;color:var(--text);cursor:pointer;transition:background .25s,border-color .25s}
.ue-kenn::before{content:'';position:absolute;left:10px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:1px solid var(--bk,var(--tint));transition:background .25s}
.ue-kenn[aria-pressed="true"]{background:var(--tint-weich);border-color:var(--bk,var(--tint))}
.ue-kenn[aria-pressed="true"]::before{background:var(--bk,var(--tint))}
.ue-kenn[aria-pressed="true"]::after{content:'';position:absolute;left:15px;top:50%;width:4px;height:8px;margin-top:-6px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.ue-kenn:focus-visible{outline:2px solid var(--tint-text);outline-offset:2px}
.ue-erg{max-width:720px;margin:34px auto 0;padding:20px 24px;border:1px dashed rgba(31,42,53,.25);border-radius:14px;text-align:center;background:rgba(255,255,255,.6)}
.ue-erg p{margin:0}
.ue-zahl{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--tinte)}
.ue-band{margin-top:6px !important;color:var(--text2)}
.ue-leer{color:var(--text2)}
.ue-schluss{max-width:720px;margin:44px auto 0;text-align:center}
.ue-schluss p{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.3;color:var(--tinte);margin:0}
.ue-schluss cite{display:block;margin-top:10px;font-style:normal;font-family:'Cinzel',serif;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tint-text)}

/* ---------------------------------------------------------------- Der zweite Blick (Wendekarten, Typ faeden) */
.t-winterfeld .fk-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.t-winterfeld .fk{perspective:1400px;min-height:320px}
.t-winterfeld .fk-in{position:relative;width:100%;height:100%;min-height:320px;border:0;padding:0;background:none;color:inherit;font:inherit;cursor:pointer;
  transform-style:preserve-3d;transition:transform .8s cubic-bezier(.2,.7,.2,1);text-align:left}
.t-winterfeld .fk.um .fk-in{transform:rotateY(180deg)}
.t-winterfeld .fk-in:focus-visible{outline:2px solid var(--tint-text);outline-offset:4px;border-radius:14px}
.t-winterfeld .fk-vo,.t-winterfeld .fk-ru{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:14px;
  border:1px solid var(--linie);padding:24px 22px;display:flex;flex-direction:column;overflow:hidden}
.t-winterfeld .fk-vo{background:repeating-linear-gradient(-8deg,rgba(31,42,53,.025) 0 2px,transparent 2px 7px),#fff;box-shadow:0 14px 36px rgba(31,42,53,.07)}
.t-winterfeld .fk-vo b{margin:auto 0 0;align-self:flex-start;font-family:'Playfair Display',serif;font-weight:400;font-size:1.65rem;color:var(--tinte);
  background:#fff7d6;border:1px solid #e9d99a;padding:6px 16px;border-radius:6px;transform:rotate(-2.5deg);box-shadow:0 6px 14px rgba(120,100,40,.12)}
.t-winterfeld .fk-vo q{quotes:none;font-style:italic;color:var(--text2);font-size:.98rem;line-height:1.5;margin-top:14px}
.t-winterfeld .fk-nr{font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text2)}
.t-winterfeld .fk-ru{transform:rotateY(180deg);background:linear-gradient(to bottom,#fff,var(--papier));gap:10px}
.t-winterfeld .fk-ru b{font-family:'Playfair Display',serif;font-weight:400;font-size:1.25rem;color:var(--tinte);text-decoration:line-through;text-decoration-color:rgba(31,42,53,.35)}
.t-winterfeld .fk-t{font-size:.95rem;line-height:1.55;color:var(--text)}
.t-winterfeld .fk-f{margin-top:auto;font-family:'Playfair Display',serif;font-style:italic;font-size:1.02rem;line-height:1.4;color:var(--tint-text)}

/* ---------------------------------------------------------------- Drei Sekunden */
.f-warten{text-align:center}
.f-warten .sek-kopf{margin-left:auto;margin-right:auto}
.wt-feld{background:#fff;border:1px solid var(--linie);border-radius:18px;padding:34px clamp(20px,5vw,48px) 26px;box-shadow:0 30px 70px rgba(31,42,53,.08)}
.wt-kind{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.2rem,2.6vw,1.5rem);line-height:1.4;color:var(--tinte);margin:0 0 6px}
.wt-ende{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.2rem,2.6vw,1.5rem);line-height:1.4;color:#2c6a4e;margin:0 0 6px;animation:tgEin .6s ease}
.wt-abt{color:var(--text2);margin:0}
.wt-knopf{position:relative;width:170px;height:170px;margin:26px auto 12px;border:0;border-radius:50%;background:var(--papier);cursor:pointer;display:grid;place-items:center;
  font:inherit;font-family:'Cinzel',serif;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinte);padding:0 30px;line-height:1.5;
  -webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;transition:transform .2s,background .3s}
.wt-knopf svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.wt-bahn{fill:none;stroke:var(--linie);stroke-width:6}
.wt-ring{fill:none;stroke:var(--tint);stroke-width:6;stroke-linecap:round}
.wt-knopf span{position:relative}
.wt-knopf.an{transform:scale(.96);background:var(--tint-weich)}
.wt-knopf:focus-visible{outline:2px solid var(--tint-text);outline-offset:4px}
.wt-hinw{font-size:.8rem;color:var(--text2);margin:0}
.wt-danach{margin-top:30px;animation:tgEin .6s ease}
.wt-danach blockquote{margin:0 0 16px}
.wt-danach blockquote p{font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.4rem,3vw,1.9rem);line-height:1.3;color:var(--tinte);margin:0}
.wt-danach blockquote.klein p{font-size:1.15rem}
.wt-danach cite{display:block;margin-top:8px;font-style:normal;font-family:'Cinzel',serif;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tint-text)}
.wt-danach>p{color:var(--text);max-width:600px;margin:0 auto 22px}

/* ---------------------------------------------------------------- Ein Satz für heute (Typ tagesfrage) */
.t-winterfeld .f-frage{text-align:center}
.t-winterfeld .fr-intro{color:var(--text2);max-width:560px;margin:0 auto 34px}
.t-winterfeld .fr-karte{margin:0 auto 26px;max-width:680px;padding:52px clamp(22px,5vw,60px);border-radius:18px;position:relative;
  background:#fff;border:1px solid var(--linie);box-shadow:0 30px 70px rgba(31,42,53,.1);transition:opacity .26s,transform .26s}
.t-winterfeld .fr-karte::before{content:'';position:absolute;left:0;right:0;top:0;height:6px;border-radius:18px 18px 0 0;
  background:linear-gradient(to right,#4d9ace,#5abf89,#9a76e3,#f59f3d,#f24b51)}
.t-winterfeld .fr-karte.weg{opacity:0;transform:translateY(8px)}
.t-winterfeld .fr-karte blockquote{margin:0;font-family:'Playfair Display',serif;font-style:italic;font-size:clamp(1.4rem,3.1vw,1.95rem);line-height:1.35;color:var(--tinte)}
.t-winterfeld .fr-karte figcaption{margin-top:18px;font-family:'Cinzel',serif;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tint-text)}
.t-winterfeld .f-frage .knoepfe{justify-content:center}
.t-winterfeld .f-frage .pin-k{margin:0}

/* ---------------------------------------------------------------- Wegweiser */
.ww-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px;align-items:start}
.ww-f{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--tinte);margin:0 0 12px}
.ww-f+.ww-wahl{margin-bottom:28px}
.ww-wahl{display:flex;flex-wrap:wrap;gap:8px}
.ww-lang{flex-direction:column}
.ww-w{border:1px solid var(--linie);background:rgba(255,255,255,.8);border-radius:999px;padding:9px 16px 8px;font:inherit;font-size:.95rem;color:var(--text);cursor:pointer;text-align:left;
  transition:background .2s,border-color .2s,color .2s}
.ww-lang .ww-w{border-radius:12px;padding:12px 16px}
.ww-w:hover{border-color:var(--tint)}
.ww-w[aria-pressed="true"]{background:var(--tinte);border-color:var(--tinte);color:#fff}
.ww-w:focus-visible{outline:2px solid var(--tint-text);outline-offset:2px}
.ww-aus{position:sticky;top:130px;min-height:260px;border-radius:18px;border:1px dashed rgba(31,42,53,.22);background:rgba(255,255,255,.55);display:flex;align-items:center;justify-content:center}
.ww-aus:has(.ww-karte){border:0;background:none;display:block}
.ww-ohne{color:var(--text2);margin:0;padding:24px;text-align:center}
.ww-karte{display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;background:#fff;border:1px solid var(--linie);border-top:6px solid var(--bf,var(--tint));
  border-radius:18px;padding:26px;box-shadow:0 30px 70px rgba(31,42,53,.1);animation:tgEin .5s ease}
.ww-karte img{width:150px;height:auto;border-radius:4px;box-shadow:0 14px 30px rgba(31,42,53,.25)}
.ww-nr{font-family:'Cinzel',serif;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text2);margin:0}
.ww-karte h3{font-family:'Playfair Display',serif;font-weight:500;font-size:1.45rem;color:var(--tinte);margin:4px 0 10px;line-height:1.2}
.ww-tx>p{margin:0 0 10px}
.ww-klbl{font-size:.82rem;color:var(--text2)}
.ww-kap{margin:0 0 16px;padding-left:18px;font-size:.95rem}
.ww-tx .knopf{padding:10px 14px;font-size:.66rem}
.ww-zusatz{margin-top:16px !important;padding-top:14px;border-top:1px solid var(--linie);font-size:.92rem;color:var(--text2)}

/* ---------------------------------------------------------------- Drei Türen */
.tu-tabs{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 0 22px}
.tu-tab{border:1px solid var(--linie);background:rgba(255,255,255,.8);border-radius:999px;padding:10px 18px 9px;font:inherit;font-size:.92rem;color:var(--text);cursor:pointer}
.tu-tab[aria-selected="true"]{background:var(--tinte);color:#fff;border-color:var(--tinte)}
.tu-tab:focus-visible{outline:2px solid var(--tint-text);outline-offset:2px}
.tu-p{background:#fff;border:1px solid var(--linie);border-radius:18px;padding:32px clamp(20px,5vw,44px);box-shadow:0 24px 60px rgba(31,42,53,.08);animation:tgEin .4s ease}
.tu-p blockquote{margin:0 0 16px}
.tu-p blockquote p{font-family:'Playfair Display',serif;font-style:italic;font-size:1.35rem;line-height:1.4;color:var(--tinte);margin:0}
.tu-p cite{display:block;margin-top:8px;font-style:normal;font-family:'Cinzel',serif;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tint-text)}
.tu-p>p{margin:0;color:var(--text)}
.f-tueren .sek-kopf{text-align:center;margin-left:auto;margin-right:auto}

/* ---------------------------------------------------------------- Bücher: fünf Stationen in Coverfarbe */
.t-winterfeld .buch-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:22px}
.t-winterfeld .buch-grid>.buchk{flex:0 1 calc((100% - 44px)/3);max-width:none}
.t-winterfeld .buchk{background:#fff;border:1px solid var(--linie);border-top:6px solid var(--bf,var(--tint));border-radius:16px;box-shadow:0 20px 50px rgba(31,42,53,.08)}
.t-winterfeld .buchk .cov{box-shadow:0 18px 36px rgba(31,42,53,.25)}
.t-winterfeld .buchk .nr{color:var(--bf,var(--tint-text));filter:saturate(1.1) brightness(.8)}
.t-winterfeld .buchk h3{color:var(--tinte)}
.t-winterfeld .buchk .satz{color:var(--text2)}
.t-winterfeld .kernfrage{font-family:'Playfair Display',serif;font-style:italic;color:var(--tinte);font-size:1.02rem;line-height:1.4;margin:0 0 14px;padding:10px 12px;
  background:linear-gradient(to right,transparent,rgba(255,255,255,0)),var(--papier);border-radius:8px}
.t-winterfeld .tags li{color:var(--text2);border-color:var(--linie)}
.t-winterfeld .buchk .preis{color:var(--text2)}
.t-winterfeld .buchk .preis b{color:var(--tinte)}
.t-winterfeld .buchk .mehr{color:var(--tint-text)}
.t-winterfeld .fuer{color:var(--tinte)}
.t-winterfeld .autor{background:#fff;border-color:var(--linie)}
.t-winterfeld .autor img{border-color:var(--tint)}
.t-winterfeld .autor p{color:var(--text)}
.t-winterfeld .autor b{color:var(--tinte)}

/* FAQ + Fuß */
.t-winterfeld .faq details{border-bottom-color:var(--linie)}
.t-winterfeld .faq summary{color:var(--tinte)}
.t-winterfeld .faq summary::after{color:var(--tint-text)}
.t-winterfeld .faq details p{color:var(--text)}
.t-winterfeld .w-fuss{background:#1f2a35;color:#b9c2cc;border-top:0}
.t-winterfeld .w-fuss a{color:#d7dde3}

/* Farbweg: dünne Leiste am unteren Rand */
.wf-weg{position:fixed;left:0;right:0;bottom:0;height:4px;z-index:70;transform-origin:0 50%;transform:scaleX(0);pointer-events:none;
  background:linear-gradient(to right,#4d9ace,#5abf89,#9a76e3,#f59f3d,#f24b51)}

/* ---------------------------------------------------------------- Mobil */
@media (max-width:1000px){
  .tg-knoepfe{grid-template-columns:repeat(5,minmax(0,1fr))}
  .tg-sonne{display:none}.tg-leiste{padding-top:0}
}
@media (max-width:900px){
  .ue-grid,.t-winterfeld .fk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ww-grid{grid-template-columns:1fr;gap:26px}
  .ww-aus{position:static}
  .t-winterfeld .buch-grid>.buchk{flex-basis:calc((100% - 22px)/2)}
}
@media (max-width:760px){
  .tg-blatt.mit-bild{grid-template-columns:1fr}
  .tg-bild img{aspect-ratio:4/3;max-height:none;object-position:50% 45%}
  .t-winterfeld .buch-grid>.buchk{flex-basis:100%;max-width:440px}
  .t-winterfeld .w-hero::after{background:
    linear-gradient(to top,var(--papier) 0%,rgba(251,248,242,.5) 7%,rgba(251,248,242,0) 16%),
    linear-gradient(to top,rgba(16,40,66,.72) 16%,rgba(16,40,66,.45) 50%,rgba(16,40,66,.12) 80%)}
  .t-winterfeld .w-hero-img{object-position:70% 55%}
}
@media (max-width:600px){
  .ue-grid,.t-winterfeld .fk-grid{grid-template-columns:1fr}
  .tg-knoepfe{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
  .tg-k{padding:8px 2px}.tg-t{display:none}
  .ww-karte{grid-template-columns:1fr;text-align:left}
  .ww-karte img{width:120px}
}
@media (prefers-reduced-motion:reduce){
  .ue-dreh,.t-winterfeld .fk-in{transition:none}
  .tg-blatt,.ww-karte,.tu-p,.wt-danach,.wt-ende{animation:none}
  .tg-sonne span{transition:none}
}

/* Wendekarten: Vorder- und Rueckseite teilen sich eine Rasterzelle, die Karte ist so hoch wie ihre laengere Seite
   (statt fester Mindesthoehe, die am Handy eine halbe leere Karte hinterliess). */
.ue-dreh,.t-winterfeld .fk-in{display:grid;min-height:240px}
.t-winterfeld .fk{min-height:0}
.ue-vo,.ue-ru,.t-winterfeld .fk-vo,.t-winterfeld .fk-ru{position:relative;inset:auto;grid-area:1/1}
