/* Petzen-Nest – Website
   Tokens 1:1 aus dem Designsystem „Petzen-Nest“ (claude.ai/design, Projekt 7ccbb272…),
   Komponenten aus ui_kits/website als statisches CSS nachgebaut. Schriften lokal (DSGVO). */
@import url("../fonts/fonts.css");

/* ---------- Tokens: Farben ---------- */
:root{
  --forest-50:#F1F4ED; --forest-100:#E1E7DA; --forest-200:#BFCBB6; --forest-300:#93A588; --forest-400:#6B8160;
  --forest-500:#4B623E; --forest-600:#3F5436; --forest-700:#34452D; --forest-800:#2A3824; --forest-900:#1F2A1B;
  --straw-100:#F8EBD2; --straw-300:#EDCD93; --straw-500:#E0B05E; --straw-700:#9A7330;
  --bark-100:#EDE0D1; --bark-300:#C6A584; --bark-500:#9C7249; --bark-700:#6E4F31;
  --slate-100:#E3E2DD; --slate-300:#A3A8A6; --slate-500:#5E6668; --slate-700:#3A4143; --slate-900:#22282A;
  --snow:#FBF8F2; --cream:#F5F0E6; --linen:#EBE3D4;

  --bg:var(--cream); --bg-alt:var(--linen); --surface:var(--snow); --surface-dark:var(--forest-800); --surface-deep:var(--forest-900);
  --fg:var(--slate-900); --fg-muted:var(--slate-500); --fg-subtle:var(--slate-300);
  --fg-on-dark:var(--snow); --fg-on-dark-muted:var(--forest-200);
  --accent:var(--forest-500); --accent-hover:var(--forest-600); --accent-press:var(--forest-700);
  --accent-warm:var(--straw-500); --accent-warm-ink:var(--straw-700);
  --border:#D9D0BF; --border-soft:#E7E0D3; --border-strong:#B9AD98; --border-on-dark:rgba(251,248,242,.22);
  --overlay-hero:rgba(31,42,27,.38);
  --focus-ring:0 0 0 3px rgba(224,176,94,.55);
  --danger:#A4533A;
}
/* ---------- Tokens: Typografie ---------- */
:root{
  --font-display:"Newsreader", Georgia, serif;
  --font-sans:"Montserrat", "Helvetica Neue", Arial, sans-serif;
  --fs-display:clamp(56px, 8vw, 112px); --fs-h1:clamp(44px,5.5vw,72px); --fs-h2:clamp(34px,4vw,52px); --fs-h3:32px; --fs-h4:24px;
  --fs-lead:20px; --fs-body:16px; --fs-sm:14px; --fs-xs:12px; --fs-eyebrow:11px;
  --lh-tight:1.04; --lh-snug:1.2; --lh-body:1.7;
  --ls-display:-0.015em; --ls-ui:0.06em; --ls-eyebrow:0.24em;
}
/* ---------- Tokens: Abstände, Radien, Schatten, Bewegung ---------- */
:root{
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px; --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px; --space-11:160px;
  --maxw-content:1200px; --maxw-wide:1440px; --maxw-prose:620px;
  --radius-sm:2px; --radius-md:4px; --radius-lg:10px; --radius-pill:999px; --radius-arch:999px 999px 0 0;
  --shadow-lg:0 24px 60px rgba(31,42,27,.18);
  --ease-out:cubic-bezier(0.22, 1, 0.36, 1); --ease:cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast:180ms; --dur-normal:320ms; --dur-slow:700ms;
  --header-h:88px;
  --gutter:40px;
}
@media (max-width:820px){ :root{ --gutter:20px; } }

