/* =========================================================================
   tokens.css · Furkan Dag · Bewerbung Technogym (Customer Success & Digital Account)
   Colours and type of the secondary pages (CV, notice, 404, cover letter).
   The approved start page (index.html) keeps its own inline tokens; these
   values are taken from it: near-black stage, white text, one yellow.

   DARK (page around the sheet, same as the start page)
     --bg #0D0D0D · --ink #FFFFFF · --muted #9AA3A3 (7,5:1) · --dim #818C8C (5,6:1)
     --y #F4E116 (accent on dark, 14,5:1) · --y-btn #F4E116 with dark text #0D0D0D (14,5:1)
   PAPER (the sheet: light, so the CV prints well)
     --paper #FFFFFF · --paper-2 #F3F3F1 · --tx-1 #141416 · --tx-2 #3D3E43 · --tx-3 #5C5D63 (5,9:1)
     --accent-ink #685D00 (dark gold for text on paper, 6,7:1 on white, 6,0:1 on --paper-2;
       the yellow itself is too light for text on a white sheet)
     --line #E3E3E0 · --line-strong #C9C9C5
   ========================================================================= */
:root {
  --font: 'Inter Static', 'Helvetica Neue', Helvetica, Arial, system-ui, sans-serif;
  --fw-reg: 400;
  --fw-med: 500;

  --bg: #0D0D0D;
  --bg-2: #141414;
  --ink: #FFFFFF;
  --ink-2: #DBDBD4;
  --muted: #9AA3A3;
  --dim: #818C8C;
  --line-dark: rgba(222, 222, 222, 0.12);
  --line-dark-2: rgba(222, 222, 222, 0.22);
  --y: #F4E116;
  --y-hover: #FDD909;
  --y-mark: #C4AE00;

  --paper: #FFFFFF;
  --paper-2: #F3F3F1;
  --tx-1: #141416;
  --tx-2: #3D3E43;
  --tx-3: #5C5D63;
  --accent-ink: #685D00;
  --line: #E3E3E0;
  --line-strong: #C9C9C5;

  --hint: #7A5200;
  --hint-bg: #FFF3D6;

  --r-pill: 999px;
  --r-md: 18px;
  --r-sm: 12px;
  --sh-sheet: 0 24px 80px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06);
  /* head of the CV and the letter: the stage of the start page with a soft yellow light */
  --grad-head: radial-gradient(60% 120% at 92% 0%, rgba(244, 225, 22, 0.16), transparent 60%), linear-gradient(180deg, #1B1B1B 0%, #0D0D0D 100%);
}

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body { font-family: var(--font); font-weight: var(--fw-reg); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
b, strong { font-weight: var(--fw-med); }
h1, h2, h3 { font-weight: var(--fw-med); }
img { max-width: 100%; display: block; }
:focus-visible { outline: 2px solid var(--y); outline-offset: 3px; border-radius: 6px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0s !important; animation-duration: 0s !important; } }