:root{
--pap-hoch:#FBF6E7;
--pap-grund:#F2ECDA;
--pap-tief:#EAE2CD;
--pap-kante:#DED5BD;
--pap-sockel:#CEC5AD;
--pap-rgb:242,236,218;
--pap-hoch-rgb:251,246,231;
--ink:#40566A;
--ink-2:#33475A;
--ink-3:#22323F;
--ink-4:#182530;
--t1:#1E2F3B;
--t2:#354858;
--t3:#465A6A;
--i1:#FBF8F2;
--i2:#E6E1D5;
--i3:#CEC6B6;
--akz:#F0882D;
--akz-tief:#8C490D;
--akz-hell:#FAC580;
--akz-ring:#B45608;
--besucht:#4E5A67;
--licht:252,225,185;
--nacht:20,31,40;
--linie:rgba(91,82,64,.26);
--linie-2:rgba(91,82,64,.14);
--linie-hell:rgba(251,248,242,.20);
--hebung:0 14px 30px -22px rgba(70,48,32,.30), 0 2px 6px -4px rgba(70,48,32,.10);
--hebung-hoch:0 34px 66px -36px rgba(70,48,32,.34), 0 6px 14px -8px rgba(70,48,32,.12);
--kante-auf:inset 0 1px 0 rgba(255,253,248,.9), inset 0 -1px 0 rgba(91,82,64,.13);
--r-fein:3px;
--r-klein:6px;
--r-mittel:10px;
--r-gross:16px;
--r-flaeche:20px;
--korn:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='k' filterUnits='userSpaceOnUse' x='0' y='0' width='256' height='256'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='1' stitchTiles='stitch' seed='3'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 .30 0 0 0 0 .26 0 0 0 0 .19 .30 0 0 0 -.15'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23k)'/%3E%3C/svg%3E");
--font-display:"Syne",system-ui,-apple-system,"Segoe UI",sans-serif;
--font-body:"Work Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
--w-fliess:410;
--w-fliess-ink:385;
--w-titel:600;
--w-titel-ink:560;
--sperr-fliess:.001em;
--sperr-fliess-ink:.008em;
--sp-h1:-.028em;
--sp-h2:-.024em;
--sp-h3:-.008em;
--sperr-1:.13em;
--sperr-2:.11em;
--sperr-3:.09em;
}
html{color-scheme:light}
body{background:var(--pap-grund);color:var(--t2)}
.abs{
background-color:var(--pap-grund);
background-image:var(--korn),radial-gradient(120% 62% at 78% 0%,
rgba(var(--licht),.50) 0%,rgba(var(--licht),.20) 42%,rgba(var(--licht),0) 78%);
background-repeat:repeat,no-repeat;
background-size:256px 256px,auto;
}
.abs--sand{
background-color:var(--pap-tief);
background-image:var(--korn),radial-gradient(110% 58% at 22% 0%,
rgba(var(--licht),.42) 0%,rgba(var(--licht),0) 74%);
}
.abs--weiss{
background-color:var(--pap-hoch);
background-image:var(--korn),radial-gradient(120% 60% at 84% 0%,
rgba(var(--licht),.44) 0%,rgba(var(--licht),0) 76%);
}
.preis,.plattenreihe,.kachel,.blatt,.platte,.hb__blatt,.frb__blatt,
.kblatt,.eventblatt,.auftakt{
background-image:var(--korn);
background-repeat:repeat;
background-size:256px 256px;
}
.abs--ink,.auf-ink,.konv{
background-color:var(--ink-3);
background-image:radial-gradient(104% 82% at 24% 108%,
rgba(var(--licht),.17) 0%,rgba(var(--licht),.07) 44%,rgba(var(--licht),0) 80%);
background-repeat:no-repeat;
background-size:auto;
color:var(--i2);
}
.fuss{background-color:var(--ink-4);
background-image:radial-gradient(96% 90% at 18% 112%,
rgba(var(--licht),.13) 0%,rgba(var(--licht),.05) 46%,rgba(var(--licht),0) 82%);
color:var(--i2)}
.abs.auf-ink{box-shadow:inset 0 1px 0 rgba(var(--licht),.22)}
.plan{background-color:var(--pap-tief)}
.bild,.blatt__i,.planblatt .bild{background-color:var(--pap-kante)}
.trennband,.bildband{background-color:var(--pap-kante)}
.preis,.beleg:not(.beleg--text),.plattenreihe,.kachel,.wahl__b,.blatt,.richtung__k,.platte,.hb__blatt{
background-color:var(--pap-hoch);
box-shadow:var(--kante-auf);
}
.preis,.platte{box-shadow:var(--kante-auf),var(--hebung)}
.kachel--fond{
background-color:var(--ink-3);
background-image:linear-gradient(rgba(var(--nacht),.8),rgba(var(--nacht),.88)),var(--fond);
background-size:cover;background-position:center;
}
.hb__blatt{box-shadow:var(--kante-auf),var(--hebung-hoch)}
.hb__blatt__b,.hb__blatt__f{background-color:var(--pap-kante)}
.preis__fuss{background-color:var(--pap-tief);box-shadow:inset 0 1px 0 rgba(91,82,64,.13)}
.preis__k{background-color:var(--ink-3);color:var(--i1)}
.reihe{border-top-color:var(--linie)}
.reihe__z{border-bottom-color:var(--linie)}
.auf-ink .reihe{border-top-color:rgba(var(--licht),.20)}
.auf-ink .reihe__z{border-bottom-color:rgba(var(--licht),.20)}
.preis__z{border-bottom-color:var(--linie-2)}
.auf-ink .beleg:not(.beleg--text){background:rgba(var(--licht),.055);border-color:rgba(var(--licht),.20)}
.marke{color:var(--akz-tief)}
.auf-ink .marke{color:var(--akz-hell)}
.preis__z i,.reihe__z .nr,.stufen b,.fahrt__st b,.plan__legende b{color:var(--t3)}
.auf-ink .reihe__z .nr,.auf-ink .stufen b,.auf-ink .fahrt__st b{color:var(--i3)}
:focus-visible{
outline:2px solid var(--akz-ring);
outline-offset:2px;
box-shadow:0 0 0 4px rgba(var(--licht),.55);
border-radius:2px;
}
.auf-ink :focus-visible,.konv :focus-visible,.fuss :focus-visible,
.kopf :focus-visible,.hb :focus-visible{
outline-color:var(--akz);
box-shadow:0 0 0 4px rgba(24,37,48,.75);
}
.abs__in p a:not(.knopf):not(.weg),.recht p a:not(.knopf):not(.weg){
color:var(--t1);
text-decoration:underline;
text-decoration-color:var(--akz-tief);
text-underline-offset:.18em;
text-decoration-thickness:1px;
}
.abs__in p a:not(.knopf):not(.weg):hover,.recht p a:not(.knopf):not(.weg):hover{
color:var(--akz-tief);text-decoration-thickness:2px;
}
.abs__in p a:not(.knopf):not(.weg):visited,.recht p a:not(.knopf):not(.weg):visited{color:var(--besucht)}
.abs__in p a:not(.knopf):not(.weg):active,.recht p a:not(.knopf):not(.weg):active{color:var(--akz-ring)}
.auf-ink .abs__in p a:not(.knopf):not(.weg){color:var(--i1);text-decoration-color:var(--akz-hell)}
.auf-ink .abs__in p a:not(.knopf):not(.weg):hover{color:var(--akz-hell)}
.weg{color:var(--t1);
background-image:linear-gradient(var(--linie),var(--linie)),linear-gradient(var(--akz-tief),var(--akz-tief))}
.weg:hover{color:var(--akz-tief)}
.weg:visited{color:var(--besucht)}
.weg:active{color:var(--akz-ring)}
.auf-ink .weg{color:var(--i1);
background-image:linear-gradient(rgba(var(--licht),.22),rgba(var(--licht),.22)),linear-gradient(var(--akz-hell),var(--akz-hell))}
.auf-ink .weg:hover{color:var(--akz-hell)}
.knopf{background:var(--ink-3);color:var(--i1);box-shadow:var(--hebung)}
.knopf:hover{background:var(--ink-4);box-shadow:var(--hebung-hoch)}
.knopf:active{background:var(--ink-4);box-shadow:inset 0 2px 4px rgba(0,0,0,.28)}
.knopf__k{background:rgba(var(--licht),.16)}
.knopf:hover .knopf__k{background:var(--akz)}
.knopf--akz{background:var(--akz);color:#1B2A34;
box-shadow:inset 0 0 0 1px var(--akz-ring),var(--hebung)}
.knopf--akz:hover{background:#E27A1D;
box-shadow:inset 0 0 0 1px var(--akz-ring),var(--hebung-hoch)}
.knopf--akz:active{box-shadow:inset 0 0 0 1px var(--akz-ring),inset 0 2px 4px rgba(0,0,0,.28)}
.knopf--akz .knopf__k{background:rgba(27,42,52,.16)}
.knopf--akz:hover .knopf__k{background:var(--ink-3);color:var(--i1)}
.knopf--hell{background:var(--pap-hoch);color:var(--t1);box-shadow:var(--kante-auf),var(--hebung)}
.knopf--hell .knopf__k{background:rgba(91,82,64,.12)}
.ruf{color:var(--i1);border-color:rgba(var(--licht),.28)}
.ruf:hover{background:rgba(var(--licht),.14)}
.wahl__b{color:var(--t1)}
.wahl__b em{color:var(--t3)}
.wahl__b:hover{background:var(--pap-hoch);border-color:var(--akz-tief)}
.wahl__b[aria-pressed="true"]{background:var(--ink-3);color:var(--i1);border-color:var(--ink-3)}
.wahl__b[aria-pressed="true"] em{color:var(--i3)}
.skip{background:var(--ink-3);color:var(--i1)}
::selection{background:rgba(var(--licht),.85);color:var(--t1)}
.bottombar{background:var(--ink-4);border-top-color:rgba(var(--licht),.16)}
.bottombar__b{color:var(--i1)}
.bottombar__b--haupt{background:var(--akz);color:#1B2A34}
body{
font-weight:var(--w-fliess);
letter-spacing:var(--sperr-fliess);
-webkit-font-smoothing:auto;
}
.auf-ink,.abs--ink,.konv,.fuss,.menu,.bottombar{
font-weight:var(--w-fliess-ink);
letter-spacing:var(--sperr-fliess-ink);
-webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-weight:var(--w-titel)}
h1{font-weight:var(--w-titel);letter-spacing:var(--sp-h1)}
h2{font-weight:var(--w-titel);letter-spacing:var(--sp-h2)}
h3{font-weight:560;letter-spacing:var(--sp-h3)}
.auf-ink h1,.auf-ink h2,.auf-ink h3,.hb__wort h1,.konv h2{
font-weight:var(--w-titel-ink);letter-spacing:-.026em;
}
.auf-ink h2,.konv h2{letter-spacing:-.022em}
.marke{font-family:var(--font-display);font-weight:600;
letter-spacing:var(--sperr-1);font-size:.78rem}
.lead{font-weight:400}
.auf-ink .lead,.hb__wort .lead{font-weight:375}
.fein,figcaption{font-weight:410}
.auf-ink .fein,.auf-ink figcaption{font-weight:390}
.preis__z b,.preis__fuss b,.tafel__preis b,.fakten__f b,.zahlen__z b,
.tafeltab__z b,.ftab__z b,.steintab dt,.stufen > li > b,.fahrt__st b,
.plan__legende b,.register__z b,.blatt__nord span,.platte__f b{
font-family:var(--font-body);
font-variant-numeric:tabular-nums lining-nums;
font-feature-settings:"tnum" 1,"lnum" 1;
letter-spacing:-.004em;
font-weight:600;
}
.preis__z i{font-family:var(--font-display);font-weight:615;letter-spacing:.06em}
.preis__k{font-family:var(--font-body);font-weight:600;letter-spacing:var(--sperr-2)}
.preis__z span{font-weight:410}
.knopf,.weg,.kopf__nav a,.menu nav a,.sprache{
font-family:var(--font-body);font-weight:580;letter-spacing:.004em}
.reihe__z dt{font-weight:600;letter-spacing:-.006em}
.auf-ink .reihe__z dt{font-weight:560}
.fein,figcaption{color:var(--t3)}
.auf-ink .fein,.auf-ink figcaption{color:var(--i3)}
.tafeltab__k,.ftab__k,.plan__legende b,.blatt__nord{color:var(--t3)}
.js [data-staffel] > .fakten__f b{color:var(--t3)}
.js [data-staffel] > .fakten__f.an b{color:var(--t1)}
.js .stufen--weg > li > b{color:var(--t3)}
.kuehl img{filter:saturate(.26) hue-rotate(14deg) brightness(1.07) contrast(1.06)}
.preisfeld__band img{filter:saturate(.86) hue-rotate(-7deg) contrast(1.04) brightness(1.02)}
.kopf__pfad{padding:0;font-size:.72rem;line-height:1.5}
.kopf__pfad > div{
width:var(--breit);margin-inline:auto;
display:flex;align-items:center;flex-wrap:wrap;gap:.4em;min-height:44px;
font-family:var(--font-body);font-weight:500;letter-spacing:var(--sperr-3);
color:var(--t3);
}
.kopf__pfad > div > *{display:inline-flex;align-items:center;min-height:44px}
.kopf__pfad + .kopf__zeile{padding-top:0;min-height:44px}
@media (min-width:900px){
.kopf__pfad > div{min-height:0;height:1.5em}
.kopf__pfad + .kopf__zeile{padding-top:.75rem}
}
.kopf .kopf__pfad a{color:var(--t2);text-decoration:none}
.kopf .kopf__pfad a:hover{color:var(--t1);text-decoration:underline;
text-underline-offset:.24em;text-decoration-thickness:1px}
.kopf__pfad i{font-style:normal;color:var(--t3);opacity:.7}
.kopf__pfad [aria-current="page"]{color:var(--t3)}
.kopf__akt{display:contents}
.kopf__tel{display:none}
.bottombar[data-sofort]{transform:translateY(0)}
.dleiste{display:none}
@media (min-width:900px){
.dleiste{
position:fixed;right:clamp(1rem,2vw,1.8rem);bottom:clamp(1rem,2vw,1.8rem);z-index:515;
display:flex;align-items:stretch;gap:1px;overflow:hidden;
background:var(--linie);border:1px solid var(--linie);border-radius:2px;
box-shadow:0 6px 22px rgba(27,42,52,.14),0 1px 3px rgba(27,42,52,.10);
transform:translateY(calc(100% + clamp(1rem,2vw,1.8rem)));
transition:transform .5s var(--ease),opacity .5s var(--ease);
opacity:0;pointer-events:none;
}
.dleiste.an{transform:translateY(0);opacity:1;pointer-events:auto}
.dleiste a{
display:flex;align-items:center;gap:.5rem;padding:.72rem 1.1rem;
background:var(--pap-grund);color:var(--t1);text-decoration:none;
font-family:var(--font-display);font-weight:600;font-size:.92rem;line-height:1.2;
transition:background .25s var(--ease),color .25s var(--ease);
}
.dleiste a:hover{background:var(--pap-hoch)}
.dleiste .dleiste__b{background:var(--akz);color:#1B2A34}
.dleiste .dleiste__b:hover{background:var(--akz-tief);color:#1B2A34}
.dleiste__t{font-variant-numeric:tabular-nums}
.dleiste__r{gap:.55rem;min-inline-size:44px;justify-content:center}
.dleiste__r svg{flex:none;display:block}
.dleiste__t{
display:inline-block;
max-inline-size:0;overflow:hidden;white-space:nowrap;opacity:0;
transition:max-inline-size .3s var(--ease),opacity .22s var(--ease);
}
.dleiste:hover .dleiste__t,.dleiste:focus-within .dleiste__t{max-inline-size:12rem;opacity:1}
@media (prefers-reduced-motion:reduce){
.dleiste__t{transition:none}
}
@media (prefers-reduced-motion:reduce){
.dleiste{transition:none}
}
body:has(.dleiste.an) .notiz{--notiz-sockel:calc(61px + env(safe-area-inset-bottom) + .9rem)}
}
@media (min-width:400px){
.kopf__ruf span{
position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:nowrap;
}
}
@media (max-width:899px){
.hb--start .hb__wort{display:flex;flex-direction:column}
.hb--start .hb__wort .lead{order:1}
}
@media (min-width:900px){
.hb--start.hb--licht .hb__blatt{
grid-column:9 / -1;grid-row:1;align-self:end;justify-self:end;
width:min(100%,19.5rem);
margin:0 0 calc(-1 * var(--ueberhang,clamp(2.2rem,3.9vw,3.5rem))) 0;
}
.hb--start.hb--licht .hb__blatt__b{height:clamp(6rem,8vw,7.5rem)}
.hb--start.hb--licht .hb__szene figcaption,
.hb--karte.hb--licht .hb__szene figcaption{
left:var(--ueber);right:auto;top:auto;bottom:var(--rand);
max-width:25rem;text-align:left;
padding:0;color:var(--i3);
background:none;border-radius:0;box-shadow:none;text-shadow:none;
}
.hb--spiegel.hb--licht .hb__szene figcaption{
right:var(--ueber);left:auto;top:auto;bottom:var(--rand);
max-width:25rem;text-align:right;
padding:0;color:var(--i3);
background:none;border-radius:0;box-shadow:none;text-shadow:none;
}
}
@media (min-width:900px){
.kopf__akt{
display:flex;align-items:stretch;gap:.7rem;
border-top:1px solid rgba(240,136,45,.28);padding-top:.7rem;
order:4;
}
.kopf__akt .kopf__cta{order:0;flex:1 1 auto;width:auto;border-top:0}
.kopf__tel{
order:1;display:inline-flex;align-items:center;white-space:nowrap;
font-family:var(--font-body);font-weight:580;font-size:.86rem;
letter-spacing:.004em;color:var(--i1);text-decoration:none;
border-bottom:1px solid rgba(var(--licht),.28);
transition:border-color var(--dur-kurz) linear;
}
.kopf__tel:hover{border-bottom-color:var(--akz)}
}
@media (min-width:900px) and (max-width:1099px){
.kopf__akt{flex-direction:column;gap:.45rem}
.kopf__akt .kopf__cta{width:100%}
.kopf__tel{justify-content:center;font-size:.82rem}
}
@media (max-width:699px){
.hb__wort .lead{font-weight:400;letter-spacing:.010em}
.hb__wort h1{letter-spacing:-.024em}
}
@media (max-width:899px){
.abs--weiss{background-color:var(--pap-grund)}
.abs--sand{background-color:var(--pap-tief)}
}
@media (min-width:900px){
.abs--weiss{
background-image:var(--korn),radial-gradient(96% 74% at 30% 0%,
rgba(var(--licht),.52) 0%,rgba(var(--licht),.18) 48%,rgba(var(--licht),0) 82%);
background-repeat:repeat,no-repeat;
background-size:256px 256px,auto;
}
}
@media print{
.abs,.abs--sand,.abs--weiss,.abs--ink,.auf-ink,.konv,.fuss{
background-image:none !important;background-color:#fff !important;color:#22323F !important;
}
}