/* =========================================================================
   AKROS — Design tokens
   Paleta extraída do frame de referência (amostragem de pixels).
   ========================================================================= */

@property --beam  { syntax:'<angle>';  initial-value:0deg; inherits:false }
@property --score { syntax:'<number>'; initial-value:0;    inherits:false }

:root{
  /* ---- tinta ---- */
  --ink:        #0A1F45;
  --ink-soft:   #16325A;
  --body:       #38485F;
  --muted:      rgba(10,31,69,.60);
  --faint:      rgba(10,31,69,.44);
  --ghost:      rgba(10,31,69,.28);

  /* ---- azul de marca ---- */
  --accent:     #0A80E2;
  --accent-lo:  #0A56C8;
  --accent-hi:  #43A6FF;
  --accent-ink: #063A82;

  /* ---- superfícies ---- */
  --glass:      rgba(255,255,255,.34);
  --glass-2:    rgba(255,255,255,.52);
  --solid:      rgba(255,255,255,.94);
  --line:       rgba(10,31,69,.12);
  --line-soft:  rgba(10,31,69,.07);
  --edge:       rgba(255,255,255,.62);

  /* ---- fundo ---- */
  --bg-a:       #D5E7F1;
  --bg-b:       #A4BBCB;
  --bg-c:       #8A9EB2;
  --bg-d:       #62788D;

  /* ---- sombras ---- */
  --sh-card:    0 22px 48px -20px rgba(12,34,58,.42), 0 2px 8px -2px rgba(12,34,58,.14);
  --sh-lift:    0 40px 80px -28px rgba(12,34,58,.50), 0 4px 14px -4px rgba(12,34,58,.18);
  --sh-btn:     0 14px 30px -10px rgba(10,86,200,.55), inset 0 1px 0 rgba(255,255,255,.35);

  /* ---- cantos ----
     Multiplicador de TODO canto arredondado do site. Nenhum raio foi apagado:
     eles passam por aqui. 0 = tudo reto. 1 = o desenho original de volta.
     Meio-termo vale: .5 arredonda pela metade.
     Circulo nao e canto — as bolinhas, o anel do score e os avatares seguem
     redondos independentemente deste numero. */
  --r: 0;

  /* O aparelho da secao 2 e' HARDWARE, nao interface: um iPhone reto nao
     existe, e deixa-lo quadrado fazia o quadro parecer defeito de render em
     vez de decisao. Por isso ele tem multiplicador proprio, e este fica em 1.
     Os raios aqui sao os reais em proporcao: 55pt de canto para 393pt de
     largura de tela = 0,14 — o mesmo que 31px numa tela de 220px. */
  --r-fone: 1;

  /* ---- tipografia ---- */
  --serif: "Bodoni Moda", "Didot", "Times New Roman", serif;
  /* Segoe UI e a fonte do sistema no Windows: nao ha o que baixar, e por isso
     ela nunca chega depois do texto. Para voltar a Instrument Sans, troque a
     ordem aqui e devolva a familia ao <link> das fontes no index.html. */
  --sans:  "Segoe UI", "Segoe UI Variable Text", system-ui, -apple-system,
           BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;

  /* ---- movimento ---- */
  --ease:      cubic-bezier(.22,.61,.36,1);
  --ease-io:   cubic-bezier(.65,.05,.36,1);
  --ease-pop:  cubic-bezier(.34,1.36,.5,1);

  /* ---- métrica ---- */
  --gutter:    clamp(18px,2.4vw,60px);
  --maxw:      1780px;
  /* 84px era uma faixa alta demais para um menu de seis itens — e ela
     cobra o mesmo recuo no TOPO de todas as secoes. 68 devolve 16px de
     altura util para cada quadro da pagina. */
  --nav-h:     68px;

  /* ---- palco do pipeline ---- */
  --body-h:    clamp(228px,26.5vh,300px);
  --slot-h:    clamp(140px,16.4vh,186px);

  /* ---- progresso da cortina (JS sobrescreve; 1 = cortina fechada) ---- */
  --p: 1;
}
