/* Datenschutz and Impressum. These are read, not browsed: one column, generous
   measure, no motion, nothing to click past. The type and colour come from the
   site so they do not read as a different website, but nothing here depends on
   the landing page's stylesheets. */

:root{
  --ink:#131A22;
  --ink-2:#0C141C;
  --amber:#FF9900;
  --paper:#F2F2F2;
  --ink-soft:#5A6570;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:'Inter',system-ui,sans-serif;
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.7;
}

.legal-top{
  background:var(--ink-2);
  padding:20px 0;
}
.legal-wrap{width:min(100% - 48px, 780px); margin:0 auto;}
.legal-top .legal-wrap{display:flex; align-items:center; justify-content:space-between; gap:18px;}
.legal-logo{
  display:inline-flex; align-items:center; gap:9px;
  font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:25px;
  color:#fff; text-decoration:none; letter-spacing:-0.01em;
}
.legal-back{
  font-size:13px; color:#B7BEC5; text-decoration:none;
  border-bottom:1px solid transparent; transition:color .25s ease, border-color .25s ease;
}
.legal-back:hover{color:#fff; border-bottom-color:var(--amber);}

main{padding:64px 0 96px;}
h1{
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:clamp(34px,5vw,52px); line-height:1.08; letter-spacing:-0.02em;
  margin:0 0 10px;
}
.legal-sub{font-size:15px; color:var(--ink-soft); margin:0 0 44px;}
h2{
  font-family:'Barlow Condensed',sans-serif; font-weight:700;
  font-size:clamp(22px,2.6vw,29px); line-height:1.15;
  margin:44px 0 12px; padding-top:28px; border-top:1px solid #131a2218;
}
h3{font-size:15.5px; font-weight:600; margin:24px 0 6px;}
p, li{font-size:15px; color:#2D3640;}
p{margin:0 0 14px; max-width:68ch;}
ul{margin:0 0 16px; padding-left:20px; max-width:68ch;}
li{margin-bottom:7px;}
a{color:#0E4C7A; text-underline-offset:3px;}
a:hover{color:var(--ink);}
strong{font-weight:600;}

.legal-note{
  margin:0 0 34px; padding:16px 20px;
  background:#fff6e6; border-left:3px solid var(--amber); border-radius:0 8px 8px 0;
  font-size:14px; color:#52412a;
}
.legal-note p{color:inherit; font-size:inherit; margin:0;}
.legal-note p + p{margin-top:8px;}

/* Anything the operator still has to supply. It is marked rather than guessed:
   an address invented for a legal notice would be worse than a visible gap. */
.todo{
  background:#ffe2e2; color:#7d1515; font-weight:600;
  padding:1px 7px; border-radius:4px; font-size:0.92em;
}

.legal-meta{
  margin-top:52px; padding-top:22px; border-top:1px solid #131a2218;
  font-size:13px; color:var(--ink-soft);
}

.legal-en{margin-top:72px;}
.legal-en > h2:first-child{border-top:3px solid var(--ink); padding-top:34px;}

footer{background:var(--ink-2); color:#8A939C; padding:30px 0; font-size:13px;}
footer .legal-wrap{display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:space-between;}
footer a{color:#B7BEC5;}
footer a:hover{color:#fff;}

@media (max-width:620px){
  main{padding:44px 0 64px;}
  h2{margin-top:34px;}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}