/* Design tokens pulled from Figma (FitStars app) via Figma MCP.
   Keep these in sync with the Figma variables of the same name. */

/* Gilroy is a licensed font — files live in css/fonts/. */
@font-face {
  font-family: 'Gilroy';
  src: url('https://fitstars-landing-prod.storage.yandexcloud.net/landings/17/v11/css/fonts/Gilroy-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy';
  src: url('https://fitstars-landing-prod.storage.yandexcloud.net/landings/17/v11/css/fonts/Gilroy-Medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy';
  src: url('https://fitstars-landing-prod.storage.yandexcloud.net/landings/17/v11/css/fonts/Gilroy-Semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Gilroy';
  src: url('https://fitstars-landing-prod.storage.yandexcloud.net/landings/17/v11/css/fonts/Gilroy-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Colors */
  --color-accent: #ef16b0;              /* "Roze" */
  --color-text-primary: #181d31;
  --color-text-secondary: #414657;
  --color-border-primary: #d3d5da;
  --color-border-secondary: #e7e7ec;
  --color-surface-primary: #ffffff;
  --color-surface-tertiary-alpha: #ffffff;

  /* Typography.
     Figma uses "Gilroy" for every text style (title / body / header).
     Real Gilroy loads via @font-face above for all four weights in use
     (400/500/600/700). Montserrat stays as a fallback stand-in for any
     environment where the Gilroy files fail to load. */
  --font-family-title: 'Gilroy', 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-family-body: 'Gilroy', 'Montserrat', -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
  --font-family-header: var(--font-family-title);
  --font-family-subheader: var(--font-family-title);
  --font-size-xxl: 32px;
  --font-size-s: 16px;
  --font-weight-bold: 700;
  --font-weight-regular: 400;
  --letter-spacing-base: 0px;
  --letter-spacing-broad: 0.15px;

  /* Radius */
  --radius-button-square: 12px;
  --radius-pill: 10px;

  /* Shadows (shadow-elevation-2) */
  --shadow-elevation-2:
    0px 4px 15px 2px rgba(49, 24, 31, 0.06),
    0px 1px 3px 1px rgba(49, 24, 31, 0.06);

  /* Layout */
  --screen-width: 375px;
}
