/* ============================================================
   EOT — END OF TIME · the legal and secondary pages.

   The homepage is one self-contained file. These pages share
   this sheet so they stay small, and they now share its dark
   field, its Didone and its chrome, so that clicking Impressum
   does not feel like leaving the house.
   ============================================================ */

/* Bodoni carries the headings; Inter carries the text and defers to whatever
   Helvetica the visitor already owns. There is no third face: the monospace
   that used to set every label here is gone. */
@font-face{font-family:"Bodoni Moda";font-style:normal;font-weight:400 500;
  font-display:swap;src:url(/assets/bodoni.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:200 600;
  font-display:swap;src:url(/assets/inter.woff2) format("woff2")}

:root{
  --paper:#0a0908; --paper-2:#100e0c;
  --ink:#f4efe4; --ink-2:#b3aa9a; --ink-3:#8b8375; --ink-4:#797265;
  --gold:#c9a55c; --gold-text:#d9b978; --gold-lit:#e6ca8e;
  --rule:rgba(244,239,228,.13); --rule-strong:rgba(244,239,228,.24);
  --rule-2:rgba(244,239,228,.07);
  --gold-rule:rgba(201,165,92,.42);

  --display:"Bodoni Moda",Didot,"Bodoni 72","Bodoni MT",Georgia,serif;
  --sans:"Inter","Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif;
  --mono:var(--sans);        /* kept as a name so the pages need no edits */
  --serif:var(--display);
  --body:var(--sans);
  --gut:clamp(20px,5vw,56px);
  --rail:46px;
  --safe-l:env(safe-area-inset-left,0px);
  --safe-r:env(safe-area-inset-right,0px);
  --safe-b:env(safe-area-inset-bottom,0px);
  --ease:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:92px}
html.rail-on{scrollbar-width:none;-ms-overflow-style:none}
html.rail-on::-webkit-scrollbar{width:0;height:0;display:none}
body{margin:0;background:var(--paper);color:var(--ink-2);
  font-family:var(--sans);font-size:16px;line-height:1.76;font-weight:300;
  letter-spacing:.004em;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:var(--gold-text);text-decoration:none;border-bottom:1px solid var(--gold-rule)}
a:hover{color:var(--gold-lit);border-color:var(--gold-lit)}
:focus-visible{outline:2px solid var(--gold-lit);outline-offset:3px}
::selection{background:rgba(201,165,92,.26);color:#fff}

.skip{position:fixed;top:-100px;left:12px;z-index:99;background:var(--gold-lit);color:#100e0c;
  padding:12px 20px;font-size:13px;letter-spacing:.16em;text-transform:uppercase;
  border:0;transition:top .2s var(--ease)}
.skip:focus{top:12px}

.lhdr{position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--paper) 86%,transparent);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--rule-2);
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px;
  padding:16px calc(var(--gut) + var(--safe-r)) 16px calc(var(--gut) + var(--safe-l))}
.lhdr .mark{font-family:var(--display);font-size:15px;font-weight:400;letter-spacing:.6em;
  color:var(--ink);border:0}
.lhdr nav{display:flex;flex-wrap:wrap;gap:8px 20px}
.lhdr nav a{font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--ink-3);border:0;padding:10px 0;border-bottom:1px solid transparent}
.lhdr nav a:hover,.lhdr nav a[aria-current]{color:var(--ink);border-bottom-color:var(--gold)}

main{max-width:74ch;margin:0 auto;
  padding:clamp(40px,8vh,88px) calc(var(--gut) + var(--safe-r))
          calc(clamp(56px,10vh,120px) + var(--safe-b)) calc(var(--gut) + var(--safe-l))}
.eyebrow{font-size:10.5px;font-weight:400;letter-spacing:.3em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 20px}
h1{font-family:var(--display);font-weight:400;font-size:clamp(34px,5.6vw,64px);
  line-height:1.04;letter-spacing:-.022em;color:var(--ink);margin:0 0 30px;text-wrap:balance}
h2{font-family:var(--display);font-weight:400;font-size:clamp(23px,3vw,34px);
  line-height:1.14;letter-spacing:-.016em;color:var(--ink);margin:clamp(48px,7vh,80px) 0 20px;
  padding-bottom:14px;border-bottom:1px solid var(--rule-2)}
h3{font-family:var(--sans);font-weight:400;font-size:17px;line-height:1.34;letter-spacing:-.012em;
  color:var(--ink);margin:36px 0 10px}
h4{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3);margin:26px 0 8px}
p{margin:0 0 1.05em}
ol,ul{margin:0 0 1.3em;padding-left:1.5em}
ol{list-style:decimal}
ul{list-style:none}
ul>li{position:relative;padding-left:1em}
ul>li::before{content:"·";position:absolute;left:0;color:var(--gold)}
li{margin-bottom:.55em}
li>ol,li>ul{margin-top:.6em}
strong{font-weight:500;color:var(--ink)}
address{font-style:normal;margin:0 0 1em}
dl{margin:0 0 1.2em}dt{font-weight:500;color:var(--ink);margin-top:.9em}dd{margin:0 0 .4em}
blockquote{margin:1.5em 0;padding:18px 22px;border-left:2px solid var(--gold-rule);
  background:var(--paper-2);font-size:15.5px}
