/* MAVEN GLOBAL — дизайн-токены */

:root {
  /* Фон и поверхности */
  --color-bg-dark: #070f1c;
  --color-bg-dark-alt: #0f1f38;
  --color-bg-light: #ffffff;
  --color-bg-muted: #eef3f8;

  /* Акценты */
  --color-accent-blue: #0b6cff;
  --color-accent-blue-bright: #3d8cff;
  --color-accent-blue-alt: #0558d9;
  --color-accent-green: #1a9d5c;
  --color-accent-green-alt: #22b86a;

  /* Текст */
  --color-text-on-dark: #ffffff;
  --color-text-heading: #061019;
  --color-text-body: #4b5565;

  /* UI */
  --color-checkmark: var(--color-accent-green);
  --color-border-ghost: rgba(255, 255, 255, 0.78);

  /* Типографика — Google Sans Variable */
  --font-heading: "Google Sans Variable", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body: "Google Sans Variable", system-ui, -apple-system, "Segoe UI", sans-serif;

  --font-weight-heading: 700;
  --font-weight-body: 400;
  --font-weight-body-medium: 500;
  --font-weight-body-semibold: 600;

  /* Радиусы и глубина */
  --radius-button: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --shadow-sm: 0 4px 16px rgba(6, 16, 40, 0.06);
  --shadow-card: 0 18px 50px rgba(6, 16, 40, 0.09);
  --shadow-card-hover: 0 26px 70px rgba(6, 16, 40, 0.13);
  --shadow-glow-blue: 0 0 0 1px rgba(11, 108, 255, 0.22), 0 18px 48px rgba(11, 108, 255, 0.18);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --transition-fast: 0.2s var(--ease-out);
  --transition-med: 0.35s var(--ease-out);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

html,
body {
  overflow-x: hidden;
  max-width: 100%;
}

img,
video {
  max-width: 100%;
  height: auto;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  margin: 0;
  font-family: var(--font-body);
  font-weight: var(--font-weight-body);
  color: var(--color-text-body);
  background: linear-gradient(180deg, #fbfcfe 0%, #eef3f8 55%, #e8eef6 100%);
}

::selection {
  background-color: rgba(11, 108, 255, 0.22);
  color: var(--color-text-heading);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-heading);
  font-weight: var(--font-weight-heading);
  color: var(--color-text-heading);
  letter-spacing: -0.03em;
}

