/* shared-tokens.css
 * Kolev Architektenküchen — design tokens for the on-page lead-magnet components.
 * Inherited from the existing brand system. Values frozen; do not modify.
 */

:root {
  /* Color */
  --kk-primary:    #0C1C28;
  --kk-accent:     #967BB6;
  --kk-cream:      #FEF5F3;
  --kk-cream-deep: #FFFFFF;
  --kk-line:       #DDD5D0;
  --kk-text-mut:   #5A6770;

  /* Type */
  --kk-font-display: "DM Sans", system-ui, sans-serif;
  --kk-font-body:    "Roboto", system-ui, sans-serif;
  --kk-body-size:    17px;

  /* Spacing (clamp) */
  --kk-pad-section:  clamp(48px, 9vw, 96px) clamp(20px, 5vw, 32px);
  --kk-pad-block:    clamp(28px, 4vw, 44px);
  --kk-pad-internal: clamp(16px, 3vw, 28px);

  /* Measure */
  --kk-measure-text: 720px;
  --kk-measure-wide: 880px;

  /* Radius */
  --kk-r-hard: 4px;
  --kk-r-soft: 24px;
  --kk-r-pill: 9999px;

  /* Elevation */
  --kk-flat:   0 0 0 1px var(--kk-line);
  --kk-raised: 0 1px 2px rgba(12, 28, 40, 0.04),
               0 4px 16px rgba(12, 28, 40, 0.06);

  /* Motion */
  --kk-ease:    cubic-bezier(.2, .8, .2, 1);
  --kk-t-micro: 200ms;
  --kk-t-macro: 400ms;

  /* Focus */
  --kk-focus-ring: 0 0 0 4px color-mix(in srgb, var(--kk-accent) 25%, transparent);
}

@media (min-width: 768px) {
  :root { --kk-body-size: 18px; }
}

/* Dark-mode auto-flip removed 2026-04-27.
 * Reason: host /referenzen/* articles are light-only by design — their
 * inline <style> blocks have no dark token overrides. Letting the kk-* tokens
 * flip on prefers-color-scheme: dark created a dark island in an otherwise
 * light page (brand-incoherent). When the entire site becomes dark-aware,
 * restore the @media (prefers-color-scheme: dark) block + the [data-kk-theme]
 * overrides here.
 */
