/* Hinteralm – Pitch-Entwurf wedolegacy
   Prinzip „Kamm über Wort“: die Bergsilhouette aus dem Logo liegt über jedem großen Wort,
   ist Höhenprofil der Nacht, Gäste-Regler und Kante zwischen den Kapiteln. */

@font-face { font-family: "Big Shoulders"; src: url("../assets/fonts/big-shoulders-latin.woff2") format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "Hanken Grotesk"; src: url("../assets/fonts/hanken-grotesk-latin.woff2") format("woff2"); font-weight: 300 800; font-style: normal; font-display: swap; }

:root {
  --nacht: #1b1512;
  --nacht-2: #261d18;
  --nacht-3: #3a2c24;
  --schnee: #f6f0e7;
  --schnee-2: #ece2d4;
  --zirbe: #e3a862;
  --holz: #a8643f;
  --pink: #e2508f;
  --pink-2: #ec74a8;
  --ink: var(--nacht);
  --display: "Big Shoulders", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --text: "Hanken Grotesk", "Helvetica Neue", Arial, sans-serif;
  --g: clamp(16px, 4vw, 56px);
  --max: 1440px;
  --hdr: 68px;
  --ease: cubic-bezier(.22, .7, .15, 1);
  --edge: clamp(34px, 6.2vw, 116px);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; overflow-x: clip; scroll-padding-top: var(--hdr); }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }
body { margin: 0; background: var(--nacht); color: var(--schnee); font: 400 1.0625rem/1.55 var(--text); overflow-x: clip; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
button, input, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--zirbe); outline-offset: 3px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.skip { position: fixed; left: 12px; top: -60px; z-index: 100; background: var(--zirbe); color: var(--nacht); padding: 10px 16px; border-radius: 6px; font-weight: 700; }
.skip:focus { top: 12px; }

/* ---------- Typo ---------- */
.eyebrow { font: 700 .82rem/1 var(--text); letter-spacing: .16em; text-transform: uppercase; opacity: .78; margin-bottom: 14px; }
.h2, .h3 { font-family: var(--display); font-weight: 850; text-transform: uppercase; line-height: .9; letter-spacing: .005em; }
.h2 { font-size: clamp(2.8rem, 6.4vw, 6.4rem); }
.h3 { font-size: clamp(2.3rem, 4.6vw, 4.4rem); }