/* ---------- Basis ---------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:72px}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--font-sans);font-size:var(--fs-body);line-height:var(--lh-body);-webkit-font-smoothing:antialiased}
body{overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:300;letter-spacing:var(--ls-display);line-height:var(--lh-snug);text-wrap:balance;margin:0}
p{text-wrap:pretty;margin:0}
a{color:var(--forest-600);text-decoration:none;transition:color var(--dur-fast) var(--ease)}
a:hover{color:var(--forest-800)}
img{display:block;max-width:100%}
::selection{background:var(--straw-300)}
:focus-visible{outline:none;box-shadow:var(--focus-ring)}
button{font:inherit}
.skip{position:absolute;left:-9999px;top:8px;z-index:50;background:var(--snow);padding:8px 16px}
.skip:focus{left:8px}

.wrap{max-width:var(--maxw-content);margin:0 auto;padding:0 var(--gutter)}
.wrap-wide{max-width:var(--maxw-wide);margin:0 auto;padding:0 var(--gutter)}
.eyebrow{font:500 11px/1 var(--font-sans);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--forest-500)}
.on-dark .eyebrow{color:var(--straw-300)}
.icon{width:var(--s,16px);height:var(--s,16px);flex:none;display:inline-block;stroke-width:1.5}

/* ---------- Button ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 28px;border:1px solid var(--forest-500);border-radius:var(--radius-sm);
  background:var(--forest-500);color:var(--snow);font:500 12px/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap;cursor:pointer;
  transition:background var(--dur-normal) var(--ease),color var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease)}
.btn .icon{transition:transform var(--dur-normal) var(--ease-out)}
.btn:hover .icon{transform:translateX(3px)}
.btn:hover{background:var(--forest-600);border-color:var(--forest-600);color:var(--snow)}
.btn--warm{background:var(--straw-500);border-color:var(--straw-500);color:var(--slate-900)}
.btn--warm:hover{background:var(--straw-300);border-color:var(--straw-300);color:var(--slate-900)}
.btn--outline{background:transparent;border-color:var(--slate-900);color:var(--slate-900)}
.btn--outline:hover{background:var(--slate-900);border-color:var(--slate-900);color:var(--snow)}
.btn--light{background:transparent;border-color:rgba(251,248,242,.7);color:var(--snow)}
.btn--light:hover{background:var(--snow);border-color:var(--snow);color:var(--slate-900)}
.btn--link{height:auto;padding:4px 0;background:none;border:none;border-bottom:1px solid currentColor;border-radius:0;color:var(--forest-600)}
.btn--link:hover{background:none;color:var(--forest-800)}
.btn--sm{height:38px;padding:0 18px;font-size:11px}
.btn--lg{height:58px;padding:0 36px;font-size:13px}

/* ---------- Section Heading ---------- */
.heading{display:grid;gap:20px;justify-items:start}
.heading--center{text-align:center;justify-items:center}
.heading h2{font-size:var(--fs-h2);line-height:1.08;color:var(--fg)}
.heading h2 i{font-weight:300}
.heading .lead{font:400 18px/1.7 var(--font-sans);color:var(--fg-muted);max-width:var(--maxw-prose)}
.on-dark .heading h2{color:var(--snow)}
.on-dark .heading .lead{color:var(--fg-on-dark-muted)}

/* ---------- Header ---------- */
.site-header{position:fixed;inset:0 0 auto 0;z-index:20;height:var(--header-h);background:transparent;border-bottom:1px solid var(--border-on-dark);
  transition:background var(--dur-normal) var(--ease),height var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease)}
.site-header .inner{max-width:var(--maxw-wide);margin:0 auto;height:100%;padding:0 var(--gutter);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px}
.site-header nav{display:flex;gap:28px}
.site-header .right{display:flex;gap:28px;justify-content:flex-end;align-items:center}
.nav-link{font:500 12px/1 var(--font-sans);letter-spacing:var(--ls-ui);text-transform:uppercase;white-space:nowrap;color:var(--snow);padding-bottom:6px;border-bottom:1px solid transparent;transition:border-color var(--dur-fast) var(--ease)}
.nav-link:hover,.nav-link[aria-current]{color:inherit;border-bottom-color:currentColor}
.brand{display:flex;align-items:center;gap:12px}
.brand img{transition:height var(--dur-normal) var(--ease)}
.brand .mark{height:52px}
.brand .word{height:34px}
.brand .dark{display:none}
.site-header .btn--warm-when-solid{display:none}
.site-header.solid{background:var(--cream);border-bottom-color:var(--border-soft);height:72px}
.site-header.solid .nav-link{color:var(--slate-900)}
.site-header.solid .brand .light{display:none}
.site-header.solid .brand .dark{display:block}
.site-header.solid .brand .mark{height:40px}
.site-header.solid .brand .word{height:28px}
.site-header.solid .btn--light{display:none}
.site-header.solid .btn--warm-when-solid{display:inline-flex}
.menu-toggle{display:none;background:none;border:none;color:var(--snow);padding:8px;cursor:pointer}
.site-header.solid .menu-toggle{color:var(--slate-900)}
@media (max-width:1380px){ .site-header .right .nav-link{display:none} }
@media (max-width:1180px){ .site-header nav .nav-link:nth-child(n+3), .site-header .right .nav-link{display:none} .site-header nav,.site-header .right{gap:18px} }
@media (max-width:820px){
  .site-header nav{display:none}
  .site-header .inner{grid-template-columns:auto 1fr auto}
  .brand{grid-column:1}
  .brand .mark{display:none!important}
  .site-header .right{grid-column:3}
  .site-header .right .btn{display:none!important}
  .menu-toggle{display:block}
}
.mobile-nav{position:fixed;inset:0;z-index:30;background:var(--forest-800);color:var(--snow);display:none;flex-direction:column;justify-content:center;align-items:center;gap:28px;padding:40px}
.mobile-nav.open{display:flex}
.mobile-nav a{color:var(--snow);font-family:var(--font-display);font-weight:300;font-size:34px}
.mobile-nav .close{position:absolute;top:20px;right:20px;background:none;border:none;color:var(--snow);padding:8px;cursor:pointer}

