/*
  Self-hosted faces from static/fonts/{Poppins,Be_Vietnam_Pro,Vina_Sans}.
  Full files (no unicode-range slices) so Vietnamese glyphs stay in-family.
  Slackside is one file — Google's overlapping slices made "&" paint wrong in Firefox.
*/

/* Poppins — body / UI */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-800.woff2') format('woff2');
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url('/fonts/Poppins/poppins-900.woff2') format('woff2');
}

/* Be Vietnam Pro — Vietnamese headings + UI when lang=vi */
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/Be_Vietnam_Pro/bevietnampro-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/Be_Vietnam_Pro/bevietnampro-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/Be_Vietnam_Pro/bevietnampro-700.woff2') format('woff2');
}
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/fonts/Be_Vietnam_Pro/bevietnampro-800.woff2') format('woff2');
}
@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 900;
  font-display: block;
  src: url('/fonts/Be_Vietnam_Pro/bevietnampro-900.woff2') format('woff2');
}

/* Vina Sans — English display headings */
@font-face {
  font-family: 'Vina Sans';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/fonts/Vina_Sans/vinasans-400.woff2') format('woff2');
}

/* Slackside One — hero "&" only */
@font-face {
  font-family: 'Slackside One';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/fonts/slacksideone.woff2') format('woff2');
}

/*
  Metric-matched local fallbacks (measured at 100px in Chromium).
  Impact has almost no Vietnamese glyphs — VI range uses Arial instead.
*/
@font-face {
  font-family: 'Vina Sans Fallback';
  src: local('Impact'), local('Haettenschweiler'), local('Arial Narrow');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
  size-adjust: 78%;
  ascent-override: 133%;
  descent-override: 22%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Vina Sans Fallback';
  src: local('Arial'), local('Helvetica Neue');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
    U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
    U+1EA0-1EF9, U+20AB;
  size-adjust: 91%;
  ascent-override: 114%;
  descent-override: 19%;
  line-gap-override: 0%;
}
@font-face {
  font-family: 'Poppins Fallback';
  src: local('Arial'), local('Helvetica Neue'), local('sans-serif');
  size-adjust: 113%;
  ascent-override: 93%;
  descent-override: 31%;
  line-gap-override: 0%;
}

:root {
  --font-heading: 'Vina Sans', 'Vina Sans Fallback', Impact, sans-serif;
  --font-body: 'Poppins', 'Poppins Fallback', Arial, sans-serif;
}

html {
  font-family: var(--font-body);
}

.vina-sans-regular,
.text-section {
  font-family: var(--font-heading);
}

.slackside-one-regular {
  font-family: 'Slackside One', var(--font-heading);
}

/*
  Vietnamese: Be Vietnam Pro for headings + body (buttons, cards, UI).
  Vina Sans / Impact scramble Ơ/Ư + tone marks; do not use line-height under ~1.15.
*/
:lang(vi) {
  --font-heading: 'Be Vietnam Pro', 'Poppins Fallback', Arial, sans-serif;
  --font-body: 'Be Vietnam Pro', 'Poppins Fallback', Arial, sans-serif;
}

:lang(vi) .text-section,
:lang(vi) .vina-sans-regular {
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
