/* Schriften vom eigenen Server (keine Google-Fonts: DSGVO) */
@font-face{font-family:Archivo;src:url(/schriften/archivo-latin-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Archivo;src:url(/schriften/archivo-latin-ext-wdth-normal.woff2) format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Newsreader;src:url(/schriften/newsreader-latin-opsz-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Newsreader;src:url(/schriften/newsreader-latin-ext-opsz-normal.woff2) format("woff2");font-weight:200 800;font-style:normal;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:Newsreader;src:url(/schriften/newsreader-latin-opsz-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Newsreader;src:url(/schriften/newsreader-latin-ext-opsz-italic.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap;unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* ───────── Tokens ───────── */
:root{
  --tal:#0e1b17; --tal-2:#142922; --wald:#1d3a31;
  --stein:#e4dfd2; --papier:#efefeb; --hoch:#e8eeec; --firn:#f4f7f6; --gipfel:#fcfdfd;
  --tinte:#111614; --tinte-2:#3c4743; --nebel:#a9b8b2; --linie:color-mix(in oklab, currentColor 18%, transparent);
  /* Akzent = Material des Ortes. Kehlsteinhaus: der Messingaufzug. */
  --messing:#c8963e; --messing-tief:#7d5a1a;
  --akzent:var(--messing); --akzent-auf-hell:var(--messing-tief);
  --display:"Archivo",system-ui,sans-serif; --text:"Newsreader",Georgia,serif;
  --rand:clamp(20px,5vw,72px); --schiene:0px; --mass:68rem;
  --r:4px;
}
@media (min-width:1100px){:root{--schiene:104px}}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--tal);color:var(--gipfel);font:400 1.125rem/1.62 var(--text);font-optical-sizing:auto;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--display);margin:0;text-wrap:balance}
p{margin:0 0 1em;text-wrap:pretty}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--akzent);outline-offset:3px;border-radius:2px}
.zahl{font-family:var(--display);font-variant-numeric:tabular-nums lining-nums;font-stretch:88%}
.kl{font:600 .72rem/1.2 var(--display);letter-spacing:.14em;text-transform:uppercase;font-stretch:105%}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--akzent);color:#111;padding:.5em 1em;z-index:99;font:600 .9rem var(--display)}
.skip:focus{left:8px}

/* ───────── Kopf ───────── */
.kopf{position:absolute;inset:0 0 auto 0;z-index:20;display:flex;align-items:center;gap:2rem;padding:22px var(--rand) 0 calc(var(--rand) + var(--schiene));font-family:var(--display)}
.marke{display:flex;align-items:baseline;gap:.5em;text-decoration:none;font-weight:800;font-stretch:118%;letter-spacing:.02em;font-size:1rem;text-transform:uppercase}
.marke svg{width:22px;height:22px;translate:0 4px}
.marke{white-space:nowrap}.marke small{font:500 .62rem var(--display);letter-spacing:.12em;opacity:.55}
@media (max-width:520px){.marke small{display:none}}
.kopf nav{margin-left:auto;display:flex;gap:1.6rem;font-size:.9rem;font-weight:500}
.kopf nav a{text-decoration:none;opacity:.78}.kopf nav a:hover{opacity:1}
.sprache{display:flex;border:1px solid var(--linie);border-radius:99px;padding:2px;font:600 .72rem var(--display);letter-spacing:.08em}
.sprache a{padding:.3em .75em;border-radius:99px;text-decoration:none;opacity:.7}
.sprache a[aria-current]{background:var(--gipfel);color:var(--tal);opacity:1}
@media (max-width:820px){.kopf nav{display:none}.sprache{margin-left:auto}}