/* ---------- Hero ---------- */
.hero{position:relative;height:100vh;height:100svh;min-height:680px;background:var(--forest-800);overflow:hidden;color:var(--snow)}
.hero .img-move{position:absolute;inset:0;will-change:transform}
.hero .img-zoom{position:absolute;inset:0;transform:scale(1.06);transition:transform 2400ms var(--ease-out)}
.hero.on .img-zoom{transform:scale(1)}
.hero img{width:100%;height:100%;object-fit:cover}
/* Ruhige Eigenbewegung: Ken Burns, Feuerschein, Schneefall (statisch bei „weniger Bewegung“) */
.hero .stage{position:absolute;inset:0;transform-origin:58% 62%;animation:kenburns 32s ease-in-out 2.4s infinite alternate}
@keyframes kenburns{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.07) translate3d(-1.2%,-.8%,0)}}
.hero .glow{position:absolute;left:0;top:0;width:var(--gw,160px);height:var(--gw,160px);margin:calc(var(--gw,160px) / -2) 0 0 calc(var(--gw,160px) / -2);border-radius:50%;background:radial-gradient(circle,rgba(255,176,82,.55) 0%,rgba(255,132,48,.26) 32%,rgba(255,120,40,0) 68%);mix-blend-mode:screen;pointer-events:none;opacity:0;animation:flicker 2.3s steps(1,end) infinite}
.hero .glow--b{animation-duration:2.9s;animation-delay:-1.1s}
.hero .glow.set{opacity:.8}
@keyframes flicker{0%{opacity:.78;transform:scale(1)}12%{opacity:.9;transform:scale(1.05)}23%{opacity:.7;transform:scale(.97)}37%{opacity:.95;transform:scale(1.07)}51%{opacity:.74;transform:scale(.99)}64%{opacity:.88;transform:scale(1.03)}78%{opacity:.68;transform:scale(.96)}89%{opacity:.92;transform:scale(1.04)}}
.hero .snow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.hero .overlay{position:absolute;inset:0;background:var(--overlay-hero);pointer-events:none}
.hero .copy{position:absolute;left:0;right:0;bottom:120px;display:grid;justify-items:center;text-align:center;gap:32px;padding:0 var(--gutter)}
.hero .claim{font-family:var(--font-display);font-weight:300;font-size:clamp(40px,5.4vw,80px);line-height:1.08;max-width:1000px;text-wrap:balance;color:var(--snow)}
.hero .fade{opacity:0;transform:translateY(16px);transition:opacity 900ms var(--ease-out),transform 900ms var(--ease-out)}
.hero.on .fade{opacity:1;transform:none}
.hero.on .fade.d2{transition-delay:200ms}
.hero.on .fade.d3{transition-delay:380ms}
.quicklinks{position:absolute;left:0;right:0;bottom:0;border-top:1px solid var(--border-on-dark)}
.quicklinks .row{max-width:var(--maxw-wide);margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.quicklinks a{height:64px;display:flex;align-items:center;justify-content:center;gap:10px;color:var(--snow);font:500 12px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;border-left:1px solid var(--border-on-dark);transition:background var(--dur-normal) var(--ease)}
.quicklinks a:first-child{border-left:none}
.quicklinks a:hover{background:rgba(251,248,242,.12);color:var(--snow)}
@media (max-width:820px){
  .hero{min-height:620px}
  .hero .copy{bottom:152px;gap:24px}
  .quicklinks .row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .quicklinks a{height:56px;font-size:11px;letter-spacing:.14em}
  .quicklinks a:nth-child(3){border-left:none}
  .quicklinks a:nth-child(n+3){border-top:1px solid var(--border-on-dark)}
}

/* ---------- Reveal & Parallax ---------- */
.reveal{opacity:0;transform:translateY(16px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:80ms}.reveal.d2{transition-delay:160ms}
[data-parallax]{will-change:transform}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal,.hero .fade{opacity:1!important;transform:none!important;transition:none!important}
  .hero .img-zoom{transform:none!important;transition:none!important}
  .hero .stage,.hero .glow{animation:none!important}
  .hero .snow{display:none}
}

/* ---------- Intro ---------- */
.intro{padding:160px var(--gutter) 128px;text-align:center}
.intro .inner{max-width:820px;margin:0 auto;display:grid;gap:28px;justify-items:center}
.intro img{height:88px;width:auto}
.intro h1{font-size:var(--fs-display);line-height:1}
.intro p{font:400 19px/1.75 var(--font-sans);color:var(--fg-muted);max-width:680px}
@media (max-width:820px){ .intro{padding:112px var(--gutter) 88px} .intro p{font-size:17px} }

/* ---------- Themen ---------- */
.themes{padding:0 0 128px}
.tiles{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.tile{display:grid;gap:14px}
.tile .pic{aspect-ratio:3/4;overflow:hidden;background:var(--forest-300);border-radius:var(--radius-sm);outline:2px solid transparent;outline-offset:4px;transition:outline-color var(--dur-normal) var(--ease)}
.tile .pic img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.tile:hover .pic img{transform:scale(1.04)}
.tile.arch .pic{border-radius:var(--radius-arch)}
.tile.active .pic{outline-color:var(--straw-500)}
.tile-label{background:none;border:none;padding:0;cursor:pointer;text-align:left;display:flex;align-items:center;justify-content:space-between;font-family:var(--font-display);font-weight:300;font-size:26px;color:var(--fg-muted);transition:color var(--dur-fast) var(--ease)}
.tile-label .icon{opacity:0;transition:all var(--dur-normal) var(--ease-out)}
.tile:hover .tile-label,.tile.active .tile-label{color:var(--slate-900)}
.tile:hover .tile-label .icon,.tile.active .tile-label .icon{opacity:1}
.tile:hover .tile-label .icon{transform:translateX(3px)}
.tabbar{display:flex;justify-content:center;gap:36px;border-bottom:1px solid var(--border);margin:96px 0 72px;flex-wrap:wrap}
.tabbar button{background:none;border:none;cursor:pointer;padding:0 0 16px;margin-bottom:-1px;font:500 12px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-muted);border-bottom:2px solid transparent}
.tabbar button[aria-selected="true"]{color:var(--slate-900);border-bottom-color:var(--straw-500)}
.panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:80px;align-items:center}
.panel[hidden]{display:none}
.panel .text{display:grid;gap:28px}
.panel .statement{font-family:var(--font-display);font-weight:400;font-size:36px;line-height:1.2;color:var(--fg)}
.panel h3{font-size:24px;font-weight:300;font-style:italic;color:var(--forest-600)}
.bullets{list-style:none;padding:0;margin:0}
.bullets li{display:flex;gap:16px;align-items:baseline;padding:14px 0;border-top:1px solid var(--border-soft);font:400 15px/1.6 var(--font-sans);color:var(--slate-700)}
.bullets li::before{content:"";width:6px;height:6px;border-radius:999px;background:var(--straw-500);flex:none;transform:translateY(-2px)}
.slider{display:grid;gap:20px}
.slider .frame{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--forest-300)}
.slider .track{display:flex;height:100%;transition:transform 800ms var(--ease-out)}
.slider .track img{width:100%;height:100%;flex:none;object-fit:cover}
.slider .controls{display:flex;align-items:center;justify-content:space-between}
.slider .count{font:500 12px/1 var(--font-sans);letter-spacing:.16em;color:var(--fg-muted);font-variant-numeric:tabular-nums}
.slider .btns{display:flex;gap:8px}
.round{width:48px;height:48px;display:grid;place-items:center;border-radius:999px;cursor:pointer;border:1px solid var(--slate-900);background:transparent;color:var(--slate-900);transition:all var(--dur-normal) var(--ease)}
.round:hover{background:var(--slate-900);color:var(--snow)}
@media (max-width:1000px){
  .tiles{grid-template-columns:repeat(5,minmax(150px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
  .tile{scroll-snap-align:start}
  .panel{grid-template-columns:1fr;gap:48px}
}
@media (max-width:820px){
  .themes{padding-bottom:88px}
  .tabbar{gap:20px;margin:64px 0 48px;justify-content:flex-start}
  .panel .statement{font-size:28px}
  .tile-label{font-size:22px}
}

/* ---------- Galerie ---------- */
.gallery{padding:128px 0;background:var(--linen)}
.gallery .inner{display:grid;gap:56px}
.gallery .head{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{height:40px;padding:0 20px;border-radius:999px;cursor:pointer;border:1px solid var(--border-strong);background:transparent;color:var(--slate-700);font:500 11px/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;transition:all var(--dur-normal) var(--ease)}
.chip[aria-pressed="true"]{border-color:var(--slate-900);background:var(--slate-900);color:var(--snow)}
.grid-gal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.grid-gal figure{margin:0;overflow:hidden;background:var(--forest-300);aspect-ratio:4/3}
.grid-gal figure:first-child{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.grid-gal img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.grid-gal figure:hover img{transform:scale(1.04)}
.grid-gal figure[hidden]{display:none}
@media (max-width:820px){
  .gallery{padding:88px 0}
  .grid-gal{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- Zahlen ---------- */
.stats{padding:128px 0}
.stats .row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.stat{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--forest-600);color:var(--snow)}
.stat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.stat .overlay{position:absolute;inset:0;background:var(--overlay-hero)}
.stat .txt{position:absolute;left:24px;right:24px;bottom:28px;display:grid;gap:6px}
.stat .num{font-family:var(--font-display);font-weight:300;font-size:clamp(40px,4.4vw,64px);line-height:1;color:var(--snow)}
.stat .lbl{font:500 11px/1.4 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--straw-300)}
@media (max-width:820px){ .stats{padding:88px 0} .stats .row{grid-template-columns:repeat(2,minmax(0,1fr))} .stat .num{font-size:30px} .stat .txt{left:14px;right:14px;bottom:18px} .stat .lbl{font-size:10px;letter-spacing:.14em} }

/* ---------- Anfahrt ---------- */
.location{padding:0 0 128px}
.location .inner{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:64px;align-items:center}
.location .pic{aspect-ratio:16/10;overflow:hidden;background:var(--forest-200)}
.location .pic img{width:100%;height:100%;object-fit:cover}
.location .text{display:grid;gap:24px}
.location address{font:400 16px/1.8 var(--font-sans);font-style:normal;color:var(--fg-muted)}
@media (max-width:820px){ .location{padding-bottom:88px} .location .inner{grid-template-columns:1fr;gap:40px} }

/* ---------- Anfrage ---------- */
.inquiry{padding:128px 0;background:var(--forest-800);color:var(--snow);color-scheme:dark}
.inquiry .inner{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);gap:80px;align-items:start}
.inquiry .left{display:grid;gap:48px}
.form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.field{display:grid;gap:8px;position:relative;min-width:0}
.field select{width:100%;min-width:0;text-overflow:ellipsis}
.field .lab{font:500 10px/1 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--fg-on-dark-muted)}
.field input,.field select,.field textarea{height:48px;padding:0;background:transparent;border:none;border-bottom:1px solid var(--border-on-dark);border-radius:0;color:var(--snow);font:400 16px/1.4 var(--font-sans);outline:none;transition:border-color var(--dur-fast) var(--ease)}
.field textarea{height:auto;padding:12px 0;resize:vertical}
.field select{appearance:none;cursor:pointer;padding-right:24px}
.field select option{color:var(--slate-900)}
.field.sel::after{content:"";position:absolute;right:2px;bottom:18px;width:7px;height:7px;border-right:1.5px solid var(--snow);border-bottom:1.5px solid var(--snow);transform:rotate(45deg);pointer-events:none}
.field input:focus,.field select:focus,.field textarea:focus{border-bottom-color:var(--straw-500);box-shadow:none}
.field input::placeholder,.field textarea::placeholder{color:rgba(191,203,182,.7)}
.span2{grid-column:span 2}.full{grid-column:1/-1}
.form-note{font:400 13px/1.6 var(--font-sans);color:var(--fg-on-dark-muted)}
.thanks{font-family:var(--font-display);font-size:32px;font-weight:300;color:var(--snow)}
.direct{border:1px solid var(--border-on-dark);padding:40px;display:grid;gap:24px;justify-items:start}
.direct img{height:64px;width:auto}
.direct h3{font-size:30px;color:var(--snow)}
.direct ul{list-style:none;padding:0;margin:0;display:grid;gap:14px;width:100%}
.direct li{display:flex;gap:12px;align-items:center;font:400 15px/1.5 var(--font-sans);color:var(--fg-on-dark-muted);padding-top:14px;border-top:1px solid var(--border-on-dark)}
.direct li .icon{color:var(--straw-300)}
@media (max-width:1000px){ .inquiry .inner{grid-template-columns:1fr;gap:56px} }
@media (max-width:820px){ .inquiry{padding:88px 0} .form .btn,.hero .btn{max-width:100%;white-space:normal;height:auto;min-height:58px;padding:14px 24px;text-align:center;line-height:1.4} .form{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px} .form>*{min-width:0} .form .span2,.form .full,.form .field:nth-child(n+3){grid-column:1/-1} .direct{padding:28px} }

/* ---------- Footer ---------- */
.site-footer{background:var(--forest-900);color:var(--fg-on-dark-muted);padding:96px 0 40px}
.site-footer .inner{display:grid;gap:72px}
.site-footer .cols{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));gap:48px;align-items:start}
.site-footer .logo{height:150px;width:auto}
.site-footer .col{display:grid;gap:12px;font:400 14px/1.7 var(--font-sans)}
.site-footer .col .t{font:500 10px/1 var(--font-sans);letter-spacing:.22em;text-transform:uppercase;color:var(--straw-300);margin-bottom:8px}
.site-footer a{color:var(--snow)}
.site-footer .bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--border-on-dark);padding-top:24px;font:400 12px/1.4 var(--font-sans)}
.site-footer .bottom a{color:inherit}
.site-footer .bottom span{display:flex;gap:24px}
@media (max-width:820px){ .site-footer{padding:72px 0 32px} .site-footer .cols{grid-template-columns:1fr 1fr} .site-footer .cols>:first-child{grid-column:1/-1} .site-footer .logo{height:110px} }

