/*
 * OMAG design system — token and component layer, copied unchanged.
 * Source: design/_ds/oemus-design-system-f7a37ce4-6e51-45b6-9b40-2fd7bbab16a5/
 * Same order as its own styles.css.
 *
 * DO NOT EDIT BY HAND. Changes belong in the design system; this file is
 * generated from it. One deviation: the @font-face rules from tokens/fonts.css
 * are dropped, because theme.json registers the fonts (avoids a double
 * registration).
 */

/* --- tokens/fonts.css (ohne @font-face) --- */
:root{--font-display:'Momo Trust Display',ui-rounded,system-ui,sans-serif;--font-body:'Inter Tight',ui-sans-serif,system-ui,sans-serif;--track-display:-0.025em;--weight-body:400;--weight-caption:600;--weight-highlight:700}

/* --- tokens/colors.css --- */
/* OEMUS MEDIA AG — Markenfarben (Quelle: Praesentation_Corporate_03, S.13+16). Nur diese Konstanten sind "Marke"; alles Abgeleitete via color-mix. */
:root{
--omag-deep-viola:#3c2282;--omag-deep-black:#000618;--omag-dust-white:#fbfaf7;
--omag-print:#86ccd2;--omag-print-light:#c9e6e9;
--omag-online:#ed749e;--omag-online-light:#f7c8dc;
--omag-event:#00aa95;--omag-event-light:#a5d5cb;
--omag-study:#ffed00;--omag-study-light:#fffad1;
--omag-corporate:#f7a83e;--omag-corporate-light:#feead2;
/* Abgeleitete Viola-Stufen (Hover/Tints) */
--omag-viola-deep:color-mix(in oklab,var(--omag-deep-viola),var(--omag-deep-black) 28%);
--omag-viola-hover:color-mix(in oklab,var(--omag-deep-viola),var(--omag-deep-black) 16%);
--omag-viola-70:color-mix(in oklab,var(--omag-deep-viola) 70%,var(--omag-dust-white));
--omag-viola-40:color-mix(in oklab,var(--omag-deep-viola) 40%,var(--omag-dust-white));
--omag-viola-25:color-mix(in oklab,var(--omag-deep-viola) 25%,var(--omag-dust-white));
--omag-viola-12:color-mix(in oklab,var(--omag-deep-viola) 12%,var(--omag-dust-white));
--omag-viola-6:color-mix(in oklab,var(--omag-deep-viola) 6%,var(--omag-dust-white));
/* Semantik: aus Event Green (Erfolg) und Online Rosé (Fehler) abgedunkelt für WCAG-AA-Text auf Weiß */
--omag-success:color-mix(in oklab,var(--omag-event),var(--omag-deep-black) 34%);
--omag-success-soft:color-mix(in oklab,var(--omag-event) 16%,var(--omag-dust-white));
--omag-error:color-mix(in oklab,var(--omag-online),var(--omag-deep-black) 48%);
--omag-error-soft:color-mix(in oklab,var(--omag-online) 16%,var(--omag-dust-white));
/* Dunkle Textfarben je Bereichsfarbe (AA auf Light-Tint) */
--omag-print-ink:color-mix(in oklab,var(--omag-print),var(--omag-deep-black) 62%);
--omag-online-ink:color-mix(in oklab,var(--omag-online),var(--omag-deep-black) 52%);
--omag-event-ink:color-mix(in oklab,var(--omag-event),var(--omag-deep-black) 40%);
--omag-study-ink:color-mix(in oklab,var(--omag-study),var(--omag-deep-black) 62%);
--omag-corporate-ink:color-mix(in oklab,var(--omag-corporate),var(--omag-deep-black) 58%);
}
/* --- tokens/spacing.css --- */
/* 4-px-Raster */
:root{--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;
--control-h-sm:36px;--control-h-md:44px;--control-h-lg:52px}
/* --- tokens/themes.css --- */
/* Zwei Themes auf denselben Brand-Assets. Default = "modern". Umschalten: data-theme="modern"|"ruhig" auf html/body oder jedem Container. */
:root,[data-theme="modern"]{
/* Farbrollen */
--color-primary:var(--omag-deep-viola);--color-primary-hover:var(--omag-viola-hover);--color-primary-active:var(--omag-viola-deep);--on-primary:var(--omag-dust-white);
--color-secondary:var(--omag-online);--color-secondary-soft:var(--omag-online-light);--on-secondary:var(--omag-deep-black);
--color-accent:var(--omag-study);--color-accent-soft:var(--omag-study-light);--on-accent:var(--omag-deep-black);
--surface-page:var(--omag-dust-white);--surface-card:#fff;--surface-sunken:var(--omag-viola-6);--surface-brand:var(--omag-deep-viola);--on-brand:var(--omag-dust-white);
--text-primary:var(--omag-deep-black);--text-secondary:color-mix(in oklab,var(--omag-deep-black) 72%,var(--omag-dust-white));--text-muted:color-mix(in oklab,var(--omag-deep-black) 52%,var(--omag-dust-white));--text-inverse:var(--omag-dust-white);
--link:var(--omag-deep-viola);--link-hover:var(--omag-viola-hover);
--color-success:var(--omag-success);--color-success-soft:var(--omag-success-soft);--color-error:var(--omag-error);--color-error-soft:var(--omag-error-soft);
--border-subtle:color-mix(in oklab,var(--omag-deep-viola) 10%,var(--omag-dust-white));--border-strong:var(--omag-viola-40);--border-input:var(--omag-viola-25);--focus-ring:var(--omag-deep-viola);
/* Radius: stärkere Rundungen */
--radius-xs:8px;--radius-sm:12px;--radius-md:16px;--radius-lg:24px;--radius-xl:32px;--radius-pill:999px;
--radius-control:var(--radius-pill);--radius-input:14px;--radius-card:20px;--radius-badge:var(--radius-pill);
/* Schatten: weich, viola-getönt */
--shadow-card:0 2px 8px rgba(60,34,130,.07),0 12px 32px rgba(60,34,130,.09);
--shadow-pop:0 6px 16px rgba(60,34,130,.14),0 24px 48px rgba(60,34,130,.14);
--shadow-hover:0 6px 14px rgba(60,34,130,.18),0 16px 40px rgba(60,34,130,.14);
/* Motion: Micro-Interactions erlaubt */
--dur-1:130ms;/* @kind other */--dur-2:220ms;/* @kind other */--ease-brand:cubic-bezier(.2,.7,.3,1);/* @kind other */--lift-hover:translateY(-2px);/* @kind other */--press-scale:scale(.98);/* @kind other */
/* Dezente Verläufe */
--grad-brand:linear-gradient(135deg,var(--omag-deep-viola),var(--omag-viola-deep));
--grad-page:linear-gradient(180deg,var(--omag-viola-6),var(--omag-dust-white) 320px);
/* Typo-Skala: große Kontraste */
--text-display-size:64px;--text-display-lh:1.05;--text-h1-size:48px;--text-h1-lh:1.08;--text-h2-size:36px;--text-h2-lh:1.12;--text-h3-size:26px;--text-h3-lh:1.2;--text-lead-size:20px;--text-lead-lh:1.5;--text-body-size:16px;--text-body-lh:1.65;--text-small-size:14px;--text-small-lh:1.5;--text-caption-size:13px;--text-caption-lh:1.45;
/* Komponenten-Maße */
--card-pad:var(--space-8);--section-gap:var(--space-16);--btn-pad-x:26px;--border-w:1.5px;
}
[data-theme="ruhig"]{
--color-primary:var(--omag-deep-viola);--color-primary-hover:var(--omag-viola-hover);--color-primary-active:var(--omag-viola-deep);--on-primary:var(--omag-dust-white);
--color-secondary:var(--omag-print);--color-secondary-soft:var(--omag-print-light);--on-secondary:var(--omag-deep-black);
--color-accent:var(--omag-deep-viola);--color-accent-soft:var(--omag-viola-12);--on-accent:var(--omag-dust-white);
--surface-page:var(--omag-dust-white);--surface-card:#fff;--surface-sunken:color-mix(in oklab,var(--omag-deep-black) 3%,var(--omag-dust-white));--surface-brand:var(--omag-deep-viola);--on-brand:var(--omag-dust-white);
--text-primary:var(--omag-deep-black);--text-secondary:color-mix(in oklab,var(--omag-deep-black) 70%,var(--omag-dust-white));--text-muted:color-mix(in oklab,var(--omag-deep-black) 50%,var(--omag-dust-white));--text-inverse:var(--omag-dust-white);
--link:var(--omag-deep-viola);--link-hover:var(--omag-viola-deep);
--color-success:var(--omag-success);--color-success-soft:var(--omag-success-soft);--color-error:var(--omag-error);--color-error-soft:var(--omag-error-soft);
--border-subtle:color-mix(in oklab,var(--omag-deep-black) 9%,var(--omag-dust-white));--border-strong:color-mix(in oklab,var(--omag-deep-black) 24%,var(--omag-dust-white));--border-input:color-mix(in oklab,var(--omag-deep-black) 18%,var(--omag-dust-white));--focus-ring:var(--omag-deep-viola);
/* Radius: dezent */
--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:10px;--radius-xl:14px;--radius-pill:999px;
--radius-control:6px;--radius-input:6px;--radius-card:10px;--radius-badge:4px;
/* Feine Linien statt Schatten */
--shadow-card:0 1px 2px rgba(0,6,25,.04);
--shadow-pop:0 4px 16px rgba(0,6,25,.08);
--shadow-hover:0 2px 6px rgba(0,6,25,.06);
/* Motion: ruhig, kein Lift */
--dur-1:110ms;/* @kind other */--dur-2:180ms;/* @kind other */--ease-brand:ease-out;/* @kind other */--lift-hover:none;/* @kind other */--press-scale:none;/* @kind other */
--grad-brand:var(--omag-deep-viola);--grad-page:var(--omag-dust-white);
/* Typo-Skala: feinere Abstufung */
--text-display-size:46px;--text-display-lh:1.12;--text-h1-size:34px;--text-h1-lh:1.18;--text-h2-size:27px;--text-h2-lh:1.22;--text-h3-size:21px;--text-h3-lh:1.3;--text-lead-size:18px;--text-lead-lh:1.55;--text-body-size:16px;--text-body-lh:1.65;--text-small-size:14px;--text-small-lh:1.55;--text-caption-size:13px;--text-caption-lh:1.5;
--card-pad:var(--space-6);--section-gap:var(--space-12);--btn-pad-x:20px;--border-w:1px;
}
/* --- tokens/base.css --- */
body{margin:0;font-family:var(--font-body);font-size:var(--text-body-size);line-height:var(--text-body-lh);font-weight:var(--weight-body);color:var(--text-primary);background:var(--surface-page);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.ds-display{font-family:var(--font-display);font-weight:400;letter-spacing:var(--track-display);margin:0;text-wrap:balance}
.ds-display{font-size:var(--text-display-size);line-height:var(--text-display-lh)}
h1{font-size:var(--text-h1-size);line-height:var(--text-h1-lh)}
h2{font-size:var(--text-h2-size);line-height:var(--text-h2-lh)}
h3{font-size:var(--text-h3-size);line-height:var(--text-h3-lh)}
p{margin:0;text-wrap:pretty}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:3px;transition:color var(--dur-1) var(--ease-brand)}
a:hover{color:var(--link-hover)}
::selection{background:var(--omag-study);color:var(--omag-deep-black)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.ds-lead{font-size:var(--text-lead-size);line-height:var(--text-lead-lh)}
.ds-small{font-size:var(--text-small-size);line-height:var(--text-small-lh)}
.ds-caption{font-size:var(--text-caption-size);line-height:var(--text-caption-lh);font-weight:var(--weight-caption)}
.ds-highlight{font-weight:var(--weight-highlight);font-style:italic}
.ds-muted{color:var(--text-muted)}
/* --- tokens/components.css --- */
/* Komponentenklassen — konsumieren ausschließlich Theme-Tokens; funktionieren in beiden Themes. */
/* Buttons */
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);box-sizing:border-box;height:var(--control-h-md);padding:0 var(--btn-pad-x);border:var(--border-w) solid transparent;border-radius:var(--radius-control);font-family:var(--font-body);font-size:var(--text-body-size);font-weight:600;line-height:1;text-decoration:none;cursor:pointer;user-select:none;white-space:nowrap;transition:background var(--dur-1) var(--ease-brand),color var(--dur-1) var(--ease-brand),border-color var(--dur-1) var(--ease-brand),box-shadow var(--dur-2) var(--ease-brand),transform var(--dur-1) var(--ease-brand)}
.ds-btn:disabled,.ds-btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.ds-btn--sm{height:var(--control-h-sm);padding:0 calc(var(--btn-pad-x)*.7);font-size:var(--text-small-size)}
.ds-btn--lg{height:var(--control-h-lg);padding:0 calc(var(--btn-pad-x)*1.25);font-size:var(--text-lead-size)}
.ds-btn--primary{background:var(--color-primary);color:var(--on-primary)}
.ds-btn--primary:hover{background:var(--color-primary-hover);box-shadow:var(--shadow-hover);transform:var(--lift-hover)}
.ds-btn--primary:active{background:var(--color-primary-active);box-shadow:none;transform:var(--press-scale)}
.ds-btn--secondary{background:var(--omag-viola-12);color:var(--color-primary)}
[data-theme="ruhig"] .ds-btn--secondary{background:var(--surface-card);border-color:var(--border-input);color:var(--color-primary)}
.ds-btn--secondary:hover{background:var(--omag-viola-25);transform:var(--lift-hover)}
[data-theme="ruhig"] .ds-btn--secondary:hover{background:var(--omag-viola-6);border-color:var(--border-strong);transform:none}
.ds-btn--secondary:active{background:var(--omag-viola-40);transform:var(--press-scale)}
.ds-btn--ghost{background:transparent;color:var(--color-primary)}
.ds-btn--ghost:hover{background:var(--omag-viola-12)}
[data-theme="ruhig"] .ds-btn--ghost:hover{background:var(--omag-viola-6)}
.ds-btn--ghost:active{background:var(--omag-viola-25)}
.ds-btn--onbrand.ds-btn--primary{background:var(--omag-dust-white);color:var(--omag-deep-viola)}
.ds-btn--onbrand.ds-btn--primary:hover{background:#fff}
.ds-btn--onbrand.ds-btn--ghost{color:var(--omag-dust-white)}
.ds-btn--onbrand.ds-btn--ghost:hover{background:rgba(251,250,247,.14)}
.ds-btn--accent{background:var(--color-accent);color:var(--on-accent)}
.ds-btn--accent:hover{background:color-mix(in oklab,var(--color-accent),#fff 14%);box-shadow:var(--shadow-hover);transform:var(--lift-hover)}
.ds-btn--block{width:100%}
/* Inputs */
.ds-input,.ds-select,.ds-textarea{box-sizing:border-box;width:100%;height:var(--control-h-md);padding:0 var(--space-4);border:var(--border-w) solid var(--border-input);border-radius:var(--radius-input);background:var(--surface-card);color:var(--text-primary);font-family:var(--font-body);font-size:var(--text-body-size);transition:border-color var(--dur-1) var(--ease-brand),box-shadow var(--dur-1) var(--ease-brand)}
.ds-textarea{height:auto;min-height:96px;padding:var(--space-3) var(--space-4);line-height:var(--text-body-lh);resize:vertical}
.ds-input::placeholder,.ds-textarea::placeholder{color:var(--text-muted)}
.ds-input:hover,.ds-select:hover,.ds-textarea:hover{border-color:var(--border-strong)}
.ds-input:focus,.ds-select:focus,.ds-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--color-primary) 18%,transparent)}
.ds-input[aria-invalid="true"],.ds-textarea[aria-invalid="true"]{border-color:var(--color-error)}
.ds-input[aria-invalid="true"]:focus,.ds-textarea[aria-invalid="true"]:focus{box-shadow:0 0 0 3px color-mix(in srgb,var(--color-error) 18%,transparent)}
.ds-input:disabled,.ds-select:disabled,.ds-textarea:disabled{opacity:.5;background:var(--surface-sunken);cursor:not-allowed}
.ds-select{appearance:none;padding-right:var(--space-10);background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 21px) 50%,calc(100% - 15px) 50%;background-size:6px 6px;background-repeat:no-repeat;cursor:pointer}
/* Field */
.ds-field{display:flex;flex-direction:column;gap:var(--space-2)}
.ds-field-label{font-size:var(--text-small-size);font-weight:var(--weight-caption);color:var(--text-primary)}
.ds-field-help{font-size:var(--text-caption-size);line-height:var(--text-caption-lh);color:var(--text-muted)}
.ds-field-error{font-size:var(--text-caption-size);line-height:var(--text-caption-lh);font-weight:600;color:var(--color-error)}
/* Checkbox / Radio */
.ds-check{display:inline-flex;align-items:flex-start;gap:var(--space-3);cursor:pointer;font-size:var(--text-body-size);line-height:1.45}
.ds-check input{appearance:none;flex:none;margin:1px 0 0;width:22px;height:22px;border:var(--border-w) solid var(--border-input);border-radius:var(--radius-xs);background:var(--surface-card);cursor:pointer;display:grid;place-content:center;transition:background var(--dur-1) var(--ease-brand),border-color var(--dur-1) var(--ease-brand)}
[data-theme="ruhig"] .ds-check input{border-radius:var(--radius-sm)}
.ds-check input[type="radio"]{border-radius:50%}
.ds-check input:hover{border-color:var(--color-primary)}
.ds-check input:checked{background:var(--color-primary);border-color:var(--color-primary)}
.ds-check input[type="checkbox"]:checked::before{content:"";width:11px;height:6px;border:2.5px solid var(--on-primary);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.ds-check input[type="radio"]:checked::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--on-primary)}
.ds-check input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.ds-check input:disabled{opacity:.45;cursor:not-allowed}
.ds-check input:disabled+span{opacity:.55}
/* Switch */
.ds-switch{display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;font-size:var(--text-body-size)}
.ds-switch input{appearance:none;flex:none;width:46px;height:26px;margin:0;border-radius:999px;background:color-mix(in oklab,var(--omag-deep-black) 18%,var(--omag-dust-white));position:relative;cursor:pointer;transition:background var(--dur-2) var(--ease-brand)}
.ds-switch input::before{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,6,25,.25);transition:transform var(--dur-2) var(--ease-brand)}
.ds-switch input:checked{background:var(--color-primary)}
.ds-switch input:checked::before{transform:translateX(20px)}
.ds-switch input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
.ds-switch input:disabled{opacity:.45;cursor:not-allowed}
/* Card */
.ds-card{box-sizing:border-box;background:var(--surface-card);border-radius:var(--radius-card);padding:var(--card-pad);box-shadow:var(--shadow-card);border:1px solid transparent}
[data-theme="ruhig"] .ds-card{border-color:var(--border-subtle)}
.ds-card--interactive{cursor:pointer;transition:box-shadow var(--dur-2) var(--ease-brand),transform var(--dur-2) var(--ease-brand),border-color var(--dur-1) var(--ease-brand)}
.ds-card--interactive:hover{box-shadow:var(--shadow-pop);transform:var(--lift-hover)}
[data-theme="ruhig"] .ds-card--interactive:hover{border-color:var(--border-strong)}
.ds-card--brand{background:var(--grad-brand);color:var(--on-brand);border:none}
.ds-card--soft{background:var(--surface-sunken);box-shadow:none}
[data-theme="ruhig"] .ds-card--soft{border-color:transparent}
/* Badge */
.ds-badge{display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 var(--space-3);border-radius:var(--radius-badge);font-size:var(--text-caption-size);font-weight:var(--weight-caption);line-height:1;white-space:nowrap;background:var(--omag-viola-12);color:var(--omag-deep-viola)}
.ds-badge--print{background:var(--omag-print-light);color:var(--omag-print-ink)}
.ds-badge--online{background:var(--omag-online-light);color:var(--omag-online-ink)}
.ds-badge--event{background:var(--omag-event-light);color:var(--omag-event-ink)}
.ds-badge--study{background:var(--omag-study-light);color:var(--omag-study-ink)}
.ds-badge--corporate{background:var(--omag-corporate-light);color:var(--omag-corporate-ink)}
.ds-badge--solid{background:var(--omag-deep-viola);color:var(--omag-dust-white)}
.ds-badge--success{background:var(--color-success-soft);color:var(--color-success)}
.ds-badge--error{background:var(--color-error-soft);color:var(--color-error)}
.ds-badge .ds-badge-dot{width:7px;height:7px;border-radius:50%;background:currentColor}