/* ───────── Höhenmesser (Schiene) ───────── */
.messer{display:none}
@media (min-width:1100px){
  .messer,.zeiger{display:block;position:fixed;z-index:30;left:0;top:0;bottom:0;width:var(--schiene);pointer-events:none}
  .messer{color:#fff;mix-blend-mode:difference}
  .messer .skala{position:absolute;inset:96px 0 56px 0}
  .messer .achse{position:absolute;left:50px;top:0;bottom:0;width:1px;background:currentColor;opacity:.6}
  .messer .strich{position:absolute;left:44px;width:7px;height:1px;background:currentColor;opacity:.7}
  .messer .strich.gross{left:38px;width:13px;opacity:.9}
  .messer .strich span{position:absolute;right:20px;top:-.6em;font:500 .62rem var(--display);font-variant-numeric:tabular-nums;opacity:.8}
  .messer .halt{position:absolute;left:47px;width:7px;height:7px;border-radius:50%;border:1px solid currentColor;background:transparent;translate:0 -3px}
  .zeiger{z-index:31;top:96px;bottom:56px}
  .zeiger .marke-z{position:absolute;left:41px;bottom:calc(var(--p,0)*100%);translate:0 50%;display:flex;align-items:center;gap:8px;transition:bottom .25s cubic-bezier(.2,.7,.2,1)}
  .zeiger .marke-z i{width:19px;height:19px;border-radius:50%;background:var(--akzent);box-shadow:0 0 0 5px color-mix(in oklab,var(--akzent) 25%,transparent)}
  .messer .jetzt{position:absolute;left:14px;top:26px;font-family:var(--display)}
  .messer .jetzt b{display:block;font-weight:800;font-size:1.25rem;font-stretch:80%;font-variant-numeric:tabular-nums;line-height:1}
  .messer .jetzt span{font:500 .6rem var(--display);letter-spacing:.1em;text-transform:uppercase;opacity:.8}
}
.zeiger{display:none}
@media (min-width:1100px){.zeiger{display:block}}
@media (prefers-reduced-motion:reduce){.zeiger .marke-z{transition:none}}
/* Mobil: Höhenleiste oben */
.leiste{position:fixed;z-index:30;inset:0 0 auto 0;height:34px;display:flex;align-items:center;gap:.6em;padding:0 var(--rand);font:600 .72rem var(--display);letter-spacing:.06em;background:color-mix(in oklab,var(--tal) 88%,transparent);backdrop-filter:blur(10px);color:var(--gipfel);translate:0 -100%;transition:translate .3s}
.leiste.an{translate:0 0}
.leiste b{font-variant-numeric:tabular-nums;color:var(--akzent)}
.leiste::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--akzent);transform-origin:0 50%;transform:scaleX(var(--p,0))}
@media (min-width:1100px){.leiste{display:none}}

/* ───────── Stationen (Abschnitte) ───────── */
main{display:block}
.station{--bg:var(--tal);--von:var(--bg);position:relative;padding:var(--luft,6rem) var(--rand) var(--luft,6rem) calc(var(--rand) + var(--schiene));background:linear-gradient(var(--von),var(--bg) 220px);color:var(--fg,var(--gipfel))}
.station>.in{max-width:var(--mass);margin-inline:auto}
.hell{color-scheme:light;--fg:var(--tinte);--akzent:var(--akzent-auf-hell)}
.dunkel{color-scheme:dark}
.marke-h{display:flex;align-items:baseline;gap:1rem;margin-bottom:2.2rem;padding-bottom:.9rem;border-bottom:1px solid var(--linie)}
.marke-h .zahl{font-size:clamp(2.6rem,6vw,4.6rem);font-weight:800;font-stretch:68%;line-height:.85;letter-spacing:-.01em}
.marke-h .zahl small{font-size:.32em;font-weight:600;font-stretch:100%;letter-spacing:.06em;margin-left:.2em;opacity:.7}
.marke-h .kl{opacity:.7}
h2{font-size:clamp(1.9rem,3.6vw,3rem);font-weight:750;font-stretch:92%;line-height:1.04;letter-spacing:-.015em;margin-bottom:1.1rem;max-width:22ch}
h3{font-size:1.18rem;font-weight:700;line-height:1.2;margin-bottom:.4rem}
.lead{font-size:clamp(1.2rem,1.7vw,1.42rem);line-height:1.5;max-width:40ch}
.spalten{display:grid;gap:clamp(2rem,5vw,5rem);grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start}
@media (max-width:900px){.spalten{grid-template-columns:1fr}}

/* Eintritt beim Scrollen – rein dekorativ, daher ohne Fallback */
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .auf{animation:auf linear both;animation-timeline:view();animation-range:entry 0% entry 38%}
    @keyframes auf{from{opacity:0;translate:0 28px}to{opacity:1;translate:0 0}}
  }
}

