/* ============================================================
   VG · Visconde de Guarapuava 2134 — Design Tokens
   Paleta extraída da Apresentação VG (Martelli Construções)
   ============================================================ */

@layer tokens {
  :root {
    /* --- Marca (amostradas do PDF) --- */
    --ink:        #1A1A1A;   /* preto de marca            */
    --charcoal:   #393939;   /* cinza escuro institucional */
    --gray:       #808080;   /* cinza médio institucional  */
    --taupe:      #928076;   /* greige quente secundário   */
    --bone:       #F4F1ED;   /* papel quente               */
    --paper:      #FBFAF8;
    --white:      #FFFFFF;

    /* --- Acento (terracota da fachada + laranja da academia) --- */
    /* LARANJA DE AÇÃO — só o que é clicável. Escurecido de #E2601B para
       carregar texto branco: 5,56:1 contra os 3,55:1 do tom anterior. */
    --ember:      #B0480D;
    /* LARANJA ABERTO — o mesmo laranja com luz para virar texto ou traço
       sobre o preto de marca: 4,91:1, contra os 3,13:1 do de ação. É o
       valor que toda superfície escura empresta para --ember-tx. */
    --ember-open: #E2601B;
    /* LARANJA COMO TEXTO — o de ação reprova sobre fundo escuro (3,13:1),
       e o aberto reprova sobre fundo claro (3,15:1). Este se adapta: aqui
       vale para fundo claro (4,94:1) e toda superfície escura o troca
       por --ember-open. */
    --ember-tx:   #B0480D;
    /* HOVER — preenche o botão POR BAIXO do texto branco, então precisa
       carregar branco como o de ação. #F0700F dava 2,99:1 e reprovava o
       CTA principal no estado de hover; este dá 4,66:1 e ainda lê como
       clareada sobre o laranja de ação. */
    --ember-hi:   #C25211;
    --terra:      #C9704E;   /* terracota da fachada       */

    /* --- Texto --- */
    --tx-strong:  var(--ink);
    --tx-body:    #5C5854;   /* 6.26:1 sobre --bone        */
    --tx-mute:    #6B6560;   /* 5.10:1 sobre --bone        */
    --tx-on-dark: #EDEAE6;
    --tx-on-dark-mute: #A9A5A0; /* 7.11:1 sobre --ink      */

    /* --- Linhas --- */
    --rule:       color-mix(in oklab, var(--ink) 14%, transparent);
    --rule-dark:  color-mix(in oklab, var(--white) 16%, transparent);

    /* --- Tipografia fluida --- */
    --f-sans: "Figtree", ui-sans-serif, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

    --t-display: clamp(2.85rem, 1.1rem + 7.1vw, 7rem);
    --t-h2:      clamp(2.1rem,  1.05rem + 4.1vw, 4.4rem);
    --t-h3:      clamp(1.4rem,  1.05rem + 1.3vw, 2rem);
    --t-lead:    clamp(1.06rem, 0.98rem + 0.42vw, 1.32rem);
    --t-body:    clamp(1rem,    0.95rem + 0.16vw, 1.06rem);   /* piso 16px: abaixo disso o Safari do iPhone dá zoom ao focar um campo */
    --t-label:   0.72rem;   /* era clamp(.66, …, .72): no celular caía a 10,6 px; o desktop já usava .72 */
    --t-stat:    clamp(2.4rem,  1.2rem + 4.4vw, 4.6rem);

    /* --- Ritmo --- */
    --pad-x:     clamp(1.25rem, 0.4rem + 3.6vw, 5.5rem);
    --sec-y:     clamp(3.4rem, 1.4rem + 6vw, 7.5rem);
    --gap:       clamp(1.25rem, 0.6rem + 2.2vw, 3rem);
    --maxw:      100rem;
    --measure:   40ch;

    /* --- Movimento --- */
    --ease-out:  cubic-bezier(.16, 1, .3, 1);
    --ease-io:   cubic-bezier(.62, .05, .2, 1);
    --dur-s:     .28s;
    --dur-m:     .6s;
    --dur-l:     1.05s;

    --nav-h:     4.5rem;
    --letreiro-h: 2.6rem;   /* o hero desconta isto para o letreiro caber na 1ª tela */
    color-scheme: light;
  }
}