/* ---------------------------------------------------------------------------
   Design tokens — lifted verbatim from the Framer build so the rebuild is 1:1.
   Framer emitted these as opaque --token-<uuid> names; they're given readable
   names here, with the original uuid noted so anything can be traced back.
   --------------------------------------------------------------------------- */

:root {
  /* palette */
  --c-black:        #000;          /* html body background */
  --c-brown:        #2b1b0d;       /* token-3211793c — brand brown (intro screen) */
  --c-off-white:    #eee;          /* token-b893d6f3 */
  --c-off-white-90: #eeeeeee6;     /* token-a038fa8f */
  --c-grey-dbd:     #dbdbdb;       /* token-2c000d89 */
  --c-white:        #fff;          /* token-44688335 */
  --c-white-f5:     #f5f5f5;       /* token-498cfe74 */
  --c-glass:        #f5f5f533;     /* token-46dc26a4 — the "GLASS" surfaces */
  --c-near-black:   #121212;       /* token-a86c6d9c */
  --c-grey-1a:      #1a1a1a;       /* token-510a3d4e */
  --c-grey-23:      #232323;       /* token-07b72685 */
  --c-grey-82:      #828282;       /* token-788313b6 */

  /* type */
  /* REGRA DA CASA: abaixo de 18 pt (24 px) a tipografia principal é a
     Maxeville Tekst. Construct e Regular são cortes de display e só entram
     acima desse limiar. Por isso --font-body — que é o texto corrido, sempre
     abaixo de 18 pt — aponta para a Tekst, com a Regular como primeiro
     fallback: se o woff2 falhar, o texto volta ao que era. */
  --font-display: 'Maxeville Construct', 'Maxeville Regular', sans-serif;
  --font-body:    'Maxeville Tekst', 'Maxeville Regular', 'General Sans', sans-serif;
  --font-alt:     'General Sans', sans-serif;
  --font-text:    var(--font-body);   /* apelido histórico */

  --fs-sm: 12px;   /* body copy / captions — Framer's dominant size */
  --fs-md: 16px;
  --lh-tight: 1.2em;
  --lh-body: 140%;
  --ls-flat: 0;

  /* layout — Framer's `sizes` attrs resolve the content column to 70vw */
  --col-main: 70;          /* percent */
  --gap: 10px;
}

/* Breakpoints observed in the Framer CSS: 810 / 1200 / 1400 / 1600 / 1920 */

/* ---------------------------------------------------------------------------
   Fonts — self-hosted. `swap` so text paints immediately instead of blocking.
   --------------------------------------------------------------------------- */

@font-face {
  font-family: 'Maxeville Regular';
  src: url('/fonts/maxeville-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Maxeville Construct';
  src: url('/fonts/maxeville-construct.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Maxeville Tekst — o corte de TEXTO da família. Desenhado para tamanho
   pequeno e leitura longa: aberturas maiores e menos contraste que a
   Regular, que é um corte de uso geral e fecha nos 12px do copy dos
   projetos. Convertida do OTF original da SM Foundry (Maxeville-Tekst.otf,
   328 glifos, 1000 upem) — 16,6 KB em woff2, a mais leve das quatro. */
@font-face {
  font-family: 'Maxeville Tekst';
  src: url('/fonts/maxeville-tekst.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'General Sans';
  src: url('/fonts/general-sans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* ---------------------------------------------------------------------------
   Base
   --------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--c-black);
  color: var(--c-white);
}

body {
  font-family: var(--font-body);
  font-size: var(--fs-sm);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img, video { display: block; max-width: 100%; }

a { color: inherit; text-decoration: none; }

/* Respect users who ask for less motion — the Framer build did not do this. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
