/* Timo Franke – shared look for the sub pages (Rustikal Radikal) */
:root{
  --char:#141519; --char-2:#1E2026; --white:#F3F3F1; --soft:#B7BAC2;
  --copper:#D9967B; --paper:#E7E6E2; --ink:#141519; --ink-soft:#4A4D55; --red:#B4553A;
  --f:"Montserrat", system-ui, sans-serif;
  --fs-small:14px; --fs-body:18px; --fs-lead:clamp(20px,1.8vw,26px); --fs-h3:clamp(28px,3vw,44px); --fs-h2:clamp(34px,5vw,80px); --fs-giant:clamp(64px,11vw,176px);
  --m:32px; --gap:24px; --section:160px; --ease:cubic-bezier(.16,1,.3,1);
}
@media (max-width:760px){:root{--m:16px;--gap:16px;--section:88px;--fs-body:17px}}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--char);color:var(--white);font-family:var(--f);font-weight:500;font-size:var(--fs-body);line-height:1.6;overflow-x:clip;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--copper);outline-offset:3px}
::selection{background:var(--copper);color:var(--char)}
h1,h2,h3{margin:0;font-weight:900;text-transform:uppercase;letter-spacing:-0.02em;line-height:.92}
p{margin:0}
.wrap{padding-left:var(--m);padding-right:var(--m)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--copper);color:var(--char);font-family:inherit;font-size:var(--fs-body);font-weight:700;text-decoration:none;padding:17px 26px;border:0;cursor:pointer;transition:background .2s,color .2s,transform .15s}
.btn:hover{background:var(--white);color:var(--char)}
.btn:active{transform:translateY(2px)}
.btn--dark{background:var(--char);color:var(--white)}
.btn--dark:hover{background:var(--copper);color:var(--char)}
.tlink{font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px;transition:text-underline-offset .2s,color .2s}
.tlink:hover{text-underline-offset:10px;color:var(--copper)}

/* Bar */
.bar{position:relative;z-index:5;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px var(--m)}
.bar--over{position:absolute;top:0;left:0;right:0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:900;text-transform:uppercase;letter-spacing:.02em;font-size:18px;white-space:nowrap}
.brand img{width:48px;height:48px}
.nav{display:flex;gap:28px;align-items:center;font-weight:700;font-size:var(--fs-small)}
.nav a{text-decoration:none;transition:color .2s}
.nav a:hover,.nav a[aria-current=page]{color:var(--copper)}
.nav .btn{padding:12px 18px;font-size:var(--fs-small);white-space:nowrap}
.nav .btn:hover{color:var(--char)}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;font-weight:700;padding:12px 8px 12px 4px}
.menu summary::-webkit-details-marker{display:none}
.menu__panel{position:absolute;right:0;top:100%;background:var(--white);color:var(--char);display:flex;flex-direction:column;min-width:220px;padding:8px 0}
.menu__panel a{padding:12px 20px;text-decoration:none;font-weight:700}

/* Section heads */
.head{display:grid;grid-template-columns:7fr 5fr;gap:var(--gap);align-items:end;margin-bottom:56px}
.head h2{font-size:var(--fs-h2)}
.head p{font-size:var(--fs-lead);line-height:1.4;max-width:32ch}
.section{padding-top:var(--section);padding-bottom:var(--section)}
.on-paper{background:var(--paper);color:var(--ink)}
.on-white{background:var(--white);color:var(--ink)}
.on-char2{background:var(--char-2)}
.on-copper{background:var(--copper);color:var(--char)}

/* Ticker */
.ticker{background:var(--copper);color:var(--char);overflow:clip;padding:20px 0}
.ticker__track{display:flex;width:max-content}
.ticker__track span{font-weight:900;text-transform:uppercase;font-size:var(--fs-lead);white-space:nowrap;padding:0 28px}
.ticker__track span i{font-style:normal;opacity:.55;margin-left:56px}
@media (prefers-reduced-motion:no-preference){.ticker__track{animation:tick 40s linear infinite}.ticker:hover .ticker__track{animation-play-state:paused}}
@keyframes tick{to{transform:translateX(-50%)}}

/* Closing band */
.band{display:grid;grid-template-columns:7fr 5fr;gap:var(--gap);align-items:end;padding-top:96px;padding-bottom:96px}
.band h2{font-size:var(--fs-h2)}
.band p{font-size:var(--fs-lead);line-height:1.4;max-width:30ch;margin-bottom:24px}

/* Footer */
.foot{padding-top:120px;padding-bottom:40px;overflow:clip}
.foot__name{font-weight:900;text-transform:uppercase;font-size:var(--fs-giant);line-height:.85;letter-spacing:-0.03em}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){
  .foot__name{animation:push2 linear both;animation-timeline:view();animation-range:entry 0% exit 30%}
}}
@keyframes push2{from{transform:translateX(10%)}to{transform:translateX(-3%)}}
.foot__row{display:grid;grid-template-columns:5fr 1fr 6fr;margin-top:72px}
.foot__places{display:flex;flex-direction:column;gap:6px}
.foot__places a{font-size:var(--fs-h3);font-weight:900;text-transform:uppercase;color:var(--copper);text-decoration:none;line-height:1.1;letter-spacing:-0.02em;transition:color .2s}
.foot__places a:hover{color:var(--white)}
.foot__links{grid-column:3;display:grid;grid-template-columns:repeat(3,1fr);gap:8px 24px;font-size:var(--fs-small);align-content:start}
.foot__links a{text-decoration:none;padding:6px 0}
.foot__links a:hover{color:var(--copper)}
.foot__legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;margin-top:96px;font-size:var(--fs-small);color:var(--soft)}
.foot__legal a{color:var(--soft)}

/* Entrances (desktop only, content never depends on them) */
@media (min-width:1001px){.js [data-reveal] > *{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .8s var(--ease)}}
.js [data-reveal].in > *{opacity:1;transform:none}
.js [data-reveal].in > :nth-child(2){transition-delay:80ms}
.js [data-reveal].in > :nth-child(3){transition-delay:160ms}
.js [data-reveal].in > :nth-child(n+4){transition-delay:240ms}
@media (prefers-reduced-motion:reduce){.js [data-reveal] > *{opacity:1!important;transform:none!important;transition:none}}

@media (max-width:1000px){
  .nav a:not(.btn){display:none}
  .menu{display:block}
  .head,.band{grid-template-columns:1fr}
}
@media (max-width:760px){
  .nav .btn{display:none}
  .brand{font-size:15px}
  .foot__row{grid-template-columns:1fr;gap:48px}
  .foot__links{grid-column:1;grid-template-columns:1fr 1fr}
}