/* ---------- Speisekarte (nach ui_kits/website/MenuPage + MenuItem) ---------- */
.menu-head{padding:200px var(--gutter) 64px;text-align:center}
.menu-head .heading{max-width:820px;margin:0 auto}
.menu-head h1{font-size:var(--fs-h1);line-height:1.08}
.menu-head h1 i{font-weight:300}
.menu-jump{position:sticky;top:72px;z-index:5;background:var(--cream);border-bottom:1px solid var(--border)}
.menu-jump .row{max-width:1000px;margin:0 auto;padding:0 var(--gutter);display:flex;justify-content:safe center;gap:32px;overflow-x:auto;scrollbar-width:none}
.menu-jump .row::-webkit-scrollbar{display:none}
.menu-jump a{flex:none;padding:18px 0 16px;font:500 11px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--fg-muted);border-bottom:1px solid transparent;margin-bottom:-1px;white-space:nowrap}
.menu-jump a:hover,.menu-jump a.on{color:var(--slate-900);border-bottom-color:var(--slate-900)}
.menu-body{max-width:820px;margin:0 auto;padding:32px var(--gutter) 128px}
.menu-sec{padding-top:72px;scroll-margin-top:140px}
.menu-sec .heading{gap:12px;margin-bottom:12px}
.menu-sec h2{font-size:clamp(30px,3.4vw,40px)}
.menu-sec .sub{font-family:var(--font-display);font-style:italic;font-weight:300;font-size:20px;color:var(--forest-600)}
.mi{display:grid;gap:6px;padding:20px 0;border-bottom:1px solid var(--border)}
.mi .name{font-family:var(--font-display);font-size:24px;font-weight:400;line-height:1.25;color:var(--fg)}
.mi p{font:400 14px/1.6 var(--font-sans);color:var(--fg-muted);max-width:520px}
.mi .tags{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.mi .tags span{font:500 10px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--forest-500)}
.mi-row{display:flex;align-items:baseline;gap:16px}
.mi-row .al{margin-left:auto;flex:none;font:500 11px/1 var(--font-sans);letter-spacing:.12em;color:var(--fg-muted)}
.al-draft{margin-top:24px;padding:12px 16px;background:var(--straw-100);border-left:3px solid var(--straw-500);font:400 13px/1.6 var(--font-sans);color:var(--slate-700)}
.legend-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;margin:8px 0 0}
.legend-list div{display:flex;gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--border-soft)}
.legend-list dt{font:600 12px/1 var(--font-sans);letter-spacing:.12em;color:var(--forest-600);width:16px;flex:none}
.legend-list dd{margin:0;font:400 15px/1.5 var(--font-sans);color:var(--slate-700)}
@media (max-width:820px){ .legend-list{grid-template-columns:1fr} }
.menu-note{padding-top:20px;font:400 14px/1.6 var(--font-sans);color:var(--fg-muted)}
.menu-end{margin-top:96px;padding-top:64px;border-top:1px solid var(--border);display:grid;gap:24px;justify-items:center;text-align:center}
.menu-end img{height:72px;width:auto}
.menu-end p.claim{font-family:var(--font-display);font-weight:300;font-size:clamp(28px,3.6vw,44px);line-height:1.15}
.menu-end p.small{font:400 14px/1.6 var(--font-sans);color:var(--fg-muted);max-width:520px}
.menu-teaser{margin-top:8px}
@media (max-width:820px){ .menu-head{padding:140px var(--gutter) 40px} .menu-jump{top:72px} .menu-jump .row{gap:22px} .menu-sec{padding-top:56px} .mi .name{font-size:21px} }

