/* ═══════════════════════════════════════════════
   club.allznaika.ru — Design System Tokens
   Palette: White / Red / Black
   ═══════════════════════════════════════════════ */

:root {
  /* ── Colors ── */
  --club-white:        #ffffff;
  --club-black:        #111111;
  --club-red:          #e44c43;
  --club-red-dark:     #c73b32;
  --club-red-soft:     rgba(228, 76, 67, 0.1);

  --club-grey-50:      #fafafa;
  --club-grey-100:     #f5f5f5;
  --club-grey-200:     #ebebeb;
  --club-grey-300:     #d4d4d4;
  --club-grey-400:     #a3a3a3;
  --club-grey-600:     #555555;
  --club-grey-800:     #2d2d2d;

  /* ── Typography ── */
  --club-font-head: "Onest", "Inter", system-ui, sans-serif;
  --club-font-body: "Manrope", "Inter", system-ui, sans-serif;

  /* ── Spacing ── */
  --club-container:    1180px;
  --club-section-py:   96px;

  /* ── Radius ── */
  --club-radius-sm:    6px;
  --club-radius-md:    12px;
  --club-radius-lg:    20px;
  --club-radius-xl:    28px;
  --club-pill:         999px;

  /* ── Shadows ── */
  --club-shadow-sm:    0 2px 8px rgba(0, 0, 0, 0.08);
  --club-shadow-md:    0 8px 32px rgba(0, 0, 0, 0.12);
  --club-shadow-lg:    0 24px 64px rgba(0, 0, 0, 0.16);
  --club-shadow-red:   0 16px 48px rgba(228, 76, 67, 0.28);

  /* ── Transitions ── */
  --club-ease:         cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --club-ease-out:     cubic-bezier(0.2, 0.7, 0.2, 1);
  --club-duration:     200ms;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  font-family: var(--club-font-body);
  color: var(--club-black);
  background: var(--club-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; border: 0; background: none; padding: 0; }
p { margin: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0; }