/* ---------- Kamm ---------- */
#kamm { vector-effect: non-scaling-stroke; }
.kamm { overflow: visible; color: var(--zirbe); }
.kamm use, .kamm path { fill: none; stroke: currentColor; stroke-width: 3px; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.7s var(--ease); }
.kamm.is-drawn use, .kamm.is-drawn path, .no-js .kamm use { stroke-dashoffset: 0; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 24px; border: 0; border-radius: 6px; font: 750 1.22rem/1 var(--display); letter-spacing: .05em; text-transform: uppercase; text-decoration: none; white-space: nowrap; transition: transform .25s var(--ease), background-color .25s, color .25s, box-shadow .25s; }
.btn:active { transform: scale(.97); }
.btn--sm { min-height: 40px; padding: 0 16px; font-size: 1.05rem; }
.btn--lg { min-height: 60px; padding: 0 34px; font-size: 1.4rem; }
.btn--pink { background: var(--pink); color: var(--nacht); }
.btn--pink:hover { background: var(--pink-2); }
.btn--dark { background: var(--nacht); color: var(--schnee); }
.btn--dark:hover { background: var(--nacht-3); }
.btn--glass { background: rgba(27, 21, 18, .55); color: var(--schnee); box-shadow: inset 0 0 0 1.5px rgba(246, 240, 231, .5); }
.btn--glass:hover { background: rgba(27, 21, 18, .8); }
.btn--line { background: transparent; color: inherit; box-shadow: inset 0 0 0 2px currentColor; }
.btn--line:hover { background: currentColor; }
.btn--line:hover > * { color: var(--nacht); }
[data-theme="dark"] .btn--line:hover > *, .menu .btn--line:hover { color: var(--nacht); }
.ico { display: inline-block; width: 18px; height: 18px; background: currentColor; }
.ico--tel { -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 0 1 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1z'/%3E%3C/svg%3E") center/contain no-repeat; }
.hint360 { font: 800 .95em/1 var(--display); letter-spacing: .04em; }

/* ---------- Header ---------- */
.hdr { position: fixed; inset: 0 0 auto; z-index: 50; height: var(--hdr); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px; padding: 0 var(--g); color: var(--schnee); transition: background-color .35s, color .35s, box-shadow .35s, transform .45s var(--ease); }
.hdr::before { content: ""; position: absolute; inset: 0 0 -40px; z-index: -1; background: linear-gradient(rgba(20, 14, 12, .62), rgba(20, 14, 12, 0)); transition: opacity .35s; pointer-events: none; }
.hdr[data-on="dark"] { background: var(--nacht); }
.hdr[data-on="light"] { background: var(--schnee); color: var(--nacht); box-shadow: 0 1px 0 rgba(27, 21, 18, .1); }
.hdr[data-on="zirbe"] { background: var(--zirbe); color: var(--nacht); }
.hdr[data-on="pink"] { background: var(--pink); color: var(--nacht); }
.hdr:not([data-on="hero"])::before { opacity: 0; }
.hdr.is-hidden { transform: translateY(-105%); }
.hdr__logo { display: block; width: clamp(108px, 9.4vw, 136px); color: currentColor; }
.hdr__logo svg { width: 100%; height: auto; fill: currentColor; }
.hdr__nav { display: flex; justify-content: center; align-items: center; gap: 12px; font: 750 1.32rem/1 var(--display); text-transform: uppercase; letter-spacing: .06em; }
.hdr__nav a { text-decoration: none; padding: 8px 2px; background: linear-gradient(currentColor 0 0) left 100% / 0 2px no-repeat; transition: background-size .3s var(--ease); }
.hdr__nav a:hover, .hdr__nav a.is-here { background-size: 100% 2px; }
.hdr__nav span { opacity: .55; }
.hdr__more { margin-left: 22px; font-weight: 600; opacity: .85; }
.hdr__right { display: flex; align-items: center; gap: 14px; }
.pill { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 13px; border-radius: 99px; box-shadow: inset 0 0 0 1.5px currentColor; font: 700 .86rem/1 var(--text); letter-spacing: .02em; text-decoration: none; white-space: nowrap; }
.pill__dot { width: 9px; height: 9px; border-radius: 50%; background: currentColor; opacity: .55; }
.pill.is-open .pill__dot { background: #6ee39a; opacity: 1; box-shadow: 0 0 0 3px rgba(110, 227, 154, .25); }
.lang { display: flex; border-radius: 6px; box-shadow: inset 0 0 0 1.5px currentColor; overflow: hidden; }
.lang button { border: 0; background: none; padding: 0 10px; height: 34px; min-width: 38px; font: 700 .82rem/1 var(--text); letter-spacing: .06em; color: inherit; }
.lang button { position: relative; }
.hdr .lang button[aria-pressed="true"] { background: var(--schnee); color: var(--nacht); }
.hdr[data-on="light"] .lang button[aria-pressed="true"], .hdr[data-on="pink"] .lang button[aria-pressed="true"], .hdr[data-on="zirbe"] .lang button[aria-pressed="true"] { background: var(--nacht); color: var(--schnee); }
.lang--menu { justify-self: start; margin-top: 8px; color: var(--schnee); }
.lang--menu button { height: 44px; padding: 0 16px; font-size: .95rem; }
.lang--menu button[aria-pressed="true"] { color: var(--nacht); background: var(--schnee); }
.hdr[data-on="pink"] .hdr__cta { background: var(--nacht); color: var(--schnee); }
.burger { display: none; width: 44px; height: 44px; border: 0; background: none; padding: 0; position: relative; }
.burger i { position: absolute; left: 10px; right: 10px; height: 2.5px; background: currentColor; border-radius: 2px; transition: transform .35s var(--ease); }
.burger i:first-of-type { top: 17px; }
.burger i:last-of-type { top: 25px; }
.burger[aria-expanded="true"] i:first-of-type { transform: translateY(4px) rotate(45deg); }
.burger[aria-expanded="true"] i:last-of-type { transform: translateY(-4px) rotate(-45deg); }

.menu { position: fixed; inset: 0; z-index: 45; background: var(--nacht); color: var(--schnee); padding: calc(var(--hdr) + 16px) var(--g) 28px; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
.menu::-webkit-scrollbar { display: none; }
.menu__nav a { display: grid; grid-template-columns: 1fr; padding: 14px 0; border-bottom: 1px solid rgba(246, 240, 231, .14); text-decoration: none; }
.menu__nav b { font: 900 clamp(3rem, 15vw, 5rem)/.9 var(--display); text-transform: uppercase; }
.menu__nav small { font-size: .95rem; opacity: .7; margin-top: 6px; }
.menu__foot { display: grid; gap: 10px; }
.menu.is-open { animation: menuIn .4s var(--ease) both; }
@keyframes menuIn { from { opacity: 0; transform: translateY(-12px); } }

/* ---------- Hero ---------- */
.hero { position: relative; height: 100vh; height: 100svh; min-height: 560px; overflow: hidden; background: #3a2230; isolation: isolate; }
.hero__stage { position: absolute; inset: 0; cursor: grab; touch-action: pan-y; outline: none; }
.hero__stage:focus-visible { outline: 3px solid var(--zirbe); outline-offset: -6px; }
.hero__stage.is-dragging, .hero__stage .is-dragging { cursor: grabbing; }
.hero__still, .hero__still img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__still img { object-fit: cover; animation: stillIn 1.1s var(--ease) backwards; }
@keyframes stillIn { from { opacity: .01; transform: scale(1.04); } }
.pano { position: absolute; inset: 0; overflow: hidden; opacity: 0; transition: opacity .6s; pointer-events: none; touch-action: pan-y; }
.pano.is-ready { opacity: 1; }
.hero__still { transition: opacity .6s; }
.hero.is-scene .hero__still { opacity: 0; }
.pano__cam { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform-style: preserve-3d; }
.pano__face { position: absolute; width: calc(var(--F) * 2); height: calc(var(--F) * 2); left: calc(var(--F) * -1); top: calc(var(--F) * -1); max-width: none; backface-visibility: hidden; user-select: none; -webkit-user-drag: none; }
.hero__shade { position: absolute; inset: 0; pointer-events: none; background:
  linear-gradient(90deg, rgba(24, 16, 14, .86) 0%, rgba(24, 16, 14, .62) 26%, rgba(24, 16, 14, .12) 50%, rgba(24, 16, 14, 0) 62%),
  linear-gradient(0deg, rgba(24, 16, 14, .55) 0%, rgba(24, 16, 14, 0) 26%); }
.hero__copy { position: absolute; left: var(--g); bottom: clamp(88px, 13vh, 150px); width: min(54vw, 780px); pointer-events: none; }
.hero__copy a { pointer-events: auto; }
.kamm--hero { width: 100%; height: clamp(36px, 5.2vw, 84px); margin-bottom: clamp(10px, 1.4vw, 20px); color: var(--schnee); }
.hero__title { font-family: var(--display); text-transform: uppercase; line-height: .84; letter-spacing: .004em; hyphens: manual; }
.hero__title .t-heavy { display: block; font-weight: 900; font-size: clamp(3.4rem, 8.3vw, 9.6rem); animation: lift 1s var(--ease) backwards; }
.hero__title .t-light { display: block; font-weight: 300; font-size: clamp(2.2rem, 5.1vw, 6rem); color: var(--zirbe); margin-top: .08em; animation: rise 1s var(--ease) .3s backwards; }
@keyframes rise { from { opacity: .01; transform: translateY(26px); } }
@keyframes lift { from { transform: translateY(22px); } }
.hero__lead { margin-top: 18px; font-size: clamp(1rem, 1.25vw, 1.2rem); font-weight: 500; opacity: .92; animation: rise 1s var(--ease) .45s backwards; }
.hero__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; animation: rise 1s var(--ease) .55s backwards; }
.hero .kamm--hero use, .hero .kamm--hero path { animation: draw 2.2s var(--ease) .35s forwards; transition: none; }
@keyframes draw { to { stroke-dashoffset: 0; } }
.hero__ui { position: absolute; right: var(--g); bottom: clamp(28px, 5vh, 52px); display: flex; flex-direction: column; align-items: flex-end; gap: 12px; animation: rise 1s var(--ease) .8s backwards; }
.scene { display: flex; padding: 4px; border-radius: 8px; background: rgba(27, 21, 18, .6); box-shadow: inset 0 0 0 1px rgba(246, 240, 231, .25); }
.scene button { border: 0; background: none; height: 38px; padding: 0 16px; border-radius: 5px; font: 750 1.05rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; color: var(--schnee); transition: background-color .25s, color .25s; }
.scene button[aria-pressed="true"] { background: var(--schnee); color: var(--nacht); }
.hero__hint { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; font-weight: 600; text-shadow: 0 1px 6px rgba(0, 0, 0, .5); transition: opacity .5s; }
.hero__hint .hint360 { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; box-shadow: inset 0 0 0 2px var(--schnee); font-size: .95rem; }
.hero.is-touched .hero__hint { opacity: 0; }

/* ---------- Kapitel ---------- */
.chapter { position: relative; z-index: 2; padding: clamp(64px, 9vw, 140px) var(--g) clamp(72px, 9vw, 140px); }
.edge { position: absolute; left: 0; top: 1px; width: 100%; height: var(--edge); transform: translateY(-100%); pointer-events: none; }
.edge use { fill: var(--sec, var(--nacht)); }
.chapter--bar { --sec: var(--nacht); background: var(--nacht); color: var(--schnee); padding-top: clamp(30px, 4vw, 70px); }
.chapter--berg { --sec: var(--zirbe); background: var(--zirbe); color: var(--nacht); padding-bottom: 0; }
.chapter--party { --sec: var(--pink); background: var(--pink); color: var(--nacht); }
.opener { max-width: var(--max); margin: 0 auto; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: end; gap: clamp(20px, 4vw, 72px); }
.opener--right { grid-template-columns: minmax(0, 1fr) auto; }
.opener--right .opener__word { order: 2; }
.opener__word { position: relative; display: inline-block; font: 900 clamp(7.5rem, 25vw, 25rem)/.76 var(--display); text-transform: uppercase; letter-spacing: -.005em; padding-top: .36em; }
.opener__word span { display: block; }
.kamm--word { position: absolute; left: -3%; width: 106%; top: 0; height: .34em; color: currentColor; }
.chapter--bar .kamm--word { color: var(--zirbe); }
.opener__text { max-width: 36ch; font-size: clamp(1.15rem, 1.65vw, 1.55rem); line-height: 1.42; font-weight: 500; padding-bottom: .4em; }

/* ---------- Nacht / Höhenprofil ---------- */
.nacht { max-width: var(--max); margin: clamp(56px, 7vw, 104px) auto 0; }
.nacht__head { display: block; }
.nacht__status { font-family: var(--display); text-transform: uppercase; line-height: .95; }
.nacht__status b { display: block; font-weight: 850; font-size: clamp(2.4rem, 5.2vw, 5.2rem); }
.nacht__status span { display: block; font-weight: 400; font-size: clamp(1.4rem, 2.4vw, 2.4rem); color: var(--zirbe); margin-top: .1em; }
.profil { position: relative; margin-top: clamp(24px, 3vw, 44px); height: clamp(190px, 25vw, 370px); }
.profil__svg { position: absolute; inset: 0 0 34px; width: 100%; height: calc(100% - 34px); overflow: visible; }
.profil__area { fill: rgba(246, 240, 231, .045); }
.profil__line { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.profil__line--rest { stroke: rgba(246, 240, 231, .32); stroke-width: 2px; stroke-dasharray: .004 .006; }
.profil__line--done { stroke: var(--zirbe); stroke-width: 4px; stroke-dasharray: var(--p, 0) 2; }
.profil__zones { position: absolute; inset: 0 0 34px; pointer-events: none; font: 600 clamp(.95rem, 1.3vw, 1.2rem)/1.2 var(--text); }
.zone { position: absolute; max-width: 18ch; opacity: .8; }
.zone--a { left: 3%; top: 26%; }
.zone--b { right: 1%; top: 2%; text-align: right; }
.profil__ticks { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-between; font: 700 1.1rem/1 var(--display); letter-spacing: .04em; opacity: .7; }
.profil__ticks li { width: 0; display: flex; justify-content: center; }
.profil__ticks li:first-child { justify-content: flex-start; }
.profil__ticks li:last-child { justify-content: flex-end; }
.profil__now { position: absolute; z-index: 2; width: 0; height: 0; }
.now__dot { position: absolute; left: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%; background: var(--zirbe); box-shadow: 0 0 0 6px rgba(227, 168, 98, .25), 0 0 0 2px var(--nacht) inset; }
.now__label { position: absolute; bottom: 20px; left: 0; transform: translateX(-50%); white-space: nowrap; background: var(--zirbe); color: var(--nacht); padding: 7px 11px 6px; border-radius: 6px; font: 800 1.2rem/1 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.now__label small { font-weight: 600; font-size: .9rem; margin-right: 4px; }
.now__label::after { content: ""; position: absolute; left: 50%; bottom: -6px; margin-left: -6px; border: 6px solid transparent; border-bottom: 0; border-top-color: var(--zirbe); }
.profil__now.is-edge-l .now__label { transform: translateX(-14px); }
.profil__now.is-edge-l .now__label::after { left: 14px; }
.profil__now.is-edge-r .now__label { transform: translateX(calc(-100% + 14px)); }
.profil__now.is-edge-r .now__label::after { left: auto; right: 8px; }
.woche { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin-top: clamp(28px, 3.5vw, 48px); }
.woche__day { display: grid; gap: 4px; padding: 14px 12px; border-radius: 6px; background: var(--nacht-2); }
.woche__day b { font: 850 1.5rem/1 var(--display); text-transform: uppercase; }
.woche__day span { font-size: .92rem; opacity: .8; }
.woche__day .sm { display: none; }
.woche__day--zu { background: transparent; box-shadow: inset 0 0 0 1px rgba(246, 240, 231, .16); opacity: .7; }
.woche__day.is-today { background: var(--zirbe); color: var(--nacht); opacity: 1; box-shadow: none; }
.nacht__note { margin-top: 18px; font-size: .98rem; opacity: .8; }
.nacht__note .sep { margin: 0 8px; }

/* ---------- Regal ---------- */
.regal { --rh: 248px; position: relative; margin: clamp(80px, 10vw, 150px) calc(var(--g) * -1) calc(clamp(72px, 9vw, 140px) * -1); padding: clamp(64px, 8vw, 120px) var(--g) clamp(72px, 9vw, 130px); background: var(--schnee); color: var(--nacht); }
.regal > * { max-width: var(--max); margin-left: auto; margin-right: auto; }
.regal__head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px clamp(24px, 5vw, 80px); align-items: end; }
.regal__text { max-width: 52ch; font-size: clamp(1.08rem, 1.4vw, 1.3rem); }
.regal__tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: clamp(28px, 3.4vw, 44px); }
.tab { border: 0; display: inline-flex; align-items: baseline; gap: 8px; height: 44px; padding: 0 16px; border-radius: 6px; background: var(--schnee-2); color: var(--nacht); font: 750 1.15rem/44px var(--display); letter-spacing: .04em; text-transform: uppercase; transition: background-color .25s, color .25s; }
.tab small { font: 700 .8rem/1 var(--text); opacity: .65; }
.tab:hover { background: #e2d5c3; }
.tab[aria-selected="true"] { background: var(--nacht); color: var(--schnee); }
.regal__shelf { position: relative; margin-top: 22px; display: flex; flex-wrap: wrap; align-items: flex-end; align-content: flex-start; column-gap: 7px; min-height: calc(var(--rh) * 2); padding: 0 6px; background: repeating-linear-gradient(to bottom, transparent 0 calc(var(--rh) - 12px), var(--holz) calc(var(--rh) - 12px) calc(var(--rh) - 2px), #ea86b5 calc(var(--rh) - 2px) var(--rh)); }
.flasche { --c: var(--nacht); --t: var(--schnee); position: relative; height: calc(var(--rh) - 12px); display: flex; flex-direction: column; align-items: center; justify-content: flex-end; margin-bottom: 12px; }
.flasche i { display: block; width: 44%; min-width: 14px; height: 24px; background: var(--c); border-radius: 3px 3px 0 0; box-shadow: inset 2px 0 0 rgba(255, 255, 255, .16); }
.flasche i::before { content: ""; display: block; width: 116%; margin-left: -8%; height: 7px; border-radius: 2px; background: var(--k, var(--holz)); }
.flasche span { writing-mode: vertical-rl; transform: rotate(180deg); max-height: calc(var(--rh) - 64px); padding: 14px 9px; border-radius: 4px 4px 13px 13px; background: var(--c); color: var(--t); font: 750 1.08rem/1.05 var(--display); letter-spacing: .05em; text-transform: uppercase; text-align: left; box-shadow: inset -3px 0 0 rgba(255, 255, 255, .16), inset 4px 0 0 rgba(0, 0, 0, .12); }
.regal__shelf.is-in .flasche { animation: stand .55s var(--ease) backwards; animation-delay: calc(var(--i) * 18ms); }
@keyframes stand { from { opacity: .01; transform: translateY(14px); } }
.regal__fine { margin-top: 14px; font-size: .9rem; opacity: .7; }
.regal__extra { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 64px); align-items: end; margin-top: clamp(56px, 7vw, 110px); }
.regal__photo img { width: 100%; border-radius: 6px; aspect-ratio: 4 / 5; object-fit: cover; }
.regal__blurb h4 { font: 850 clamp(2rem, 3.2vw, 3rem)/.9 var(--display); text-transform: uppercase; margin-bottom: 12px; }
.regal__blurb p { max-width: 40ch; }

/* ---------- Berg / Hütte ---------- */
.chapter--berg .opener__text { font-weight: 500; }
.huette { max-width: var(--max); margin: clamp(48px, 7vw, 110px) auto 0; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); grid-template-areas: "bar stube" "bar lounge" "fakten fakten"; gap: clamp(14px, 1.6vw, 24px); }
.raum { position: relative; margin: 0; overflow: hidden; border-radius: 6px; background: var(--holz); }
.raum img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.raum:hover img { transform: scale(1.03); }
.raum--bar { grid-area: bar; -webkit-mask: url("../assets/img/kamm-mask.svg") top / 100% 16% no-repeat, linear-gradient(#000 0 0) bottom / 100% 84.4% no-repeat; mask: url("../assets/img/kamm-mask.svg") top / 100% 16% no-repeat, linear-gradient(#000 0 0) bottom / 100% 84.4% no-repeat; border-radius: 0 0 6px 6px; }
.raum--bar img { aspect-ratio: auto; min-height: 100%; }
.raum--stube { grid-area: stube; }
.raum--lounge { grid-area: lounge; }
.raum--stube img, .raum--lounge img { aspect-ratio: 3 / 2; }
.raum figcaption { position: absolute; left: 0; bottom: 0; right: 0; padding: 40px 18px 16px; background: linear-gradient(transparent, rgba(20, 13, 11, .75)); color: var(--schnee); display: grid; gap: 2px; }
.raum figcaption b { font: 850 clamp(1.7rem, 2.6vw, 2.6rem)/.95 var(--display); text-transform: uppercase; }
.raum figcaption span { font-size: .95rem; opacity: .9; }
.fakten { grid-area: fakten; display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; align-items: center; gap: clamp(16px, 3vw, 52px); padding: clamp(24px, 3vw, 40px) 0 clamp(56px, 7vw, 100px); border-top: 2px solid var(--nacht); margin-top: clamp(14px, 2vw, 30px); }
.fakten__big { display: grid; line-height: .9; }
.fakten__big b { font: 900 clamp(4.4rem, 9vw, 9rem)/.8 var(--display); }
.fakten__big span { font: 700 1rem/1.2 var(--text); margin-top: 8px; }
.fakten__list { columns: 2; column-gap: 32px; font-weight: 500; }
.fakten__list li { break-inside: avoid; padding: 5px 0 5px 22px; position: relative; }
.fakten__list li::before { content: ""; position: absolute; left: 0; top: .78em; width: 12px; height: 2px; background: var(--nacht); }

.garten { position: relative; margin: 0 calc(var(--g) * -1); padding: clamp(64px, 8vw, 120px) var(--g) clamp(72px, 10vw, 150px); background: var(--schnee); color: var(--nacht); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(28px, 5vw, 90px); align-items: center; }
.garten > * { max-width: 720px; }
.garten__text { justify-self: end; }
.garten__lead { font: 800 clamp(1.7rem, 2.6vw, 2.5rem)/1.02 var(--display); text-transform: uppercase; margin: 14px 0 18px; color: var(--holz); }
.garten__text p + p { margin-top: 12px; }
.garten__pics { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: 14px; }
.garten__pics img { width: 100%; border-radius: 6px; object-fit: cover; }
.garten__pics .g1 { aspect-ratio: 3 / 4; }
.garten__pics .g2 { aspect-ratio: 3 / 4; margin-top: 48px; }
.garten__pics .g3 { grid-column: 1 / -1; aspect-ratio: 16 / 8; object-position: 50% 82%; }

/* ---------- Party ---------- */
.chapter--party { padding-bottom: 0; }
.statement { max-width: var(--max); margin: clamp(56px, 8vw, 120px) auto 0; }
.statement__big { font: 900 clamp(3.1rem, 9.4vw, 10.5rem)/.84 var(--display); text-transform: uppercase; }
.statement__big span { display: block; }
.statement__big span + span { color: var(--schnee); }
.statement__sub { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-top: 22px; font: 800 clamp(1.5rem, 2.8vw, 2.7rem)/1 var(--display); text-transform: uppercase; }
.statement__sub small { font: 700 .95rem/1 var(--text); text-transform: none; padding: 6px 10px; border-radius: 5px; background: var(--nacht); color: var(--schnee); }
.busserl { position: relative; margin: clamp(48px, 7vw, 110px) calc(var(--g) * -1) 0; }
.busserl img { width: 100%; aspect-ratio: 1800 / 740; object-fit: cover; }
.busserl figcaption { position: absolute; left: var(--g); bottom: 0; transform: translateY(42%); max-width: 30ch; padding: 18px 20px; border-radius: 6px; background: var(--nacht); color: var(--schnee); font: 750 clamp(1.25rem, 1.9vw, 1.8rem)/1.08 var(--display); text-transform: uppercase; letter-spacing: .01em; }
.fotos { max-width: var(--max); margin: clamp(96px, 11vw, 170px) auto 0; }
.fotos__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: 12px 40px; }
.fotos__head p { max-width: 40ch; font-weight: 500; }
.fotos__strip { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(250px, 30vw, 420px); gap: 14px; margin: 24px calc(var(--g) * -1) 0; padding: 0 var(--g) 10px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 var(--g); scrollbar-width: thin; scrollbar-color: var(--nacht) transparent; }
.fotos__strip li { scroll-snap-align: start; }
.foto { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 6px; overflow: hidden; background: var(--nacht); text-align: left; }
.foto img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .8s var(--ease), opacity .3s; }
.foto:hover img { transform: scale(1.04); }
.foto span { position: absolute; left: 10px; bottom: 10px; padding: 7px 11px 6px; border-radius: 5px; background: var(--schnee); color: var(--nacht); font: 800 1.15rem/1 var(--display); letter-spacing: .04em; text-transform: uppercase; }
.foto span::after { content: " →"; }

/* ---------- Feier-Planer ---------- */
.planer { max-width: var(--max); margin: clamp(64px, 9vw, 140px) auto 0; padding-bottom: clamp(72px, 9vw, 140px); }
.planer__intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 16px clamp(24px, 5vw, 80px); align-items: end; }
.planer__intro .eyebrow { grid-column: 1 / -1; margin-bottom: -4px; }
.planer__intro p:last-child { font-size: clamp(1.05rem, 1.35vw, 1.25rem); font-weight: 500; max-width: 46ch; }
.planer__form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); grid-template-areas: "anlass result" "pers result" "datum result" "kontakt kontakt"; gap: 0 clamp(24px, 4vw, 64px); margin-top: clamp(32px, 4vw, 56px); }
.pf { border: 0; margin: 0; padding: 22px 0; border-top: 2px solid var(--nacht); min-width: 0; }
.pf legend { float: left; width: 100%; display: flex; justify-content: space-between; align-items: baseline; padding: 0; margin-bottom: 14px; font: 850 1.65rem/1 var(--display); text-transform: uppercase; letter-spacing: .02em; }
.pf legend + * { clear: both; }
.pf--anlass { grid-area: anlass; }
.pf--pers { grid-area: pers; }
.pf--datum { grid-area: datum; }
.pf--kontakt { grid-area: kontakt; margin-top: clamp(24px, 3vw, 40px); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; }
.chip input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chip span { display: inline-flex; align-items: center; height: 44px; padding: 0 16px; border-radius: 6px; box-shadow: inset 0 0 0 2px var(--nacht); font: 750 1.15rem/1 var(--display); letter-spacing: .04em; text-transform: uppercase; transition: background-color .2s, color .2s; }
.chip input:checked + span { background: var(--nacht); color: var(--schnee); }
.chip input:focus-visible + span { outline: 3px solid var(--schnee); outline-offset: 2px; }
.pers__out { font: 900 3.4rem/.8 var(--display); }
.kammregler { position: relative; height: 150px; margin: 6px 0 4px; touch-action: pan-y; }
.kammregler__svg { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100px; overflow: visible; }
.kr__track { fill: none; stroke: rgba(27, 21, 18, .32); stroke-width: 3px; stroke-dasharray: .006 .008; }
.kr__fill { fill: none; stroke: var(--nacht); stroke-width: 5px; stroke-linecap: round; stroke-dasharray: var(--p, 0) 2; }
.kr__knob { position: absolute; left: 0; top: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; border-radius: 50%; background: var(--nacht); box-shadow: 0 0 0 4px var(--schnee); pointer-events: none; transition: box-shadow .2s; }
.kr__knob::after { content: ""; position: absolute; inset: 10px; background: var(--schnee); -webkit-mask: url("../assets/img/huette.svg") center/contain no-repeat; mask: url("../assets/img/huette.svg") center/contain no-repeat; }
.kammregler.is-active .kr__knob { box-shadow: 0 0 0 6px var(--schnee), 0 0 0 12px rgba(27, 21, 18, .2); }
.kr__input { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 100px; margin: 0; opacity: 0; cursor: grab; }
.kr__input:focus-visible ~ .kr__knob, .kammregler:focus-within .kr__knob { box-shadow: 0 0 0 4px var(--schnee), 0 0 0 8px var(--nacht); }
.kr__stops { position: absolute; left: 0; right: 0; top: 108px; height: 40px; }
.kr__stop { position: absolute; transform: translateX(-50%); display: grid; justify-items: center; line-height: 1; white-space: nowrap; }
.kr__stop::before { content: ""; position: absolute; bottom: calc(100% + 4px); left: 50%; width: 2px; height: 10px; background: currentColor; }
.kr__stop b { font: 850 1.1rem/1 var(--display); }
.kr__stop small { font-size: .78rem; font-weight: 700; margin-top: 3px; }
.kr__stop b { padding: 3px 5px 2px; border-radius: 4px; transition: background-color .25s, color .25s; }
.kr__stop.is-on b { background: var(--nacht); color: var(--pink); }
.pers__step { display: none; gap: 8px; }
.pers__step button { width: 52px; height: 44px; border: 0; border-radius: 6px; background: var(--nacht); color: var(--schnee); font: 800 1.6rem/1 var(--display); }
.field { width: 100%; min-height: 52px; padding: 12px 14px; border: 0; border-radius: 6px; background: var(--schnee); color: var(--nacht); box-shadow: inset 0 0 0 2px transparent; font-size: 1.05rem; transition: box-shadow .2s; }
.field:focus { outline: none; box-shadow: inset 0 0 0 3px var(--nacht); }
textarea.field { resize: vertical; min-height: 92px; }
input[type="date"].field { max-width: 300px; font-weight: 600; }
.pf__hint { margin-top: 10px; font-weight: 600; font-size: .98rem; }
.pf__hint.is-warn { background: var(--nacht); color: var(--schnee); padding: 8px 12px; border-radius: 6px; display: inline-block; }
.planer__result { grid-area: result; align-self: start; margin-top: 22px; padding: clamp(18px, 2vw, 28px); border-radius: 8px; background: var(--nacht); color: var(--schnee); display: grid; gap: 22px; }
.res__label { font: 700 .8rem/1 var(--text); letter-spacing: .16em; text-transform: uppercase; opacity: .7; }
.res__zone { font: 850 clamp(1.9rem, 3vw, 2.9rem)/.95 var(--display); text-transform: uppercase; margin: 6px 0 14px; color: var(--zirbe); }
.plan { width: 100%; height: auto; }
.plan__wall { fill: none; stroke: rgba(246, 240, 231, .4); stroke-width: 3; }
.plan__fix rect { fill: rgba(246, 240, 231, .16); }
.plan__bench { fill: rgba(246, 240, 231, .16); }
.plan__labels text { fill: rgba(246, 240, 231, .5); font: 700 22px/1 var(--display); letter-spacing: .12em; text-transform: uppercase; }
.plan__names text { fill: rgba(246, 240, 231, .55); font: 800 22px/1 var(--display); text-anchor: middle; pointer-events: none; transition: fill .3s; }
.plan .t { fill: transparent; stroke: rgba(246, 240, 231, .55); stroke-width: 2.5; transition: fill .35s, stroke .35s; }
.plan .s, .plan .s rect { fill: rgba(246, 240, 231, .22); transition: fill .35s; }
.plan .is-sel .t, .plan .t.is-sel { fill: var(--pink); stroke: var(--pink); }
.plan .is-sel .s rect, .plan .s.is-sel { fill: var(--pink-2); }
.plan__names text.is-sel { fill: var(--nacht); }
.res__garten { margin-top: 10px; font-weight: 700; color: var(--zirbe); }
.perks { display: grid; gap: 9px; margin-top: 10px; }
.perks li { position: relative; padding-left: 30px; font-weight: 600; line-height: 1.35; transition: opacity .3s; }
.perks li::before { content: ""; position: absolute; left: 0; top: .1em; width: 20px; height: 20px; border-radius: 50%; background: var(--pink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%231b1512' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat; }
.perks li.is-locked { color: rgba(246, 240, 231, .74); }
.perks li.is-locked::before { background: transparent; box-shadow: inset 0 0 0 2px rgba(246, 240, 231, .5); }
.perks li small { display: block; font-weight: 500; font-size: .88rem; }
.perks li.is-cond::before { background: var(--zirbe) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5.5v6M10 14.2v.3' fill='none' stroke='%231b1512' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% no-repeat; }
.res__fine { margin-top: 14px; font-size: .86rem; opacity: .7; }
.fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.fl { display: grid; gap: 6px; font-weight: 700; font-size: .95rem; }
.fl--wide { grid-column: 1 / -1; }
.pf__err { margin-top: 14px; padding: 10px 14px; border-radius: 6px; background: var(--nacht); color: var(--schnee); font-weight: 600; }
.pf--kontakt .btn { margin-top: 18px; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pf__err a { color: inherit; font-weight: 700; }
.only-live { display: none; }
.is-live .only-live { display: inline; }
.is-live .only-pitch, .is-live .pf__demo, .is-live .pass__demo { display: none; }
.pf__demo { margin-top: 10px; font-size: .9rem; font-weight: 600; }

.pass { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: center; margin-top: clamp(32px, 4vw, 56px); outline: none; }
.pass__card { --notch: 18px; position: relative; padding: 26px 28px 22px; border-radius: 12px; background: var(--nacht); color: var(--schnee); -webkit-mask: radial-gradient(circle var(--notch) at 0 62%, transparent 98%, #000) , radial-gradient(circle var(--notch) at 100% 62%, transparent 98%, #000); -webkit-mask-composite: source-in; mask: radial-gradient(circle var(--notch) at 0 62%, transparent 98%, #000), radial-gradient(circle var(--notch) at 100% 62%, transparent 98%, #000); mask-composite: intersect; animation: passIn .9s var(--ease) both; }
@keyframes passIn { from { opacity: .01; transform: translateY(40px) rotate(-3deg); } to { transform: rotate(-1.2deg); } }
.pass__top { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.pass__logo { width: 140px; fill: var(--schnee); }
.pass__kind { font: 850 1.5rem/1 var(--display); text-transform: uppercase; letter-spacing: .08em; color: var(--pink); }
.pass__kamm { width: 100%; height: 44px; margin: 18px 0 10px; color: var(--zirbe); }
.pass__kamm use, .pass__kamm path { fill: none; stroke: currentColor; stroke-width: 2.5px; }
.pass__data { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; padding-bottom: 18px; border-bottom: 2px dashed rgba(246, 240, 231, .3); }
.pass__data dt { font: 700 .74rem/1 var(--text); letter-spacing: .14em; text-transform: uppercase; opacity: .65; }
.pass__data dd { font: 850 1.6rem/1 var(--display); text-transform: uppercase; margin-top: 5px; }
.pass__no { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; margin-top: 14px; font-size: .9rem; }
.pass__no b { font: 800 1.3rem/1 var(--display); letter-spacing: .08em; }
.pass__addr { margin-left: auto; opacity: .7; }
.pass__text h4 { font: 900 clamp(2rem, 3.4vw, 3.2rem)/.92 var(--display); text-transform: uppercase; margin-bottom: 14px; }
.pass__text p { max-width: 44ch; font-weight: 500; }
.pass__demo { margin-top: 12px; font-weight: 700 !important; }
.pass__text .btn { margin-top: 22px; }

/* ---------- Kalender ---------- */
.kalender { position: relative; z-index: 2; padding: clamp(72px, 9vw, 140px) var(--g); background: var(--nacht); }
.kalender__head, .events { max-width: var(--max); margin: 0 auto; }
.kalender__head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px clamp(24px, 5vw, 80px); align-items: end; }
.kalender__head .beispiel { grid-column: 2; }
.beispiel { display: inline-flex; justify-self: start; padding: 6px 10px; border-radius: 5px; background: var(--nacht-3); font-size: .86rem; font-weight: 600; }
.events { margin-top: clamp(36px, 5vw, 64px); border-top: 1px solid rgba(246, 240, 231, .2); }
.ev { display: grid; grid-template-columns: 110px minmax(0, 1fr) minmax(0, .9fr) auto; gap: 8px clamp(16px, 3vw, 48px); align-items: center; padding: clamp(18px, 2.2vw, 28px) 0; border-bottom: 1px solid rgba(246, 240, 231, .2); }
.ev__date { display: grid; line-height: .85; }
.ev__date b { font: 900 3.4rem/.8 var(--display); }
.ev__date span { font: 700 .95rem/1 var(--display); letter-spacing: .1em; text-transform: uppercase; margin-top: 6px; color: var(--zirbe); }
.ev__title { font: 850 clamp(1.9rem, 3.6vw, 3.6rem)/.92 var(--display); text-transform: uppercase; }
.ev__info { opacity: .85; max-width: 46ch; }
.ev__go { font: 750 1.05rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; text-decoration: none; padding: 12px 14px; border-radius: 6px; box-shadow: inset 0 0 0 1.5px rgba(246, 240, 231, .5); white-space: nowrap; transition: background-color .25s, color .25s; }
.ev__go:hover { background: var(--pink); color: var(--nacht); box-shadow: none; }

/* ---------- FAQ ---------- */
.faq { position: relative; z-index: 2; padding: clamp(72px, 9vw, 140px) var(--g) calc(clamp(72px, 9vw, 140px) + var(--edge)); background: var(--schnee); color: var(--nacht); display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(28px, 5vw, 90px); }
.faq > * { max-width: 860px; }
.faq__head { justify-self: end; align-self: start; position: sticky; top: calc(var(--hdr) + 28px); }
.faq__head p { margin-top: 14px; font-weight: 500; }
.faq__list details { border-top: 2px solid var(--nacht); }
.faq__list details:last-child { border-bottom: 2px solid var(--nacht); }
.faq__list summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) 32px; gap: 16px; align-items: center; padding: 20px 0; font: 800 clamp(1.35rem, 2vw, 1.85rem)/1.05 var(--display); text-transform: uppercase; letter-spacing: .01em; }
.faq__list summary::-webkit-details-marker { display: none; }
.faq__list summary::after { content: ""; width: 32px; height: 32px; border-radius: 50%; background: var(--nacht) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 10v12M10 16h12' stroke='%23f6f0e7' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% no-repeat; transition: transform .3s var(--ease); }
.faq__list details[open] summary::after { transform: rotate(45deg); background-color: var(--pink); }
.faq__list details > div { padding: 0 48px 24px 0; }
.faq__list details[open] > div { animation: faqIn .45s var(--ease); }
@keyframes faqIn { from { opacity: 0; transform: translateY(-6px); } }

/* ---------- Anfahrt ---------- */
.anfahrt { position: relative; z-index: 3; padding: clamp(40px, 5vw, 80px) var(--g) clamp(72px, 9vw, 130px); background: var(--nacht); display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 72px); align-items: start; --sec: var(--nacht); }
.anfahrt__map { position: relative; border-radius: 8px; overflow: hidden; background: var(--nacht-2); }
.anfahrt__map > svg { width: 100%; height: auto; }
.map__pin { position: absolute; transform: translate(-50%, -100%); display: grid; justify-items: center; gap: 4px; pointer-events: none; }
.map__pin svg { width: 74px; fill: var(--schnee); filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .6)); }
.map__pin b { padding: 5px 9px 4px; border-radius: 5px; background: var(--pink); color: var(--nacht); font: 850 1rem/1 var(--display); letter-spacing: .06em; text-transform: uppercase; }
.map__pin::after { content: ""; width: 12px; height: 12px; border-radius: 50%; background: var(--pink); box-shadow: 0 0 0 4px rgba(226, 80, 143, .35); margin-bottom: -6px; }
.anfahrt__map .map__svg--tall { display: none; }
.anfahrt__map .m-street { fill: none; stroke: #4f3e33; stroke-width: 2.2; }
.anfahrt__map .m-major { fill: none; stroke: #8a6748; stroke-width: 5; }
.anfahrt__map .m-rail { fill: none; stroke: #5d4b40; stroke-width: 1.4; stroke-dasharray: 4 4; }
.anfahrt__map .m-water { fill: #22323c; stroke: none; }
.anfahrt__map .m-park { fill: #24301f; stroke: none; }
.anfahrt__map .m-route { fill: none; stroke: var(--pink); stroke-width: 4.5; stroke-linecap: round; stroke-dasharray: .1 9; transition: stroke .25s, stroke-width .25s; }
.anfahrt__map .m-route.is-hi { stroke: var(--zirbe); stroke-width: 6; }
.anfahrt__map .m-label { fill: rgba(246, 240, 231, .78); stroke: var(--nacht-2); stroke-width: 4px; paint-order: stroke; font-family: var(--text); font-weight: 600; }
.anfahrt__map .m-wlabel { fill: #8fb0c4; stroke: #22323c; stroke-width: 3px; paint-order: stroke; font-family: var(--text); font-weight: 600; }
.anfahrt__map .m-stop { fill: var(--schnee); font-family: var(--text); font-weight: 700; }
.anfahrt__map .m-stop text { stroke: var(--nacht-2); stroke-width: 4px; paint-order: stroke; }
.anfahrt__map .m-pin { display: none; }
.anfahrt__map .m-attr { fill: rgba(246, 240, 231, .5); font-family: var(--text); }
.anfahrt__info .h2 { margin-bottom: 18px; }
.anfahrt__addr { font: 800 clamp(1.6rem, 2.4vw, 2.3rem)/1.02 var(--display); text-transform: uppercase; margin-bottom: 12px; color: var(--zirbe); }
.wege { display: grid; gap: 8px; margin: 20px 0 26px; }
.weg { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; padding: 12px 14px; border: 0; border-radius: 6px; background: var(--nacht-2); color: var(--schnee); text-align: left; transition: background-color .25s; }
.weg:hover, .weg.is-hi { background: var(--nacht-3); }
.weg__line { display: inline-grid; place-items: center; min-width: 38px; height: 30px; padding: 0 8px; border-radius: 5px; background: #8a5aa8; color: #fff; font: 800 1rem/1 var(--display); letter-spacing: .04em; }
.weg__line--s { background: #1f73b7; }
.weg b { font-weight: 700; }
.weg small { display: block; opacity: .7; font-size: .85rem; }
.weg__min { font: 850 1.5rem/1 var(--display); }
.kontakt { padding: 20px 0; border-top: 1px solid rgba(246, 240, 231, .2); border-bottom: 1px solid rgba(246, 240, 231, .2); }
.kontakt__big { display: inline-block; font: 900 clamp(2.4rem, 4.4vw, 4rem)/.9 var(--display); text-decoration: none; letter-spacing: .01em; }
.kontakt__small { font-size: .92rem; opacity: .75; margin: 6px 0 10px; }
.kontakt__mail { font-weight: 700; font-size: 1.1rem; }
.infos { display: grid; gap: 14px; margin-top: 22px; }
.infos dt { font: 700 .76rem/1 var(--text); letter-spacing: .14em; text-transform: uppercase; opacity: .65; margin-bottom: 4px; }

/* ---------- Footer ---------- */
.ftr { position: relative; z-index: 3; padding: clamp(48px, 6vw, 90px) var(--g) 110px; background: #120e0c; color: var(--schnee); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 32px clamp(28px, 5vw, 90px); }
.ftr__logo { width: min(320px, 70%); fill: var(--schnee); }
.ftr__claim { margin-top: 16px; font: 800 1.6rem/1 var(--display); letter-spacing: .14em; text-transform: uppercase; color: var(--zirbe); }
.ftr__cols { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; font-size: .95rem; line-height: 1.6; }
.ftr h3 { font: 800 1.2rem/1 var(--display); letter-spacing: .08em; text-transform: uppercase; margin-bottom: 10px; }
.ftr h3 + p + h3 { margin-top: 22px; }
.ftr__cols p { opacity: .82; }
.ftr__fine { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 22px; padding-top: 22px; border-top: 1px solid rgba(246, 240, 231, .14); font-size: .85rem; opacity: .6; }

/* ---------- Dock ---------- */
.dock { display: none; }

/* ---------- Reveals ---------- */
.rv { opacity: 0; transform: translateY(26px); transition: opacity .8s var(--ease), transform .9s var(--ease); }
.rv.rv-in { opacity: 1; transform: none; }

/* ---------- Responsiv ---------- */
@media (max-width: 1180px) {
  .hdr__more { display: none; }
  .fakten { grid-template-columns: auto auto; }
  .fakten__list { grid-column: 1 / -1; }
  .fakten .btn { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 980px) {
  :root { --hdr: 62px; }
  .hdr { grid-template-columns: auto 1fr auto; gap: 10px; }
  .hdr__nav, .lang, .hdr__cta { display: none; }
  .hdr__right { justify-self: end; gap: 6px; }
  .burger { display: block; }
  .menu .lang { display: flex; }
  .opener, .opener--right { grid-template-columns: 1fr; gap: 18px; }
  .opener--right .opener__word { order: 0; }
  .regal__head, .kalender__head, .planer__intro { grid-template-columns: 1fr; }
  .kalender__head .beispiel { grid-column: 1; }
  .regal__extra { grid-template-columns: 1fr 1fr; }
  .regal__photo { grid-column: 1 / -1; max-width: 420px; }
  .huette { grid-template-columns: 1fr; grid-template-areas: "bar" "stube" "lounge" "fakten"; }
  .raum--bar img { aspect-ratio: 4 / 3; }
  .garten { grid-template-columns: 1fr; }
  .garten__text { justify-self: start; }
  .planer__form { grid-template-columns: 1fr; grid-template-areas: "anlass" "pers" "datum" "result" "kontakt"; }
  .planer__result { position: static; margin-top: 8px; }
  .fields { grid-template-columns: 1fr; }
  .pass { grid-template-columns: 1fr; }
  .ev { grid-template-columns: 76px minmax(0, 1fr); }
  .ev__info { grid-column: 2; }
  .ev__go { grid-column: 2; justify-self: start; }
  .ev__date b { font-size: 2.6rem; }
  .faq { grid-template-columns: 1fr; }
  .faq__head { position: static; justify-self: start; }
  .anfahrt { grid-template-columns: 1fr; }
  .anfahrt__map .map__svg--wide { display: none; }
  .anfahrt__map .map__svg--tall { display: block; }
  .ftr { grid-template-columns: 1fr; }
  .dock { position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); z-index: 40; display: grid; grid-template-columns: auto 1fr; gap: 8px; transform: translateY(150%); transition: transform .45s var(--ease); }
  .dock.is-on { transform: none; }
  .dock a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 54px; border-radius: 8px; font: 800 1.2rem/1 var(--display); letter-spacing: .05em; text-transform: uppercase; text-decoration: none; box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
  .dock__tel { padding: 0 18px; background: var(--nacht); color: var(--schnee); box-shadow: inset 0 0 0 1.5px rgba(246, 240, 231, .35), 0 8px 24px rgba(0, 0, 0, .35) !important; }
  .dock__cta { background: var(--pink); color: var(--nacht); }
}
@media (max-width: 980px) and (orientation: portrait), (max-width: 640px) {
  .hero__shade { background:
    linear-gradient(180deg, rgba(24, 16, 14, .9) 0%, rgba(24, 16, 14, .62) 26%, rgba(24, 16, 14, 0) 46%),
    linear-gradient(0deg, rgba(24, 16, 14, .82) 0%, rgba(24, 16, 14, .35) 22%, rgba(24, 16, 14, 0) 36%); }
  .hero__copy { position: absolute; top: calc(var(--hdr) + 8px); bottom: auto; left: var(--g); right: var(--g); width: auto; }
  .kamm--hero { height: 30px; margin-bottom: 8px; }
  .hero__title .t-heavy { font-size: clamp(3rem, 15.5vw, 6rem); }
  .hero__title .t-light { font-size: clamp(1.9rem, 9.4vw, 3.6rem); }
  .hero__lead { margin-top: 10px; font-size: .95rem; }
  .hero__cta { position: fixed; display: none; }
  .hero__ui { left: var(--g); right: var(--g); bottom: calc(84px + env(safe-area-inset-bottom)); flex-direction: row; justify-content: space-between; align-items: center; }
  .hero__hint { font-size: .85rem; }
}
@media (max-width: 640px) {
  body { font-size: 1rem; }
  .pill { height: 32px; padding: 0 11px; font-size: .8rem; }
  .opener__word { font-size: clamp(6.6rem, 37vw, 12rem); }
  .woche { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
  .woche__day { padding: 10px 4px; text-align: center; justify-items: center; }
  .woche__day b { font-size: 1.15rem; }
  .woche__day span { font-size: .68rem; }
  .woche__day .lg { display: none; }
  .woche__day .sm { display: inline; }
  .kr__stop[data-at="40"] { top: 22px; }
  .kr__stop[data-at="40"]::before { height: 32px; }
  .zone--a { left: 0; top: 34%; max-width: 12ch; }
  .zone--b { top: -6%; max-width: 15ch; }
  .profil { height: 210px; }
  .profil__ticks { font-size: .9rem; }
  .profil__ticks li:nth-child(even) { visibility: hidden; }
  .regal { --rh: 214px; }
  .flasche span { font-size: .96rem; padding: 12px 7px; }
  .regal__extra { grid-template-columns: 1fr; }
  .fakten__list { columns: 1; }
  .garten__pics .g2 { margin-top: 28px; }
  .busserl img { aspect-ratio: 4 / 3; object-position: 52% 50%; }
  .busserl figcaption { position: relative; left: auto; bottom: auto; margin: -30px var(--g) 0; }
  .kammregler { height: 140px; }
  .pers__step { display: flex; justify-content: flex-end; margin-top: -6px; }
  .pass__data dd { font-size: 1.3rem; }
  .pass__addr { margin-left: 0; }
  .ftr__cols { grid-template-columns: 1fr; }
}
@media (pointer: coarse) {
  .kr__input { pointer-events: none; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  .kamm use, .kamm path { stroke-dashoffset: 0; }
  .rv { opacity: 1; transform: none; }
}