/* ---------- Unterseiten (Impressum, Datenschutz) ---------- */
.page{padding:160px 0 112px}
.page .prose{max-width:var(--maxw-prose)}
.page h1{font-size:var(--fs-h1);line-height:1.08;margin-bottom:40px}
.page h2{font-size:28px;margin:40px 0 12px}
.page p,.page li{color:var(--slate-700)}
.todo{background:var(--straw-100);border-left:3px solid var(--straw-500);padding:2px 8px}

/* ---------- Jobs (jobs.html) ---------- */
.hero--job .copy{gap:24px;bottom:auto;top:50%;transform:translateY(-38%)}
.hero--job .overlay{background:linear-gradient(180deg,rgba(31,42,27,.30) 0%,rgba(31,42,27,.55) 55%,rgba(31,42,27,.70) 100%)}
.hero--job .claim{font-size:clamp(56px,8vw,120px);line-height:1}
.hero--job .sub{font:400 clamp(16px,1.6vw,20px)/1.6 var(--font-sans);color:var(--cream);max-width:560px}
.hero-btns{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
.intro .job-h{font-size:var(--fs-h1);line-height:1.05}
.intro .job-h i{font-weight:300}
.job-meet{background:var(--forest-800);color:var(--snow);padding:128px 0}
.job-meet .inner{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:80px;align-items:start}
.job-meet .meet-text{display:grid;gap:20px}
.job-meet p{font:400 18px/1.8 var(--font-sans);color:var(--fg-on-dark-muted)}
.job-roles{padding:128px 0}
.roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:64px}
.role{display:grid;gap:16px;align-content:start}
.role .pic{aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius-arch);background:var(--forest-200)}
.role .pic img{width:100%;height:100%;object-fit:cover;transition:transform 1200ms var(--ease-out)}
.role:hover .pic img{transform:scale(1.04)}
.role h3{font-size:var(--fs-h3);margin-top:8px}
.role p{color:var(--fg-muted)}
.role .eyebrow{margin-top:8px}
.role .eyebrow+h3{margin-top:0}
.role--top .eyebrow{color:var(--straw-700,#a8772b)}
.job-fit{padding:0 0 128px}
.job-fit .inner{display:grid;grid-template-columns:1fr 1fr;gap:64px;border-top:1px solid var(--border);padding-top:64px}
.job-fit .col{display:grid;gap:24px;align-content:start}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.ticks li{display:flex;gap:14px;align-items:flex-start;font:400 17px/1.6 var(--font-sans);color:var(--slate-700)}
.ticks .icon{--s:20px;color:var(--forest-500);margin-top:3px}
.job-fit .pay{display:grid;gap:8px;padding:16px 18px;background:var(--linen);border-left:3px solid var(--forest-500)}
.job-fit .pay p,.job-fit .pay li{font:400 14px/1.6 var(--font-sans);color:var(--slate-700)}
.job-fit .pay ul{margin:0;padding-left:18px;display:grid;gap:4px}
.job-host{background:var(--linen);padding:128px 0}
.job-host .inner{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:72px;align-items:start;max-width:1080px;margin:0 auto}
.job-host .portrait{margin:0;position:sticky;top:110px}
.job-host .portrait img{width:100%;aspect-ratio:4/5;object-fit:cover}
.job-host figcaption{font:400 12px/1.5 var(--font-sans);color:var(--fg-muted);margin-top:10px}
.job-host .text{display:grid;gap:22px}
.job-host .text>p{font:400 18px/1.8 var(--font-sans);color:var(--slate-700)}
.job-host blockquote{margin:0;padding:8px 0 8px 24px;border-left:3px solid var(--straw-500);font-family:var(--font-display);font-style:italic;font-weight:300;font-size:23px;line-height:1.5;color:var(--slate-900)}
.job-host .sign{font-family:var(--font-display);font-size:28px;color:var(--slate-900);display:grid;gap:6px}
.job-host .sign span{font:500 11px/1.4 var(--font-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--fg-muted)}
.job-apply .lead{max-width:560px}
.apply-btns{display:flex;flex-wrap:wrap;gap:16px}
.job-share{padding:128px 0}
.job-share .inner{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:80px;align-items:start}
.share{display:grid;gap:28px}
.share-row{display:flex;flex-wrap:wrap;gap:12px}
.share-btn{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 22px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--snow);color:var(--slate-900);font:500 12px/1 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:background var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease),color var(--dur-normal) var(--ease)}
.share-btn svg{width:20px;height:20px;flex:none}
.share-btn:hover{background:var(--forest-800);border-color:var(--forest-800);color:var(--snow)}
.share-btn[data-share="whatsapp"]:hover{background:#1f8f4e;border-color:#1f8f4e}
.share-btn[data-share="facebook"]:hover{background:#1b5fc9;border-color:#1b5fc9}
.share-btn[data-share="instagram"]:hover{background:#b8327a;border-color:#b8327a}
.share-note{min-height:1.5em;font-size:14px;color:var(--forest-600)}
.downloads{display:grid;gap:14px}
.dl{display:grid;grid-template-columns:64px 1fr;gap:18px;align-items:center;padding:12px;border:1px solid var(--border);background:var(--snow);color:var(--slate-900);transition:border-color var(--dur-normal) var(--ease)}
.dl:hover{border-color:var(--forest-500);color:var(--slate-900)}
.dl img{width:64px;height:80px;object-fit:cover}
.dl span{display:grid;gap:4px;font:500 14px/1.3 var(--font-sans)}
.dl small{font:400 13px/1.4 var(--font-sans);color:var(--fg-muted)}
.dl-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center}
.dl-share{display:flex;gap:6px}
.share-mini{width:44px;height:44px;display:inline-grid;place-items:center;padding:0;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--snow);color:var(--slate-900);cursor:pointer;transition:background var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease),color var(--dur-normal) var(--ease)}
.share-mini svg{width:20px;height:20px}
.share-mini:hover,.share-mini:focus-visible{color:var(--snow)}
.share-mini[data-net="whatsapp"]:hover,.share-mini[data-net="whatsapp"]:focus-visible{background:#1f8f4e;border-color:#1f8f4e}
.share-mini[data-net="facebook"]:hover,.share-mini[data-net="facebook"]:focus-visible{background:#1b5fc9;border-color:#1b5fc9}
.share-mini[data-net="instagram"]:hover,.share-mini[data-net="instagram"]:focus-visible{background:#b8327a;border-color:#b8327a}
@media (max-width:560px){ .dl-row{grid-template-columns:1fr} .dl-share{justify-content:flex-end;margin-top:-4px} }
/* Startseite: Erzählung, Tagesverlauf, Mountain Club (nutzen die Job-Bausteine mit) */
.story blockquote{margin:0;font-family:var(--font-display);font-style:italic;font-weight:300;font-size:clamp(22px,2.2vw,28px);line-height:1.5;color:var(--snow)}
.story-sign{display:flex;gap:16px;align-items:center;margin-top:12px;color:var(--snow)}
.story-sign:hover{color:var(--straw-300)}
.story-sign img{width:64px;height:64px;border-radius:50%;object-fit:cover;flex:none}
.story-sign span{display:grid;gap:4px}
.story-sign b{font-family:var(--font-display);font-weight:400;font-size:20px}
.story-sign small{font:500 11px/1.4 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--straw-300)}
.day-flow{padding:128px 0}
.day-flow .role .eyebrow{margin-top:8px}
.day-flow .role h3{margin-top:0}
.club{padding-top:128px}
.events .heading{max-width:720px;margin:0 auto}
.events .lead{color:var(--fg-on-dark-muted)}
.events .role h3{color:var(--snow)}
.events .role p{color:var(--fg-on-dark-muted)}
.event-dates{margin:72px auto 0;max-width:760px;display:grid;gap:18px;padding:32px;border:1px solid var(--border-on-dark)}
.event-dates ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.event-dates li{display:grid;grid-template-columns:200px 1fr;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--border-on-dark)}
.event-dates li:last-child{border-bottom:0;padding-bottom:0}
.event-dates .when{font:500 12px/1.6 var(--font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--straw-300)}
.event-dates .what{display:grid;gap:4px}
.event-dates b{font-family:var(--font-display);font-weight:400;font-size:22px;color:var(--snow)}
.event-dates small{font:400 15px/1.6 var(--font-sans);color:var(--fg-on-dark-muted)}
.event-dates li.empty{display:block;font:400 16px/1.7 var(--font-sans);color:var(--fg-on-dark-muted)}
.event-note{font:400 14px/1.6 var(--font-sans);color:var(--fg-on-dark-muted)}
.event-note a{color:var(--straw-300)}
@media (max-width:560px){ .event-dates{padding:22px} .event-dates li{grid-template-columns:1fr;gap:4px} }
.club .heading{max-width:720px;margin:0 auto 64px}
.club .lead{color:var(--fg-muted)}
@media (max-width:980px){
  .job-meet .inner,.job-host .inner,.job-share .inner,.job-fit .inner{grid-template-columns:1fr;gap:48px}
  .job-host .portrait{position:static;max-width:240px}
  .roles{grid-template-columns:1fr;gap:56px}
  .role .pic{aspect-ratio:16/10}
}
@media (max-width:820px){
  .job-meet,.job-roles,.job-host,.job-share{padding:88px 0}
  .job-fit{padding-bottom:88px}
  .job-host blockquote{font-size:20px;padding-left:18px}
  .story blockquote{font-size:21px}
  .day-flow{padding:88px 0}
  .club{padding-top:88px}
  .share-btn{flex:1 1 calc(50% - 6px);justify-content:center;padding:0 12px}
  .apply-btns .btn,.hero-btns .btn{width:100%}
}

/* ---------- Sprachschalter DE · EN · SL (i18n.js) ---------- */
.lang-switch{display:inline-flex;align-items:center;gap:2px}
.lang-switch button{background:none;border:none;padding:6px 7px;cursor:pointer;font:500 11px/1 var(--font-sans);letter-spacing:.14em;color:inherit;opacity:.62;border-bottom:1px solid transparent;transition:opacity var(--dur-fast) var(--ease),border-color var(--dur-fast) var(--ease)}
.lang-switch button:hover{opacity:1}
.lang-switch button[aria-pressed="true"]{opacity:1;border-bottom-color:currentColor}
.lang-switch button+button::before{content:"";display:inline-block;width:1px;height:10px;background:currentColor;opacity:.35;margin-right:9px;vertical-align:-1px}
.site-header .lang-switch{color:var(--snow)}
.site-header.solid .lang-switch{color:var(--slate-900)}
.mobile-nav .lang-switch{color:var(--snow);margin-top:8px}
.mobile-nav .lang-switch button{font-size:14px;padding:8px 10px}
.lang-hint{background:var(--straw-100);border-left:3px solid var(--straw-500);padding:12px 16px;margin-bottom:32px;font-size:14px}
@media (max-width:820px){ .site-header .lang-switch button{padding:6px 4px} .site-header .lang-switch button+button::before{margin-right:6px} .site-header .right{gap:8px} }

/* Facebook-Link im Fuß (Kontakt) */
.fb-link{display:inline-flex;align-items:center;gap:8px}
.fb-ico{width:16px;height:16px;flex:none}

/* Info-Leiste im Hero (statt Themen-Links) */
.infobar a{gap:14px;letter-spacing:0;text-transform:none}
.infobar a>span{display:grid;gap:4px;text-align:left}
.infobar small{font:500 10px/1 var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--straw-300)}
.infobar b{font:500 14px/1.2 var(--font-sans);color:var(--snow);white-space:nowrap}
.infobar .icon{--s:20px;color:var(--straw-300);flex:none}
@media (max-width:820px){ .infobar a{height:60px;justify-content:flex-start;padding:0 14px;gap:10px} .infobar b{font-size:12.5px} .infobar .icon{--s:17px} }

