/* ============================================================
   Naturnah — gemeinsames Fundament für alle Seiten
   Seiten-spezifisches CSS steht weiterhin inline in der jeweiligen HTML-Datei.
   Vor 2026-09-04 stand dieser Block inline in jeder Seite (Punkt 9 STATUS.md).
   ============================================================ */
:root{
  --paper:#F2EDE2; --paper-2:#E9E1CF;
  --ink:#20261C; --ink-soft:#3B4433;
  --pine:#42523A; --pine-deep:#26301F;
  --sage:#8A9578;
  --orange:#C9552A; --orange-deep:#A8481F;
  --flame:#E6945A;
  --line:rgba(32,38,28,.18);
  --serif:'Fraunces',Georgia,'Times New Roman',serif;
  --sans:'Karla',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono','SFMono-Regular',Consolas,'Liberation Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{background:var(--paper);color:var(--ink);font:1.05rem/1.75 var(--sans);position:relative;overflow-x:hidden}
::selection{background:var(--orange);color:var(--paper)}
img{display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:560;line-height:1.08;letter-spacing:-.01em}
[hidden]{display:none!important}
:focus-visible{outline:2px dashed var(--orange);outline-offset:3px}
[tabindex="-1"]:focus{outline:none}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--paper)}
::-webkit-scrollbar-thumb{background:var(--pine);border:2px solid var(--paper);border-radius:6px}
.mono{font-family:var(--mono);font-size:.68rem;font-weight:500;letter-spacing:.17em;text-transform:uppercase;line-height:1.6}
.dia{width:9px;height:9px;fill:var(--orange);flex:none}
.wrap{max-width:1140px;margin:0 auto;padding-inline:clamp(1.25rem,5vw,4rem);position:relative;z-index:3}
.eyebrow{display:flex;align-items:center;gap:.7rem;color:var(--orange-deep)}
.on-dark .eyebrow{color:var(--flame)}
.sec-sub{max-width:52ch;color:var(--ink-soft)}
section{position:relative;padding-block:clamp(4.5rem,11vh,7.5rem)}
[data-rv]{opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .6s cubic-bezier(.22,.61,.36,1)}
[data-rv].in{opacity:1;transform:none}
.fade-in{animation:fadeUp .7s ease both;animation-delay:var(--d,0s)}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

#siteHead{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
#siteHead.scrolled{background:rgba(242,237,226,.9);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);border-bottom-color:var(--line)}
.head-inner{display:flex;align-items:center;gap:2rem;padding:.7rem clamp(1.25rem,5vw,4rem);max-width:1400px;margin:auto}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.brand img{height:27px;width:auto}
.brand b{font:560 1.05rem var(--serif);letter-spacing:-.01em}
.head-nav{margin-left:auto;display:flex;gap:1.6rem}
.head-nav a{text-decoration:none;color:var(--pine);transition:color .2s}
.head-nav a:hover,.head-nav a.active{color:var(--orange-deep)}
.nav-toggle{display:none;width:44px;height:44px;margin-left:.4rem;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:var(--ink);flex:none}
.nav-toggle-bar{position:relative}
.nav-toggle-bar,.nav-toggle-bar::before,.nav-toggle-bar::after{display:block;width:22px;height:2px;background:currentColor;transition:transform .25s ease,top .25s ease,background .2s}
.nav-toggle-bar::before,.nav-toggle-bar::after{content:"";position:absolute;left:0}
.nav-toggle-bar::before{top:-7px}
.nav-toggle-bar::after{top:7px}
#siteHead.nav-open .nav-toggle-bar{background:transparent}
#siteHead.nav-open .nav-toggle-bar::before{top:0;transform:rotate(45deg)}
#siteHead.nav-open .nav-toggle-bar::after{top:0;transform:rotate(-45deg)}
.btn{display:inline-flex;align-items:center;gap:.65em;font:700 .8rem/1 var(--sans);letter-spacing:.11em;text-transform:uppercase;padding:1em 1.45em;border-radius:3px;border:1.5px solid var(--ink);cursor:pointer;text-decoration:none;transition:transform .22s,box-shadow .22s,background .22s,color .22s;background:none;color:var(--ink)}
.btn .arr{width:14px;height:14px;transition:transform .25s}
.btn:hover .arr{transform:translateX(4px)}
.btn-primary{background:var(--ink);color:var(--paper)}
.btn-primary:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 var(--orange)}
.btn-ghost:hover{background:rgba(32,38,28,.07)}
.btn-flame{background:var(--flame);border-color:var(--flame);color:var(--pine-deep)}
.btn-flame:hover{transform:translate(-2px,-2px);box-shadow:4px 4px 0 rgba(0,0,0,.4)}
.btn-small{padding:.8em 1.15em;font-size:.72rem}
.on-dark .btn:not(.btn-flame){border-color:var(--paper);color:var(--paper)}
.on-dark .btn-ghost:hover{background:rgba(242,237,226,.08)}

