@font-face{font-family:"Inter Tight";font-weight:400;font-display:swap;src:url(fonts/inter-tight-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-weight:500;font-display:swap;src:url(fonts/inter-tight-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter Tight";font-weight:600;font-display:swap;src:url(fonts/inter-tight-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2")}

:root{--ground:#12161C;--text:#F2EFE8;--muted:#C9CCD2;--quiet:#A9ADB5;--accent:#C8A46B}
*{box-sizing:border-box}
html,body{margin:0;background:var(--ground);color:var(--text)}
body{font-family:"Inter Tight",system-ui,sans-serif;min-height:100vh;display:flex}
.page{width:100%;max-width:1520px;margin:0 auto;padding:clamp(32px,6vw,120px) clamp(24px,10vw,200px);display:flex;flex-direction:column;justify-content:space-between;gap:72px;min-height:100vh}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}
.top{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.mark{width:64px;height:64px;border:2px solid var(--accent);color:var(--accent);font-weight:600;font-size:24px;display:flex;align-items:center;justify-content:center;text-decoration:none}
.claim{font-size:clamp(12px,1.2vw,18px);letter-spacing:.16em;color:var(--quiet);text-transform:uppercase}
h1{margin:0;font-size:clamp(44px,6vw,88px);font-weight:600;letter-spacing:-.015em;line-height:1.05}
.role{font-size:clamp(20px,2.2vw,34px);font-weight:500;color:var(--accent);margin:22px 0 0}
.rule{width:72px;height:2px;background:var(--accent);margin:44px 0 36px;border:0}
.company{font-size:clamp(17px,1.6vw,24px);line-height:1.5;color:var(--muted);margin:0}
.bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
dl.contact{margin:0;display:grid;grid-template-columns:64px auto;row-gap:14px;font-size:clamp(17px,1.7vw,26px);line-height:1.3}
dl.contact dt{color:var(--accent);font-size:.78em;align-self:baseline}
dl.contact dd{margin:0}
a{color:var(--text);text-decoration:none;border-bottom:1px solid transparent}
a:hover,a:focus-visible{border-bottom-color:var(--accent);outline:none}
.side{text-align:right}
.focus{font-size:clamp(15px,1.4vw,22px);font-weight:500;margin:0}
.lang{font-size:clamp(12px,1.1vw,18px);letter-spacing:.08em;color:var(--quiet);margin:14px 0 0}
footer{font-size:14px;color:var(--quiet)}
footer a{color:var(--quiet)}

/* Text pages (Impressum, Datenschutz) */
.legal{max-width:760px}
.legal h1{font-size:clamp(36px,4.5vw,64px)}
.legal h2{font-size:20px;font-weight:600;color:var(--accent);margin:44px 0 12px}
.legal p,.legal li{font-size:17px;line-height:1.65;color:var(--muted);margin:0 0 12px}
.legal ul{padding-left:20px;margin:0 0 12px}
.legal dl{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:10px 24px;margin:0;font-size:17px;line-height:1.5}
.legal dt{color:var(--quiet)}
.legal dd{margin:0;color:var(--text)}
.legal .todo{color:var(--accent)}

@media (max-width:760px){.side{text-align:left}dl.contact{grid-template-columns:48px auto}.legal dl{grid-template-columns:1fr;gap:2px}.legal dd{margin-bottom:12px}}