/* ============================================================
   Digitalakademie Bayern — Colors & Type
   ============================================================
   Source: 250913_Digitalakademie_Design-Manual_v01.pdf
   Brand identity: BVS Digitalakademie Bayern (DAKBY)
   Core principle: Orange + Grey + crisp grotesque type +
   rounded-corner surfaces (echoing tablet/app UI).
   ============================================================ */

/* --- Webfonts ---------------------------------------------- */
/* Real brand fonts: Univers (print/display + body) and Ebrima
   (digital). Loaded from fonts/ directory. */

@font-face {
  font-family: 'Univers';
  src: url('fonts/UniversLight.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers';
  src: url('fonts/UniversRegular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers';
  src: url('fonts/UniversBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers Condensed';
  src: url('fonts/UniversCnRg.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Univers Condensed';
  src: url('fonts/UniversCnBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ebrima';
  src: url('fonts/ebrima.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Ebrima';
  src: url('fonts/ebrima-bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ============================================================
     COLORS
     ============================================================ */

  /* --- Primary: Orange ---
     CMYK 0-57-100-0 · Pantone 151 C · HKS 7K · RAL 2008
     The brand color — confident, warm, signals digital + clarity */
  --dakby-orange-100: #f08300;        /* CI Primary */
  --dakby-orange-90:  #f18f1a;
  --dakby-orange-80:  #f39b33;
  --dakby-orange-70:  #f5a84d;
  --dakby-orange-60:  #f7b466;
  --dakby-orange-50:  #f9c180;
  --dakby-orange-40:  #facd99;
  --dakby-orange-30:  #fcd9b3;
  --dakby-orange-20:  #fde6cc;
  --dakby-orange-10:  #fff2e6;

  /* --- Secondary: Grey (anchored at 50% black) ---
     CMYK 0-0-50-0 · Pantone Cool Gray 9 C · RAL 7040 */
  --dakby-grey-50:    #9d9d9c;        /* CI Secondary */
  --dakby-grey-40:    #b1b1b0;
  --dakby-grey-30:    #c5c5c4;
  --dakby-grey-20:    #d8d8d8;
  --dakby-grey-10:    #ececec;

  /* --- Base ---
     Schwarz und Weiß sind als Basis gesetzt */
  --dakby-black:      #000000;
  --dakby-white:      #ffffff;

  /* --- Extended neutrals (for digital UI; derived) --- */
  --dakby-ink-900:    #111111;        /* near-black for body text */
  --dakby-ink-700:    #4a4a4a;
  --dakby-ink-500:    #6e6e6d;
  --dakby-bg-soft:    #f7f7f6;        /* page background tint */
  --dakby-line:       #e3e3e2;        /* hairline borders */

  /* --- Semantic foreground / background --- */
  --fg-1: var(--dakby-ink-900);       /* primary text */
  --fg-2: var(--dakby-ink-700);       /* secondary text */
  --fg-3: var(--dakby-ink-500);       /* tertiary / captions */
  --fg-on-orange: var(--dakby-white);
  --fg-link: var(--dakby-orange-100);

  --bg-1: var(--dakby-white);         /* primary surface */
  --bg-2: var(--dakby-bg-soft);       /* page wash */
  --bg-3: var(--dakby-grey-10);       /* alt section */
  --bg-accent: var(--dakby-orange-100);
  --bg-accent-soft: var(--dakby-orange-10);

  --border-default: var(--dakby-line);
  --border-strong:  var(--dakby-grey-30);

  /* --- Status (derived; not in printed manual,
     held to brand temperature) --- */
  --color-success: #4a8b3b;
  --color-warning: var(--dakby-orange-100);
  --color-danger:  #c4351c;

  /* ============================================================
     TYPOGRAPHY
     ============================================================
     House: Univers (print) / Ebrima (digital).
     Substitute used here: Manrope (similar grotesque proportion).
     ============================================================ */

  /* Print/display: Univers (CD-Handbuch standard).
     Digital: Ebrima (CD-Handbuch standard for elektronische Kommunikation).
     The two are interchangeable in this system; default to Univers since
     the brochure spec uses it and Ebrima is a fallback for environments
     without webfont support. */
  --font-sans: 'Univers', 'Ebrima', 'Helvetica Neue', 'Arial', system-ui, sans-serif;
  --font-display: 'Univers', 'Ebrima', 'Helvetica Neue', sans-serif;
  --font-condensed: 'Univers Condensed', 'Univers', 'Helvetica Neue Condensed', sans-serif;
  --font-digital: 'Ebrima', 'Univers', system-ui, sans-serif;
  --font-mono: ui-monospace, 'SF Mono', 'Roboto Mono', Menlo, monospace;

  /* Weights (mapping to Univers nomenclature) */
  --weight-light: 300;     /* Univers Light */
  --weight-regular: 400;   /* Univers Roman */
  --weight-medium: 500;
  --weight-bold: 700;      /* Univers Bold */
  --weight-black: 800;     /* Univers Black, for headlines */

  /* Type scale — based on the brochure spec
     (Headlines 18pt / Body 8pt / Leading 11pt) scaled for screen */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px — body */
  --text-lg:   1.125rem;  /* 18px */
  --text-xl:   1.375rem;  /* 22px */
  --text-2xl:  1.75rem;   /* 28px */
  --text-3xl:  2.25rem;   /* 36px */
  --text-4xl:  3rem;      /* 48px */
  --text-5xl:  4rem;      /* 64px — hero / Plakat */
  --text-6xl:  5.5rem;    /* 88px — kraft headlines */

  --leading-tight: 1.05;
  --leading-snug:  1.2;
  --leading-normal: 1.45;
  --leading-relaxed: 1.6;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.12em;       /* for ALL-CAPS labels like DIGITAL FIRST */

  /* ============================================================
     SHAPE & SPACING
     ============================================================
     "Abgerundete Ecken" — rounded corners are the brand's
     signature design element. Min radius 4pt; scale up for
     larger surfaces. */
  --radius-xs: 4px;       /* PDF minimum (4pt) */
  --radius-sm: 8px;
  --radius-md: 14px;      /* default for cards */
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-pill: 999px;   /* DIGITAL FIRST button */

  /* Spacing — 4px base */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;

  /* Print spec gutters (from manual): 5mm column gap, 10mm margin */
  --grid-gutter: 20px;
  --grid-margin: 40px;

  /* Shadows — kept restrained; the brand is print-rooted */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04), 0 1px 1px rgba(0,0,0,0.03);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.06), 0 2px 4px rgba(0,0,0,0.04);
  --shadow-lg: 0 12px 32px rgba(0,0,0,0.08), 0 4px 8px rgba(0,0,0,0.05);
  --shadow-orange: 0 8px 24px rgba(240, 131, 0, 0.25);

  /* Transitions — clean, snappy, no bounce */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 120ms;
  --dur-base: 200ms;
  --dur-slow: 360ms;
}

/* ============================================================
   SEMANTIC TYPE STYLES — apply directly via class
   ============================================================ */

/* Hero / kraft headline. Mimics "Digitale Transformation" cover */
.dakby-hero,
h1.dakby {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  font-size: var(--text-6xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
}

/* Section title */
.dakby-h1, h1 {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-4xl);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
}

.dakby-h2, h2 {
  font-family: var(--font-display);
  font-weight: var(--weight-bold);
  font-size: var(--text-3xl);
  line-height: var(--leading-snug);
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
}

.dakby-h3, h3 {
  font-family: var(--font-sans);
  font-weight: var(--weight-bold);
  font-size: var(--text-2xl);
  line-height: var(--leading-snug);
  color: var(--fg-1);
}

.dakby-h4, h4 {
  font-family: var(--font-sans);
  font-weight: var(--weight-bold);
  font-size: var(--text-xl);
  line-height: var(--leading-snug);
  color: var(--fg-1);
}

/* Body text — Univers Roman, 8pt / 11pt scaled */
.dakby-body, p {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--fg-1);
  text-wrap: pretty;
}

.dakby-lead {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  font-size: var(--text-lg);
  line-height: var(--leading-relaxed);
  color: var(--fg-2);
}

.dakby-small,
small {
  font-family: var(--font-sans);
  font-weight: var(--weight-regular);
  font-size: var(--text-sm);
  line-height: var(--leading-normal);
  color: var(--fg-2);
}

.dakby-caption {
  font-family: var(--font-sans);
  font-size: var(--text-xs);
  line-height: var(--leading-normal);
  color: var(--fg-3);
}

/* Eyebrow / kicker — used for "MACH'S DIGITAL", "DIGITAL FIRST", etc. */
.dakby-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--weight-bold);
  font-size: var(--text-sm);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--fg-1);
}

/* Highlighted/italic — Univers Condensed Italic role
   (Univers Condensed doesn't ship with an italic in the supplied
   font set, so we synthesize via font-style: italic on the
   condensed family.) */
.dakby-emphasis,
em {
  font-family: var(--font-condensed);
  font-style: italic;
  font-weight: var(--weight-regular);
  letter-spacing: 0;
}

/* Code */
code, .dakby-code {
  font-family: var(--font-mono);
  font-size: 0.92em;
  background: var(--bg-3);
  padding: 0.1em 0.35em;
  border-radius: var(--radius-xs);
}

/* Link */
a, .dakby-link {
  color: var(--fg-link);
  text-decoration-color: var(--dakby-orange-50);
  text-underline-offset: 0.18em;
  transition: color var(--dur-fast) var(--ease-out);
}
a:hover { color: var(--dakby-orange-90); text-decoration-color: var(--fg-link); }

/* Reset baseline for design-system pages */
.dakby-reset, .dakby-reset * { box-sizing: border-box; }
.dakby-reset {
  font-family: var(--font-sans);
  color: var(--fg-1);
  background: var(--bg-1);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}