/* Öffnungszeiten, Wetter, Anfahrt */
.location{padding:128px 0}
.location .inner{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);align-items:start}
.hours-list{margin:0;display:grid;gap:0;border-top:1px solid var(--border)}
.hours-list div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--border)}
.hours-list dt{font:500 12px/1.6 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--forest-600)}
.hours-list dd{margin:0;font:400 16px/1.6 var(--font-sans);color:var(--slate-900)}
.hours-note{font:400 14px/1.6 var(--font-sans);color:var(--fg-muted)}
.loc-links{display:flex;flex-wrap:wrap;gap:8px 28px}
.weather{display:grid;gap:18px;padding:32px;background:var(--forest-800);color:var(--snow)}
.weather .eyebrow{color:var(--straw-300)}
.wx-row{display:grid;grid-template-columns:1fr auto;grid-template-areas:"place temp" "desc temp";gap:2px 16px;padding-bottom:16px;border-bottom:1px solid var(--border-on-dark)}
.wx-place{grid-area:place;font:500 12px/1.6 var(--font-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--fg-on-dark-muted)}
.wx-temp{grid-area:temp;align-self:center;font-family:var(--font-display);font-weight:300;font-size:48px;line-height:1;color:var(--snow)}
.wx-desc{grid-area:desc;font:400 15px/1.5 var(--font-sans);color:var(--snow)}
.weather .btn--link{color:var(--straw-300)}
.wx-src{font:400 11px/1.4 var(--font-sans);color:var(--fg-on-dark-muted)}
@media (max-width:820px){ .location{padding:88px 0} .location .inner{grid-template-columns:minmax(0,1fr);gap:40px} .weather{padding:24px} .hours-list div{grid-template-columns:1fr;gap:2px} }
.wx-links{display:flex;flex-wrap:wrap;gap:10px}
.wx-btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border:1px solid var(--border-on-dark);border-radius:var(--radius-sm);color:var(--snow);font:500 11px/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;transition:background var(--dur-normal) var(--ease),border-color var(--dur-normal) var(--ease)}
.wx-btn:hover{background:rgba(251,248,242,.1);border-color:var(--straw-300);color:var(--snow)}
.wx-btn .icon{--s:16px;color:var(--straw-300)}