/* ============================================================
   GAGOC — 01 DESIGN TOKENS
   Куди: Bricks → Settings → Custom CSS  (або Theme Styles → Custom CSS)
   Підключається ГЛОБАЛЬНО на всіх сторінках. Вставляти ПЕРШИМ.
   Tailwind тут не потрібен — це самостійний CSS.
   ============================================================ */

/* --- Шрифти (варіант швидкого старту через Google Fonts).
   Краще self-host через плагін (OMGF / Local Google Fonts) заради швидкості,
   як робив оригінал через next/font. Тоді цей @import прибрати. --- */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Jost:wght@300;400;500;600;700&display=swap');

:root {
  /* Brand */
  --crimson:        359 100% 60%;   /* ≈ #ff3032 — primary/accent (HSL без hsl()) */
  --crimson-glow:   359 100% 70%;
  --void:           0 0% 0%;
  --carbon:         0 0% 8%;         /* картки ≈ #141414 */
  --shadow:         300 4% 7%;
  --pure:           0 0% 100%;
  --chrome:         0 0% 100%;

  /* Semantic */
  --background:        0 0% 0%;
  --foreground:        0 0% 100%;
  --card:              0 0% 8%;
  --card-foreground:   0 0% 100%;
  --popover:           0 0% 6%;
  --popover-foreground:0 0% 100%;
  --primary:           359 100% 60%;
  --primary-foreground:0 0% 100%;
  --secondary:         0 0% 12%;
  --secondary-foreground:0 0% 100%;
  --muted:             0 0% 15%;
  --muted-foreground:  0 0% 60%;
  --accent:            359 100% 60%;
  --accent-foreground: 0 0% 100%;
  --destructive:       0 84% 60%;
  --border:            0 0% 15%;
  --input:             0 0% 15%;
  --ring:              359 100% 60%;
  --radius:            0px;          /* ГОСТРІ КУТИ — критично для стилю */

  /* Gradients / shadows */
  --gradient-void:    linear-gradient(180deg, hsl(0 0% 0%) 0%, hsl(0 0% 8%) 100%);
  --gradient-radial:  radial-gradient(ellipse at center, hsl(0 0% 8%) 0%, hsl(0 0% 0%) 70%);
  --gradient-crimson: linear-gradient(135deg, hsl(359 100% 60%) 0%, hsl(350 85% 55%) 100%);
  --shadow-crimson:   0 0 40px hsla(359, 100%, 60%, 0.3);
  --shadow-deep:      0 30px 80px hsla(0, 0%, 0%, 0.8);

  /* Easings */
  --spring-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --spring-smooth: cubic-bezier(0.19, 1.0, 0.22, 1.0);
  --snap:          cubic-bezier(0.16, 1, 0.3, 1);
}

/* --- Глобальна темна база --- */
html { scroll-behavior: smooth; -webkit-overflow-scrolling: touch; }

body {
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  font-family: 'Outfit', 'Jost', system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  overscroll-behavior: none;
}

/* Гострі кути всюди (Bricks елементи + основні теги) */
.brxe-button, .brxe-image, .brxe-block, .brxe-container,
button, input, textarea, select, img, .card {
  border-radius: var(--radius);
}

::selection { background: hsl(var(--primary) / 0.3); color: hsl(var(--pure)); }

/* Типографіка заголовків (Awwwards-стиль оригіналу) */
h1, .h1 {
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 0.9;
  font-size: clamp(2.75rem, 6vw, 6rem);   /* ≈ text-5xl → 8xl */
}
h2, .h2 { font-weight: 700; letter-spacing: -0.01em; line-height: 1.05; }

/* Прехедер / ейбрів-лейбл */
.eyebrow {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: hsl(var(--primary) / 0.8);
}

/* Допоміжні tabular-числа для лічильників статистики */
.counter { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; }