/* Zeit base for the generated pages: tokens, typography, buttons, footer (subset of /css/zeit.css,
   without its component classes like .card/.hero that clash with the seo-*.css page layouts). */
:root{
  --black:#000;--white:#fff;--red:#e5000f;--red-dark:#b3000c;--red-darker:#80000a;
  --grey-950:#0a0a0a;--grey-900:#171717;--grey-700:#404040;--grey-500:#6b6b6b;--grey-400:#a3a3a3;--grey-200:#e5e5e5;--grey-100:#f5f5f5;
  --bg-dark:var(--black);--bg-dark-subtle:var(--grey-900);--bg-dark-hover:#1f1f1f;--bg-dark-pressed:var(--grey-700);
  --bg-light:var(--white);--bg-light-hover:var(--grey-200);--bg-light-pressed:var(--grey-400);--bg-subtle:var(--grey-100);
  --bg-neutral:var(--grey-400);--bg-neutral-hover:var(--grey-200);--bg-neutral-pressed:var(--grey-100);
  --bg-accent:var(--red);--bg-disabled:var(--grey-700);
  --text-on-dark:var(--white);--text-on-dark-secondary:var(--grey-400);--text-on-light:var(--black);--text-on-light-secondary:var(--grey-500);--text-accent:var(--red);--text-disabled:var(--grey-400);
  --border-on-dark:var(--grey-700);--border-light:var(--white);--border-on-light:var(--grey-200);--border-strong:var(--black);--border-disabled:var(--grey-700);--border-focus:var(--red);
  --radius:0;--radius-emphasis:999px;
  --space-4:4px;--space-8:8px;--space-12:12px;--space-16:16px;--space-20:20px;--space-24:24px;--space-28:28px;--space-32:32px;--space-40:40px;--space-48:48px;--space-56:56px;--space-64:64px;--space-80:80px;--space-96:96px;
  --layout-margin:clamp(20px,11.1vw,160px);--layout-reading:720px;
  --font-sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--font-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-sans);color:var(--text-on-light);background:var(--bg-light);line-height:1.5;font-size:15px}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit}
:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
.reading{max-width:var(--layout-reading)}

/* ---------- Typografie ---------- */
.t-display-xl{font-weight:700;font-size:clamp(72px,11vw,160px);line-height:.94;letter-spacing:-.04em;text-transform:lowercase}
.t-display-l{font-weight:700;font-size:clamp(56px,6.7vw,96px);line-height:1;letter-spacing:-.03em;text-transform:lowercase}
.t-headline-l{font-weight:700;font-size:clamp(30px,2.8vw,40px);line-height:1.2;letter-spacing:-.02em;text-transform:lowercase}
.t-headline-m{font-weight:700;font-size:32px;line-height:40px;letter-spacing:-.02em;text-transform:lowercase}
.t-title-l{font-weight:600;font-size:22px;line-height:28px;letter-spacing:-.01em;text-transform:lowercase}
.t-title-m{font-weight:600;font-size:20px;line-height:26px;letter-spacing:-.01em;text-transform:lowercase}
.t-lead{font-size:20px;line-height:30px}
.t-body-l{font-size:17px;line-height:26px}
.t-body-m{font-size:15px;line-height:23px}
.t-body-s{font-size:14px;line-height:20px}
.t-body-xs{font-size:13px;line-height:18px}
.t-label{font-weight:500;font-size:15px;line-height:20px;text-transform:lowercase}
.t-label-s{font-weight:600;font-size:13px;line-height:18px;text-transform:lowercase}
.t-label-ui{font-weight:500;font-size:15px;line-height:20px}
.t-eyebrow{font-family:var(--font-mono);font-weight:500;font-size:12px;line-height:16px;letter-spacing:.12em;text-transform:uppercase}
.t-tag{font-family:var(--font-mono);font-weight:500;font-size:11px;line-height:14px;letter-spacing:.1em;text-transform:uppercase}
.t-code{font-family:var(--font-mono);font-weight:500;font-size:13px;line-height:18px}
.t-value{font-family:var(--font-mono);font-weight:600;font-size:20px;line-height:24px}
.c-sec{color:var(--text-on-light-secondary)}
.c-dsec{color:var(--text-on-dark-secondary)}
.c-accent{color:var(--text-accent)}


.eyebrow-row{display:flex;align-items:center;gap:10px;color:var(--text-on-dark-secondary)}
.eyebrow-row .accent{width:24px;height:2px;background:var(--bg-accent)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-8);height:48px;padding:0 var(--space-24);font-weight:500;font-size:15px;line-height:20px;text-transform:lowercase;white-space:nowrap;cursor:pointer;border:0;border-radius:var(--radius);background:var(--bg-light);color:var(--text-on-light)}
.btn--m{height:40px;padding:0 var(--space-16)}
.btn--primary{border-radius:var(--radius-emphasis)}
.btn--tertiary{background:var(--bg-neutral)}
.btn--ghost{background:transparent;color:var(--text-on-dark)}
.btn:hover,.btn.is-hover{background:var(--bg-light-hover)}
.btn:active,.btn.is-pressed{background:var(--bg-light-pressed)}
.btn--tertiary:hover,.btn--tertiary.is-hover{background:var(--bg-neutral-hover)}
.btn--tertiary:active,.btn--tertiary.is-pressed{background:var(--bg-neutral-pressed)}
.btn--ghost:hover,.btn--ghost.is-hover{background:var(--bg-dark-hover)}
.btn--ghost:active,.btn--ghost.is-pressed{background:var(--bg-dark-pressed)}
.btn[disabled],.btn.is-disabled,.btn[disabled]:hover{background:var(--bg-disabled);color:var(--text-disabled);cursor:not-allowed}
.is-focus{outline:2px solid var(--border-focus);outline-offset:2px}

/* ---------- Footer ---------- */
.footer{background:var(--bg-dark);color:var(--text-on-dark);padding:72px var(--layout-margin) var(--space-40);display:flex;flex-direction:column;gap:var(--space-56)}
.footer .top{display:flex;justify-content:space-between;gap:var(--space-40);flex-wrap:wrap}
.footer .brand{display:flex;flex-direction:column;gap:var(--space-16);max-width:320px}
.footer .brand p{color:var(--text-on-dark-secondary)}
.footer .columns{display:flex;gap:var(--space-80);flex-wrap:wrap}
.footer .col{display:flex;flex-direction:column;gap:14px;list-style:none}
.footer .col li:first-child{color:var(--text-on-dark-secondary);margin-bottom:4px}
.footer .col a{font-weight:500;text-transform:lowercase}
.footer .col a:hover{color:var(--text-accent)}
.footer .divider{height:1px;background:var(--border-on-dark)}
.footer .bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--text-on-dark-secondary)}
.footer .bottom a{text-decoration:underline;text-underline-offset:3px}.footer .bottom a:hover{color:var(--text-on-dark)}
@media (max-width:760px){.footer .columns{gap:40px}}