/* 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}


/* ───────── 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}

/* ───────── Themenseite (Longtail) ───────── */
.hero.kurz{min-height:74svh}
.hero.kurz h1{font-size:clamp(2.6rem,min(5.4vw,11svh),5rem)}
.hero.kurz .titel{width:min(100%,46rem)}
.lese-station{--bg:var(--papier);--von:var(--tal);--luft:6rem}
.lese-station.stein{--bg:var(--stein)}
.lese-station.firn{--bg:var(--firn);--von:var(--papier)}
.lese{max-width:46rem}
.lese>h2{margin-top:3.6rem;font-size:clamp(1.7rem,3vw,2.4rem);max-width:none}
.lese>h2:first-child{margin-top:0}
.lese>h3{margin-top:2.2rem;font-size:1.25rem}
.lese p,.lese li{font-size:1.12rem;line-height:1.66}
.lese ul,.lese ol{padding-left:1.3em;margin:0 0 1.2em}
.lese li{margin-bottom:.45em}
.lese figure{margin:2.6rem 0}
.lese figure img{display:block;width:100%;height:auto;border-radius:var(--r)}
.lese figcaption{font:400 .8rem/1.5 var(--display);opacity:.75;margin-top:.55rem}
.lese .angebot{margin:2rem 0 .4rem}
.lese .fakten{margin:1.8rem 0}
.tabelle{overflow-x:auto;margin:1.8rem 0 2.2rem;-webkit-overflow-scrolling:touch}
table.tarif{width:100%;border-collapse:collapse;font:500 .95rem/1.4 var(--display);font-variant-numeric:tabular-nums;min-width:30rem}
table.tarif caption{caption-side:bottom;text-align:left;font:400 .76rem/1.5 var(--display);opacity:.7;padding-top:.7rem}
table.tarif th{text-align:left;font-size:.68rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;opacity:.65;padding:.55rem 1rem .55rem 0;border-bottom:1px solid var(--tinte);white-space:nowrap}
table.tarif td{padding:.75rem 1rem .75rem 0;border-bottom:1px solid var(--linie);vertical-align:top}
table.tarif td.z,table.tarif th.z{text-align:right;white-space:nowrap;padding-right:0}
table.tarif td.z{font-weight:700;font-size:1.05rem}
table.tarif tr.best td{background:color-mix(in oklab,var(--akzent) 9%,transparent)}
.merk{border-left:3px solid var(--akzent);padding:.2rem 0 .2rem 1.2rem;margin:2rem 0;font-size:1.1rem}
.merk b{font-family:var(--display)}
/* Cluster-Navigation: interne Verlinkung je Anker */
.cluster{--bg:var(--firn);--von:var(--firn);--luft:5rem;color-scheme:light;--fg:var(--tinte);--akzent:var(--akzent-auf-hell)}
.cluster h2{font-size:1.6rem}
.cluster ul{list-style:none;margin:1.6rem 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:1px;background:var(--linie);border:1px solid var(--linie);border-radius:var(--r);overflow:hidden}
.cluster li{background:var(--firn)}
.cluster a{display:block;height:100%;padding:1.1rem 1.2rem 1.2rem;text-decoration:none;font-family:var(--display);transition:background .2s}
.cluster a:hover{background:color-mix(in oklab,var(--akzent) 8%,var(--firn))}
.cluster a b{display:block;font-size:1.05rem;font-stretch:92%}
.cluster a b::after{content:" →";color:var(--akzent)}
.cluster a span{display:block;font-size:.82rem;line-height:1.4;opacity:.72;margin-top:.25rem}
.cluster a[aria-current]{background:color-mix(in oklab,var(--tinte) 6%,var(--firn))}
.cluster a[aria-current] b::after{content:""}
/* Zielkarten auf der Startseite */
.ziel-raster{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.4rem;margin-top:1.4rem}
@media (max-width:820px){.ziel-raster{grid-template-columns:1fr}}
.ziel-klein{display:grid;grid-template-rows:auto 1fr;border:1px solid var(--linie);border-radius:var(--r);overflow:hidden;text-decoration:none;background:var(--gipfel)}
.ziel-klein .bildbox{overflow:hidden;aspect-ratio:16/9}
.ziel-klein img{display:block;width:100%;height:100%;object-fit:cover;transition:scale .8s cubic-bezier(.2,.7,.2,1)}
.ziel-klein:hover img{scale:1.04}
.ziel-klein .pad{padding:1.4rem 1.6rem 1.6rem;display:grid;gap:.5rem;align-content:start}
.ziel-klein .zahl{font-size:2.4rem;font-weight:800;font-stretch:68%;line-height:.9}
.ziel-klein .zahl small{font-size:.4em;font-stretch:100%;font-weight:600;opacity:.7;margin-left:.2em}
.ziel-klein h3{font-size:1.4rem;font-stretch:90%}
.ziel-klein p{margin:0;font-size:1rem}
.ziel-klein .zu{font:600 .85rem var(--display);color:var(--akzent)}
.ziel-klein .zu::after{content:" →"}
.hero.kurz .titel{margin-left:0}
.hero.kurz::before{background:linear-gradient(to top,var(--tal) 0%,color-mix(in oklab,var(--tal) 86%,transparent) 28%,color-mix(in oklab,var(--tal) 40%,transparent) 60%,color-mix(in oklab,var(--tal) 22%,transparent) 100%),linear-gradient(to right,color-mix(in oklab,var(--tal) 70%,transparent),transparent 65%)}
@media (max-width:1100px){.hero.kurz{padding-top:40svh}.hero.kurz .hero-bild{height:54svh}.hero.kurz::before{background:linear-gradient(to bottom,color-mix(in oklab,var(--tal) 55%,transparent) 0,transparent 12svh,transparent 26svh,color-mix(in oklab,var(--tal) 85%,transparent) 42svh,var(--tal) 54svh)}}

