/* 01-base.css — reset, body, grain, typografie, container, blob
   ZUŠ Pardubice — viz CSS-ARCHITEKTURA.md. Vzhled 1:1 z předlohy. */

  * { box-sizing: border-box; margin: 0; padding: 0; }
  html { scroll-behavior: smooth; }
  body {
    font-family: 'Bricolage Grotesque', system-ui, sans-serif;
    background: var(--bg);
    color: var(--ink);
    font-size: 16px;
    line-height: 1.5;
    overflow-x: hidden;
    position: relative;
    -webkit-font-smoothing: antialiased;
  }
  body::before {
    content: '';
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: 1;
    background-image:
      radial-gradient(circle at 12% 18%, var(--grain) 0%, transparent 4%),
      radial-gradient(circle at 68% 47%, var(--grain) 0%, transparent 4%),
      radial-gradient(circle at 33% 84%, var(--grain) 0%, transparent 4%),
      radial-gradient(circle at 85% 23%, var(--grain) 0%, transparent 4%),
      radial-gradient(circle at 91% 71%, var(--grain) 0%, transparent 4%);
    background-size: 320px 320px;
    opacity: 0.7;
    mix-blend-mode: multiply;
  }
  ::selection { background: var(--yellow); color: var(--ink); }
  .serif { font-family: 'Instrument Serif', Georgia, serif; font-style: italic; }
  .mono { font-family: 'JetBrains Mono', monospace; }
  a { color: inherit; text-decoration: none; }
  a:hover { color: var(--dramatak); }
  .container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    position: relative;
    z-index: 2;
  }
  .blob {
    position: absolute;
    border-radius: 50%;
    mix-blend-mode: multiply;
    opacity: 0.85;
    pointer-events: none;
    z-index: 0;
  }