/* MK-Equity design tokens — copied verbatim from Design-system 2.html.
   Three layers: primitives -> semantic roles -> element defaults.
   Do not edit values here; this is the source of truth shared with the design system. */

:root{
/* ---- Brand palette (verbatim from CM-Equity CI sheet) ---- */
--mk-navy:#002c50;              /* Die Basisfarbe / Dunkelblau */
--mk-navy-light:#235273;        /* Hellblau */
--mk-silver:#8c8b8a;            /* Die Akzentfarbe / Silber */
--mk-silver-light:#c8c7c6;      /* Helles Silber */
--mk-silver-faint:#f1f1f1;      /* Leichtes Silber */
--mk-gold:#edbb5f;              /* Farbe fuer Hervorhebungen / Gelb */

/* ---- Derived ramps (harmonised in oklch from the six brand values) ---- */
--navy-950:#001b32;
--navy-900:var(--mk-navy);
--navy-800:#0a3c62;
--navy-700:var(--mk-navy-light);
--navy-600:#3d6d8f;
--navy-400:#7d9db4;
--navy-200:#c3d2dd;
--navy-100:#e3ebf1;
--navy-050:#f2f6f9;

--silver-900:#2b2b2a;
--silver-800:#454443;
--silver-700:#6f6e6d;
--silver-600:var(--mk-silver);
--silver-500:#a3a2a1;
--silver-400:var(--mk-silver-light);
--silver-300:#dedddc;
--silver-200:#e9e8e7;
--silver-100:var(--mk-silver-faint);
--silver-050:#f8f8f8;
--white:#ffffff;

--gold-700:#b4801f;
--gold-600:#d9a341;
--gold-500:var(--mk-gold);
--gold-300:#f5d9a4;
--gold-100:#fbf1dc;

/* ---- Status (derived additions: none were specified in the CI sheet) ---- */
--positive-600:#2e6f52;
--positive-100:#e4efe9;
--negative-600:#9c3328;
--negative-100:#f6e6e4;
--caution-600:var(--gold-700);
--caution-100:var(--gold-100);

/* ---- Semantic aliases: text ---- */
--text-strong:var(--navy-900);
--text-body:var(--silver-900);
--text-muted:var(--silver-700);
--text-subtle:var(--silver-600);
--text-inverse:var(--white);
--text-inverse-muted:var(--navy-200);
--text-link:var(--navy-700);
--text-link-hover:var(--navy-900);
--text-on-gold:var(--navy-900);

/* ---- Semantic aliases: surface ---- */
--surface-page:var(--white);
--surface-subtle:var(--silver-100);
--surface-sunken:var(--silver-050);
--surface-card:var(--white);
--surface-raised:var(--white);
--surface-inverse:var(--navy-900);
--surface-inverse-alt:var(--navy-800);
--surface-accent:var(--navy-050);
--surface-highlight:var(--gold-100);
--surface-overlay:rgba(0,27,50,.55);

/* ---- Semantic aliases: border ---- */
--border-subtle:var(--silver-300);
--border-default:var(--silver-400);
--border-strong:var(--silver-600);
--border-inverse:rgba(255,255,255,.22);
--border-accent:var(--navy-700);
/* No --rule-gold: the gold accent rule was retired, and so was the 6px gold disc that
   briefly replaced it. Emphasis inside a set is --border-accent, the navy hairline on a
   featured panel. Gold appears once per page, as the CTA band ground. */

/* ---- Semantic aliases: interaction ---- */
--action-primary:var(--navy-900);
--action-primary-hover:var(--navy-800);
--action-primary-active:var(--navy-950);
--action-secondary:var(--white);
--action-secondary-hover:var(--navy-050);
--action-accent:var(--gold-500);
--action-accent-hover:var(--gold-600);
--action-accent-active:var(--gold-700);
--action-disabled-bg:var(--silver-200);
--action-disabled-text:var(--silver-500);
--focus-ring:var(--navy-700);
--selection-bg:var(--gold-100);
}

:root{
/* families — two, structurally unlike each other */
--font-display:"Prata",Georgia,"Times New Roman",serif;
--font-sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
--font-body:var(--font-sans);
/* Figures are the body sans with tabular numerals. There is no mono face. */
--font-figure:var(--font-sans);

/* size scale (px, hand-tuned) */
--text-3xs:11px;
--text-2xs:12px;
--text-xs:13px;
--text-sm:15px;
--text-md:17px;
--text-lg:19px;
--text-xl:22px;
--text-2xl:28px;
--text-3xl:36px;
--text-4xl:48px;
--text-5xl:62px;
--text-6xl:78px;

/* line heights — the serif gets less, the sans more, never the same value */
--leading-display:1.04;
--leading-snug:1.2;
--leading-normal:1.5;
--leading-relaxed:1.62;
--leading-serif-body:1.42;

/* weights */
--weight-regular:400;
--weight-medium:500;
--weight-semibold:600;

/* tracking — nothing wider than 0.06em, nothing tighter than -0.015em */
--tracking-display:-0.015em;
--tracking-normal:0;
--tracking-label:0.06em;
/* Financial-print convention, table column headers ONLY. Not a decorative eyebrow. */
--tracking-column:0.1em;

/* measures — sans must not exceed ~78 characters */
--measure-sans:60ch;
--measure-serif:34ch;

/* semantic type roles */
--type-display-family:var(--font-display);
--type-heading-family:var(--font-display);
--type-body-family:var(--font-sans);
--type-label-family:var(--font-sans);
--type-label-size:var(--text-xs);
--type-label-weight:var(--weight-semibold);
--type-figure-family:var(--font-figure);
--type-figure-variant:tabular-nums;
}