/* ───────── Navigation: Ziele im Kopf, Menü auf kleinen Schirmen ───────── */
.kopf .hauptnav a[aria-current]{opacity:1;box-shadow:0 2px 0 var(--akzent)}
.menue{display:none;margin-left:auto;position:relative}
.menue summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-content:center;gap:6px;border:1px solid color-mix(in oklab,currentColor 30%,transparent);border-radius:50%}
.menue summary::-webkit-details-marker{display:none}
.menue summary span{display:block;width:18px;height:2px;background:currentColor;transition:translate .2s,rotate .2s}
.menue[open] summary span:first-child{translate:0 4px;rotate:45deg}
.menue[open] summary span:last-child{translate:0 -4px;rotate:-45deg}
.menue nav{margin:0;gap:0;opacity:1;position:absolute;right:0;top:54px;display:grid;min-width:15rem;padding:.6rem;border-radius:8px;background:color-mix(in oklab,var(--tal) 94%,transparent);backdrop-filter:blur(14px);border:1px solid color-mix(in oklab,var(--gipfel) 18%,transparent);box-shadow:0 20px 40px -20px #000}
.menue nav a{opacity:1;padding:.8rem .9rem;text-decoration:none;font:600 1rem var(--display);color:var(--gipfel);border-radius:5px;white-space:nowrap}
.menue nav a:hover,.menue nav a[aria-current]{background:color-mix(in oklab,var(--gipfel) 10%,transparent)}
@media (max-width:960px){.kopf .hauptnav{display:none}.menue{display:block}}
/* Rasterkinder dürfen schrumpfen – sonst drückt eine Tabelle die Spalte über den Bildschirm */
.spalten>*,.hero-raster>*,.rat-raster>*,.lese,.in{min-width:0}
.tabelle{max-width:100%}
/* Sprachschalter im Kopf */
.kopf .sprache{margin-left:1.2rem}
.kopf .hauptnav+.sprache{margin-left:1.2rem}
@media (max-width:960px){.kopf .sprache{display:none}}
/* Auswahlfelder im Rechner */
.eingabe select{font:600 .95rem var(--display);color:inherit;background:transparent;border:1px solid var(--tinte);border-radius:99px;padding:.55em 2.2em .55em 1em;max-width:15rem;appearance:none;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 1.1em) 55%,calc(100% - .75em) 55%;background-size:.35em .35em;background-repeat:no-repeat;cursor:pointer}
.eingabe select:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}
.eingabe .zeile[hidden]{display:none}
@media (max-width:520px){.eingabe .zeile:has(select){flex-direction:column;align-items:flex-start;gap:.6rem}.eingabe select{max-width:100%;width:100%}}