/*
 * Método 4D — Tokens
 * Projeto Legado 4D · Fernando Bacelar
 * Extraído da apresentação (atual). Fonte única de cor, tipo, espaço e tempo.
 *
 * O sistema é escuro por decisão, não por omissão: a marca vive no fundo
 * quase-preto com névoa violeta e o dourado como recompensa. Não há tema claro.
 */

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@200;300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,200..500,0..1,-25..200&display=block');

:root {
  /* ===== FUNDOS ===== */
  --bg: #05060C;              /* fundo-mãe, quase preto azulado */
  --bg2: #080A14;             /* segundo plano, seções alternadas */
  --indigo: #1B1145;          /* bloco denso, tabela, rodapé */

  /* ===== VIOLETA — a jornada ===== */
  --violet: #6D4AFF;          /* cor de ação: CTA, foco, barra */
  --violet-l: #9B7DFF;        /* texto sobre escuro, eyebrow, número */
  --violet-d: #3A1F9E;        /* profundidade, início de gradiente */
  --blue-deep: #1E3A8A;       /* orbe de apoio na névoa */

  /* ===== DOURADO — o destino ===== */
  --gold: #E5C46B;            /* citação, diamante, D4, prova */
  --gold-d: #B08F3A;          /* sombra do dourado, orbe */
  --gold-l: #FFF0C4;          /* brilho do diamante */

  /* ===== ÂMBAR — assinatura pessoal ===== */
  /* Cor do monograma FB. Território exclusivo da pessoa Fernando Bacelar:
     nunca em botão, nunca em texto, nunca disputando com o dourado do Método.
     Se aparecer fora do logotipo, deixou de ser assinatura. */
  --amber: #F29E1E;
  /* Tinta do nome "Fernando Bacelar" quando o logotipo vai sobre fundo claro.
     Vem do arquivo original da marca. Não é cor de interface. */
  --fb-tinta: #1C1E33;

  /* ===== TEXTO ===== */
  --white: #FFFFFF;           /* títulos */
  --text: #FFFFFF;            /* corpo sobre escuro — branco 100% (pedido do cliente, set/2026) */
  --muted: #FFFFFF;           /* apoio, legenda, descrição — branco 100% */
  --faint: rgba(255,255,255,.82); /* dica, marca d'água */

  /* ===== SUPERFÍCIE DE VIDRO ===== */
  --glass: rgba(255,255,255,.045);    /* card em repouso */
  --glass2: rgba(255,255,255,.075);   /* card em hover */
  --glass-soft: rgba(255,255,255,.028);/* chip, pílula */
  --stroke: rgba(255,255,255,.10);    /* contorno padrão */
  --stroke-soft: rgba(255,255,255,.055);
  --stroke-vio: rgba(155,125,255,.34);/* contorno ativo/hover */
  --tint-vio: rgba(155,125,255,.10);  /* preenchimento ativo */
  --stroke-gld: rgba(229,196,107,.30);/* contorno de chegada */
  --tint-gld: rgba(229,196,107,.08);  /* preenchimento de chegada */
  --blur: 22px;

  /* ===== FASES DO MÉTODO ===== */
  /* A cor sobe do roxo profundo ao dourado: o percurso é visível na paleta. */
  --d1: #6D4AFF;              /* DESPERTAR */
  --d2: #8763FF;              /* DECIDIR */
  --d3: #9B7DFF;              /* DESDOBRAMENTOS */
  --d4: #E5C46B;              /* DIAMANTES */

  /* ===== TIPOGRAFIA ===== */
  --font: 'Jost','Century Gothic','Avenir Next','Futura','Trebuchet MS',system-ui,-apple-system,sans-serif;

  --fw-thin: 200;             /* citação, itálico */
  --fw-light: 300;            /* corpo — peso padrão do sistema */
  --fw-book: 400;             /* legenda, small */
  --fw-medium: 500;           /* eyebrow, número, rótulo */
  --fw-semi: 600;             /* títulos */

  /* Escala fluida. Todo tamanho do sistema sai daqui. */
  --fs-display: clamp(57px, 9.6vw, 148px);   /* h1 / capa */
  --fs-h2:      clamp(36px, 5.5vw, 80px);
  --fs-mega:    clamp(30px, 5.2vw, 74px);    /* frase-manifesto */
  --fs-num:     clamp(52px, 6.1vw, 92px);    /* dado numérico */
  --fs-idx:     clamp(39px, 4.1vw, 59px);    /* índice de seção */
  --fs-quote:   clamp(25px, 3vw, 42px);
  --fs-h3:      clamp(22px, 2vw, 29px);
  --fs-lead:    clamp(18px, 1.48vw, 23px);
  --fs-body:    clamp(16px, 1.3vw, 19px);
  --fs-small:   clamp(15px, 1.24vw, 17.5px);
  --fs-label:   13px;                         /* rótulo caixa-alta */
  --fs-micro:   12px;                         /* contador, dica */

  --lh-tight: 1.14;
  --lh-title: 1.2;
  --lh-body: 1.68;
  --lh-lead: 1.72;

  --ls-display: -.035em;
  --ls-title: -.03em;
  --ls-tag: .42em;            /* eyebrow com respiro largo */
  --ls-label: .26em;
  --ls-small: .2em;

  --measure: 72ch;            /* largura máxima de leitura */

  /* ===== ÍCONES ===== */
  /* Material Symbols Rounded, eixo variável. O peso 300 e o traço arredondado
     acompanham a Jost geométrica; FILL fica em 0 — o sistema é de contorno. */
  --ico-fill: 0;
  --ico-wght: 300;
  --ico-grad: 0;
  --ico-sm: 20px;
  --ico-md: 24px;             /* padrão */
  --ico-lg: 32px;
  --ico-xl: 48px;

  /* ===== FOTOGRAFIA ===== */
  --foto-grade: linear-gradient(180deg, rgba(5,6,12,.20) 0%, rgba(5,6,12,.72) 78%, rgba(5,6,12,.94) 100%);
  --foto-tinta: rgba(58,31,158,.28);   /* véu violeta que une foto e ambiente */
  --foto-op: .92;                       /* opacidade de foto em fundo de cena */
  --foto-op-mob: .5;
  --foto-blur-borda: 0 0 90px 40px rgba(5,6,12,.9) inset;

  /* ===== ESPAÇAMENTO ===== */
  --sp-2xs: 6px;
  --sp-xs: 11px;
  --sp-sm: 18px;
  --sp-md: 26px;
  --sp-lg: 44px;
  --sp-xl: 64px;
  --sp-2xl: 96px;
  --sp-3xl: clamp(72px, 9vw, 140px);          /* respiro entre seções */
  --pad-slide: clamp(34px, 5.2vw, 88px);
  --pad-card: clamp(20px, 1.85vw, 30px);
  --maxw: 1460px;

  /* ===== RAIO ===== */
  --r-sm: 11px;               /* chip */
  --r-md: 14px;               /* linha de pergunta */
  --r-lg: 16px;               /* linha de jornada */
  --r-xl: 20px;               /* card de vidro */
  --r-pill: 999px;

  /* ===== LUZ E SOMBRA ===== */
  --glow-vio: 0 22px 60px rgba(109,74,255,.20);
  --glow-vio-sm: 0 0 16px rgba(155,125,255,.6);
  --glow-gold: 0 0 22px rgba(229,196,107,.5);
  --glow-gold-lg: 0 0 46px rgba(229,196,107,.75);
  --shadow-lift: 0 18px 44px rgba(0,0,0,.45);

  /* ===== GRADIENTES ===== */
  --grad-text: linear-gradient(96deg, #FFFFFF 6%, var(--violet-l) 52%, var(--gold) 96%);
  --grad-bar: linear-gradient(90deg, var(--violet-d), var(--violet-l) 60%, var(--gold));
  --grad-dmd: linear-gradient(135deg, var(--gold), var(--gold-l));
  --grad-rule: linear-gradient(90deg, var(--violet-l), transparent);

  /* ===== MOVIMENTO ===== */
  --ease: cubic-bezier(.16,.84,.44,1);        /* a única curva do sistema */
  --t-fast: .35s;
  --t-base: .55s;
  --t-slow: .9s;

  /* ===== CAMADAS ===== */
  --z-mesh: 0;
  --z-spot: 1;
  --z-grain: 2;
  --z-content: 5;
  --z-nav: 20;
  --z-chrome: 30;
}