/* Projekt 2045 – Design-Tokens, 1:1 aus dem Übergabepaket (tokens/colors, typography, spacing, borders, motion).
   Schriften sind in theme.json per fontFace eingebunden. */

/* ---- colors ---- */
:root{
/* base — the brand runs on three colours */
--red-500:#e3000f;--red-600:#b8000c;--red-700:#8f0009;--red-100:#fde5e6;
--black:#000000;--white:#ffffff;
--sand-500:#e7dac5;--sand-300:#efe7d9;--sand-100:#f7f2ea;
--grey-900:#1a1a1a;--grey-700:#4d4d4d;--grey-500:#808080;--grey-300:#cccccc;--grey-200:#e6e6e6;--grey-100:#f2f2f2;--grey-050:#fafafa;
/* utility signals — interface only, never in campaign artwork */
--signal-success:#007a3d;--signal-warning:#8a5a00;--signal-error:var(--red-500);
/* semantic — text */
--text-primary:var(--black);--text-secondary:var(--grey-700);--text-muted:var(--grey-500);
--text-inverse:var(--white);--text-accent:var(--red-500);--text-on-accent:var(--white);
/* semantic — surface */
--surface-page:var(--white);--surface-card:var(--white);--surface-muted:var(--grey-100);
--surface-inverse:var(--red-500);--surface-accent:var(--red-500);--surface-accent-soft:var(--red-100);
--surface-warm:var(--sand-500);--surface-warm-soft:var(--sand-100);
/* semantic — border */
--border-strong:var(--black);--border-subtle:var(--grey-300);--border-inverse:var(--white);--border-accent:var(--red-500);
/* semantic — interaction */
--action-primary-bg:var(--black);--action-primary-bg-hover:var(--red-500);--action-primary-bg-active:var(--red-600);
--action-accent-bg:var(--red-500);--action-accent-bg-hover:var(--red-600);--action-accent-bg-active:var(--red-700);
--focus-ring:var(--red-500);
}
[data-theme="inverse"]{--text-primary:var(--white);--text-secondary:var(--white);--text-muted:var(--red-100);--text-inverse:var(--black);
--surface-page:var(--red-500);--surface-card:var(--red-500);--surface-muted:var(--red-600);--surface-inverse:var(--white);
--border-strong:var(--white);--border-subtle:var(--red-100);
--action-primary-bg:var(--white);--action-primary-bg-hover:var(--black);--action-primary-bg-active:var(--black);--text-on-accent:var(--white);}

/* ---- typography ---- */
:root{
--font-sans:"Familjen Grotesk","Helvetica Neue",Arial,sans-serif;
/* Display: Archivo Expanded 900 – einziger Schnitt. Nur Headlines, Zahlen, Marquee */
--font-display:"Archivo Expanded","Familjen Grotesk","Helvetica Neue",Arial,sans-serif;
--display-stretch:125%;--weight-display:900;
--font-mono:ui-monospace,"SFMono-Regular",Menlo,monospace;
--weight-black:900;--weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700;
/* type scale — 1.28 ratio, tuned for poster-scale display type */
--size-2xs:0.75rem;--size-xs:0.8125rem;--size-sm:0.875rem;--size-base:1rem;--size-md:1.125rem;--size-lg:1.3125rem;
--size-xl:1.625rem;--size-2xl:2rem;--size-3xl:2.625rem;--size-4xl:3.5rem;--size-5xl:4.5rem;--size-6xl:6rem;
--leading-tight:0.94;--leading-display:1.02;--leading-snug:1.2;--leading-normal:1.45;--leading-relaxed:1.6;
--tracking-display:-0.02em;--tracking-heading:-0.01em;--tracking-normal:0;--tracking-wide:0.06em;--tracking-label:0.12em;
/* semantic roles */
--text-display:var(--weight-black) expanded var(--size-5xl)/var(--leading-tight) var(--font-display);
--text-h1:var(--weight-black) expanded var(--size-4xl)/var(--leading-display) var(--font-display);
--text-h2:800 expanded var(--size-2xl)/var(--leading-snug) var(--font-display);
--text-h3:var(--weight-bold) var(--size-xl)/var(--leading-snug) var(--font-sans);
--text-claim:var(--weight-bold) var(--size-xl)/var(--leading-snug) var(--font-sans);
--text-lead:var(--weight-medium) var(--size-lg)/var(--leading-normal) var(--font-sans);
--text-body:var(--weight-regular) var(--size-base)/var(--leading-relaxed) var(--font-sans);
--text-small:var(--weight-regular) var(--size-sm)/var(--leading-normal) var(--font-sans);
--text-label:var(--weight-bold) var(--size-xs)/1.2 var(--font-sans);
--text-button:var(--weight-bold) var(--size-base)/1 var(--font-sans);
}

/* ---- spacing ---- */
:root{
--space-0:0;--space-1:0.25rem;--space-2:0.5rem;--space-3:0.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;
--space-7:3rem;--space-8:4rem;--space-9:6rem;--space-10:8rem;
--gutter:var(--space-5);--section-y:var(--space-9);
--container-narrow:44rem;--container-text:60rem;--container-wide:78rem;--container-full:100%;
--page-padding-inline:clamp(1rem,5vw,4rem);
--control-height-sm:2rem;--control-height-md:2.75rem;--control-height-lg:3.5rem;
}

/* ---- borders ---- */
:root{
--border-width-hair:1px;--border-width:2px;--border-width-thick:3px;--border-width-block:6px;
--border-hair:var(--border-width-hair) solid var(--border-subtle);
--border-solid:var(--border-width) solid var(--border-strong);
--border-accent-solid:var(--border-width) solid var(--border-accent);
/* everything is square – only radio circles are round */
--radius-none:0;--radius-media:0;--radius-card:0;--radius-full:9999px;
/* the only shadow in the system: a hard offset block, no blur */
--shadow-none:none;--shadow-hard:0.375rem 0.375rem 0 var(--border-strong);--shadow-hard-accent:0.375rem 0.375rem 0 var(--red-500);--shadow-hard-lg:0.625rem 0.625rem 0 var(--border-strong);
--focus-outline:var(--border-width-thick) solid var(--focus-ring);--focus-offset:2px;
}

/* ---- motion ---- */
:root{
--duration-instant:80ms/* @kind other */;
--duration-fast:140ms/* @kind other */;
--duration-base:200ms/* @kind other */;
--duration-slow:320ms/* @kind other */;
--ease-out:cubic-bezier(0.2,0,0,1)/* @kind other */;
--ease-in-out:cubic-bezier(0.4,0,0.2,1)/* @kind other */;
--ease-linear:linear/* @kind other */;
--transition-control:background-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out)/* @kind other */;
}
@media (prefers-reduced-motion:reduce){:root{--duration-instant:0ms/* @kind other */;--duration-fast:0ms/* @kind other */;--duration-base:0ms/* @kind other */;--duration-slow:0ms/* @kind other */}}