/* NOUBAU — tipografia i tokens.
   Escrit a mà: no hi ha build ni node_modules. Els .woff2 són els subconjunts
   `latin` de Be Vietnam Pro (@fontsource 5.3.0) copiats a assets/fonts/.
   Amb `unicode-range` el navegador només baixa el que fa falta; els caràcters
   fora d'aquest rang (p. ex. ₂) cauen a la família de sistema, com abans. */

@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/be-vietnam-pro-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../fonts/be-vietnam-pro-latin-500-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Be Vietnam Pro';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../fonts/be-vietnam-pro-latin-800-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* NOUBAU — tokens. Font canònica: docs/BRAND.md § Identitat visual.
   Fons blanc pur, sense textura. Una sola família: Be Vietnam Pro. */

:root {
  color-scheme: light;

  /* ---------- Color ---------- */
  --c-ink: #1b1b1b;          /* text i logo */
  --c-black: #000000;        /* bandes i blocs */
  --c-paper: #ffffff;        /* fons: blanc pur, sense gra */
  /* El gris de suport de la marca és #8A8A8A, però sobre blanc només arriba a 3,4:1
     i el text de cos necessita 4,5:1. Es fa servir un to de la mateixa família que sí
     hi arriba (5,3:1); #8A8A8A es reserva per a filets i grafismes. */
  --c-muted: #6e6e6e;        /* text secundari (AA sobre blanc) */
  --c-muted-soft: #8a8a8a;   /* gris de marca: només grafisme, mai text petit */
  --c-rule: #e6e6e6;         /* filets */
  /* Igual amb la terracota: #C97A5A és l'accent de marca (3:1 → xifres grans, focus,
     subratllats); per a text i per al botó ple cal el to fosc de la mateixa família. */
  --c-terracotta: #c97a5a;   /* accent: focus, xifres grans, filets */
  --c-terracotta-ink: #a85c3e; /* text i botó primari sobre blanc (5,0:1) */
  --c-terracotta-deep: #8e4c33; /* hover del botó primari (6,5:1) */
  --c-pastel: #cbb0a5;       /* accent suau: tags, filets */
  --c-pastel-wash: #f4ebe7;  /* fons de tag */

  /* ---------- Tipografia ---------- */
  --font: 'Be Vietnam Pro', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --t-display: clamp(2.5rem, 1.05rem + 6.2vw, 6.5rem);   /* 40 → 104 px */
  --t-h1: clamp(2.25rem, 1.2rem + 4.5vw, 5rem);          /* 36 → 80 */
  --t-h2: clamp(1.75rem, 1.15rem + 2.4vw, 2.875rem);     /* 28 → 46 */
  --t-h3: clamp(1.375rem, 1.13rem + 1.05vw, 2rem);       /* 22 → 32 */
  --t-h4: clamp(1.125rem, 1.03rem + 0.4vw, 1.375rem);    /* 18 → 22 */
  --t-lead: clamp(1.1875rem, 1.05rem + 0.6vw, 1.5rem);   /* 19 → 24 */
  --t-body: clamp(1.0625rem, 1.03rem + 0.16vw, 1.125rem);/* 17 → 18 */
  --t-small: 0.9375rem;
  --t-kicker: clamp(0.6875rem, 0.66rem + 0.1vw, 0.75rem);/* 11 → 12 */
  --t-stat: clamp(2.5rem, 1.2rem + 4.2vw, 4rem);

  --lh-display: 1.02;
  --lh-title: 1.06;
  --lh-body: 1.55;
  --ls-display: -0.035em;
  --ls-title: -0.025em;
  --ls-kicker: 0.08em;

  /* ---------- Retícula i ritme ---------- */
  --max: 1440px;
  --gutter: 24px;            /* mòbil */
  --cols: 12;
  --gap: clamp(16px, 2.2vw, 32px);

  --s-1: 8px;
  --s-2: 16px;
  --s-3: 24px;
  --s-4: 40px;
  --s-5: 64px;
  --s-6: 96px;
  --s-7: 144px;
  --section-y: clamp(64px, 8vw, 144px);

  /* ---------- Motiu diagonal ----------
     L'aresta del símbol cau 24,7° respecte la vertical: tan(24,7°) ≈ 0,4607.
     --slant és l'alçada del tall; --slant-x, la carrera horitzontal que li toca. */
  --slant: clamp(48px, 8vw, 128px);
  --slant-x: calc(var(--slant) * 0.4607);

  --radius: 2px;
  --dur: 300ms;
  --ease: cubic-bezier(0.2, 0.7, 0.3, 1);
}

@media (min-width: 700px) {
  :root { --gutter: 48px; }
}
@media (min-width: 1180px) {
  :root { --gutter: 96px; }
}