/* ───────── Hero ───────── */
.hero{--bg:var(--tal);padding-top:clamp(7rem,14vh,10rem);padding-bottom:4.5rem;overflow:clip;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  radial-gradient(90% 60% at 78% 8%,color-mix(in oklab,var(--messing) 20%,transparent),transparent 62%),
  radial-gradient(70% 50% at 10% 100%,#1f4438,transparent 70%);opacity:.9}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.13;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.pfad{display:flex;gap:.6em;flex-wrap:wrap;list-style:none;padding:0;margin:0 0 2.2rem;font:500 .78rem var(--display);letter-spacing:.04em;opacity:.7}
.pfad li+li::before{content:"／";margin-right:.6em;opacity:.5}
.pfad a{text-decoration:none}.pfad a:hover{text-decoration:underline}
.hero-raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(2rem,4vw,4rem);align-items:end}
@media (max-width:980px){.hero-raster{grid-template-columns:1fr}}
h1{font-size:clamp(3.2rem,9.2vw,8.2rem);font-weight:850;font-stretch:66%;line-height:.84;letter-spacing:-.02em;text-transform:uppercase;margin-bottom:1.6rem}
h1 em{display:block;font:italic 300 .2em/1.25 var(--text);text-transform:none;letter-spacing:0;color:var(--akzent);margin-bottom:.9em}
.hero .lead{color:color-mix(in oklab,var(--gipfel) 86%,transparent)}
.profil{width:100%;height:auto;display:block;overflow:visible}
.profil .berg{fill:url(#bergv)}
.profil .weg{fill:none;stroke:var(--gipfel);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:zieh 2.4s .5s cubic-bezier(.5,0,.2,1) forwards}
.profil .lift{fill:none;stroke:var(--messing);stroke-width:3;stroke-dasharray:1;stroke-dashoffset:1;animation:zieh .9s 2.7s ease-out forwards}
.profil .pkt{fill:var(--tal);stroke:var(--gipfel);stroke-width:1.5;opacity:0;animation:da .4s forwards}
.profil .pkt.g{fill:var(--messing);stroke:none}
.profil text{font-family:var(--display);fill:var(--gipfel);opacity:0;animation:da .5s forwards}
.profil .hm{font-size:19px;font-weight:800;font-stretch:72%;font-variant-numeric:tabular-nums}
.profil .ort{font-size:10.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;opacity:0;animation-name:da7}
.profil .seg{font-size:9.5px;font-style:italic;font-family:var(--text);animation-name:da7}
.profil .raster line{stroke:var(--gipfel);stroke-opacity:.12}
.profil .raster text{font-size:9px;animation:none;opacity:.4}
.profil *{animation-play-state:paused!important}.profil.los *{animation-play-state:running!important}
@keyframes zieh{to{stroke-dashoffset:0}}
@keyframes da{to{opacity:1}}
@keyframes da7{to{opacity:.7}}
@media (prefers-reduced-motion:reduce){.profil .weg,.profil .lift{animation:none;stroke-dashoffset:0}.profil .pkt,.profil text{animation:none;opacity:1}}

/* Die kurze Antwort */
.antwort{margin-top:3.2rem;display:grid;grid-template-columns:auto 1fr auto;border:1px solid color-mix(in oklab,var(--gipfel) 22%,transparent);border-radius:var(--r);background:color-mix(in oklab,var(--tal) 55%,transparent);backdrop-filter:blur(6px)}
.antwort>div{padding:1.5rem 1.7rem}
.antwort>div+div{border-left:1px solid color-mix(in oklab,var(--gipfel) 16%,transparent)}
.antwort .kl{color:var(--akzent);margin-bottom:.7rem;display:block}
.preis-gross{font-size:clamp(2.8rem,5vw,4.1rem);font-weight:800;font-stretch:70%;line-height:.9;white-space:nowrap}
.preis-gross sup{font-size:.42em;font-weight:600;vertical-align:top;position:relative;top:.18em;margin-left:.08em}
.antwort small{display:block;font:400 .82rem/1.45 var(--display);opacity:.72;margin-top:.55rem}
.weg-liste{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem .4rem;font:500 .95rem/1.3 var(--display)}
.weg-liste li{display:flex;align-items:center;gap:.4rem}
.weg-liste li+li::before{content:"→";opacity:.45}
.weg-liste b{font-weight:700}
.weg-liste span{opacity:.62;font-size:.82em;font-variant-numeric:tabular-nums}
.takt{display:grid;grid-template-columns:auto auto;gap:.15rem 1.1rem;font:500 .88rem var(--display);font-variant-numeric:tabular-nums}
.takt dt{opacity:.62}.takt dd{margin:0;font-weight:700;text-align:right}
@media (max-width:1000px){.antwort{grid-template-columns:1fr}.antwort>div+div{border-left:0;border-top:1px solid color-mix(in oklab,var(--gipfel) 16%,transparent)}}
.beleg{display:block;margin-top:1.1rem;font:500 .74rem var(--display);letter-spacing:.03em;opacity:.7}
.beleg::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#6fcf97;margin-right:.55em;translate:0 -1px}
.beleg a{text-underline-offset:.25em}

/* Der Rat */
.rat{--bg:var(--tal-2);--von:var(--tal);--luft:4.5rem}
.rat ol{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;counter-reset:r}
.rat li{counter-increment:r;padding:0 2rem 0 0;position:relative}
.rat li+li{padding-left:2rem;border-left:1px solid var(--linie)}
.rat li::before{content:"0" counter(r);display:block;font:800 .8rem var(--display);letter-spacing:.1em;color:var(--akzent);margin-bottom:.9rem}
.rat q{display:block;quotes:"„" "“";font:italic 400 1.42rem/1.32 var(--text);margin-bottom:.7rem}
.rat p{font-size:.98rem;opacity:.76;margin:0}
@media (max-width:900px){.rat ol{grid-template-columns:1fr;gap:2rem}.rat li,.rat li+li{padding:0;border:0}}

/* Anreise */
.anreise{--bg:var(--wald);--von:var(--tal-2)}
.wahl{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border:1px solid var(--linie);border-radius:99px;margin:1.6rem 0 2rem}
.wahl button{all:unset;cursor:pointer;padding:.55em 1.15em;border-radius:99px;font:600 .88rem var(--display);opacity:.75;transition:background .2s,color .2s}
.wahl button:hover{opacity:1}
.wahl button[aria-selected=true]{background:var(--gipfel);color:var(--tal);opacity:1}
.wahl button:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}
.feld[hidden]{display:none}
.fakten{display:flex;flex-wrap:wrap;gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:var(--r);overflow:hidden;margin:1.5rem 0}
.fakten div{flex:1 1 9.5rem;background:var(--bg);padding:1rem 1.1rem}
.fakten dt{font:500 .72rem var(--display);letter-spacing:.08em;text-transform:uppercase;opacity:.62;margin-bottom:.3rem}
.fakten dd{margin:0;font:700 1.35rem/1.1 var(--display);font-stretch:85%;font-variant-numeric:tabular-nums}
.fakten dd small{font-size:.6em;font-weight:500;opacity:.7}

/* Angebot – beantwortet eine Frage, unterbricht nie */
.angebot{display:grid;grid-template-columns:1fr auto;gap:.4rem 2rem;align-items:end;padding:1.4rem 1.5rem;border:1px solid var(--linie);border-left:3px solid var(--akzent);border-radius:var(--r);text-decoration:none;transition:background .2s,translate .2s}
.angebot:hover{background:color-mix(in oklab,currentColor 6%,transparent);translate:0 -2px}
.angebot .frage{grid-column:1/-1;font:italic 400 1.02rem var(--text);opacity:.78}
.angebot h4{font-size:1.12rem;font-weight:700;line-height:1.25}
.angebot .meta{font:500 .8rem var(--display);opacity:.7;margin-top:.35rem;font-variant-numeric:tabular-nums}
.angebot .p{font:800 1.9rem/1 var(--display);font-stretch:75%;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.angebot .p small{display:block;font:500 .68rem var(--display);font-stretch:100%;letter-spacing:.06em;opacity:.65;margin-bottom:.3rem}
.angebot .zu{grid-column:1/-1;font:600 .8rem var(--display);letter-spacing:.04em;color:var(--akzent);margin-top:.5rem}
.angebot .zu::after{content:" ↗"}
.ehrlich{margin-top:1.1rem;font-size:.98rem;opacity:.85;padding-left:1.1rem;border-left:1px solid var(--linie)}
.ehrlich b{font-family:var(--display);font-weight:700;font-size:.92em}

/* Rechner */
.rechner{--bg:var(--stein);--von:var(--wald);--luft:7rem}
.rechner .spalten{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:900px){.rechner .spalten{grid-template-columns:1fr}}
.eingabe{display:grid;gap:0;border-top:1px solid var(--linie)}
.zeile{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--linie)}
.zeile label,.zeile .lab{font:600 1rem var(--display)}
.zeile small{display:block;font:400 .8rem var(--display);opacity:.65;margin-top:.1rem}
.stepper{display:flex;align-items:center;gap:.2rem}
.stepper button{all:unset;cursor:pointer;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--tinte);border-radius:50%;font:500 1.3rem var(--display);transition:background .15s,color .15s}
.stepper button:hover{background:var(--tinte);color:var(--stein)}
.stepper button:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}
.stepper button[disabled]{opacity:.25;cursor:default;background:none;color:inherit}
.stepper output{width:2.6ch;text-align:center;font:800 1.5rem var(--display);font-variant-numeric:tabular-nums}
.schalter{position:relative;width:54px;height:30px;flex:none}
.schalter input{appearance:none;position:absolute;inset:0;margin:0;border-radius:99px;border:1px solid var(--tinte);cursor:pointer;transition:background .2s}
.schalter input::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--tinte);transition:translate .2s,background .2s}
.schalter input:checked{background:var(--tinte)}
.schalter input:checked::after{translate:24px 0;background:var(--stein)}
.ergebnis{background:var(--tinte);color:var(--gipfel);border-radius:var(--r);padding:2rem 2rem 1.6rem;position:sticky;top:3rem;color-scheme:dark;--akzent:var(--messing)}
.ergebnis .kl{color:var(--akzent)}
.summe{font:800 clamp(3.4rem,7vw,5.4rem)/.9 var(--display);font-stretch:68%;font-variant-numeric:tabular-nums;margin:.5rem 0 .2rem}
.summe sup{font-size:.4em;vertical-align:top;position:relative;top:.2em}
.ticketname{font:600 1.05rem var(--display);margin-bottom:1.2rem}
.posten{list-style:none;margin:0 0 1.2rem;padding:0;border-top:1px solid color-mix(in oklab,var(--gipfel) 20%,transparent);font:500 .92rem var(--display);font-variant-numeric:tabular-nums}
.posten li{display:flex;justify-content:space-between;gap:1rem;padding:.55rem 0;border-bottom:1px solid color-mix(in oklab,var(--gipfel) 12%,transparent)}
.posten li span:last-child{font-weight:700;white-space:nowrap;text-align:right}
.posten .drin span:last-child{color:#8fdcb0}
.spar{display:inline-block;background:var(--akzent);color:#16110a;font:700 .82rem var(--display);padding:.35em .8em;border-radius:99px;margin-bottom:1rem}
.spar:empty{display:none}
.hinweis{font:400 .84rem/1.5 var(--display);opacity:.72;margin:0}
.vergleich{margin-top:1.2rem;padding-top:1.1rem;border-top:1px dashed color-mix(in oklab,var(--gipfel) 28%,transparent);font:400 .9rem/1.5 var(--display)}
.vergleich b{font-variant-numeric:tabular-nums}

/* Zweiter Ton: Ernst. Keine Akzentfarbe, kein Bild, kein Angebotskasten. */
.ernst{--bg:var(--papier);--von:var(--stein);--luft:8rem;--akzent:var(--tinte)}
.ernst .in{max-width:46rem}
.ernst .marke-h{border-color:var(--tinte)}
.ernst h2{font-weight:600;font-stretch:100%;letter-spacing:-.005em;max-width:none;font-size:clamp(1.7rem,3vw,2.4rem)}
.ernst p{font-size:1.16rem;line-height:1.7}
.ernst .fakten{margin:2.4rem 0}
.ernst .fakten dd{font-weight:600}
.ernst .nb{font:400 .95rem/1.6 var(--display);border-top:1px solid var(--tinte);padding-top:1.1rem;margin-top:2.2rem}

/* Auffahrt */
.auffahrt{--bg:var(--hoch);--von:var(--papier);--luft:8rem}
.strecke{position:relative;margin:2.6rem 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(5,1fr);font-family:var(--display)}
.strecke::before{content:"";position:absolute;left:0;right:0;top:9px;height:2px;background:repeating-linear-gradient(90deg,var(--tinte) 0 10px,transparent 10px 16px)}
.strecke li{position:relative;padding:2rem .8rem 0 0}
.strecke li::before{content:"";position:absolute;top:2px;left:0;width:16px;height:16px;border-radius:50%;background:var(--hoch);border:2px solid var(--tinte)}
.strecke li:last-child::before{background:var(--akzent);border-color:var(--akzent)}
.strecke b{display:block;font-size:1.7rem;font-weight:800;font-stretch:72%;line-height:1;font-variant-numeric:tabular-nums}
.strecke span{font-size:.82rem;opacity:.72;line-height:1.35;display:block;margin-top:.3rem}
@media (max-width:760px){.strecke{grid-template-columns:1fr 1fr;gap:1.4rem 0}.strecke::before{display:none}}

/* Aufzug */
.aufzug{--bg:var(--firn);--von:var(--hoch);--luft:9rem}
.schacht{position:relative;height:340px;width:120px;margin-inline:auto}
.schacht::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;translate:-50% 0;background:repeating-linear-gradient(var(--akzent) 0 6px,transparent 6px 12px)}
.kabine{position:absolute;left:50%;bottom:0;width:64px;height:78px;translate:-50% 0;border-radius:3px;background:linear-gradient(135deg,#e7c27a,#b9852f 45%,#f0d59a 60%,#9a6c22);box-shadow:inset 0 0 0 3px #7d5a1a,inset 0 0 0 6px #e9cb8b55,0 18px 30px -12px #7d5a1a88}
.kabine::after{content:"";position:absolute;left:50%;top:8px;bottom:8px;width:1px;background:#7d5a1a}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){
  .kabine{animation:hoch linear both;animation-timeline:view();animation-range:cover 15% cover 70%}
  @keyframes hoch{to{bottom:calc(100% - 78px)}}
}}
.schacht .oben,.schacht .unten{position:absolute;left:calc(100% + 14px);white-space:nowrap;font:700 .85rem var(--display);font-variant-numeric:tabular-nums}
.schacht .oben{top:-4px}.schacht .unten{bottom:-4px}
.zu-fuss{margin-top:1.6rem;font-size:1rem}

/* Gipfel */
.gipfel{--bg:var(--gipfel);--von:var(--firn);--luft:11rem;text-align:center}
.gipfel .marke-h{justify-content:center;border:0;flex-direction:column;align-items:center;gap:.6rem;margin-bottom:1.5rem}
.gipfel .marke-h .zahl{font-size:clamp(5rem,17vw,14rem);font-stretch:62%;letter-spacing:-.03em}
.gipfel h2{margin-inline:auto;max-width:18ch}
.gipfel .lead{margin:0 auto 3.5rem}
.lohnt{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:var(--r);overflow:hidden;text-align:left;max-width:58rem;margin-inline:auto}
.lohnt>div{background:var(--gipfel);padding:2rem 2.1rem}
.lohnt h3{display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.lohnt h3 i{width:10px;height:10px;border-radius:50%;background:#2f9e62;flex:none}
.lohnt .nein h3 i{background:#b3402e}
.lohnt ul{margin:0;padding:0;list-style:none}
.lohnt li{padding:.6rem 0;border-top:1px solid var(--linie);font-size:1.02rem;line-height:1.45}
.lohnt li b{font-family:var(--display);font-size:.95em}
@media (max-width:760px){.lohnt{grid-template-columns:1fr}}
.cam{margin-top:2rem;font:500 .95rem var(--display)}

/* Korb */
.korb{--bg:var(--gipfel);--luft:5rem;padding-top:0}
.korb .in{border-top:1px solid var(--linie);padding-top:4rem}
.karten{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.2rem;margin-top:2rem}
@media (max-width:900px){.karten{grid-template-columns:1fr}}
.karten .angebot{grid-template-columns:1fr;align-items:start;height:100%}
.karten .angebot .p{text-align:left;margin-top:.8rem}

/* ───────── Bilder ───────── */
.quelle{font:400 .62rem/1.3 var(--display);letter-spacing:.04em;opacity:.72}
.quelle a{text-decoration:none}.quelle a:hover{text-decoration:underline}
/* Hero mit Foto */
.hero{min-height:100svh;display:flex;align-items:flex-end;padding-top:7rem;padding-bottom:2.2rem}
.hero>.in{width:100%}
.hero-bild{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:30% 6%;z-index:-3;transform-origin:22% 20%}
.hero::before{z-index:-2;opacity:1;background:
  linear-gradient(to top,var(--tal) 0%,color-mix(in oklab,var(--tal) 90%,transparent) 20%,color-mix(in oklab,var(--tal) 35%,transparent) 42%,transparent 62%),
  linear-gradient(to bottom,color-mix(in oklab,var(--tal) 70%,transparent),transparent 22%),
  radial-gradient(70% 80% at 100% 70%,color-mix(in oklab,var(--tal) 72%,transparent),transparent 72%)}
.hero::after{z-index:-1}
@media (prefers-reduced-motion:no-preference){
  .hero-bild{animation:kb 18s cubic-bezier(.2,.6,.2,1) both}
  @keyframes kb{from{scale:1.07}to{scale:1}}
  .hero h1,.hero .lead,.hero .antwort,.hero .beleg,.hero .pfad{animation:hoch-rein .9s cubic-bezier(.2,.7,.2,1) both}
  .hero h1{animation-delay:.15s}.hero .lead{animation-delay:.3s}.hero .antwort{animation-delay:.5s}.hero .beleg{animation-delay:.7s}
  @keyframes hoch-rein{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
}
.hero .titel{margin-left:auto;width:min(100%,41rem)}
@media (max-width:1100px){
  .hero .titel{margin-left:0}
  .hero{min-height:auto;padding-top:47svh}
  .hero-bild{inset:0 0 auto 0;height:64svh;object-position:24% 0%}
  .hero::before{background:linear-gradient(to bottom,color-mix(in oklab,var(--tal) 60%,transparent) 0,transparent 14svh,transparent 32svh,color-mix(in oklab,var(--tal) 80%,transparent) 50svh,var(--tal) 64svh)}
}
.hero h1{font-size:clamp(3rem,min(6.3vw,13svh),6.2rem);margin-bottom:1.1rem;text-shadow:0 2px 40px #0006}
.hero .lead{max-width:44ch;text-shadow:0 1px 18px #000a}
.hero .antwort{margin-top:2rem;background:color-mix(in oklab,var(--tal) 62%,transparent);backdrop-filter:blur(14px) saturate(1.2)}
.hero .antwort>div{padding:1.15rem 1.5rem}
.hero .preis-gross{font-size:clamp(2.6rem,4.4vw,3.6rem)}
/* Profil jetzt neben den Ratschlägen */
.rat{--luft:6rem}
.rat-raster{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
.rat-raster figure{margin:0}
.rat-raster figcaption{font:600 .72rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--akzent);margin-bottom:1rem}
.rat ol{grid-template-columns:1fr}
.rat li,.rat li+li{padding:1.5rem 0;border-left:0;border-top:1px solid var(--linie)}
.rat li:first-child{border-top:0;padding-top:0}
.rat li::before{float:left;margin:.5rem 1.2rem 0 0}
.rat q{font-size:1.5rem}
@media (max-width:900px){.rat-raster{grid-template-columns:1fr}}
/* Fenster: randabfallendes Bild zwischen zwei Stationen */
.fenster{position:relative;margin:0;height:min(92svh,860px);overflow:clip;color:#fff;background:var(--tal);isolation:isolate}
.fenster img{position:absolute;left:0;top:-10%;width:100%;height:120%;object-fit:cover;z-index:-2}
.fenster::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,#08110eee 0%,#08110e88 28%,transparent 58%),linear-gradient(to bottom,var(--oben,transparent),transparent 22%)}
.fenster figcaption{position:absolute;left:calc(var(--rand) + var(--schiene));right:var(--rand);bottom:clamp(2rem,6vh,4.5rem)}
.fenster .kl{color:var(--messing);display:block;margin-bottom:.9rem}
.fenster figcaption{text-shadow:0 1px 24px #000b}
.fenster .satz{font:750 clamp(2rem,5.2vw,4.6rem)/1 var(--display);font-stretch:80%;letter-spacing:-.015em;max-width:16ch;text-wrap:balance;margin:0}
.fenster .satz em{font:italic 300 .5em/1.3 var(--text);display:block;letter-spacing:0;margin-top:1rem;max-width:34ch;opacity:.92}
.fenster .quelle{position:absolute;right:1rem;bottom:.7rem}
@media (prefers-reduced-motion:no-preference){@supports (animation-timeline:view()){
  .fenster img{animation:zieh-bild linear both;animation-timeline:view();animation-range:cover}
  @keyframes zieh-bild{from{translate:0 -7%}to{translate:0 7%}}
}}
/* Im Berg */
.imberg{position:relative;display:grid;grid-template-columns:repeat(12,1fr);align-items:end}
.imberg figure{margin:0}
.imberg .t{grid-column:1/11;grid-row:1}
.imberg .a{grid-column:8/13;grid-row:1;translate:0 14%;z-index:2}
.imberg img{display:block;width:100%;height:auto;border-radius:var(--r)}
.imberg .t img{aspect-ratio:4/3;object-fit:cover}
.imberg .a img{aspect-ratio:3/4;object-fit:cover;box-shadow:0 0 0 6px var(--firn),0 0 0 7px var(--messing),0 40px 60px -30px #7d5a1a99}
.imberg figcaption{font:500 .8rem/1.4 var(--display);margin-top:.7rem;max-width:30ch}
.imberg .a figcaption{margin-top:1rem}
.aufzug{padding-bottom:12rem}
/* Panorama */
.pano-rahmen{margin:0 calc(-1*var(--rand)) 0 calc(-1*(var(--rand) + var(--schiene)));position:relative}
.pano{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain}
.pano::-webkit-scrollbar{display:none}
.pano.zieht{cursor:grabbing}
.pano-in{position:relative;width:clamp(1150px,165vw,2800px)}
.pano img{display:block;width:100%;height:auto;user-select:none;-webkit-user-drag:none}
.gn{position:absolute;translate:-50% 0;text-align:center;color:#fff;font:700 .78rem/1.2 var(--display);letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 10px #000c;white-space:nowrap}
.gn small{display:block;font:italic 400 .82rem var(--text);letter-spacing:0;text-transform:none;opacity:.95}
.gn::after{content:"";display:block;width:1px;height:var(--h,40px);background:#fff;margin:.5rem auto 0;opacity:.8}
.pano-hinweis{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.8rem var(--rand) 0 calc(var(--rand) + var(--schiene));font:500 .74rem var(--display);letter-spacing:.06em;opacity:.7;text-align:left}
.gipfel .lead{margin-bottom:3rem}
.gipfel .danach{margin-top:6rem}
/* Lohnt-es-sich mit Beweisfoto */
.lohnt>div{padding:0}
.lohnt .pad{padding:1.6rem 2.1rem 2rem}
.lohnt figure{margin:0;position:relative}
.lohnt figure img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.lohnt figure .quelle{position:absolute;right:.6rem;bottom:.4rem;color:#fff;text-shadow:0 1px 6px #000}
/* Ernst: ein Bild, entsättigt, ohne Effekt */
.ernst figure{margin:2.6rem 0}
.ernst figure img{display:block;width:100%;height:auto;filter:grayscale(1) contrast(1.06)}
.ernst figcaption{font:400 .82rem/1.5 var(--display);margin-top:.6rem;opacity:.8}
/* Korb-Karten mit Bild */
.karten .angebot{padding:0;overflow:hidden;display:flex;flex-direction:column;border-left-width:1px;border-top:3px solid var(--akzent)}
.karten .angebot img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;transition:scale .6s cubic-bezier(.2,.7,.2,1)}
.karten .angebot:hover img{scale:1.04}
.karten .angebot .pad{padding:1.2rem 1.4rem 1.4rem;display:grid;gap:.4rem;flex:1;align-content:start}
.karten .angebot .bildbox{overflow:hidden}
.bn{list-style:none;padding:0;margin:1rem 0 0;columns:2 22rem;font:400 .78rem/1.5 var(--display);opacity:.8}
.bn li{break-inside:avoid;margin-bottom:.35rem}

/* Quellen + Fuß */
.quellen{--bg:var(--tinte);--von:var(--tinte);--luft:4.5rem;color-scheme:dark}
.quellen table{width:100%;border-collapse:collapse;font:400 .88rem/1.4 var(--display);margin-top:1.5rem}
.quellen th{text-align:left;font-weight:600;letter-spacing:.08em;text-transform:uppercase;font-size:.68rem;opacity:.6;padding:.6rem .8rem .6rem 0;border-bottom:1px solid var(--linie)}
.quellen td{padding:.7rem .8rem .7rem 0;border-bottom:1px solid var(--linie);vertical-align:top}
.quellen td:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.fuss{margin-top:3rem;font:400 .82rem/1.55 var(--display);opacity:.62;max-width:60ch}
@media (max-width:700px){.quellen thead{display:none}.quellen tr{display:block;padding:.7rem 0;border-bottom:1px solid var(--linie)}.quellen td{display:block;border:0;padding:.1rem 0}}

/* ───────── Seitenfuß, Textseiten, Startseite (Generator) ───────── */
.seitenfuss{background:#0a1411;color:var(--gipfel);padding:3.5rem var(--rand) 3rem calc(var(--rand) + var(--schiene));font-family:var(--display);color-scheme:dark}
.seitenfuss .in{max-width:var(--mass);margin-inline:auto;display:grid;gap:1.1rem}
.seitenfuss p{margin:0;max-width:52ch;font-size:.95rem;opacity:.8}
.seitenfuss .klein{font-size:.78rem;opacity:.55}
.seitenfuss nav{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;font-size:.9rem;font-weight:500}
.seitenfuss nav a{text-decoration:none;opacity:.85}.seitenfuss nav a:hover{opacity:1;text-decoration:underline}
body:not([data-skala]){--schiene:0px}
.seitenkopf{--bg:var(--tal);padding-top:9rem;padding-bottom:3.5rem}
.seitenkopf h1{font-size:clamp(2.6rem,7vw,5.4rem)}
.prosa-station{--bg:var(--papier);--von:var(--tal);--luft:5rem}
.prosa{max-width:44rem}
.prosa h2{font-size:1.5rem;font-weight:700;font-stretch:100%;margin:2.4rem 0 .6rem;max-width:none;letter-spacing:0}
.prosa p,.prosa li{font-size:1.08rem}
.prosa .klein{font:400 .9rem var(--display);opacity:.75}
.prosa table{width:100%;border-collapse:collapse;font:400 .9rem/1.45 var(--display);margin:1rem 0 2rem}
.prosa th,.prosa td{text-align:left;padding:.6rem .8rem .6rem 0;border-bottom:1px solid var(--linie);vertical-align:top}
.prosa th{font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;opacity:.65}
.start .hero-bild{object-position:45% 30%}
.start .titel{margin-left:0!important;width:min(100%,52rem)!important}
.start h1{font-size:clamp(3rem,min(8.4vw,15svh),8rem)!important}
.prinzip{--bg:var(--stein);--von:var(--tal);--luft:7rem}
.prinzip ol{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1.5rem,4vw,3.5rem);counter-reset:p}
.prinzip li{counter-increment:p;border-top:1px solid var(--tinte);padding-top:1.1rem}
.prinzip li::before{content:"0" counter(p);font:800 .8rem var(--display);letter-spacing:.1em;color:var(--akzent)}
.prinzip h3{font-size:1.5rem;font-stretch:88%;margin:.5rem 0 .5rem}
.prinzip p{margin:0;font-size:1.02rem}
@media (max-width:900px){.prinzip ol{grid-template-columns:1fr}}
.ziele{--bg:var(--firn);--von:var(--stein);--luft:7rem}
.ziel-gross{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0;margin-top:2.5rem;border:1px solid var(--linie);border-radius:var(--r);overflow:hidden;text-decoration:none;background:var(--gipfel)}
.ziel-gross .bildbox{overflow:hidden;min-height:22rem}
.ziel-gross img{display:block;width:100%;height:100%;object-fit:cover;object-position:30% 20%;transition:scale .8s cubic-bezier(.2,.7,.2,1)}
.ziel-gross:hover img{scale:1.04}
.ziel-gross .pad{padding:clamp(1.5rem,3vw,2.8rem);display:grid;align-content:center;gap:.8rem}
.ziel-gross .zahl{font-size:clamp(3rem,6vw,5rem);font-weight:800;font-stretch:66%;line-height:.9}
.ziel-gross .zahl small{font-size:.3em;font-stretch:100%;font-weight:600;opacity:.7;margin-left:.2em}
.ziel-gross h3{font-size:1.7rem;font-stretch:90%}
.ziel-gross p{margin:0}
.ziel-gross .zu{font:600 .85rem var(--display);color:var(--akzent)}
.ziel-gross .zu::after{content:" →"}
@media (max-width:820px){.ziel-gross{grid-template-columns:1fr}.ziel-gross .bildbox{min-height:14rem}}
.bald{margin-top:3rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:var(--r);overflow:hidden;list-style:none;padding:0}
.bald li{background:var(--firn);padding:1.2rem 1.3rem;font-family:var(--display)}
.bald b{display:block;font-size:1.15rem;font-stretch:90%}
.bald span{font-size:.82rem;opacity:.7}