:root{
--space-1:2px;
--space-2:4px;
--space-3:8px;
--space-4:12px;
--space-5:16px;
--space-6:20px;
--space-7:24px;
--space-8:32px;
--space-9:40px;
--space-10:56px;
--space-11:72px;
--space-12:96px;
--space-13:128px;
--space-14:176px;

/* Layout. Sections do NOT share a padding value — the rhythm is deliberately uneven,
   and the numbers below are the vocabulary, not a default to apply everywhere. */
--section-y-open:128px;    /* the page's opening statement */
--section-y-loose:96px;    /* a section that needs air */
--section-y-tight:56px;    /* a list or an index */
--section-y-band:112px;    /* the single navy statement band */

--container-max:1200px;
--container-text:760px;
--gutter:32px;
--gutter-narrow:20px;

--control-height-sm:32px;
--control-height-md:40px;
--control-height-lg:48px;

/* Card padding is chosen per card, from these three. Never one value everywhere. */
--pad-panel-tight:20px;
--pad-panel:28px;
--pad-panel-loose:40px;
}

:root{
/* Radius encodes hierarchy: a control, a panel and an overlay are three different things
   and do not share a corner. Panels are square — this brand's reference object is a
   printed factsheet, not an app card. */
--radius-none:0;
--radius-panel:0;        /* cards, tables, bands, media blocks */
--radius-control:3px;    /* buttons, inputs, selects, tags */
--radius-chip:2px;       /* badges, checkboxes */
--radius-overlay:6px;    /* dialog, toast — the only things that float */
--radius-full:999px;     /* monogram, switch knob, radio, the status dot */

--border-width-hairline:1px;
--border-width-marker:2px;
}

:root{
/* Two shadows, both navy-tinted, and only on things that actually float above the page.
   Nothing at rest carries a shadow; hover never adds one. */
--shadow-none:none;
--shadow-overlay:0 18px 44px rgba(0,27,50,.18),0 2px 6px rgba(0,27,50,.08);
--shadow-header:0 1px 0 0 var(--border-subtle);
--ring-focus:0 0 0 3px rgba(35,82,115,.26);
}

:root{
/* Motion is a response to input, never ambient. No scroll reveals, no entrance
   animations, no counting numbers, no animated backgrounds. */
--duration-fast:130ms;    /* @kind other */  /* colour, border, opacity */
--duration-base:220ms;    /* @kind other */  /* overlay entry, expand/collapse */
--ease-standard:cubic-bezier(.2,.6,.25,1); /* @kind other */
--transition-control:background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard),color var(--duration-fast) var(--ease-standard),box-shadow var(--duration-fast) var(--ease-standard);
}

*,*::before,*::after{box-sizing:border-box}
body{margin:0;font-family:var(--font-body);font-size:var(--text-md);line-height:var(--leading-relaxed);color:var(--text-body);background:var(--surface-page);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--type-heading-family);font-weight:var(--weight-regular);color:var(--text-strong);letter-spacing:var(--tracking-display);line-height:var(--leading-snug);margin:0 0 var(--space-5);max-width:var(--measure-serif)}
h1{font-size:var(--text-4xl);line-height:var(--leading-display)}h2{font-size:var(--text-3xl)}h3{font-size:var(--text-xl);max-width:none}
h4{font-family:var(--font-sans);font-size:var(--text-lg);font-weight:var(--weight-semibold);color:var(--text-strong);letter-spacing:0;line-height:var(--leading-snug);margin:0 0 var(--space-5)}
p{margin:0 0 var(--space-5);max-width:var(--measure-sans);text-wrap:pretty}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid var(--silver-400);transition:color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard)}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--navy-700)}
::selection{background:var(--selection-bg);color:var(--navy-900)}
:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}
/* Sentence-case label. Not uppercase, not tracked out — a label, not an eyebrow. */
.mk-label{font-family:var(--type-label-family);font-size:var(--type-label-size);font-weight:var(--type-label-weight);color:var(--text-muted);letter-spacing:var(--tracking-label)}
/* Uppercase tracked caps survive in exactly ONE role: a table column header, where it is a
   financial-print convention and the label carries information. Nowhere else. */
.mk-colhead{font-family:var(--font-sans);font-size:var(--text-3xs);font-weight:var(--weight-medium);text-transform:uppercase;letter-spacing:var(--tracking-column);color:var(--text-muted)}
.mk-figure{font-family:var(--font-figure);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1}
.mk-container{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter)}
.mk-serif{font-family:var(--font-display);font-weight:var(--weight-regular);letter-spacing:var(--tracking-display);line-height:var(--leading-serif-body)}