/* ==========================================================================
   VARIABLES.CSS — Design tokens Grupo Mauser
   Único arquivo que muda para criar variação de tema.

   A base neutra foi MEDIDA nos vídeos oficiais, para a emenda entre o
   <video> e o fundo da página ser invisível:
     Volt, pináculo à noite (t=62s)  → RGB(2,1,10)
     Electron, abertura   (t=2s)     → RGB(4,1,9)
     Electron, fecho      (t=135s)   → RGB(20,19,22)
   Ao trocar as peças de vídeo, reamostre (procedimento no README).
   ========================================================================== */

:root {

    /* ---------- Base neutra ----------
       Preto com viés azul levíssimo. Não é preto puro: preto puro sobre
       tela OLED cria borda dura onde o vídeo termina. */
    --void:            #05050C;   /* fundo principal do site */
    --surface:         #0D0D16;   /* cards, blocos elevados */
    --surface-2:       #14141F;   /* hover, estados ativos */
    --surface-3:       #1C1C29;   /* blocos aninhados */
    --line:            rgba(255,255,255,.09);
    --line-forte:      rgba(255,255,255,.18);

    /* ---------- Texto ---------- */
    --text:            #FFFFFF;
    --text-muted:      rgba(255,255,255,.66);   /* 9,2:1 sobre --void */
    --text-dim:        rgba(255,255,255,.40);   /* 5,1:1 — mínimo para corpo */

    /* ---------- Marcas do grupo ----------
       Amostradas dos logos oficiais, não estimadas.

       O grupo é a SOMA das luzes: branco. Cada empresa é um espectro
       dessa mesma luz. Por isso a marca-mãe não tem cor própria — ela
       contém as outras. Ao acrescentar algo colorido, verifique em qual
       espectro ele cai; se não cair em nenhum, é da marca-mãe e é branco. */
    --mauser-vermelho: #DE4A3E;   /* Móveis Planejados — hexágono */
    --mauser-verde:    #8FE320;   /* Empreendimentos — o "M" angular */
    --volt-dourado:    #E8B84B;   /* Volt Tower — o raio */
    --volt-ambar:      #C98A3C;   /* Volt — apoio quente */
    --electron-ciano:  #35E0E8;   /* Electron Tower — órbita fria */
    --electron-magenta:#E838C8;   /* Electron — órbita quente, uso escasso */

    /* ---------- Acento por contexto ----------
       Fallback = branco, que é a marca-mãe. Os seletores abaixo trocam
       o acento da página inteira; nenhum componente escreve cor direto. */
    --accent:          var(--text);
    --accent-soft:     rgba(255,255,255,.14);
    --accent-line:     rgba(255,255,255,.28);

    /* ---------- Tipografia ----------
       Display: Sora — geométrica de terminais retos, com tracking largo,
                que é o registro do wordmark MAUSER.
       Corpo:   Inter — neutra, alta legibilidade em tela escura.
       Dados:   JetBrains Mono — ficha técnica e medidas. */
    --font-display:    'Sora', system-ui, sans-serif;
    --font-body:       'Inter', system-ui, sans-serif;
    --font-mono:       'JetBrains Mono', ui-monospace, monospace;

    --fs-hero:         clamp(38px, 6.2vw, 78px);
    --fs-h2:           clamp(28px, 3.6vw, 48px);
    --fs-h3:           clamp(20px, 2.1vw, 28px);
    --fs-body:         clamp(15px, 1.05vw, 16.5px);
    --fs-small:        13.5px;
    --fs-eyebrow:      11px;

    --tracking-wide:   .38em;   /* etiquetas e versaletes */
    --tracking-brand:  .42em;   /* wordmark */

    /* ---------- Ritmo ---------- */
    --gap:             clamp(16px, 2vw, 28px);
    --pad-x:           clamp(22px, 5vw, 78px);
    --sec-y:           clamp(72px, 9vw, 140px);
    --maxw:            1320px;
    --maxw-texto:      68ch;

    /* ---------- Movimento ----------
       Uma curva só no site inteiro. Duas curvas diferentes em telas
       vizinhas leem como dois sites. */
    --ease:            cubic-bezier(.16, 1, .3, 1);
    --dur:             .6s;

    /* ---------- Malha de luz ----------
       Reticulado triangular que evoca a decomposição do espectro.
       Substitui o grid quadrado genérico. */
    --malha:
      repeating-linear-gradient(60deg,  rgba(255,255,255,.035) 0 1px, transparent 1px 38px),
      repeating-linear-gradient(-60deg, rgba(255,255,255,.035) 0 1px, transparent 1px 38px);
}

/* ==========================================================================
   CONTEXTOS — o acento troca, nada mais
   ========================================================================== */

[data-contexto="moveis"] {
    --accent:      var(--mauser-vermelho);
    --accent-soft: rgba(222,74,62,.13);
    --accent-line: rgba(222,74,62,.30);
}

[data-contexto="empreendimentos"] {
    --accent:      var(--mauser-verde);
    --accent-soft: rgba(143,227,32,.12);
    --accent-line: rgba(143,227,32,.30);
}

[data-torre="volt-tower"] {
    --accent:      var(--volt-dourado);
    --accent-soft: rgba(232,184,75,.12);
    --accent-line: rgba(232,184,75,.30);
    --void:        #06050A;   /* medido no pináculo noturno */
}

[data-torre="electron-tower"] {
    --accent:      var(--electron-ciano);
    --accent-soft: rgba(53,224,232,.11);
    --accent-line: rgba(53,224,232,.30);
    --void:        #04060E;   /* medido na fachada em LED */
}

/* Quem pediu menos movimento no sistema recebe menos movimento. */
@media (prefers-reduced-motion: reduce) {
    :root { --dur: .01s; }
}