/* Holy Ghost legal pages: same room as the site (near-black, film grain, ember/gold fringe), set as readable long text. */
:root{--ink:#030303;--bone:#f4efe7;--ash:#a8988a;--line:#2b2b2b;--primary:#f8b000;--halo:#ffd98a;--ember:#d9481c;--ease:cubic-bezier(.22,1,.36,1);--gut:clamp(16px,4vw,56px);--topH:64px;
  --f:'Helvetica Neue',Helvetica,Arial,sans-serif;color-scheme:dark}
*{box-sizing:border-box}
html{background:var(--ink);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--bone);font:16px/1.65 var(--f);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}
:focus-visible{outline:2px solid var(--primary);outline-offset:3px}
::selection{background:var(--primary);color:var(--ink)}
.mono{font:500 11px/1 var(--f);letter-spacing:.14em;text-transform:uppercase}

/* backdrop: the hero frame, buried, so the page keeps the film's warmth without competing with the text */
.bg{position:fixed;inset:0;z-index:0;pointer-events:none;background:#000 url(../assets/media/hero.jpg) center/cover;transform:scale(1.03)}
.bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(3,3,3,.9),rgba(3,3,3,.96) 40%,#030303)}
.grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:200;opacity:.2;mix-blend-mode:overlay;animation:grain .6s steps(6) infinite;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
@keyframes grain{0%{transform:translate(0,0)}17%{transform:translate(-4%,3%)}33%{transform:translate(3%,-5%)}50%{transform:translate(-6%,-2%)}67%{transform:translate(5%,4%)}83%{transform:translate(-2%,6%)}100%{transform:translate(0,0)}}

/* top bar: no fill, two blur layers fading out, like the site */
.l-top{position:fixed;left:0;right:0;top:0;z-index:100;height:var(--topH);padding:0 var(--gut);display:flex;align-items:center;justify-content:space-between;gap:16px}
.l-top::before,.l-top::after{content:"";position:absolute;left:0;right:0;top:0;z-index:-1;pointer-events:none}
.l-top::before{bottom:-26px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);-webkit-mask-image:linear-gradient(to bottom,#000 10%,transparent);mask-image:linear-gradient(to bottom,#000 10%,transparent)}
.l-top::after{bottom:-6px;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);-webkit-mask-image:linear-gradient(to bottom,#000 20%,transparent 85%);mask-image:linear-gradient(to bottom,#000 20%,transparent 85%)}
.l-top .logo img{height:34px;width:auto;display:block}
.l-top nav{display:flex;align-items:center;gap:clamp(14px,2.4vw,28px)}
.l-top nav>a{color:rgba(244,239,231,.6);text-decoration:none;transition:color .25s}
.l-top nav>a:hover,.l-top nav>a[aria-current]{color:var(--bone)}
.l-top nav>a[aria-current]{color:var(--primary)}
.lang{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:3px;border-radius:999px;background:rgba(244,239,231,.08);box-shadow:inset 0 0 0 1px rgba(244,239,231,.12);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.lang::before{content:"";position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:var(--bone);transition:transform .5s var(--ease)}
.lang[data-cur=en]::before{transform:translateX(100%)}
.lang button{position:relative;z-index:1;background:none;border:0;padding:.55em 1.05em;font:600 11.5px/1 var(--f);letter-spacing:.06em;color:rgba(244,239,231,.62);cursor:pointer;transition:color .35s}
.lang button[aria-pressed=true]{color:#000}
.lang button:not([aria-pressed=true]):hover{color:var(--bone)}
@media (max-width:560px){.l-top nav>a{display:none}}

/* page */
main{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:calc(var(--topH) + clamp(48px,10vh,120px)) var(--gut) clamp(72px,12vh,140px)}
.eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 clamp(18px,3vh,28px);color:var(--primary)}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
h1{margin:0 0 clamp(28px,5vh,52px);font:700 clamp(3rem,10.5vw,8.6rem)/.84 var(--f);letter-spacing:-.06em;text-transform:uppercase;text-wrap:balance}
.lead{max-width:640px;margin:0 0 clamp(40px,8vh,88px);font-size:clamp(17px,1.5vw,21px);line-height:1.5;font-weight:500;color:var(--bone);text-wrap:pretty}
.note{display:inline-block;margin:0 0 clamp(24px,4vh,40px);padding:.7em 1.1em;border-radius:14px;background:rgba(244,239,231,.06);box-shadow:inset 0 0 0 1px rgba(244,239,231,.14);color:var(--ash);font-size:14px}
@supports (corner-shape:squircle){.note{corner-shape:squircle;border-radius:999px}}

.sec{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:8px clamp(24px,5vw,72px);padding:clamp(28px,5vh,48px) 0;border-top:1px solid rgba(244,239,231,.14)}
.sec:last-of-type{border-bottom:1px solid rgba(244,239,231,.14)}
.sec>h2{margin:0;font:700 clamp(18px,1.7vw,22px)/1.05 var(--f);letter-spacing:-.03em;text-transform:uppercase;color:var(--bone)}
.sec>h2 .n{display:block;margin-bottom:12px;color:var(--primary);font:500 11px/1 var(--f);letter-spacing:.14em}
.sec .b{max-width:680px}
.sec p,.sec li{margin:0 0 .9em;color:#d6cdc1;text-wrap:pretty}
.sec p:last-child,.sec li:last-child{margin-bottom:0}
.sec h3{margin:1.6em 0 .5em;font:600 12px/1.2 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.sec h3:first-child{margin-top:0}
.sec ul{margin:0 0 .9em;padding:0;list-style:none}
.sec li{position:relative;padding-left:1.4em}
.sec li::before{content:"";position:absolute;left:0;top:.78em;width:.6em;height:1px;background:var(--primary)}
.sec b{color:var(--bone);font-weight:600}
.sec a{text-decoration-color:rgba(244,239,231,.35);text-underline-offset:.2em;transition:color .2s,text-decoration-color .2s}
.sec a:hover{color:var(--primary);text-decoration-color:var(--primary)}
address{font-style:normal;color:var(--bone);font-weight:500;line-height:1.5}
.todo{background:rgba(248,176,0,.16);color:var(--primary);padding:0 .35em;border-radius:6px}
.stand{margin:clamp(28px,5vh,48px) 0 0;color:var(--ash)}

html[lang=de] [lang=en],html[lang=en] [lang=de]{display:none}

/* sections lift in like the site's reveals */
.js [data-reveal]{opacity:0;transform:translateY(24px);filter:blur(6px);transition:opacity .9s var(--ease),transform 1.1s var(--ease),filter 1s var(--ease)}
.js [data-reveal].in{opacity:1;transform:none;filter:none}

footer{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:0 var(--gut) 40px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:rgba(244,239,231,.5)}
footer a{text-decoration:none;transition:color .2s}footer a:hover{color:var(--primary)}
footer .r{display:flex;gap:22px}

@media (max-width:760px){.sec{grid-template-columns:minmax(0,1fr)}.sec>h2 .n{display:inline-block;margin:0 12px 0 0}}
@media (prefers-reduced-motion:reduce){.grain{animation:none}html{scroll-behavior:auto}.js [data-reveal]{opacity:1;transform:none;filter:none;transition:none}}
