/* Global design tokens. Keep these generic: no section-specific variables here. */

@font-face {
  font-family: "Inter";
  src: url("/fonts/inter-variable.woff2") format("woff2-variations");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

@font-face {
  font-family: "bebas_neue_regular";
  src:
    url("/fonts/bebasneue_regular-webfont.woff2") format("woff2"),
    url("/fonts/bebasneue_regular-webfont.woff") format("woff");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "vl_sans";
  src: url("/fonts/prompt-400.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "vl_sans";
  src: url("/fonts/prompt-600.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: "vl_sans";
  src: url("/fonts/prompt-700.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

@font-face {
  font-family: "Prompt";
  src: url("/fonts/prompt-400.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 400;
}

@font-face {
  font-family: "Prompt";
  src: url("/fonts/prompt-600.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 600;
}

@font-face {
  font-family: "Prompt";
  src: url("/fonts/prompt-700.ttf") format("truetype");
  font-display: swap;
  font-style: normal;
  font-weight: 700;
}

:root {
  --vl-red: #e91d25;
  --vl-red-bright: #ff1f2a;
  --vl-black: #050505;
  --vl-ink: #08090b;
  --vl-muted: #252525;
  --vl-border: rgba(255, 255, 255, 0.55);
  --vl-display: "Liberation Sans Narrow", "Arial Narrow", "Roboto Condensed", "Helvetica Neue Condensed", Arial, sans-serif;
  --vl-body: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --vl-section-title-size: 56px;
  --vl-section-title-letter-spacing: 1.8px;
  --vl-section-title-line-height: 0.91;
  --vl-card-radius: 3px;
  --vl-card-shadow: 0 16px 31px rgba(0, 0, 0, 0.13);
  --vl-card-title-size: 23px;
  --vl-card-title-letter-spacing: 0.45px;
  --vl-card-title-line-height: 1;
  --vl-card-text-size: 13.5px;
  --vl-card-text-line-height: 1.58;
  --vl-button-radius: var(--vl-card-radius);
  --vl-button-fill-bg: var(--vl-red);
  --vl-button-fill-hover-bg: var(--vl-red-bright);
}

:root:lang(th-TH),
:root:lang(th) {
  --vl-body: "Prompt", "vl_sans", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