#trailSvg{position:absolute;top:0;left:0;z-index:2;pointer-events:none;overflow:visible}
#trailBase{fill:none;stroke:var(--sage);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:.5 8;opacity:.5}
#trailProg{fill:none;stroke:var(--orange);stroke-width:2;stroke-linecap:round;stroke-dasharray:1000}
.wp{position:absolute;width:13px;height:13px;background:var(--paper);border:1.6px solid var(--ink);transform:rotate(45deg);z-index:3;transition:background .4s,border-color .4s,transform .4s}
.wp.lit{background:var(--orange);border-color:var(--orange);transform:rotate(45deg) scale(1.2)}
.wp-side{left:5vw;top:130px}
.wp-label{position:absolute;z-index:3;color:var(--pine);writing-mode:vertical-rl;font-size:.6rem;left:calc(5vw + 26px);top:150px}

.ticker{border-block:1px solid var(--line);overflow:hidden;padding-block:.85rem;background:var(--paper)}
.ticker-track{display:flex;width:max-content;animation:tick 40s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
@keyframes tick{to{transform:translateX(-50%)}}
.t-set{display:flex;align-items:center;gap:2.4rem;padding-right:2.4rem}
.t-item{font-family:var(--serif);font-style:italic;font-size:1.12rem;white-space:nowrap;color:var(--ink)}
.t-dia{width:9px;height:9px;fill:var(--orange);flex:none}

footer{border-top:1px solid var(--line);padding:3.4rem 0 2.4rem;background:var(--paper)}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:2rem}
.foot-brand .brand{margin-bottom:.7rem}
.foot-brand p{font-size:.92rem;color:var(--ink-soft);max-width:32ch}
.foot-col h4{font-family:var(--mono);font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--pine);margin-bottom:.9rem}
.foot-col ul{list-style:none}
.foot-col li{margin-bottom:.55rem}
.foot-col a,.foot-col .plain{text-decoration:none;font-size:.92rem;color:var(--ink-soft)}
.foot-col a:hover{color:var(--orange-deep)}
.foot-bottom{margin-top:2.6rem;padding-top:1.4rem;border-top:1px dashed rgba(32,38,28,.25);color:var(--pine);display:flex;justify-content:space-between;flex-wrap:wrap;gap:.8rem;font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase}
.foot-bottom a{text-decoration:none}
.foot-bottom a:hover{color:var(--orange-deep)}
.grain{position:fixed;inset:0;z-index:999;pointer-events:none;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}

@media(max-width:1240px){.wp-label{display:none}}
@media(max-width:960px){.wp,#trailSvg{display:none!important}.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:860px){
  .head-inner{gap:.6rem}
  .head-inner>.btn{margin-left:auto}
  .nav-toggle{display:flex}
  #siteHead.nav-open{background:rgba(242,237,226,.97);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px)}
  .head-nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;background:var(--paper);border-bottom:1px solid var(--line);max-height:0;overflow:hidden;visibility:hidden;transition:max-height .3s ease,visibility 0s .3s}
  #siteHead.nav-open .head-nav{max-height:75vh;visibility:visible;transition:max-height .3s ease}
  .head-nav a{padding:1rem clamp(1.25rem,5vw,4rem);border-top:1px solid var(--line)}
}
@media(max-width:640px){.foot-grid{grid-template-columns:1fr}}
@media(max-width:360px){.brand b{display:none}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
  [data-rv]{opacity:1;transform:none}
  .ticker-track{animation:none}
}