table{width:100%;border-collapse:collapse;margin:0 0 1.5em;font-size:14.5px}
th,td{text-align:left;vertical-align:top;padding:13px 14px;border:1px solid var(--rule-2)}
th{background:var(--paper-2);font-weight:400;color:var(--ink-3);
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase}

.auth{display:inline-block;margin-left:.7em;font-style:normal;
  font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);
  vertical-align:middle}
.draft{margin:0 0 clamp(32px,5vh,56px);padding:clamp(18px,2.6vw,26px);
  border:1px solid var(--gold-rule);background:rgba(201,165,92,.05);
  font-size:13px;line-height:1.7;color:var(--ink-2)}
.draft strong{color:var(--gold-lit)}
mark.fill{background:rgba(201,165,92,.16);color:var(--gold-lit);padding:1px 6px;
  border-bottom:1px dashed var(--gold);font-style:normal;font-size:.94em}
.stamp{margin-top:clamp(44px,7vh,76px);padding-top:20px;border-top:1px solid var(--rule-2);
  font-size:11.5px;letter-spacing:.04em;color:var(--ink-3)}

.lftr{border-top:1px solid var(--rule-2);background:var(--paper-2);
  display:flex;flex-wrap:wrap;gap:14px 28px;justify-content:space-between;
  padding:28px calc(var(--gut) + var(--safe-r)) calc(28px + var(--safe-b)) calc(var(--gut) + var(--safe-l));
  font-size:11.5px;letter-spacing:.06em;color:var(--ink-3)}
.lftr a{border:0;color:var(--ink-3)}
.lftr a:hover{color:var(--gold-lit)}

/* ── the cursor, exactly as on the homepage ───────────────────────────── */
.cur-dot,.cur-ring{position:fixed;top:0;left:0;z-index:8000;pointer-events:none;
  border-radius:50%;opacity:0;will-change:transform;
  transition:opacity .4s var(--ease),width .55s var(--ease),height .55s var(--ease),
    margin .55s var(--ease),background-color .55s var(--ease),border-color .55s var(--ease)}
.cur-dot{width:5px;height:5px;margin:-2.5px 0 0 -2.5px;background:var(--gold-lit)}
.cur-ring{width:44px;height:44px;margin:-22px 0 0 -22px;
  border:1px solid rgba(201,165,92,.55);background:rgba(201,165,92,.04)}
html.cur-on .cur-dot,html.cur-on .cur-ring{opacity:1}
html.cur-on.cur-out .cur-dot,html.cur-on.cur-out .cur-ring{opacity:0}
html.cur-on,html.cur-on *{cursor:none !important}
html.cur-act .cur-ring{width:92px;height:92px;margin:-46px 0 0 -46px;
  border-color:var(--gold-lit);background:rgba(201,165,92,.10)}
html.cur-act .cur-dot{opacity:0}
html.cur-down .cur-ring{width:34px;height:34px;margin:-17px 0 0 -17px;
  background:rgba(201,165,92,.20)}
@media (hover:none),(pointer:coarse){
  .cur-dot,.cur-ring{display:none}
  html.cur-on,html.cur-on *{cursor:auto !important}
}

/* ── the progress rail, exactly as on the homepage ────────────────────── */
.rail{position:fixed;top:0;right:0;bottom:0;width:var(--rail);z-index:60;
  padding-right:var(--safe-r);touch-action:none;opacity:0;transition:opacity .8s var(--ease)}
html.rail-on .rail{opacity:1}
.rail::before{content:"";position:absolute;top:0;bottom:0;right:calc(18px + var(--safe-r));
  width:1px;background:var(--rule-2)}
.rail-fill{position:absolute;top:0;right:calc(18px + var(--safe-r));width:1px;height:0;
  background:linear-gradient(180deg,rgba(201,165,92,.35),var(--gold))}
.rail-thumb{position:absolute;right:0;width:var(--rail);height:34px;
  display:flex;align-items:center;justify-content:flex-end;cursor:grab}
.rail-thumb::before{content:"";position:absolute;right:calc(16px + var(--safe-r));
  top:50%;margin-top:-13px;width:5px;height:26px;
  background:linear-gradient(180deg,var(--gold-lit),var(--gold));
  transition:width .4s var(--ease),right .4s var(--ease)}
.rail:hover .rail-thumb::before,.rail.drag .rail-thumb::before{width:9px;right:calc(14px + var(--safe-r))}
.rail.drag .rail-thumb{cursor:grabbing}
.rail-thumb:focus-visible{outline:2px solid var(--gold-lit);outline-offset:-6px}
@media (hover:none),(pointer:coarse){
  .rail{width:16px}
  .rail-thumb{pointer-events:none;width:16px}
  .rail::before,.rail-fill{right:calc(6px + var(--safe-r))}
  .rail-thumb::before{right:calc(4px + var(--safe-r));width:3px}
}

@media (max-width:899px){
  body{font-size:16px}
  main{max-width:none}
  .lhdr nav a{padding:12px 0}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;transition-duration:.001ms !important}
  html{scroll-behavior:auto}
}

@media print{
  body{background:#fff;color:#000}
  .lhdr,.lftr,.rail,.cur-dot,.cur-ring,.skip{display:none !important}
  main{max-width:none;padding:0}
  a{color:#000;border:0}
  h1,h2,h3,strong,dt{color:#000}
  th{background:#eee;color:#000}
  mark.fill{background:#ffe9a8;color:#000}
}
