/*
  SOT — Sound of Thailand Music Awards | design tokens
  Generated from build/build-tokens.py — do not edit by hand.
  Source: SOT Guidelines V2.1 - 15JUN2026.pdf (Visual Guidelines V2.1)
*/

:root {

  /* color ------------------------------------------------------------- */
  --sot-color-white: #ffffff;
  --sot-color-black: #000000;
  --sot-color-cyan: #00ffff;
  --sot-color-magenta: #ff00ff;
  --sot-color-red: #ff0000;
  --sot-color-blue: #0000ff;
  --sot-color-green: #00ff00;
  --sot-color-yellow: #ffff00;

  /* campaign ---------------------------------------------------------- */
  --sot-campaign-blue: #0000ff;
  --sot-campaign-green: #00ff00;
  --sot-campaign-magenta: #ff00ff;

  /* semantic ---------------------------------------------------------- */
  --sot-surface: #ffffff;
  --sot-surface-invert: #000000;
  --sot-text: #000000;
  --sot-text-invert: #ffffff;
  --sot-text-muted: #666666;
  --sot-accent: #0000ff;
  --sot-caution: #ff0000;
  --sot-rule: #000000;

  /* font -------------------------------------------------------------- */
  --sot-font-primary: 'LINE Seed Sans TH';
  --sot-font-display-en: 'Tungsten Condensed';
  --sot-font-display-th: Rahong;
  --sot-font-primary-stack: 'LINE Seed Sans TH', 'LINE Seed Sans', 'LINESeedSansTH', 'Avenir Next', 'Helvetica Neue', system-ui, sans-serif;
  --sot-font-display-en-stack: 'Tungsten Condensed', 'Tungsten', 'Helvetica Neue Condensed Black', 'HelveticaNeue-CondensedBlack', 'Avenir Next Condensed', 'Arial Narrow', Impact, sans-serif;
  --sot-font-display-th-stack: 'Rahong', 'LINE Seed Sans TH', 'Noto Sans Thai', 'Sarabun', 'Thonburi', sans-serif;
  --sot-weight-regular: 400;
  --sot-weight-bold: 700;
  --sot-weight-extrabold: 800;
  --sot-weight-heavy: 900;
  --sot-weight-display-book: 300;
  --sot-weight-display-medium: 500;
  --sot-weight-display-semibold: 600;
  --sot-weight-display-bold: 700;
  --sot-weight-display-black: 900;

  /* size -------------------------------------------------------------- */
  --sot-size-3xs: 0.6875rem;
  --sot-size-2xs: 0.75rem;
  --sot-size-xs: 0.8125rem;
  --sot-size-sm: 0.875rem;
  --sot-size-md: 1rem;
  --sot-size-lg: 1.125rem;
  --sot-size-xl: 1.375rem;
  --sot-size-2xl: 1.75rem;
  --sot-size-3xl: 2.25rem;
  --sot-size-4xl: 3rem;
  --sot-size-5xl: 4.25rem;
  --sot-size-6xl: 6rem;
  --sot-size-7xl: 8.5rem;

  /* leading ----------------------------------------------------------- */
  --sot-leading-display: 0.82;
  --sot-leading-display-th: 1.3;
  --sot-leading-tight: 0.95;
  --sot-leading-tight-th: 1.2;
  --sot-leading-snug: 1.15;
  --sot-leading-normal: 1.45;
  --sot-leading-loose: 1.7;

  /* track ------------------------------------------------------------- */
  --sot-track-tight: -0.02em;
  --sot-track-normal: 0em;
  --sot-track-wide: 0.08em;
  --sot-track-wider: 0.18em;
  --sot-track-widest: 0.34em;

  /* space ------------------------------------------------------------- */
  --sot-space-0: 0;
  --sot-space-1: 4px;
  --sot-space-2: 8px;
  --sot-space-3: 12px;
  --sot-space-4: 16px;
  --sot-space-5: 20px;
  --sot-space-6: 24px;
  --sot-space-8: 32px;
  --sot-space-10: 40px;
  --sot-space-12: 48px;
  --sot-space-16: 64px;
  --sot-space-20: 80px;
  --sot-space-24: 96px;
  --sot-space-32: 128px;

  /* border ------------------------------------------------------------ */
  --sot-border-hairline: 1px;
  --sot-border-rule: 2px;
  --sot-border-heavy: 4px;

  /* radius ------------------------------------------------------------ */
  --sot-radius-none: 0;

  /* logo -------------------------------------------------------------- */
  --sot-logo-clearspace-unit: 0.1185;
  --sot-logo-clearspace-of-primary: 0.0533;
  --sot-logo-clearspace-of-horizontal: 0.118;
  --sot-logo-min-size-digital: 100px;
  --sot-logo-min-size-print: 35mm;
  --sot-logo-aspect-primary: 1.3607;
  --sot-logo-aspect-horizontal: 6.2211;
  --sot-logo-aspect-primary-th: 1.3644;
  --sot-logo-aspect-small-use: 3.0224;

  /* kv ---------------------------------------------------------------- */
  --sot-kv-pad-inline: 0.045;
  --sot-kv-pad-block: 0.03;
  --sot-kv-aspect-poster: 2 / 3;
  --sot-kv-aspect-square: 1 / 1;
  --sot-kv-aspect-story: 9 / 16;
  --sot-kv-aspect-billboard: 4 / 3;

  /* effect ------------------------------------------------------------ */
  --sot-effect-halftone-cell: 4px;
  --sot-effect-halftone-angle: 45deg;
  --sot-effect-duotone-mix: 0.85;
  --sot-effect-imagery-notice: All imagery is for placement and inspirational purposes only.;

  /* motion ------------------------------------------------------------ */
  --sot-motion-duration-fast: 120ms;
  --sot-motion-duration-base: 200ms;
  --sot-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
}

