/* Tokens: measured from the prototype at 1440 and 390 px (_prototyp/messwerte-1440-390.json). The type scale comes from the settings (inc/assets.php). */
@font-face{font-family:"Wildling";src:url(../fonts/wildling.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/OpenSans-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/OpenSans-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/OpenSans-SemiBold.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"Open Sans";src:url(../fonts/OpenSans-Bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --ink:#000;--paper:#fff;--flaeche:#e7e7e5;--karte:#f6f6f4;--cta:#ecebe7;--cta-h:#e0dfda;
  --sans:"Open Sans",Arial,sans-serif;--disp:"Wildling","Open Sans",sans-serif;
  --g:2vw;--gap:5px;--rr:6px;--hd:55px;
  --sp:clamp(72px,7vw,140px);--sp-h:clamp(28px,2.6vw,52px);
  --lh-d:1.1;--lh-t:1.18;--lh-b:1.5;
  --ease:cubic-bezier(.16,1,.3,1);
  --sq:linear-gradient(90deg,transparent 2px,var(--paper) 0) 0 0/3px 3px,linear-gradient(transparent 2px,var(--paper) 0) 0 0/3px 3px,#ececea
}
@media (max-width:999px){:root{--hd:44px}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html.is-locked{overflow:hidden}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--t-b)/var(--lh-b) var(--sans);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,p,ul,ol,figure,dl,dd{margin:0;padding:0}
h1,h2,h3,h4{font-size:inherit;font-weight:inherit;line-height:var(--lh-t)}
main{overflow-x:clip}
main>:last-child{padding-bottom:var(--sp)}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
strong,b{font-weight:700}
button{color:inherit;font:inherit}
[hidden]{display:none!important}
.sub{position:relative}
.sub::before{content:"";position:absolute;z-index:-1;inset:0 0 auto;height:min(110svh,1100px);pointer-events:none;background:var(--sq);-webkit-mask:radial-gradient(ellipse 60% 75% at 88% 0%,#000,transparent 72%);mask:radial-gradient(ellipse 60% 75% at 88% 0%,#000,transparent 72%)}

/* Layout: section spacing has two values, --sp between sections and --sp-h from title to content */
.row{padding:var(--sp) var(--g) 0}
.row[data-space=s]{padding-top:var(--sp-h)}
.row[data-space="0"]{padding-top:0}
.row[data-bg=flaeche]{margin-top:var(--sp);padding-block:var(--sp);background:var(--flaeche)}
.head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:var(--sp-h)}
.head__sub{margin-top:.45em}

/* Type roles */
.disp{font:400 var(--t1)/var(--lh-d) var(--disp);text-transform:lowercase}
.lead{font-size:var(--t-lead);line-height:var(--lh-t)}
.ty-h{font-size:var(--t-h);line-height:var(--lh-t);font-weight:600}
.prose>*+*{margin-top:1.45em}
.prose{max-width:62ch}
.prose a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.prose h2,.prose h3{font-size:var(--t-h);line-height:1.2;font-weight:600}
.prose ul{display:grid}
.prose li{position:relative;padding:.45em 0 .45em 1.4em;border-bottom:1px solid rgb(0 0 0/.08)}
.prose li:first-child{border-top:1px solid rgb(0 0 0/.08)}
.prose li::before{content:"";position:absolute;left:0;top:calc(.45em + .5lh - .25em);width:.5em;height:.5em;background:var(--ink)}
.prose ol{list-style:decimal;padding-left:1.4em}
.prose ol li{padding-left:.2em}
.prose ol li::before{content:none}
.kicker{margin-bottom:.9em;font-size:var(--t-s);font-weight:600;letter-spacing:.02em}

/* Title beside large text */
.seitlich{display:grid;grid-template-columns:1fr 2fr;gap:clamp(20px,3vw,60px)}
.seitlich .prose{max-width:26em;font-size:var(--t-lead);line-height:var(--lh-t)}
.seitlich .prose>*+*{margin-top:1em}
.row>.ty-h{margin-bottom:.6em}
@media (max-width:690px){.seitlich{grid-template-columns:1fr}}

/* One action per view: a calm grey surface, the arrow says where it leads */
.btn{display:inline-flex;align-items:center;gap:.5em;padding:.6em .8em;border:0;border-radius:var(--rr);background:var(--cta);color:var(--ink);font:600 calc(var(--t-h)*.8)/1.1 var(--sans);white-space:nowrap;cursor:pointer;transition:background .25s}
.btn::after{content:"→";font-weight:400;transition:transform .35s var(--ease)}
.btn[target=_blank]::after{content:"↗"}
.btn:hover{background:var(--cta-h)}
.btn:hover::after{transform:translateX(3px)}
.btn[target=_blank]:hover::after{transform:translate(2px,-2px)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips li{padding:10px 16px;border:1px solid var(--ink);border-radius:var(--rr)}

/* Rows: branches, jobs, stops */
.rows{border-top:1px solid var(--ink)}
.rows--voll{margin-inline:calc(var(--g)*-1)}
.rows__i{display:flex;justify-content:space-between;align-items:center;gap:20px;width:100%;padding:clamp(18px,1.9vw,38px) var(--g);border:0;border-bottom:1px solid var(--ink);background:none;text-align:left;transition:background .2s,color .2s}
.rows__i h3{font-size:var(--t-h);line-height:var(--lh-t);font-weight:600}
.rows__i>span{display:flex;align-items:baseline;gap:1.4em;text-align:right}
/* The large variant: job list and the list of occasions */
.rows__i--gross h3{font:400 var(--t2)/1.05 var(--disp);text-transform:lowercase}
a.rows__i:hover,button.rows__i:hover{background:var(--ink);color:var(--paper)}
button.rows__i{cursor:pointer}
@media (max-width:690px){.rows__i{flex-direction:column;align-items:flex-start;gap:4px;padding-block:12px}.rows__i>span{flex-direction:column;gap:2px;text-align:left}}
.stat{display:inline-flex;align-items:center;gap:.55em;font-style:normal}
.stat:not(.stat--gai)::before{content:"";flex:none;width:.6em;height:.6em;border-radius:50%;background:currentColor}
.stat.is-open{font-weight:600}
.stat.is-open::before{background:#128742}

.bereich-ende .row{padding-top:0}
.bereich-ende .ty-h{font-size:var(--t-b);line-height:1.5;margin-bottom:30px}

/* Reveal, added by frame.js only */
.w{transition:opacity .25s linear}
.js .wr .w{opacity:.22}
.rv{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .9s var(--ease);transition-delay:calc(var(--d,0)*70ms)}
.rv.is-in{opacity:1;transform:none}
.ir{clip-path:inset(100% 0 0 0);scale:1.15;transition:clip-path 1.2s cubic-bezier(.7,0,.2,1) calc(var(--d,0)*90ms),scale 1.8s var(--ease) calc(var(--d,0)*90ms)}
.ir.is-in{clip-path:inset(0);scale:1}
.ir.px{translate:0 var(--py,0)}
@media (prefers-reduced-motion:reduce){.js .wr .w{opacity:1}.rv{opacity:1;transform:none;transition:none}.ir{clip-path:none;scale:1;translate:none;transition:none}}

/* Header: transparent at the top, white once scrolled */
.hd{position:sticky;top:0;z-index:20;height:var(--hd);display:flex;align-items:center;justify-content:space-between;padding:0 var(--g);transition:background .35s,box-shadow .35s}
.hd--over{position:fixed;inset:0 0 auto;color:var(--paper)}
.hd.is-stuck{background:color-mix(in srgb,var(--paper) 80%,transparent);box-shadow:0 2px 14px rgb(0 0 0/.08);color:var(--ink)}
.hd__logo img{width:78px;height:auto}
.hd:not(.hd--over) .hd__logo img,.hd.is-stuck .hd__logo img{filter:invert(1)}
.hd>nav{margin-left:auto}
.hd__nav{display:flex;gap:40px;font:500 var(--t-nav)/20px var(--sans)}
.hd__nav a{position:relative;display:inline-flex;align-items:center}
.hd__nav .is-on::after{content:"";position:absolute;inset:auto 0 -4px;height:1px;background:currentColor}
.badge{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;margin-left:6px;padding:0 4px;border-radius:50px;background:#333;color:#fff;font:700 10px/1 var(--sans)}
.hd__burger{display:none;width:22px;height:20px;padding:0;border:0;background:none;cursor:pointer}
.hd__burger span{display:block;height:2px;margin:4px 0;background:currentColor}
@media (max-width:999px){.hd__logo img{width:61px}.hd>nav{display:none}.hd__burger{display:block}}

/* Mobile navigation: curtain from the top */
.mnav{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;padding:env(safe-area-inset-top,0) var(--g) calc(24px + env(safe-area-inset-bottom,0));background:var(--ink);color:var(--paper);clip-path:inset(0 0 100% 0);transition:clip-path .55s cubic-bezier(.7,0,.2,1);overflow-y:auto}
.mnav.is-open{clip-path:inset(0)}
.mnav__top{display:flex;justify-content:space-between;align-items:center;height:var(--hd)}
.mnav__top img{width:61px;height:auto}
.mnav__x{width:44px;height:44px;margin-right:-11px;border:0;background:none;cursor:pointer}
.mnav__nav{display:flex;flex-direction:column;margin:auto 0;padding:24px 0}
.mnav__nav a{padding:.08em 0;font:600 var(--t-mnav)/1.08 var(--sans);white-space:nowrap;opacity:0;transform:translateY(24px);transition:opacity .4s,transform .5s var(--ease)}
.mnav.is-open .mnav__nav a{opacity:1;transform:none;transition-delay:calc(.18s + var(--k)*.05s)}
.mnav__nav a.is-on{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:8px}
.mnav__ft{display:flex;flex-direction:column;gap:20px;padding-top:24px;border-top:1px solid rgb(255 255 255/.25);opacity:0;transition:opacity .4s .4s}
.mnav.is-open .mnav__ft{opacity:1}
.mnav__ft .btn{align-self:flex-start;background:#262626;color:var(--paper)}
.mnav__ft p{opacity:.75}

/* Footer */
.ft{padding:115px var(--g) 77px;background:var(--ink) url(../img/wellen.png) left top repeat;color:var(--paper)}
.ft__so{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;padding-bottom:40px;border-bottom:1px solid rgb(255 255 255/.3);text-align:center}
.ft__so p+p{border-left:1px solid rgb(255 255 255/.5)}
.ft__so a{font-size:var(--t2);line-height:var(--lh-t);text-transform:capitalize}
.ft__so a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:10px}
.ft__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:var(--sp)}
.ft__cols p+p{margin-top:27px}
.ft__cols strong{font-weight:600}
.ft__cols a{color:rgb(255 255 255/.75)}
.ft__cols a:hover{color:var(--paper)}
.ft__end{display:flex;justify-content:space-between;align-items:flex-end;margin-top:var(--sp)}
.ft__end img{width:clamp(140px,14vw,280px);height:auto}
.l7{display:inline-flex;align-items:center;gap:8px;margin-left:.3em;color:rgb(255 255 255/.85)}
.l7 b{font-weight:600;color:var(--paper)}
.l7 svg{width:32px;height:16px}
@media (max-width:690px){
  .ft{padding:22px var(--g) 40px}
  .ft__so{padding-bottom:20px}
  .ft__cols{grid-template-columns:1fr;margin-top:4vw}
  .ft__end{flex-direction:column-reverse;align-items:stretch;margin-top:4vw;gap:8px}
  .ft__cols p+p{margin-top:22px}
  .ft__end img{align-self:flex-end}
}