/* NUR VORSCHAU (Lillia 28.10.2026): Nebenseiten wie Figma „Stand 25.10.“ – Kopf wie Startseite, Hausschriften, keine Fabelwesen am Logo.
   Diese Datei geht nicht an das Team; Vorlage für das Team ist Figma. */
:root{--sans:'Raisonne','EB Garamond',Georgia,serif}
.heimweg-zeile,.heimweg-menue-zeile{display:none!important}
.j-webkopf .marke .wesen-stand{display:none}
.j-kopf .j-wesen{display:none}

.j-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:16px 22px;border:1px solid var(--tinte);background:transparent;color:var(--tinte);cursor:pointer;text-decoration:none;border-radius:0;line-height:1.2}
.j-btn.voll{width:100%}
.j-btn.schwarz{background:var(--tinte);color:var(--papier)}
.j-btn.gelb{background:var(--gelb);border-color:var(--gelb);color:#141414}
.j-btn:disabled,.j-btn[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.j-preisleiste .j-btn{min-width:140px}
.j-aufenthalt.unten .j-btn{flex:0 1 auto;max-width:46%;padding:12px 14px;min-height:44px;white-space:normal;text-align:center}
.j-aufenthalt.unten.strecke .j-btn{font-size:clamp(10px,2.7vw,11px);letter-spacing:.06em;padding-left:10px;padding-right:10px;max-width:52%;overflow-wrap:normal;hyphens:none}
.j-aufenthalt.karte .j-btn{width:100%;margin-top:10px}
.j-liste-auswahl .j-btn{display:block;text-align:left;width:100%}
@media (min-width:900px){.j-web .nur-schmal{display:none!important}}
@media (max-width:899px){.j-web .nur-breit{display:none!important}}
.j-webkopf{background:var(--papier);border-bottom:1px solid var(--linie);position:relative;z-index:5}
.j-webkopf .links{display:flex;align-items:center;gap:4px}
.j-webkopf .leiste{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:16px;padding:16px 48px 14px}
.j-webkopf ul{list-style:none;margin:0;padding:0}
.j-webkopf nav ul{display:flex;flex-wrap:wrap;gap:0 28px}
.j-webkopf nav a,.j-webkopf .kopflink,.j-webkopf summary{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--mut);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.j-webkopf nav a[aria-current],.j-webkopf .kopflink{color:var(--tinte)}
.j-webkopf .marke{display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none}
.j-webkopf .marke .j-logo{height:27px;width:auto;margin:0}
.j-webkopf .marke .j-wesen{height:47px;width:auto;margin:0}
.j-webkopf .bereich{font-family:var(--sans);font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
.j-webkopf .rechts{display:flex;justify-content:flex-end;align-items:center;gap:20px}
.j-webkopf summary{cursor:pointer;list-style:none;color:var(--tinte)}
.j-webkopf summary::-webkit-details-marker{display:none}
.j-webkopf .menue-inhalt{position:absolute;left:0;right:0;top:100%;background:var(--papier);border-bottom:1px solid var(--linie);padding:8px 20px 16px}
.j-webkopf .menue-inhalt nav ul{flex-direction:column}
.j-webkopf .ks-auf{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;height:44px;color:var(--tinte);border-radius:4px;flex:none;text-decoration:none;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.j-webkopf .ks-auf[aria-expanded="true"]{background:var(--grund)}
.j-webkopf .ks-ebene{display:none;position:absolute;left:0;right:0;top:100%;z-index:6;background:var(--papier);border-bottom:1px solid var(--linie);padding:12px 14px 16px;box-shadow:0 14px 28px rgba(20,20,20,.10)}
.j-webkopf .ks-ebene[data-offen]{display:block}
.j-webkopf .ks-ebene>*{max-width:720px;margin-left:auto;margin-right:auto}
.j-web .ks-los:focus-visible,.j-web .ks-zu:focus-visible,.j-webkopf .ks-auf:focus-visible{outline:2px solid var(--tinte);outline-offset:-2px}
@media (max-width:899px){.j-webkopf .ks-auf-text{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}}
@media (min-width:900px){.j-webkopf .ks-auf{padding:0 6px;margin-left:22px;color:var(--mut)}.j-webkopf .ks-auf:hover,.j-webkopf .ks-auf[aria-expanded="true"]{color:var(--tinte)}.j-webkopf .ks-ebene{padding:20px var(--rand) 24px}}
.j-sprachen{display:flex;gap:10px;list-style:none;margin:0;padding:0}
.j-sprachen a{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:.12em;color:var(--mut);text-decoration:none;min-height:32px;display:inline-flex;align-items:center;border-bottom:2px solid transparent}
.j-sprachen a[aria-current]{color:var(--tinte);border-bottom-color:var(--gelb)}
@media (max-width:899px){.j-webkopf .leiste{padding:12px 14px;gap:8px}.j-webkopf .rechts{gap:0}.j-webkopf .marke .j-logo{height:15px}.j-webkopf .leiste{grid-template-columns:1fr minmax(0,auto) 1fr}.j-webkopf .marke{min-width:0}.j-webkopf .bereich{white-space:normal;word-break:break-word}.j-webkopf .marke{gap:6px}.j-webkopf .kopflink,.j-webkopf summary{font-size:10px;font-weight:500;letter-spacing:.12em}.j-webkopf .menue-inhalt .j-sprachen{margin-top:8px}}
.j-web .j-btn{font-size:12px;letter-spacing:.14em;padding:15px 26px;border-radius:4px;min-height:44px}
.j-web .j-btn.haupt{background:var(--gelb);border-color:var(--gelb);color:#141414}
.j-web .j-btn.primaer{background:var(--tinte);border-color:var(--tinte);color:var(--papier)}
.j-web .j-btn.sekundaer{background:var(--papier);border-color:var(--tinte);color:var(--tinte)}
.j-web .j-btn.leise{background:none;border-color:transparent;color:var(--gold);padding-left:0;padding-right:0}
.j-web .j-btn.leise:hover{text-decoration:underline}
.j-webkopf .wesen-stand{display:flex;flex-direction:column;align-items:center;margin-bottom:3px}
.j-webkopf .marke .j-wesen{transform-origin:50% 100%}
.j-webkopf .marke .wesen-stand{display:none}
@media (prefers-reduced-motion:no-preference){.j-webkopf .marke:hover .j-wesen,.j-webkopf .marke:focus-visible .j-wesen{animation:wesen-wackel .7s ease-in-out 1}}
.j-webkopf .marke-heim{display:flex;flex-direction:column;align-items:center;gap:inherit;text-decoration:none}
.j-webkopf .marke-heim:focus-visible .j-wesen{animation:wesen-wackel .7s ease-in-out 1}
.j-webkopf a.bereich{text-decoration:none}
.j-webkopf a.bereich:hover,.j-webkopf a.bereich:focus-visible{color:var(--tinte);text-decoration:underline;text-underline-offset:.2em}
.j-webkopf .heimweg-zeile{margin:0;padding:6px 48px 0}
.j-webkopf .heimweg,.j-webkopf .heimweg-menue{font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.02em;color:var(--tinte);
    text-decoration:none;min-height:44px;display:inline-flex;align-items:center;gap:.4em}
.j-webkopf .heimweg{min-height:32px}
.j-webkopf .heimweg:hover,.j-webkopf .heimweg:focus-visible,.j-webkopf .heimweg-menue:hover,.j-webkopf .heimweg-menue:focus-visible{text-decoration:underline;text-underline-offset:.2em}
.j-webkopf .heimweg-menue-zeile{margin:0 0 6px;padding-bottom:6px;border-bottom:1px solid var(--linie)}
.hp-link .hp-winkel .hp-ico{width:12px;height:12px;margin:0;stroke-width:2.4}
.hp-feld .hp-alle,.hp-zu{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
.hp-feld .hp-alle{color:var(--gold)}
.hp-feld .hp-alle .hp-ico,.hp-zu .hp-ico{width:16px;height:16px}
.hp-feld .hp-unter{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:2px 24px}
.hp-unter a{display:flex;align-items:flex-start;gap:14px;text-decoration:none;color:var(--tinte)}
.hp-unter .hp-ico{margin-top:2px}
.hp-u{display:flex;flex-direction:column;min-width:0}
.hp-u-name{font-family:var(--haus);font-weight:600;font-size:16px;line-height:1.25;text-transform:uppercase;letter-spacing:.05em}
.hp-u-satz{font-family:var(--serif);font-size:15px;line-height:1.35;color:var(--mut);letter-spacing:0;text-transform:none;font-weight:400}
.hp-feld .hp-unter a{padding:10px 12px;min-height:44px;border-radius:4px}
.hp-feld .hp-unter a:hover,.hp-feld .hp-unter a:focus-visible{background:var(--grund)}
.hp-ico{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none;transform-origin:50% 60%}
.hp-link .hp-ico{margin-right:8px}
.hp-zieh summary .hp-ico{margin-right:12px}
.hp-zieh summary{justify-content:flex-start}
.hp-zieh summary::after{margin-left:auto}
.s-bereich .hp-ico{width:30px;height:30px}
.hp-ico.reiten .ohr{transform-box:view-box;transform-origin:15.2px 12.1px}
@media (prefers-reduced-motion:no-preference){.hp-ico *{animation:hp-zeichnen .8s ease-out .1s both}a:hover>.hp-ico,a:focus-visible>.hp-ico,summary:hover>.hp-ico,a:hover .hp-ico,.hp-symbole a:focus-visible .hp-ico{animation:hp-wippen .5s ease-in-out 1}a:hover .hp-ico *{animation:none}.hp-ico.reiten .ohr{transition:transform .3s ease-out}a:hover .hp-ico.reiten,a:focus-visible .hp-ico.reiten,summary:hover>.hp-ico.reiten,summary:focus-visible>.hp-ico.reiten{animation:none}a:hover .hp-ico.reiten .ohr,a:focus-visible .hp-ico.reiten .ohr,summary:hover>.hp-ico.reiten .ohr,summary:focus-visible>.hp-ico.reiten .ohr{transform:rotate(14deg)}a:active .hp-ico,summary:active .hp-ico{transform:scale(.88);transition:transform .08s}.hp-unter .hp-ico *,.hp-feld-kopf .hp-ico *,.hp-winkel .hp-ico *{animation:none}.hp-unter a:hover .hp-ico,.hp-unter a:focus-visible .hp-ico,.hp-feld-kopf a:hover .hp-ico,.hp-feld-kopf a:focus-visible .hp-ico,.hp-link:hover .hp-winkel .hp-ico,.hp-link:focus-visible .hp-winkel .hp-ico{animation:none}.hp-zieh details[open]>ul{animation:hp-einblenden .2s ease-out}}
.hp-symbole{list-style:none;margin:0;padding:0;display:flex;align-items:center;justify-content:flex-end;gap:2px}
.hp-symbole a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--tinte)}
.hp-symbole a:hover{color:var(--tinte);background:color-mix(in srgb,var(--gelb) 40%,transparent);border-radius:6px}
.hp-symbole svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.j-webkopf .hp-aktion{margin-left:14px}
.j-webkopf .hp-aktion-buchen{margin-left:14px;padding:11px 18px;min-height:40px}
.hp-zieh details{border-top:1px solid var(--linie)}
.hp-zieh details:last-child{border-bottom:1px solid var(--linie)}
.hp-zieh summary{display:flex;justify-content:space-between;align-items:center;min-height:52px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tinte);cursor:pointer;list-style:none}
.hp-zieh summary::-webkit-details-marker{display:none}
.hp-zieh summary::after{content:"+";color:var(--gold);font-size:18px}
.hp-zieh details[open]>summary::after{content:"\2013"}
.hp-zieh ul{list-style:none;margin:0;padding:0 0 10px}
.j-webkopf .hp-zieh ul a{display:flex;align-items:center;min-height:44px;font-family:var(--serif);font-size:18px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--tinte);text-decoration:none;padding:7px 0 7px 4px}
.j-webkopf .hp-zieh .hp-unter a{align-items:flex-start}
.j-webkopf .hp-zieh ul a.hp-alle{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.hp-leiste .j-btn{padding:12px 6px;font-size:11px;letter-spacing:.1em;text-align:center;min-height:48px}
.j-hero .text .j-btn{align-self:flex-start}
@media (max-width:899px){.j-suche .j-btn{width:100%}}
.j-karte .j-btn{margin-top:4px}
@media (max-width:899px){.j-raster.karten-zeilen .j-karte .j-btn{padding:10px 14px;min-height:40px}}
.j-box-kopf .j-btn.leise{min-height:36px;padding-top:6px;padding-bottom:6px}
.j-pferd .steckbrief .j-btn{align-self:flex-start}
.j-web .j-hero .j-btn.primaer{border-radius:999px;background:transparent;border-color:var(--gelb);color:var(--papier)}
.j-web .j-hero .j-btn.primaer:hover,.j-web .j-hero .j-btn.primaer:focus-visible{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (prefers-reduced-motion:no-preference){.j-web .j-hero .j-btn.primaer{transition:background .2s ease-out}}
.j-web .j-webkopf .leiste{padding:20px 48px 18px}
.j-web .j-webkopf .kopflink,.j-web .j-webkopf .leiste>.rechts summary{font-size:14px;letter-spacing:.14em}
.j-web .j-webkopf .hp-aktion-buchen{font-size:15px;padding:14px 26px;min-height:48px;margin-left:18px}
.j-web .j-webkopf .rechts{gap:24px}
.j-web .j-webkopf .hp-symbole{gap:6px}
.j-web .j-webkopf .hp-symbole a{width:48px;height:48px}
.j-web .j-webkopf .hp-symbole svg{width:28px;height:28px}
.j-web .j-webkopf .marke .j-logo{height:32px}
@media (min-width:900px) and (max-width:1239px){.j-web .j-webkopf .leiste{padding:18px 24px 16px;gap:12px}.j-web .j-webkopf .kopflink,.j-web .j-webkopf .leiste>.rechts summary{font-size:12px;letter-spacing:.1em}.j-web .j-webkopf .hp-aktion-buchen{font-size:13px;padding:12px 16px;min-height:44px;margin-left:6px}.j-web .j-webkopf .rechts{gap:14px}.j-web .j-webkopf .hp-symbole{gap:0}.j-web .j-webkopf .hp-symbole a{width:44px;height:44px}.j-web .j-webkopf .hp-symbole svg{width:25px;height:25px}.j-web .j-webkopf .marke .j-logo{height:24px}}
@media (max-width:899px){.j-web .j-webkopf .leiste{padding:14px calc(var(--rahmen-d,8px) + 8px)}.j-web .j-webkopf .kopflink,.j-web .j-webkopf .leiste>.rechts summary{font-size:13px;letter-spacing:.12em}.j-web .j-webkopf .rechts{gap:0}.j-web .j-webkopf .hp-symbole{gap:0}.j-web .j-webkopf .hp-symbole a{width:44px;height:44px}.j-web .j-webkopf .hp-symbole svg{width:25px;height:25px}.j-web .j-webkopf .marke .j-logo{height:17px}}
@media (min-width:700px) and (max-width:899px){.j-web .hp-zeile.nur-breit{display:block!important}}
.j-web .j-btn{font-family:var(--haus);font-weight:600;font-size:13px;line-height:14.4px;letter-spacing:.8px}
.j-web .j-btn,.j-web .j-pille,.j-web .z-reiter .j-pille,.hp-zeile .hp-link,.s-bereich .j-link,.j-web .j-hero .j-btn.primaer,.hp-feld .hp-unter a{border-radius:6px}

/* NUR VORSCHAU · Reiten wie Figma 28.10.: keine Familienfarben, Karten weiß mit gelbem Rand, Schrift und Symbole schwarz */
html:root body{--ang-platz:var(--papier);--ang-platz-tief:var(--papier);--ang-ausritt:var(--papier);--ang-ausritt-tief:var(--papier);
  --ang-alm:var(--papier);--ang-alm-tief:var(--papier);--ang-morgen:var(--papier);--ang-morgen-tief:var(--papier);
  --ang-horsemanship:var(--papier);--ang-horsemanship-tief:var(--papier);--ang-springen:var(--papier);--ang-springen-tief:var(--papier);
  --ang-kinder:var(--papier);--ang-kinder-tief:var(--papier);--ang-stallzeit:var(--papier);--ang-stallzeit-tief:var(--papier)}
html body .rs-plakat{background:var(--papier);color:var(--tinte);border:1px solid var(--gelb)}
html body.j-web .rs-plakat .j-klein,html body.j-web .rs-plakat .j-klein.gold{color:var(--gold)}
html body .rs-riesig{display:none}
html body .rs-plakat-symbol{background:var(--grund);color:var(--tinte)}
html body .rs-karte.rs-plakat .rs-bild{background:var(--grund)}
html body .rs-karte.rs-plakat .rs-badge{background:var(--papier);color:var(--tinte);border:1px solid var(--gelb)}
html body .rs-karte.rs-plakat .rs-fakten,html body .rs-karte.rs-plakat .rs-fakten .rs,html body .rs-karte.rs-plakat .j-preis .j-klein{color:var(--mut)}
html body .rs-karte.rs-plakat .j-btn.sekundaer{border-color:var(--tinte)}
html body .rs-karte.rs-plakat .j-btn.sekundaer:hover,html body .rs-karte.rs-plakat .j-btn.sekundaer:focus-visible{background:var(--gelb);border-color:var(--gelb)}
html body .rs-treffer-bild{background:var(--grund)}
html body .rs-treffer .rs-fam,html body .rs-treffer .j-zg-name{color:var(--tinte)}
html body .rs-treffer .j-zeit:hover,html body .rs-treffer .j-zeit:focus-visible{background:var(--gelb);border-color:var(--gelb)}
html body .rs-treffer .j-pille{background:var(--papier);border-color:var(--tinte)}
html body .rs-kachel{background:var(--papier);border:1px solid var(--gelb)}
html body .rs-kachel:hover,html body .rs-kachel:focus-visible{border-color:var(--tinte)}
html body .rs-kachel-bild{background:var(--papier);color:var(--tinte);border:1px solid var(--gelb)}
html body .rs-kachel em{color:var(--gold)}
html body .rs-plakat :is(h3,h3 a,p,li,em){color:var(--tinte)}
html body.j-web .rs-plakat p.j-klein,html body.j-web .rs-plakat .j-klein.gold{color:var(--gold)}
html body .rs-karte.rs-plakat .rs-fakten li,html body .rs-karte.rs-plakat .j-preis .j-klein{color:var(--mut)}
html body .rs-karte.rs-plakat h3{font-size:23px}
html body .rs-treffer .j-einstieg-treffer>.j-klein:first-child,html body .rs-treffer .j-erklaerung{color:var(--tinte)}
html body .rs-treffer .rs-fam,html body .rs-treffer .j-zg-name{color:var(--gold)}
html body .rs-treffer .j-zg-gruppe{border-top-color:var(--linie)}
html body .rs-treffer .j-zeit{border-color:var(--tinte)}
html body .rs-wesen{display:none}

/* NUR VORSCHAU · Reiten Punkte 1–5 (Lillia 28.10.2026) */
/* 1 Knopf im Aufmacher wie auf der Startseite */
html body.j-web .j-hero .j-btn.primaer{border-radius:6px;background:transparent;border-color:var(--gelb);color:var(--papier)}
html body.j-web .j-hero .j-btn.primaer:hover,html body.j-web .j-hero .j-btn.primaer:focus-visible{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (prefers-reduced-motion:no-preference){html body.j-web .j-hero .j-btn.primaer{transition:background .2s ease-out}}
/* 2 Einstiegs-Kacheln wie „Das findest du bei uns“ */
html body .j-raster.s-bereiche{display:grid;gap:20px;grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1099px){html body .j-raster.s-bereiche{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){html body .j-raster.s-bereiche{grid-template-columns:minmax(0,1fr)}}
html body .s-bereich{display:flex;flex-direction:column;gap:10px;padding:22px 22px 24px;text-decoration:none;color:var(--tinte);background:var(--papier);border:1px solid var(--gelb);border-radius:6px;height:100%}
html body .s-bereich svg{width:30px;height:30px;flex:none}
html body .s-bereich h3{font-family:var(--haus);font-weight:600;font-size:23px;line-height:28.8px;text-transform:uppercase;margin:0}
html body .s-bereich p{margin:0;font-size:16px;line-height:24px;color:var(--mut)}
html body .s-bereich .j-link{align-self:flex-end;display:inline-flex;align-items:center;min-height:36px;margin-top:auto;padding:8px 18px;border:1px solid var(--gelb);border-radius:6px;color:var(--tinte);font-size:11px;letter-spacing:.16em}
/* 3 kein Hover-Effekt, der Effekt kommt beim Klick (und beim Tastatur-Fokus) */
html body .rs-weg-kachel:hover{transform:none;border-color:var(--gelb)}
html body .rs-weg-kachel:hover .j-link{background:transparent}
html body .rs-weg-kachel:active,html body .rs-weg-kachel:focus-visible{border-color:var(--tinte)}
html body .rs-weg-kachel:active .j-link,html body .rs-weg-kachel:focus-visible .j-link{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (prefers-reduced-motion:no-preference){html body .rs-weg-kachel{transition:border-color .12s,transform .12s}html body .rs-weg-kachel:active{transform:translateY(1px)}}
/* 4 Pferdefotos in Bilderrahmen wie die Packages */
html body .s-rahmen-buehne{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:666/900;margin:0 auto 14px}
html body .s-bild-rahmen{position:relative;width:100%;margin:0;filter:drop-shadow(1px 4px 5px color-mix(in srgb,var(--tinte) 28%,transparent))}
html body .s-bild-rahmen .rahmen{position:relative;z-index:2;display:block;width:100%;height:100%;filter:grayscale(1) brightness(1.2) contrast(1.35)}
html body .s-bild-rahmen .foto{position:absolute;z-index:1;left:calc(var(--rl) - 1%);top:calc(var(--rt) - 1%);width:calc(100% - var(--rl) - var(--rr) + 2%);height:calc(100% - var(--rt) - var(--rb) + 2%);object-fit:cover}
html body .s-bild-rahmen.oval .foto{border-radius:50%}
html body .s-bild-rahmen.oval{width:86%}
html body .s-bild-rahmen::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:var(--rahmen-farbe,var(--gelb));-webkit-mask:var(--rahmen-bild) center/100% 100% no-repeat;mask:var(--rahmen-bild) center/100% 100% no-repeat;mix-blend-mode:multiply}
html body .j-panini.rs-pferd-rahmen{display:flex;flex-direction:column;background:none;border:0;box-shadow:none;padding:0;color:var(--tinte);text-decoration:none;height:auto;overflow:visible}
/* 5 Name unter dem Rahmen, darunter Rasse und Größe, „Ab L…“ rechts */
html body .rs-pferd-rahmen .name{font-family:var(--haus);font-weight:600;font-size:24px;line-height:28px;text-transform:uppercase;margin:0 0 4px;color:var(--tinte)}
html body .rs-pferd-rahmen .rs-pferd-zeile{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0;font-family:var(--serif);font-size:15px;line-height:1.4;color:var(--mut)}
html body .rs-pferd-rahmen .stufe{flex:none;font-family:var(--haus);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
html body a.j-panini.rs-pferd-rahmen{border:0!important;border-radius:0!important;min-height:0;padding:0 4px}
html body .rs-pferd-rahmen .s-rahmen-buehne{margin-bottom:12px}
/* 3 (nachgeschärft): Überfahren ändert gar nichts mehr */
html body a.s-bereich.rs-weg-kachel:hover{transform:none!important;box-shadow:none!important;border-color:var(--gelb)!important}
html body a.s-bereich.rs-weg-kachel:hover .j-link{background:transparent!important}
html body a.s-bereich.rs-weg-kachel:hover svg,html body a.s-bereich.rs-weg-kachel:hover .hp-ico{animation:none!important}
html body a.s-bereich.rs-weg-kachel:active{border-color:var(--tinte)!important}
html body a.s-bereich.rs-weg-kachel:active .j-link{background:color-mix(in srgb,var(--gelb) 40%,transparent)!important}
/* Ornament-Rahmen ist quer: in der Bühne mittig */
html body .rs-pferd-rahmen .s-bild-rahmen.ornament{width:100%}
/* Bilderwand „Sammle sie alle“ (Lillia 28.10.2026): festes Raster, alle Rahmen so gleich groß wie möglich, gerade */
html body ul.rs-bilderwand{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 36px;align-items:start;overflow:visible!important;padding:8px 0 24px;margin:0;list-style:none}
html body ul.rs-bilderwand>li{width:100%}
/* gleiche Bühne für alle: Hochformat-Rahmen gleich hoch, der quere Ornament-Rahmen so breit wie die Spalte, mittig */
html body ul.rs-bilderwand .s-rahmen-buehne{aspect-ratio:auto;width:100%;height:300px;display:flex;align-items:center;justify-content:center;margin:0 0 12px}
html body ul.rs-bilderwand .s-bild-rahmen,html body ul.rs-bilderwand .s-bild-rahmen.oval{height:100%;width:auto;max-width:100%;margin:0}
html body ul.rs-bilderwand .s-bild-rahmen.ornament{width:100%;height:auto}
html body ul.rs-bilderwand .j-panini.rs-pferd-rahmen{width:100%;padding:0}
@media (max-width:899px){
  html body ul.rs-bilderwand{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 18px}
  html body ul.rs-bilderwand .s-rahmen-buehne{height:220px}
}

/* Reitangebot von Raimund (Numbers-Datei, 30.10.2026) */
html body .rs-voraus{margin:0;font-family:var(--serif);font-size:16px;line-height:1.35;color:var(--mut)}
html body .rs-kachel{align-items:start}
html body .rs-kachel span.rs-kachel-voraus{display:block;font-family:var(--serif);font-size:15px;line-height:1.3;color:var(--mut);margin-top:2px}
html body .rs-reiter{margin:14px 0 18px}
html body .rs-reiter .j-filter-chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
html body .rs-reiter .j-pille{min-height:44px;cursor:pointer;border-color:var(--gelb);color:var(--tinte)}
html body .rs-reiter .j-pille:hover{background:color-mix(in srgb,var(--gelb) 20%,transparent)}
html body .rs-reiter .j-pille[aria-pressed="true"],html body .rs-reiter .j-pille[aria-pressed="true"]:hover{background:color-mix(in srgb,var(--gelb) 40%,transparent);border-color:var(--gelb);color:var(--tinte)}
html body .rs-reiter .j-pille:focus-visible{outline:2px solid var(--tinte);outline-offset:2px}
html body #rs-alle-angebote > li[hidden]{display:none}
html body .rs-pferd-rahmen .rs-pferd-text{margin:4px 0 0;font-family:var(--serif);font-size:15px;line-height:1.35;color:var(--tinte)}
html body .rs-stallrest{margin:32px 0 0;font-family:var(--serif);font-size:17px;line-height:1.45;color:var(--tinte)}
html body .rs-stallrest b{font-weight:600}
html body .rs-extras > li{display:flex}
html body .rs-extras > li[hidden]{display:none}
html body .rs-extras .rs-kachel{width:100%}

/* Urlaub: Bilderrahmen wie Entwurf 25.10., alle gleich hoch (Vorschlag, KI-Rahmen) */
html body .u-reihe>li{width:min(72vw,289px)}
html body .s-rahmen-buehne.u-rahmen{aspect-ratio:auto;height:300px;margin:0 0 10px}
html body .j-karte>.s-rahmen-buehne.u-rahmen{margin:18px 0 0}
html body .u-rahmen .s-bild-rahmen,html body .u-rahmen .s-bild-rahmen.oval{height:100%;width:auto;max-width:100%;margin:0}
html body .u-rahmen .s-bild-rahmen.ornament{width:min(100%,300px);height:auto}
html body .u-rahmen .s-bild-rahmen img{aspect-ratio:auto;border-radius:0;background:none}
html body .u-rahmen .s-bild-rahmen img.rahmen{object-fit:fill}
html body .u-rahmen .s-bild-rahmen.oval img.foto{border-radius:50%}

/* Urlaub: Aufmacher wie Startseite (Regeln von dort, ohne Testvideo) */
.j-web .j-hero .j-kick,.j-web .j-hero.mit-film .text .j-kick{color:var(--gelb)}
.j-web .j-hero .j-btn.primaer{border-radius:999px;background:transparent;border-color:var(--gelb);color:var(--papier)}
.j-web .j-hero .j-btn.primaer:hover,.j-web .j-hero .j-btn.primaer:focus-visible{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (prefers-reduced-motion:no-preference){.j-web .j-hero .j-btn.primaer{transition:background .2s ease-out}}
.j-web .j-hero .j-kick,.j-web #willkommen .j-kick{font-family:var(--serif);font-style:italic;font-weight:400;font-size:34px;line-height:1.3;letter-spacing:0;text-transform:none}
@media (max-width:700px){.j-web .j-hero .j-kick,.j-web #willkommen .j-kick{font-size:25px;line-height:1.35}}
.j-web .j-hero .text .j-kick{margin-bottom:-12px}
@media (max-width:700px){.j-web .j-hero .text .j-kick{margin-bottom:-8px}}
.j-web .j-hero .j-titel.xl{width:max-content;max-width:calc(100vw - 2*var(--rand))}
@media (min-width:900px){.j-hero{min-height:clamp(680px,86svh,1100px)}}
.j-hero.mit-film::after{background:linear-gradient(90deg,color-mix(in srgb,var(--tinte) 45%,transparent) 0,color-mix(in srgb,var(--tinte) 45%,transparent) calc(max(var(--rand),calc((100% - 1200px)/2)) + 200px),color-mix(in srgb,var(--tinte) 32%,transparent) calc(max(var(--rand),calc((100% - 1200px)/2)) + 450px),color-mix(in srgb,var(--tinte) 14%,transparent) calc(max(var(--rand),calc((100% - 1200px)/2)) + 720px),transparent calc(max(var(--rand),calc((100% - 1200px)/2)) + 1000px)),color-mix(in srgb,var(--tinte) 4%,transparent)}@media (max-width:899px){.j-hero.mit-film::after{background:linear-gradient(180deg,color-mix(in srgb,var(--tinte) 45%,transparent) 0,color-mix(in srgb,var(--tinte) 45%,transparent) 110px,color-mix(in srgb,var(--tinte) 30%,transparent) 220px,color-mix(in srgb,var(--tinte) 12%,transparent) 340px,transparent 460px),color-mix(in srgb,var(--tinte) 0%,transparent)}}
@media (max-width:899px){.j-web .j-hero .j-titel.xl{width:auto;max-width:none}}

/* Urlaub-Umbau (Lillia 30.10.2026): Bausteine der Startseite */
.s-mitte{text-align:center;max-width:780px;margin:0 auto}
.s-mitte .j-titel,.s-mitte .j-lead{margin-left:auto;margin-right:auto}
.s-abstand,.j-web p.s-abstand{margin-top:32px}
.j-raster.s-bereiche{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:899px){.j-raster.s-bereiche{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.j-raster.s-bereiche{grid-template-columns:minmax(0,1fr)}}
.s-bereich{display:flex;flex-direction:column;gap:10px;padding:22px 22px 24px;text-decoration:none;color:var(--tinte);background:var(--papier);border:1px solid var(--gelb);border-radius:6px;height:100%} /* Lillia 20.10.2026: kein dicker gelber Balken, eine Kontur in einer Stärke */
.s-bereich:hover,.s-bereich:focus-visible{border-color:var(--gelb)}
.s-bereich h3{font-family:var(--serif);font-size:24px;font-weight:400;margin:0;line-height:1.2}
.s-bereich p{margin:0;font-size:16px;line-height:1.5;color:var(--mut)}
.s-bereich .j-link{margin-top:auto;padding-top:6px}
/* „Ansehen“ als Knopf wie die Zimmer-Reiter: gelbe Kontur, schwarze Schrift, beim Überfahren der Kachel Gelb 40 % (Lillia 20.10.2026) */
.s-bereich .j-link{align-self:flex-end;display:inline-flex;align-items:center;min-height:36px;margin-top:auto;padding:8px 18px;border:1px solid var(--gelb);border-radius:999px;color:var(--tinte);font-size:11px;letter-spacing:.16em}
.s-bereich:hover .j-link,.s-bereich:focus-visible .j-link{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
/* Aufmacher-Knopf „Zimmer ansehen“ wie die anderen Knöpfe: rund, gelbe Kontur; Schrift weiß, weil er auf dem dunklen Bild steht (Lillia 20.10.2026) */
.j-web .j-hero .j-btn.primaer{border-radius:999px;background:transparent;border-color:var(--gelb);color:var(--papier)}
.j-web .j-hero .j-btn.primaer:hover,.j-web .j-hero .j-btn.primaer:focus-visible{background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (prefers-reduced-motion:no-preference){.j-web .j-hero .j-btn.primaer{transition:background .2s ease-out}}
@media (prefers-reduced-motion:no-preference){.s-bereich .j-link{transition:background .2s ease-out}}
.z-reiter{margin:28px 0 0}
.z-reiter .j-filter-chips>li:first-child{margin-left:auto}.z-reiter .j-filter-chips>li:last-child{margin-right:auto}
.z-reiter .j-pille{font-size:11px;padding:9px 18px}
.j-raster .j-karte[hidden]{display:none}
#zimmer .j-karte{border-color:var(--gelb)}
#zimmer .j-karte h3 a{text-decoration-color:var(--tinte)}
#zimmer .j-karte .meta,#zimmer .j-preis .j-klein{color:var(--tinte)}
#zimmer .s-bilder{background:var(--papier)}
#zimmer .z-reiter .j-pille{border-color:var(--gelb)}
#zimmer .z-reiter .j-pille:hover{background:color-mix(in srgb,var(--gelb) 20%,transparent);border-color:var(--gelb);color:var(--tinte)}
/* ausgewählter Reiter: Gelb mit 40 % Deckkraft, Schrift schwarz (Lillia 20.10.2026) */
#zimmer .z-reiter .j-pille[aria-pressed="true"],#zimmer .z-reiter .j-pille[aria-pressed="true"]:hover{background:color-mix(in srgb,var(--gelb) 40%,transparent);border-color:var(--gelb);color:var(--tinte)}
  @media (min-width:900px){
    #zimmer-karten{display:flex;flex-wrap:wrap;justify-content:center}
    #zimmer-karten>.j-karte{flex:0 0 calc((100% - (var(--spalten,4) - 1)*20px)/var(--spalten,4))}
  }
#willkommen .s-mitte{width:100%;max-width:1000px}
.j-web .j-lead.s-aufdecken{font-family:var(--serif);font-size:34px;line-height:1.3;color:var(--tinte);max-width:900px;margin-top:28px}
@media (max-width:700px){.j-web .j-lead.s-aufdecken{font-size:25px;line-height:1.35}}
.j-hero.u-held .standbild{object-position:60% 50%}
/* Galerie als Bilderwand: vier Spalten, jede schwebt anders schnell nach oben */
.u-wand{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;align-items:start}
.u-wand-spalte{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:32px}
.u-wand figure{margin:0}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    #willkommen{padding:calc(45svh + 40px) 0;view-timeline-name:--aufdecken;overflow:clip}
    #willkommen>.j-rahmen{animation:s-langsam linear both;animation-timeline:--aufdecken;animation-range:cover 0% cover 100%}
    @keyframes s-langsam{from{transform:translateY(-45svh)}to{transform:translateY(45svh)}}
    .s-aufdecken span{color:transparent;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;
      background-image:linear-gradient(var(--tinte),var(--tinte)),linear-gradient(color-mix(in srgb,var(--gelb) 40%,transparent),color-mix(in srgb,var(--gelb) 40%,transparent));
      background-repeat:no-repeat;background-size:0% 100%,100% 100%;
      animation:s-aufdecken linear both;animation-timeline:--aufdecken;animation-range:cover 15% cover 68%}
    @keyframes s-aufdecken{to{background-size:100% 100%,100% 100%}}
    #impressionen{view-timeline-name:--wand;overflow:clip;padding-bottom:140px;margin-top:-45svh;padding-top:0;position:relative;z-index:2;background:transparent}
    #willkommen .willkommen-bild{animation:s-rahmen-schweben linear both;animation-timeline:--aufdecken;animation-range:cover 0% cover 100%}
    @keyframes s-rahmen-schweben{from{transform:translateY(var(--hub))}to{transform:translateY(calc(-1*var(--hub)))}}
    .u-wand-spalte{animation:u-schweben linear both;animation-timeline:--wand;animation-range:cover 0% cover 100%}
    .u-wand-spalte:nth-child(1){--hub:120px}.u-wand-spalte:nth-child(2){--hub:340px}.u-wand-spalte:nth-child(3){--hub:200px}.u-wand-spalte:nth-child(4){--hub:440px}
    @keyframes u-schweben{from{transform:translateY(var(--hub))}to{transform:translateY(0)}}
    .u-wand-spalte>li{animation:u-steigen linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
    @keyframes u-steigen{from{transform:translateY(90px);opacity:.2}to{transform:none;opacity:1}}
  }
}

/* Urlaub, Runde 2 (Lillia 30.10.2026) */
.s-bilder{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;background:var(--grund)}
#zimmer .s-bilder{background:var(--papier)}
.s-eck,.j-web p.s-eck{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:36px 0 0}
.j-raster.s-packs{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 28px}
@media (max-width:1100px){.j-raster.s-packs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.j-raster.s-packs{grid-template-columns:minmax(0,1fr);gap:48px}}
.s-pack{display:flex;flex-direction:column;gap:8px}
.s-pack h3{font-family:var(--haus);font-weight:600;font-size:30px;line-height:34px;text-transform:uppercase;margin:0}
.j-web .s-pack-zeit{font-family:var(--serif);font-size:16px;line-height:1.4;color:var(--mut);margin:0 0 22px}
.s-pack .j-preis{margin-top:auto;padding-top:16px}
.s-pack-preis .platzhalter{font-family:var(--serif);font-style:italic;font-size:15px;color:var(--mut)}
@media (max-width:560px){.s-pack h3{font-size:26px;line-height:30px}}
.s-pack .meta{font-size:15px;line-height:21.75px;color:var(--mut)}
#packages .s-pack-zeit{margin-bottom:4px}
html body #packages .s-rahmen-buehne{width:min(100%,260px);margin:6px auto 14px}
html body #packages .s-bild-rahmen,html body #packages .s-bild-rahmen.oval{width:min(100%,260px);margin:0 auto}
.j-raster.s-packs{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1100px){.j-raster.s-packs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.j-raster.s-packs{grid-template-columns:minmax(0,1fr)}}
.s-pack[hidden]{display:none}
#packages .pack-reiter .j-filter-chips>li:first-child{margin-left:auto}#packages .pack-reiter .j-filter-chips>li:last-child{margin-right:auto}
#packages .pack-reiter .j-pille{border-color:var(--gelb)}
#packages .pack-reiter .j-pille[aria-pressed="true"]{background:color-mix(in srgb,var(--gelb) 40%,transparent);border-color:var(--gelb);color:var(--tinte)}
#packages .u-knoepfe{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
/* Bilderwand: Bildtext neben dem Rahmen, Titel Raisonne, Text EB Garamond, weisse Karte damit er auch über dem Scroll-Text lesbar bleibt */
html body .u-wand .s-rahmen-buehne.u-rahmen{margin:0}
.u-wand figcaption{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--tinte)}
.u-wand figcaption strong{display:block;font-family:var(--haus);font-weight:600;font-size:20px;line-height:1.2;text-transform:uppercase;margin:8px 0 4px}
/* Zwei schwebende Rahmen im Scroll-Text wie Startseite, nur breit */
#willkommen>.j-rahmen{position:relative}
#willkommen .willkommen-bild{position:absolute;display:none;pointer-events:none;z-index:0}
#willkommen .willkommen-bild .s-bild-rahmen{margin:0;width:100%}
#willkommen .willkommen-bild.b1{--bw:min(200px,calc(50vw - 500px));width:var(--bw);left:calc(50% - 470px - var(--bw));top:-40px;--hub:130svh;z-index:2}
#willkommen .willkommen-bild.b3{--bw:min(140px,calc((50vw - 500px)*.65));width:var(--bw);left:calc(50% + 500px);top:560px;--hub:115svh;z-index:2}
#willkommen .s-mitte{position:relative;z-index:1}
@media (min-width:1200px){#willkommen .willkommen-bild{display:block}}
html body #bereiche .j-raster.s-bereiche{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:899px){html body #bereiche .j-raster.s-bereiche{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){html body #bereiche .j-raster.s-bereiche{grid-template-columns:minmax(0,1fr)}}
@media (max-width:899px){.u-wand{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}html body .u-wand .s-rahmen-buehne.u-rahmen{height:210px}.u-wand figcaption{font-size:16px;line-height:1.4}.u-wand figcaption strong{font-size:17px}}

/* ===== Gemeinsame Regeln aller Unterseiten: Gestaltung wie Startseite (Lillia 30.10.2026) ===== */
/* Kleinzeilen in WH-Gelb wie Startseite (Kontrast auf Weiß gering, im Pull Request zur Entscheidung nennen) */
.j-web .j-abschnitt .j-kick:not(.tinte){color:var(--gelb)}
/* Kontur überall 1 px gelb, Ecken 6 px */
.u-note,.u-faq details,.u-form{border-color:var(--gelb)}
.u-note{border-radius:6px}
.u-faq details{border-bottom:1px solid var(--gelb)}
/* Bewertungen im selben Raster wie die Kacheln, Text in Lesegröße */
.j-raster.u-stimmen-raster{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:899px){.j-raster.u-stimmen-raster{grid-template-columns:minmax(0,1fr)}}
.u-stimmen blockquote{font-size:17px;line-height:1.5}
/* Kacheln „100% echt!“: Abstand und Ecken wie Raster, Beschriftung wie Kachel-Titel */
.u-welten{gap:20px}
.u-welt{border-radius:6px}
.u-welt span{font-family:var(--haus);font-weight:600;font-size:23px;line-height:28.8px;letter-spacing:0;text-transform:uppercase}
/* Packages: Preiszeile wie Startseite, Aufklapper lesbar */
#packages .s-pack .j-preis .j-klein{font-family:var(--serif);font-size:26px;line-height:1.2;color:var(--tinte)}
#packages .u-mehr summary{font-size:13px}
/* Anfrage: Kopf mittig, Formular darunter */
#anfrage .j-zwei{display:block}
#anfrage .j-zwei>div:first-child{text-align:center;max-width:780px;margin:0 auto}
#anfrage .j-zwei>div:last-child{max-width:780px;margin:36px auto 0}
.s-mitte .u-haken,#anfrage .u-haken{list-style:none;padding:0;margin:18px 0 0}
/* Lageplan: Kopf mittig */
#lageplan .j-abschnitt-kopf{text-align:center;justify-content:center}
#lageplan .j-abschnitt-kopf .j-lead{margin-left:auto;margin-right:auto}
.u-stimmen figure.j-karte{margin:0}

/* ===== Alle Unterseiten wie Startseite (Lillia 30.10.2026) ===== */
/* Linien und Konturen gelb 1 px, Eingabefelder bleiben gut sichtbar */
main,.j-seite{--linie:var(--gelb);--linie2:var(--gelb)}
main input:not([type=checkbox]):not([type=radio]),main select,main textarea{border-color:var(--tinte);border-radius:6px}
/* Ecken 6 px */
html body .j-btn,html body .j-pille,html body .j-zeit{border-radius:6px}
.j-box,.j-kachel,.j-erste,.j-suche,.rs-jz,.rs-plakat,.rs-treffer,.rs-ruhe,.j-story-bild,.ab-tafel,.j-mt-pfeil,.k-leer,.k-eltern,.j-karte{border-radius:6px}
/* Keine Systemschrift auf Knöpfen und Feldern */
main button,main input,main select,main textarea,.j-seite button,.j-seite input,.j-seite select,.j-seite textarea{font-family:var(--serif)}
/* Köpfe mittig */
.j-abschnitt-kopf{text-align:center;justify-content:center}
.j-abschnitt-kopf>div{width:100%}
.j-abschnitt-kopf .j-lead{margin-left:auto;margin-right:auto}
main .j-abschnitt .j-rahmen>h2.j-titel,main .j-abschnitt h1.j-titel{text-align:center}
main .j-abschnitt h2.j-kick,main .j-abschnitt h3.j-kick.tinte{text-align:center}
main .j-abschnitt h1.j-titel+.j-lead,main .j-abschnitt h1.j-titel~.j-lead{margin-left:auto;margin-right:auto;text-align:center}
.j-pillen{justify-content:center}
.rs-kopf{position:relative;display:block}
.rs-kopf .rs-wesen{position:absolute;right:0;top:0}
/* Kopfband mittig auf Grund */
html body .s-kopfband{background:var(--grund);text-align:center}
.s-kopfband .j-titel{margin-left:auto;margin-right:auto}
/* Textseiten: mittig, Überschriften wie Startseite */
.s-text{text-align:center;max-width:780px;margin-left:auto;margin-right:auto;font-size:17px;line-height:1.5}
.s-text h2{font-family:var(--haus);font-weight:600;font-size:50px;line-height:1.1;text-transform:uppercase;margin:72px 0 12px}
.s-text h3{font-family:var(--serif);font-weight:400;font-size:20px;line-height:1.45;margin:0 0 14px}
.s-text h2:first-child,.s-text h3:first-child{margin-top:0}
@media (max-width:899px){.s-text h2{font-size:30px}}
/* Schlafen: Reihen mittig wie Zimmer-Reiter */
#alpinista .j-raster,#gipfelstuermer .j-raster,#weitere-zimmer .j-raster,#scesa .j-raster,#suiten .j-raster{display:flex;flex-wrap:wrap;justify-content:center}
#alpinista .j-raster>*,#gipfelstuermer .j-raster>*,#weitere-zimmer .j-raster>*,#scesa .j-raster>*,#suiten .j-raster>*{flex:0 0 calc((100% - 60px)/4)}
@media (max-width:899px){#alpinista .j-raster>*,#gipfelstuermer .j-raster>*,#weitere-zimmer .j-raster>*,#scesa .j-raster>*,#suiten .j-raster>*{flex-basis:calc((100% - 20px)/2)}}
@media (max-width:560px){#alpinista .j-raster>*,#gipfelstuermer .j-raster>*,#weitere-zimmer .j-raster>*,#scesa .j-raster>*,#suiten .j-raster>*{flex-basis:100%}}
/* Kids: Titel in Hausschrift */
html body .k-seite h1{font-family:var(--haus);font-weight:600;font-size:96px;line-height:1;text-transform:uppercase}
html body .k-seite h2:not(.j-kick){font-family:var(--haus);font-weight:600;text-transform:uppercase}
@media (max-width:899px){html body .k-seite h1{font-size:40px;line-height:44px}}
/* Wedding: Hausschriften und Hausfarben, helle Flächen; Aufmacher und eigener Kopf bleiben */
.wedding-seite{--grot:var(--haus);--tinte:#141414;--morgen:#FAF8F3;--mittag:#FAF8F3;--kalk:#FFFFFF;--parkett:#141414;--luster:#F7D34C}
.wedding-seite .grund-abend,.wedding-seite .grund-nacht,.wedding-seite main .strecke,.wedding-seite .fragen,.wedding-seite .erbstueck{--kalk:#141414;--abend:#FAF8F3;--nacht:#FAF8F3;background:#FAF8F3;color:#141414}
.wedding-seite main h2,.wedding-seite main .zeile-gross,.wedding-seite main .zeile-mittel{font-family:var(--haus);font-weight:600;text-transform:uppercase}

/* Menüzeile wie Startseite, Krümel-Zeile weg */
.hp-zeile{background:var(--papier);border-bottom:0}
.hp-zeile>ul{gap:10px;padding-top:10px;padding-bottom:10px}
.hp-zeile .hp-link{min-height:38px;padding:0 16px;border:1px solid var(--gelb);border-radius:999px}
.hp-zeile .hp-link:hover,.hp-zeile .hp-link:focus-visible,.hp-zeile .hp-link[aria-current],.hp-zeile .hp-link[aria-expanded="true"]{border-color:var(--gelb);background:color-mix(in srgb,var(--gelb) 40%,transparent)}
@media (min-width:900px){.hp-zeile{background:var(--papier)}}
html body .hp-zeile .hp-link{border-radius:6px}
.s-krume{display:none}
/* Wedding: Unterseiten-Zeile, Abstand unter dem Kopf */
.wedding-wege{background:var(--papier)}
.wedding-wege ul{list-style:none;display:flex;justify-content:center;gap:10px;margin:0;padding:0 0 10px}
.wedding-wege a{display:inline-flex;align-items:center;min-height:38px;padding:0 16px;border:1px solid var(--gelb);border-radius:6px;font-family:var(--haus);font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--tinte);text-decoration:none}
html body.wedding-seite{background:var(--papier);padding-top:0}
.wedding-seite .j-webkopf{background:var(--papier);margin-top:var(--rahmen-d,0px)}
.wedding-seite .j-logo{opacity:1;filter:none}

/* Oberer Teil der Unterseiten: Video oder Foto im Bilderrahmen links, Überschrift und Text rechts (Lillia 30.10.2026) */
.n-held{background:var(--papier);padding:56px 0 72px}
.n-held-raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.n-held-bild{position:relative;display:flex;justify-content:center;align-items:center}
html body .n-held .s-bild-rahmen,html body .n-held .s-bild-rahmen.oval{margin:0;height:min(72svh,600px);width:auto;max-width:100%}
html body .n-held .quer .s-bild-rahmen,html body .n-held .s-bild-rahmen.ornament{width:100%;height:auto}
.n-held .s-bild-rahmen .rahmen{object-fit:fill}
.n-held-text{display:flex;flex-direction:column;align-items:flex-start;gap:16px;text-align:left}
.n-held-text>*{margin:0}
.j-web .n-held-text .j-kick{font-family:var(--serif);font-style:italic;font-weight:400;font-size:26px;line-height:1.3;letter-spacing:0;text-transform:none;color:var(--gelb)}
html body .n-held-text h1{font-family:var(--haus);font-weight:600;font-size:60px;line-height:1.02;letter-spacing:-.2px;text-transform:uppercase;text-align:left;margin:0;color:var(--tinte)}
.n-held-text .j-lead,.n-held-text .unterzeile{font-family:var(--serif);font-size:20px;line-height:1.45;color:var(--tinte);max-width:520px}
.n-held .j-film-schalter.n-film{position:absolute;right:0;bottom:-14px;z-index:4}
.wedding-seite .n-held-text .marke{font-family:var(--serif);font-style:italic;font-size:26px;letter-spacing:0;text-transform:none;color:var(--gelb);opacity:1}
.n-held-text .zug{display:inline}
.k-tueren{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:899px){
  .n-held{padding:28px 0 40px}
  .n-held-raster{grid-template-columns:minmax(0,1fr);gap:24px}
  html body .n-held .s-bild-rahmen,html body .n-held .s-bild-rahmen.oval{height:min(56svh,420px)}
  html body .n-held .quer .s-bild-rahmen,html body .n-held .s-bild-rahmen.ornament{height:auto}
  html body .n-held-text h1{font-size:40px;line-height:44px}
  .j-web .n-held-text .j-kick{font-size:22px}
  .n-held-text .j-lead,.n-held-text .unterzeile{font-size:18px}
}
.wedding-seite .n-held .j-rahmen{width:100%;max-width:calc(1200px + 2*clamp(20px,6vw,120px));margin:0 auto;padding:0 clamp(20px,6vw,120px)}
.wedding-seite .n-held-text .unterzeile{text-transform:none;letter-spacing:0;font-weight:400}
.wedding-seite .n-held-text .knopf-reihe{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.wedding-seite .n-held-text .knopf{border-radius:6px}
.wedding-seite .n-held-text .knopf-neben{font-family:var(--serif);font-size:16px;text-transform:none;letter-spacing:0}
html body.wedding-seite .j-webkopf .marke{opacity:1;margin:0;padding:0;font-size:inherit;letter-spacing:0;text-transform:none;color:inherit}

/* Feste Zeiten als Kacheln wie „Das findest du bei uns“, Hinweise in zwei Spalten (Lillia 30.10.2026) */
html body .j-feste,html body .j-einstieg .j-feste{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;border:0;padding:0}
.j-web .j-feste>.j-klein{grid-column:1/-1;margin:0 0 4px;text-align:center;font-family:var(--haus);font-weight:600;font-size:23px;line-height:28.8px;letter-spacing:0;text-transform:uppercase;color:var(--tinte)}
.j-feste-gruppe{display:flex;flex-direction:column;gap:10px;margin:0;padding:22px 22px 24px;background:var(--papier);border:1px solid var(--gelb);border-radius:6px}
.j-feste-name,.j-web .j-feste-name{margin:0;font-family:var(--haus);font-weight:600;font-size:23px;line-height:28.8px;letter-spacing:0;text-transform:uppercase;color:var(--tinte)}
.j-feste .j-erklaerung{margin:0;font-family:var(--serif);font-style:normal;font-size:16px;line-height:24px;color:var(--mut)}
.j-feste .j-pillen{justify-content:flex-start;gap:8px;margin:auto 0 0;padding-top:6px}
.j-feste .j-pille{min-height:44px;border-color:var(--gelb)}
@media (max-width:1100px){html body .j-feste,html body .j-einstieg .j-feste{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){html body .j-feste,html body .j-einstieg .j-feste{grid-template-columns:minmax(0,1fr)}}
.j-liste-wissen{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 40px;margin-top:16px}
.j-liste-wissen li{font-size:17px;line-height:1.45}
.j-liste-wissen li::before{top:10px}
@media (max-width:899px){.j-liste-wissen{grid-template-columns:minmax(0,1fr)}}
html body .j-feste,html body .j-einstieg .j-feste{align-items:stretch}
html body .j-feste .j-pille{padding:8px 12px;letter-spacing:.1em}

/* Pferd im Menü: rechtes Ohr dreht beim Überfahren wie Startseite */
@media (prefers-reduced-motion:no-preference){
.hp-ico.reiten .ohr{transition:transform .3s ease-out}
a:hover .hp-ico.reiten,a:focus-visible .hp-ico.reiten,summary:hover>.hp-ico.reiten,summary:focus-visible>.hp-ico.reiten{animation:none}
a:hover .hp-ico.reiten .ohr,a:focus-visible .hp-ico.reiten .ohr,summary:hover>.hp-ico.reiten .ohr,summary:focus-visible>.hp-ico.reiten .ohr{transform:rotate(14deg)}
}

/* Test Feinschliff nach Skill emil-design-eng, nur Wellness (Lillia 30.10.2026) */
body.feinschliff{--kurve-aus:cubic-bezier(.23,1,.32,1)}
/* Behandlungskarten: gleich hoch, Knöpfe unten auf einer Linie, Titel wie Startseite, Aktionen mittig */
body.feinschliff .sw-beh-raster{align-items:stretch}
body.feinschliff .sw-beh{display:flex;flex-direction:column;overflow:hidden}
body.feinschliff .sw-beh .inhalt{flex:1;display:flex;flex-direction:column}
body.feinschliff .sw-beh .sw-beh-name{font-family:var(--haus);font-weight:600;font-size:22px;line-height:26.4px;text-transform:uppercase}
body.feinschliff .sw-beh .sw-beh-verschenken{margin:4px 0 0;text-align:center}
body.feinschliff .sw-beh .sw-beh-verschenken .j-btn{min-height:44px}
/* Köpfe und Reihen auf der Mittelachse */
body.feinschliff #welten>.j-rahmen>.j-raster{display:flex;flex-wrap:wrap;justify-content:center}
body.feinschliff #welten>.j-rahmen>.j-raster>.j-karte{flex:0 0 calc((100% - 40px)/3)}
body.feinschliff .sg-kopf{text-align:center}
body.feinschliff .sg-kopf .sg-lead{margin-left:auto;margin-right:auto}
body.feinschliff .sg-kopf h3{font-family:var(--haus);font-weight:600;font-size:50px;line-height:44px;text-transform:uppercase}
body.feinschliff .sg-reiter{justify-content:center}
@media (max-width:899px){
  body.feinschliff #welten>.j-rahmen>.j-raster>.j-karte{flex-basis:100%}
  body.feinschliff .sg-kopf h3{font-size:30px;line-height:33px}
}
@media (prefers-reduced-motion:no-preference){
  /* Knöpfe antworten sofort beim Drücken */
  body.feinschliff .j-btn,body.feinschliff .j-pille,body.feinschliff .j-mtag,body.feinschliff .hp-link{transition:background-color .2s ease-out,border-color .2s ease-out,color .2s ease-out,transform .16s var(--kurve-aus)}
  body.feinschliff .j-btn:active,body.feinschliff .j-pille:active,body.feinschliff .j-mtag:active,body.feinschliff .hp-link:active{transform:scale(.97)}
  /* Bilder reagieren nur mit echter Maus, nicht beim Tippen am Handy */
  body.feinschliff .sw-beh-bild,body.feinschliff #welten .j-motiv img{transition:transform .3s var(--kurve-aus)}
  @media (hover:hover) and (pointer:fine){
    body.feinschliff .sw-beh:hover .sw-beh-bild,body.feinschliff #welten .j-karte:hover .j-motiv img{transform:scale(1.02)}
  }
  body.feinschliff #welten .j-motiv{overflow:hidden}
  /* Aufmacher: Rahmen und Text kommen ruhig nacheinander herein */
  @keyframes fs-herein{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  body.feinschliff .n-held-bild{animation:fs-herein .5s var(--kurve-aus) both}
  body.feinschliff .n-held-text>*{animation:fs-herein .4s var(--kurve-aus) both}
  body.feinschliff .n-held-text>:nth-child(1){animation-delay:.08s}
  body.feinschliff .n-held-text>:nth-child(2){animation-delay:.14s}
  body.feinschliff .n-held-text>:nth-child(3){animation-delay:.2s}
  body.feinschliff .n-held-text>:nth-child(4){animation-delay:.26s}
  /* Karten erscheinen beim Scrollen, Reihe für Reihe leicht versetzt */
  @supports (animation-timeline:view()){
    @keyframes fs-scroll{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
    body.feinschliff .sw-beh,body.feinschliff #welten .j-karte,body.feinschliff .sw-ds-karte{animation:fs-scroll linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
    body.feinschliff .sw-beh:nth-child(3n+2){animation-range:entry 4% entry 49%}
    body.feinschliff .sw-beh:nth-child(3n){animation-range:entry 8% entry 53%}
  }
}
body.feinschliff .sg-kopf{max-width:none;width:100%;margin-left:auto;margin-right:auto}

/* Kalender: heutiger Tag mit Rand 3 px (1 px + 2), Lillia 30.10.2026 */
.j-mtag.heute{border-width:3px;border-color:var(--gelb)}

/* Kalender: Monate über der Tagesauswahl (Lillia 30.10.2026) */
.j-ts .j-ts-monate{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;overflow:visible;margin:14px 0 6px}
.j-ts .j-ts-monate .j-pille{min-height:38px;padding:6px 12px;border-color:var(--gelb);background:var(--papier);color:var(--tinte);white-space:nowrap}
.j-ts .j-ts-monate .j-pille.an,.j-ts .j-ts-monate .j-pille[aria-current]{background:color-mix(in srgb,var(--gelb) 40%,var(--papier));border-color:var(--gelb);color:var(--tinte)}
@media (max-width:899px){
  .j-ts .j-ts-monate{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto}
  .j-ts .j-ts-monate .j-pille{min-height:44px}
}

/* Kalender: Monat als aufklappbare Auswahl statt langer Reihe (Lillia 30.10.2026) */
html body .j-mt-kopf{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"b t n";gap:12px;margin:14px 0 8px}
.j-mt-wahl{position:relative;justify-self:center}
.j-mt-wahl summary{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:4px 14px;border:1px solid var(--gelb);border-radius:6px;background:var(--papier);cursor:pointer;list-style:none}
.j-mt-wahl summary::-webkit-details-marker{display:none}
.j-mt-wahl summary:focus-visible{outline:2px solid var(--tinte);outline-offset:2px}
.j-mt-wahl .j-mt-titel{font-size:22px}
.j-mt-winkel{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.j-mt-wahl[open] .j-mt-winkel{transform:rotate(180deg)}
.j-mt-monate{position:absolute;z-index:6;top:calc(100% + 6px);left:50%;translate:-50% 0;display:grid;grid-template-columns:repeat(4,76px);gap:6px;max-height:280px;overflow-y:auto;padding:10px;background:var(--papier);border:1px solid var(--gelb);border-radius:6px;box-shadow:0 8px 24px color-mix(in srgb,var(--tinte) 12%,transparent)}
.j-mt-monat-link{display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:6px;font-family:var(--haus);font-weight:600;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--tinte);text-decoration:none}
.j-mt-monat-link:hover,.j-mt-monat-link:focus-visible{background:color-mix(in srgb,var(--gelb) 20%,transparent)}
.j-mt-monat-link.an{background:color-mix(in srgb,var(--gelb) 40%,var(--papier))}
@media (prefers-reduced-motion:no-preference){
  @keyframes mt-auf{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
  .j-mt-wahl[open] .j-mt-monate{animation:mt-auf .16s cubic-bezier(.23,1,.32,1) both}
}

/* Wellness: Landschaftsbilder auf Behandlungskarten ohne eigenes Foto, schwarzweiß (Lillia 30.10.2026) */
.sw-beh-bild.sw-land{filter:grayscale(1) contrast(1.05)}

/* Nur Schwarz, Weiß und WH-Gelb: Goldbraun ausnahmslos weg (Lillia 30.10.2026). Bilderrahmen bleiben. */
:root,body,.j-web,.wedding-seite,.k-seite{--gold:var(--tinte)}
.abend{--gold:var(--gelb)}
/* Lageplan: Holztöne neutral statt braun */
body{--plan-holz:var(--grund);--plan-holz-dunkel:var(--tinte);--plan-holz-fuge:var(--gelb);--plan-holz-maser:var(--gelb);--plan-parkett:var(--grund);--plan-glut:var(--gelb)}

/* Kopf: Hover wie Lillia 30.10.2026. Symbole gelb, Anfragen und Menü gelbe Linie, Buchen schwarz mit gelber Schrift */
html body .j-webkopf .kopflink,html body .j-webkopf .leiste>.rechts summary{text-decoration:underline;text-decoration-color:transparent;text-decoration-thickness:2px;text-underline-offset:6px}
html body .j-webkopf .hp-aktion-buchen{border:1px solid var(--gelb)}
@media (prefers-reduced-motion:no-preference){
  html body .j-webkopf .hp-symbole a,html body .j-webkopf .kopflink,html body .j-webkopf .leiste>.rechts summary,html body .j-webkopf .hp-aktion-buchen{transition:color .2s ease-out,background-color .2s ease-out,border-color .2s ease-out,text-decoration-color .2s ease-out}
}
html body .j-webkopf .hp-symbole a:focus-visible{color:var(--gelb);background:none}
html body .j-webkopf .kopflink:focus-visible,html body .j-webkopf .leiste>.rechts summary:focus-visible{text-decoration-color:var(--gelb)}
html body .j-webkopf .hp-aktion-buchen:focus-visible{background:var(--tinte);border-color:var(--tinte);color:var(--gelb)}
@media (hover:hover) and (pointer:fine){
  html body .j-webkopf .hp-symbole a:hover{color:var(--gelb);background:none}
  html body .j-webkopf .kopflink:hover,html body .j-webkopf .leiste>.rechts summary:hover{text-decoration-color:var(--gelb)}
  html body .j-webkopf .hp-aktion-buchen:hover{background:var(--tinte);border-color:var(--tinte);color:var(--gelb)}
}

/* Menü: alle Punkte auf einer Ebene, „Mehr“ aufgelöst (Lillia 30.10.2026) */
.j-webkopf .hp-zieh>a.hp-punkt{display:flex;align-items:center;min-height:52px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tinte);text-decoration:none;border-top:1px solid var(--linie)}
.j-webkopf .hp-zieh>a.hp-punkt .hp-ico{margin-right:12px}
.j-webkopf .hp-zieh>a.hp-punkt:last-child{border-bottom:1px solid var(--linie)}
.j-webkopf .hp-zieh details:last-of-type{border-bottom:0}
html body .j-webkopf .hp-zieh>a.hp-punkt,html body .j-webkopf .hp-zieh summary{font-size:14px;letter-spacing:.14em}
html body .j-webkopf .menue-inhalt{padding-left:48px;padding-right:48px}
@media (min-width:900px) and (max-width:1239px){html body .j-webkopf .hp-zieh>a.hp-punkt,html body .j-webkopf .hp-zieh summary{font-size:12px;letter-spacing:.1em}html body .j-webkopf .menue-inhalt{padding-left:24px;padding-right:24px}}
@media (max-width:899px){html body .j-webkopf .hp-zieh>a.hp-punkt,html body .j-webkopf .hp-zieh summary{font-size:13px;letter-spacing:.12em}html body .j-webkopf .menue-inhalt{padding-left:20px;padding-right:20px}}

/* Zimmerkarten: Kontur beim Überfahren dicker, ohne dass sich etwas verschiebt (Lillia 31.10.2026) */
#zimmer .j-karte,#alpinista .j-karte,#gipfelstuermer .j-karte,#weitere-zimmer .j-karte,#scesa .j-karte,#suiten .j-karte{box-shadow:0 0 0 0 var(--gelb)}
#zimmer .j-karte:focus-within,#alpinista .j-karte:focus-within,#gipfelstuermer .j-karte:focus-within,#weitere-zimmer .j-karte:focus-within,#scesa .j-karte:focus-within,#suiten .j-karte:focus-within{box-shadow:0 0 0 2px var(--gelb)}
@media (hover:hover) and (pointer:fine){
  #zimmer .j-karte:hover,#alpinista .j-karte:hover,#gipfelstuermer .j-karte:hover,#weitere-zimmer .j-karte:hover,#scesa .j-karte:hover,#suiten .j-karte:hover{box-shadow:0 0 0 2px var(--gelb)}
}
@media (prefers-reduced-motion:no-preference){
  #zimmer .j-karte,#alpinista .j-karte,#gipfelstuermer .j-karte,#weitere-zimmer .j-karte,#scesa .j-karte,#suiten .j-karte{transition:box-shadow .2s ease}
}

/* Zimmerkarten: beim Klicken Gelb 40 %, die ganze Karte führt zum Zimmer (Lillia 31.10.2026) */
#zimmer .j-karte,#alpinista .j-karte,#gipfelstuermer .j-karte,#weitere-zimmer .j-karte,#scesa .j-karte,#suiten .j-karte{position:relative}
#zimmer-karten .j-karte h3 a::after{content:"";position:absolute;inset:0;z-index:1}
#zimmer .j-karte:active,#alpinista .j-karte:active,#gipfelstuermer .j-karte:active,#weitere-zimmer .j-karte:active,#scesa .j-karte:active,#suiten .j-karte:active{background:color-mix(in srgb,var(--gelb) 40%,var(--papier))}
#zimmer .j-karte:active img,#alpinista .j-karte:active img,#gipfelstuermer .j-karte:active img,#weitere-zimmer .j-karte:active img,#scesa .j-karte:active img,#suiten .j-karte:active img{opacity:.6}

/* Chatfenster wie Website: 6 px Ecken, gelbe Kontur, Titel in Raisonne (Lillia 31.10.2026) */
html body .gc-karte{border:1px solid var(--gelb);border-radius:6px}
html body .gc-kopf{border-bottom:1px solid var(--gelb)}
html body .gc-titel{font-family:var(--haus);font-size:13px;letter-spacing:.8px;color:var(--tinte)}
html body .gc-zu{border-radius:6px}
@media (hover:hover) and (pointer:fine){html body .gc-zu:hover{background:color-mix(in srgb,var(--gelb) 40%,transparent)}}

/* Chatfenster öffnet aus der Sprechblase unten rechts, schließt schneller (Lillia 31.10.2026). Nur transform und opacity. */
html body .gc-ebene{transition:visibility 0s linear .15s}
html body .gc-ebene[data-offen="1"]{transition-delay:0s}
html body .gc-schleier{opacity:0;transition:opacity .15s ease-out}
html body .gc-ebene[data-offen="1"] .gc-schleier{opacity:1;transition-duration:.25s}
html body .gc-karte{opacity:0;transition:opacity .15s cubic-bezier(.23,1,.32,1)}
html body .gc-ebene[data-offen="1"] .gc-karte{opacity:1;transition-duration:.25s}
@media (prefers-reduced-motion:no-preference){
  html body .gc-karte{transform:scale(.95);transform-origin:100% 100%;transition:opacity .15s cubic-bezier(.23,1,.32,1),transform .15s cubic-bezier(.23,1,.32,1)}
  html body .gc-ebene[data-offen="1"] .gc-karte{transform:none;transition-duration:.25s}
}
@media (max-width:699px) and (prefers-reduced-motion:no-preference){html body .gc-karte{transform-origin:50% 100%}}

/* Schwebende Rahmen im Willkommen auch schmal (Lillia 31.10.2026): kleiner, sie gleiten rasch über den Text */
@media (max-width:1199px){
  html body #willkommen .willkommen-bild{display:block}
  html body #willkommen .willkommen-bild.b1{--bw:clamp(84px,24vw,170px)}
  html body #willkommen .willkommen-bild.b2{--bw:clamp(90px,26vw,180px)}
  html body #willkommen .willkommen-bild.b3{--bw:clamp(70px,20vw,130px)}
}

/* Fuß bis ganz unten */
body.hp-rahmen:has(>.j-webfuss){background:linear-gradient(var(--papier),var(--papier)) top/100% calc(100% - 300px) no-repeat,var(--grund)}

/* Sekundärlogo WH im Fuß (Lillia 31.10.2026): Originaldatei des Hauses, schwarz; Mindestbreite laut CI 115 px */
.j-webfuss .j-wh{display:block;width:150px;height:auto;margin:0 auto 10px}
.abend .j-webfuss .j-wh{filter:brightness(0) invert(1)}
@media (max-width:899px){.j-webfuss .j-wh{width:120px}}

/* Fuß überall gleich wie Startseite (Lillia 31.10.2026), auch auf Buchen und Anfrage */
html body .j-webfuss{background:var(--grund);color:var(--tinte);border-top:1px solid var(--linie);text-align:center;padding:56px 24px 48px;display:flex;flex-direction:column;align-items:center;gap:12px;font-family:var(--serif);font-size:17px;line-height:1.45;margin:0}
html body .j-webfuss a{color:var(--tinte)}
html body .j-webfuss .recht-links{list-style:none;margin:0;padding:12px 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:0 32px}
html body .j-webfuss nav a{font-family:var(--haus);font-weight:600;font-size:13px;line-height:15.95px;letter-spacing:.8px;text-transform:uppercase;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
html body .j-webfuss nav a:hover{text-decoration:underline}
html body .j-webfuss .ort{font-style:italic;font-size:14px;line-height:20.3px;margin:0}
html body .j-webfuss .klein{font-size:13px;line-height:18.85px;margin:0}
@media (max-width:899px){html body .j-webfuss .recht-links{flex-direction:column;gap:0}}
html body .j-wh-link{display:block;min-height:44px;line-height:0;margin:0}
html body .j-webfuss .j-wh{display:block;width:150px;height:auto;margin:0 auto}
@media (max-width:899px){html body .j-webfuss .j-wh{width:120px}}
.s-steuerhinweis{max-width:780px;margin:24px auto;padding:0 24px;text-align:center;font-family:var(--serif);font-size:15px;color:var(--mut)}
.s-recht-kauf{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:12px 24px;margin:0;padding:24px;font-family:var(--serif);font-size:15px}

/* Preise nach Regel des Hauses (Stand 31.10.2026): nie mit ,00, nie fett, nie größer als der Text */
html body .j-preis .betrag,html body .j-betrag,html body .j-kachel .wert,html body #packages .muster-preis,html body #packages .s-pack .j-preis .j-klein,html body .sp-packs .j-preis .j-klein{font-family:var(--serif);font-weight:400;font-size:17px;line-height:1.45;letter-spacing:0;text-transform:none}

/* ===== Kopf wie auf der Startseite (Lillia 06.11.2026): Menü, Knöpfe, Laufband ===== */
/* Menü: Symbol und Text auf einer Mittelachse (Lillia 06.11.2026) */
.hp-feld .hp-unter a,.j-webkopf .hp-zieh .hp-unter a{align-items:center}
/* Menü-Symbole (Lillia 06.11.2026): Familien = zwei Einzelbetten übereinander, Hund = Pfote (wie vorher). */
/* Menüeinträge: Hover und Tastatur Gelb 40 % (Lillia 06.11.2026), wie der Aufmacher-Knopf */
.hp-feld .hp-unter a:hover,.hp-feld .hp-unter a:focus-visible,.hp-zieh .hp-unter a:hover,.hp-zieh .hp-unter a:focus-visible{background:color-mix(in srgb,var(--gelb) 40%,var(--papier))}
@media (prefers-reduced-motion:no-preference){.hp-feld .hp-unter a,.hp-zieh .hp-unter a{transition:background-color .2s ease-out}}
/* Menü Schlafen (Lillia 06.11.2026): links Spalte „Zimmer“ (Alle Zimmer, darunter die Kategorien), daneben „Gut zu wissen“ */
#hp-feld-schlafen .hp-spalten{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#hp-feld-schlafen .hp-spalte .hp-unter{grid-template-columns:minmax(0,1fr)}
/* Menü Aktiv (Lillia 06.11.2026): zwei Spalten, Golf & Tennis unter Bike */
#hp-feld-aktiv .hp-spalte:first-child .hp-unter{grid-template-columns:repeat(2,minmax(0,1fr))}
/* Knöpfe: Hover und Drücken (Lillia 06.11.2026). Nur Schwarz, Weiß, Gelb. Knopf mit schwarzer Kontur: Schrift und Kontur werden gelb, ohne Fläche,
   schwarzer Knopf bekommt gelbe Schrift, gelber Knopf wird schwarz mit gelber Schrift (wie „Buchen“ im Kopf).
   Beim Drücken gibt jeder Knopf leicht nach. Ohne Bewegung (prefers-reduced-motion) wechselt nur die Farbe, sofort. */
@media (prefers-reduced-motion:no-preference){
  .j-web .j-btn{transition:background-color .2s ease-out,color .2s ease-out,border-color .2s ease-out,transform .16s ease-out}
  .j-web .j-btn:active{transform:scale(.97)}
}
.j-web .j-btn.sekundaer:focus-visible{border-color:var(--gelb);color:var(--gelb)}
.j-web .j-btn.primaer:focus-visible{color:var(--gelb)}
.j-web .j-btn.haupt:focus-visible{background:var(--tinte);border-color:var(--tinte);color:var(--gelb)}
@media (hover:hover) and (pointer:fine){
  .j-web .j-btn.sekundaer:hover{border-color:var(--gelb);color:var(--gelb)}
  .j-web .j-btn.primaer:hover{color:var(--gelb)}
  .j-web .j-btn.haupt:hover{background:var(--tinte);border-color:var(--tinte);color:var(--gelb)}
  /* auf dem dunklen Abschluss „Bock auf Urlaub“ bleibt der Rand gelb, sonst verschwindet der Knopf im Schwarz */
  .j-web .s-bock .j-btn.haupt:hover{background:transparent;border-color:var(--gelb);color:var(--gelb)}
}
.j-web .s-bock .j-btn.haupt:focus-visible{background:transparent;border-color:var(--gelb);color:var(--gelb)}
@media (prefers-reduced-motion:no-preference){.s-band-spur{animation-duration:125s}}

/* Laufband wie auf der Startseite (Lillia 06.11.2026), für Seiten, die es noch nicht hatten */
.s-band{position:relative;z-index:1;display:flex;align-items:center;height:clamp(32px,3.5vw,50px);margin:0;overflow:hidden;background:var(--gelb);color:var(--tinte);font-family:var(--haus);font-weight:600;font-size:clamp(25px,3.4vw,46px);line-height:1;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.s-band-spur{display:inline-flex;width:max-content}
.s-band-gruppe{display:inline-flex;flex:none}
.s-band-gruppe>span{padding:0 .5em}
@media (prefers-reduced-motion:no-preference){
  .s-band-spur{will-change:transform;animation:s-band-lauf 125s linear infinite}
  @keyframes s-band-lauf{to{transform:translateX(-50%)}}
  .s-band.halt .s-band-spur{animation-play-state:paused}
  @media (hover:hover) and (pointer:fine){.s-band:hover .s-band-spur{animation-play-state:paused}}
}

/* Buchen im Kopf im Blau des Ornament-Bilderrahmens (Lillia 06.11.2026). VORSCHLAG: Hausregel sagt Hauptknopf gelb, Rahmenfarben nur für Bilderrahmen. */
html body .j-webkopf a.j-btn.hp-aktion-buchen{background:color-mix(in srgb,var(--programm-spa) 55%,var(--papier));border-color:color-mix(in srgb,var(--programm-spa) 55%,var(--papier));color:var(--tinte)}
html body .j-webkopf a.j-btn.hp-aktion-buchen:focus-visible{background:var(--tinte);border-color:var(--tinte);color:var(--papier)}
@media (hover:hover) and (pointer:fine){html body .j-webkopf a.j-btn.hp-aktion-buchen:hover{background:var(--tinte);border-color:var(--tinte);color:var(--papier)}}

/* Telefon- und Nachrichten-Knopf unten rechts im Rot des ovalen Bilderrahmens (Lillia 06.11.2026). VORSCHLAG: Rahmenfarben sind laut Hausregel nur für Bilderrahmen. */
html body .kt-knopf,html body .gc-blase{background:color-mix(in srgb,var(--programm-restaurant) 70%,var(--papier));border-color:color-mix(in srgb,var(--programm-restaurant) 70%,var(--papier));color:var(--papier)}
@media (hover:hover) and (pointer:fine){html body .kt-knopf:hover,html body .gc-blase:hover{background:var(--programm-restaurant);border-color:var(--programm-restaurant)}}
html body .kt-knopf:focus-visible,html body .gc-blase:focus-visible{outline:2px solid var(--tinte);outline-offset:2px}

/* Handy-Grundlagen (Lillia 06.11.2026, Skill mobile-native): kein grauer Tipp-Blitz, keine Schrift-Aufblähung,
   Eingaben 16 px (sonst zoomt iPhone hinein), Knöpfe ohne 300-ms-Verzögerung und ohne Text-Markieren beim Halten. */
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media (pointer:coarse){input,textarea,select{font-size:16px!important}}
button,a.j-btn,.j-pille,[role="button"],summary,.hp-link{touch-action:manipulation;-webkit-user-select:none;user-select:none}

/* Kleinzeilen (Eyebrows) im Grün des Holz-Bilderrahmens (Lillia 06.11.2026), etwas dunkler gemischt, damit sie auf Weiß lesbar sind.
   Auf dunklen Flächen (Film, Abschluss, Nacht, Bar) bleiben sie gelb. VORSCHLAG: Rahmenfarbe außerhalb der Bilderrahmen. */
html .j-web .j-kick:not(.tinte),html .j-web .n-held-text .j-kick,html .j-web .j-abschnitt .j-kick:not(.tinte){color:color-mix(in srgb,var(--bereich-sommer) 72%,var(--tinte))}
html .j-web :is(.j-hero.mit-film,.s-bock,.s-weiter,.wi-nacht,.fd-bar,.u-dunkel,.b-hero,.j-box.tinte,.z-hero) .j-kick{color:var(--gelb)}

/* Keine Linien über und unter der Menüzeile (Lillia 06.11.2026) */
html .j-webkopf,html .j-web .j-webkopf{border-bottom:0!important}
html .hp-zeile,html .j-web .hp-zeile{border-bottom:0!important;border-top:0!important}

/* Seitenwechsel (Lillia 07.11.2026): die alte Seite blendet aus, die neue steigt leicht auf. Kopf bleibt stehen. Ruhige Fassung: ohne Animation. */
@media (prefers-reduced-motion:no-preference){
  @view-transition{navigation:auto}
  html body .j-webkopf{view-transition-name:wh-kopf}
  ::view-transition-old(root){animation:wh-seite-aus .18s cubic-bezier(0.23,1,0.32,1) both}
  ::view-transition-new(root){animation:wh-seite-ein .3s cubic-bezier(0.23,1,0.32,1) both}
  ::view-transition-group(wh-kopf){animation-duration:0s}
  @keyframes wh-seite-aus{to{opacity:0}}
  @keyframes wh-seite-ein{from{opacity:0;transform:translateY(14px)}}
}
/* Aufklapp-Menü: offene Kategorie mit Hintergrund und ruhiger Bewegung (Wunsch Lillia 08.11.2026) */
html body .j-webkopf .hp-zieh details{border-radius:0;background-color:transparent;outline:1px solid transparent;outline-offset:-1px}
html body .j-webkopf .hp-zieh details,html body .j-webkopf .hp-zieh>a.hp-punkt{border-color:var(--gelb)}
html body .j-webkopf .hp-zieh details[open]{border-radius:6px;margin:6px -14px;padding:0 14px 12px;background-color:var(--grund);outline-color:var(--gelb);border-top-color:transparent}
html body .j-webkopf .hp-zieh details[open]+details{border-top-color:transparent}
html body .j-webkopf .hp-zieh details[open]>summary span{text-decoration:underline;text-decoration-color:var(--gelb);text-decoration-thickness:2px;text-underline-offset:6px}
html body .j-webkopf .hp-zieh summary:focus{outline:none}
html body .j-webkopf .hp-zieh summary:focus-visible{outline:2px solid var(--gelb);outline-offset:-2px;border-radius:6px}
html body .j-webkopf .hp-zieh details[open]>ul{animation:none}
@media (prefers-reduced-motion:no-preference){
  html body .j-webkopf .hp-zieh details{transition:background-color .2s ease,outline-color .2s ease}
  html body .j-webkopf .hp-zieh summary::after{display:inline-block;transition:transform .25s cubic-bezier(0.23,1,0.32,1)}
  html body .j-webkopf .hp-zieh details[open]>summary::after{transform:rotate(180deg)}
  html body .j-webkopf .hp-zieh{interpolate-size:allow-keywords}
  html body .j-webkopf .hp-zieh details::details-content{height:0;overflow:clip;transition:height .25s cubic-bezier(0.23,1,0.32,1),content-visibility .25s allow-discrete}
  html body .j-webkopf .hp-zieh details[open]::details-content{height:auto}
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel){animation:hp-menue-rein .3s cubic-bezier(0.23,1,0.32,1) both}
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel):nth-child(2){animation-delay:40ms}
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel):nth-child(3){animation-delay:80ms}
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel):nth-child(4){animation-delay:120ms}
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel):nth-child(n+5){animation-delay:160ms}
}
@media (prefers-reduced-motion:reduce){
  html body .j-webkopf .hp-zieh details[open] :is(li,.hp-spalte-titel){animation:hp-menue-blende .2s ease both}
}
@keyframes hp-menue-rein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes hp-menue-blende{from{opacity:0}to{opacity:1}}

/* Preise immer in Raisonne (Lillia 08.11.2026) */
html body .j-betrag,html body .betrag,html body .ws-preis,html body .ws-ds-preis,html body .dz-betrag,html body .muster-preis,html body .k-preis,html body .z3-v,html body .z3-gesamt{font-family:var(--haus)!important;font-weight:600!important;font-style:normal!important;letter-spacing:.01em}

/* Kein Grau für Text: Nebentext schwarz wie der Haupttext (Lillia 08.11.2026) */
html,html body,html body *{--mut:var(--tinte)!important}