/* type roles (p20, p21) ------------------------------------------------- */

.sot-headline-en {
  font-family: Tungsten Condensed;
  font-weight: 600;
  font-size: 8.5rem;
  line-height: 0.82;
  letter-spacing: -0.02em;
}

.sot-headline-th {
  font-family: Rahong;
  font-weight: 600;
  font-size: 8.5rem;
  line-height: 1.3;
  letter-spacing: -0.02em;
}

.sot-headline-secondary {
  font-family: LINE Seed Sans TH;
  font-weight: 900;
  font-size: 3rem;
  line-height: 0.95;
  letter-spacing: -0.02em;
}

.sot-subhead {
  font-family: LINE Seed Sans TH;
  font-weight: 800;
  font-size: 1.375rem;
  line-height: 1.15;
  letter-spacing: 0em;
}

.sot-body {
  font-family: LINE Seed Sans TH;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.45;
  letter-spacing: 0em;
}

.sot-event-info {
  font-family: LINE Seed Sans TH;
  font-weight: 900;
  font-size: 0.75rem;
  line-height: 1.15;
  letter-spacing: 0.34em;
}

.sot-award-year {
  font-family: LINE Seed Sans TH;
  font-weight: 900;
  font-size: 1.75rem;
  line-height: 0.95;
  letter-spacing: 0.34em;
}

/* duotone pairings (p60) — set data-sot-pair on any element --------------- */
[data-sot-pair="green-on-blue"] {
  --sot-pair-bg: #0000ff;
  --sot-pair-fg: #00ff00;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}
[data-sot-pair="magenta-on-blue"] {
  --sot-pair-bg: #0000ff;
  --sot-pair-fg: #ff00ff;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}
[data-sot-pair="blue-on-green"] {
  --sot-pair-bg: #00ff00;
  --sot-pair-fg: #0000ff;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}
[data-sot-pair="magenta-on-green"] {
  --sot-pair-bg: #00ff00;
  --sot-pair-fg: #ff00ff;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}
[data-sot-pair="blue-on-magenta"] {
  --sot-pair-bg: #ff00ff;
  --sot-pair-fg: #0000ff;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}
[data-sot-pair="green-on-magenta"] {
  --sot-pair-bg: #ff00ff;
  --sot-pair-fg: #00ff00;
  background: var(--sot-pair-bg);
  color: var(--sot-pair-fg);
}