/* =============================================================================
   Rosathon — tokens da identidade visual

   Direção: terminal instável. Base CRT quase preta, chuva de código ao fundo,
   deslocamento cromático rosa/ciano no texto de display e raios ocasionais.
   A marca não muda: ROSA continua rosa, THON continua cinza.

   Nenhum hex solto nos outros arquivos. Qualquer cor da marca sai daqui.
   ========================================================================== */

:root {
    /* ---- Cores: base ---------------------------------------------------- */

    /*
       O preto ganhou um viés frio em relação ao #0A0A0A original: sobre ele o
       verde da chuva e o ciano do raio leem como fósforo de monitor, não como
       cor decorativa em cima de cinza.
    */
    --color-black: #050607;

    /* Cards, containers, modais, blocos internos. */
    --color-black-secondary: #0B0D0F;

    --color-gray-dark: #14181B;

    /* THON, textos secundários, labels, informações complementares. */
    --color-gray: #8A8A8A;

    --color-gray-light: #C7C7C7;

    --color-white: #F5F5F5;

    /* ---- Cores: marca --------------------------------------------------- */

    /* ROSA, botões principais, links, destaques, ícones, estados ativos. */
    --color-pink: #FF3B9D;

    /* Hover, gradientes, sombras, detalhes. */
    --color-pink-dark: #D91F7A;

    /* Acento neon — usar com moderação. */
    --color-pink-neon: #FF4FB0;

    /* ---- Cores: camada glitch ------------------------------------------- */

    /*
       Três papéis fixos, para o efeito não virar arco-íris:

       matrix  chuva de código, prompt, cursor, estado confirmado
       cyan    metade fria do deslocamento cromático e o raio
       bug     falha, case tomado, briefing bloqueado, erro
    */
    --color-matrix: #00FF9C;
    --color-matrix-dim: #0C7A55;

    --color-cyan: #24E1FF;

    --color-success: #00FF9C;
    --color-danger: #FF4D4D;
    --color-bug: #FF4D4D;

    /* ---- Derivadas ------------------------------------------------------ */

    --border-subtle: #1B2126;
    --border-strong: #2E383F;

    --border-pink: rgba(255, 59, 157, .65);
    --border-pink-faint: rgba(255, 59, 157, .15);
    --border-matrix: rgba(0, 255, 156, .45);
    --border-matrix-faint: rgba(0, 255, 156, .16);
    --border-cyan-faint: rgba(36, 225, 255, .18);
    --border-bug: rgba(255, 77, 77, .45);

    --tint-pink: rgba(255, 59, 157, .07);
    --tint-matrix: rgba(0, 255, 156, .07);
    --tint-bug: rgba(255, 77, 77, .08);

    --glow-pink: 0 0 25px rgba(255, 59, 157, .35);
    --glow-pink-soft: 0 8px 30px rgba(255, 59, 157, .25);
    --glow-pink-card: 0 15px 50px rgba(255, 59, 157, .15);
    --glow-matrix: 0 0 22px rgba(0, 255, 156, .3);
    --glow-cyan: 0 0 22px rgba(36, 225, 255, .32);
    --glow-bug: 0 0 20px rgba(255, 77, 77, .3);

    /* Sombra de texto do deslocamento cromático (rosa à esquerda, ciano à direita). */
    --shadow-split: -2px 0 rgba(255, 59, 157, .75), 2px 0 rgba(36, 225, 255, .65);

    /* ---- Tipografia ----------------------------------------------------- */

    --font-display: 'Sora', 'Segoe UI', system-ui, sans-serif;
    --font-body: 'Inter', 'Segoe UI', system-ui, sans-serif;

    /*
       Monoespaçada de sistema, de propósito. É o que faz o site parecer console,
       e não há .woff2 mono em vendor/ — puxar uma de CDN quebraria a regra que
       existe justamente para o dia do evento. Fonte instalada não depende de rede.
    */
    --font-mono: ui-monospace, 'Cascadia Mono', 'Segoe UI Mono', Consolas,
        'DejaVu Sans Mono', 'Liberation Mono', monospace;

    /* Escala do §3. O H1 é responsivo: 64 desktop, 48 tablet, 38 mobile. */
    --fs-h1: 64px;
    --lh-h1: 72px;
    --fs-h2: 44px;
    --lh-h2: 52px;
    --fs-h3: 28px;
    --lh-h3: 36px;
    --fs-h4: 22px;
    --lh-h4: 30px;
    --fs-body: 16px;
    --lh-body: 26px;
    --fs-small: 14px;
    --lh-small: 20px;
    --fs-code: 13px;

    /* Rastreamento das etiquetas mono — o ar entre letras é metade do efeito. */
    --tracking-mono: .16em;

    /* ---- Espaçamento e forma -------------------------------------------- */

    /*
       Cantos praticamente retos. O arredondado de 16px suavizava a interface;
       aqui a borda dura é o que sustenta a leitura de terminal. O antigo
       --radius-pill saiu: pílula e botão redondo não existem mais em tela
       nenhuma, e manter o token convidaria a reintroduzi-los.
    */
    --radius-sm: 2px;
    --radius: 3px;
    --radius-card: 4px;

    --container: 1200px;
    --header-height: 76px;

    --section-gap: 120px;

    /* ---- Movimento ------------------------------------------------------ */

    --transition: 200ms ease;
    --transition-slow: 600ms cubic-bezier(.22, 1, .36, 1);

    /* Passo do glitch. Curto de propósito: falha é instantânea, não animação. */
    --glitch-step: 2.6s;

    /* ---- Camada de fundo ------------------------------------------------ */

    /* Grid de circuito. */
    --grid-size: 40px;
    --grid-line: rgba(0, 255, 156, .035);

    /*
       Chuva de código: opacidade do canvas inteiro, não de cada glifo. Baixa de
       propósito — nas seções sem painel o texto corrido fica em cima dela, e é
       a legibilidade desse texto que define o teto deste número.
    */
    --rain-opacity: .15;

    /* Scanline do CRT sobreposto ao conteúdo. */
    --scanline-size: 3px;
    --scanline-color: rgba(0, 0, 0, .28);
}

@media (max-width: 991px) {
    :root {
        --fs-h1: 48px;
        --lh-h1: 56px;
        --fs-h2: 34px;
        --lh-h2: 42px;
        --fs-h3: 24px;
        --lh-h3: 32px;
        --section-gap: 88px;
    }
}

@media (max-width: 575px) {
    :root {
        --fs-h1: 38px;
        --lh-h1: 44px;
        --fs-h2: 28px;
        --lh-h2: 36px;
        --fs-h4: 20px;
        --section-gap: 64px;
        --header-height: 64px;

        /* Tela pequena, texto por cima: a chuva precisa recuar. */
        --rain-opacity: .11;
    }
}