/* ============================================================
   Kotari — tokens de marca
   Fonte: KV/Gemini_Generated_Image_2212uc2212uc2212.png
   (proposta de identidade visual)

   Regra: nada de hex solto no CSS das peças. Sempre var(--k-*).
   Se faltar um token, crie aqui — não improvise no componente.
   ============================================================ */

:root {
  /* ---- Paleta bruta (valores da prancha de identidade) ---- */
  --k-navy:        #0A1B3F;  /* primário */
  --k-emerald:     #1A633B;  /* ação / símbolo */
  --k-mint:        #E0F2E9;  /* secundário claro */
  --k-saffron:     #F5C71A;  /* secundário de destaque */
  --k-cream:       #FDFBF6;  /* fundo da marca */

  /* Warm greys: a prancha mostra os dois swatches mas não declara hex.
     Valores abaixo são aproximação — [confirmar com o DS]. */
  --k-grey-warm:   #C9C2BA;
  --k-grey-deep:   #7D7873;

  /* Derivados (tonalidades de trabalho, não estão na prancha) */
  --k-navy-900:    #060F24;
  --k-navy-700:    #16305F;
  --k-emerald-700: #124A2C;
  --k-emerald-300: #3E8C5F;

  /* ---- Papéis semânticos: use ESTES nas peças ---- */
  --k-bg:            var(--k-cream);
  --k-bg-alt:        var(--k-mint);
  --k-bg-inverse:    var(--k-navy);

  --k-surface:       #FFFFFF;
  --k-border:        var(--k-grey-warm);

  --k-text:          var(--k-navy);
  --k-text-muted:    var(--k-grey-deep);
  --k-text-inverse:  var(--k-cream);

  --k-action:            var(--k-emerald);
  --k-action-text:       #FFFFFF;
  --k-highlight:         var(--k-saffron);  /* dado, número, gráfico. NÃO é cor de CTA */

  /* ---- Tipografia ----
     [confirmar] A Satoshi Variable veio do site de referência, não da marca.
     O wordmark do KV é uma grotesca geométrica de peso alto. Definir antes de fechar peça. */
  --k-font-display: "Satoshi", system-ui, sans-serif;
  --k-font-text:    "Satoshi", system-ui, sans-serif;

  --k-step--1: clamp(0.83rem, 0.8rem + 0.15vw, 0.94rem);
  --k-step-0:  clamp(1rem, 0.96rem + 0.2vw, 1.13rem);
  --k-step-1:  clamp(1.35rem, 1.2rem + 0.7vw, 1.8rem);
  --k-step-2:  clamp(1.8rem, 1.5rem + 1.5vw, 2.8rem);
  --k-step-3:  clamp(2.4rem, 1.8rem + 3vw, 4.5rem);

  /* ---- Espaçamento e forma ---- */
  --k-space-1: 0.5rem;
  --k-space-2: 1rem;
  --k-space-3: 1.5rem;
  --k-space-4: 2.5rem;
  --k-space-5: 4rem;
  --k-space-6: 6.5rem;

  --k-radius:    12px;
  --k-radius-lg: 20px;
}

/* ============================================================
   Direção visual (do KV — vale para qualquer peça)

   - Fundo padrão é o creme, não branco puro. O branco é superfície
     de card, não fundo de página.
   - Fotografia é de alimento fresco e real, em luz natural, sobre
     superfície clara. Nada de foto de escritório ou aperto de mão.
   - O monograma entra como marca d'água discreta / textura, nunca
     como elemento gritante.
   - Textura de papel kraft é o material de apoio da marca.
   - Saffron é acento pontual (número, gráfico, grifo). Se virar cor
     de botão, a marca perde o eixo navy+emerald.
   ============================================================ */