/* =============================================================================
   Já Assinei — tokens da identidade visual
   Origem: "Já Assinei Design System" (tokens/colors, typography, spacing,
   radius-shadow, motion). Este arquivo é a tradução fiel daqueles tokens para
   o produto, com UMA diferença deliberada: as fontes são servidas LOCALMENTE.

   O design system entrega as fontes pelo Google Fonts e registra a pendência:
   "o produto roda sem internet por decisão de arquitetura - para usar em
   produção, baixe os .woff2 e troque os src". Foi o que foi feito: os arquivos
   estão em /fonts e nenhuma requisição sai para fora.
   ============================================================================= */

/* ---- Plus Jakarta Sans: texto e display (peso variável 200-800) ---------- */
@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("/fonts/plus-jakarta-sans-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                   U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                   U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Plus Jakarta Sans";
    font-style: normal;
    font-weight: 200 800;
    font-display: swap;
    src: url("/fonts/plus-jakarta-sans-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                   U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                   U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---- JetBrains Mono: SÓ dado verificável (hash, código, IP, chave) ------- */
@font-face {
    font-family: "JetBrains Mono";
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url("/fonts/jetbrains-mono-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                   U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                   U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "JetBrains Mono";
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url("/fonts/jetbrains-mono-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                   U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF,
                   U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
    /* ---- base: azul-marinho (institucional) ---------------------------- */
    --ja-azul-950: #06131F;
    --ja-azul-900: #0B2033;
    --ja-azul-800: #102D49;
    --ja-azul-700: #153A5E;
    --ja-azul-600: #1B4B75;
    --ja-azul-500: #2A6CA3;
    --ja-azul-400: #5590C0;
    --ja-azul-300: #8FB6D6;
    --ja-azul-200: #C4DAEA;
    --ja-azul-100: #E1EDF6;
    --ja-azul-50:  #F2F7FB;

    /* ---- acento: verde-lima (ação e conclusão, uma vez por tela) -------- */
    --ja-lima-700: #5C7F0E;
    --ja-lima-600: #7BA614;
    --ja-lima-500: #9ACD1F;
    --ja-lima-400: #B8E63C;
    --ja-lima-300: #CFF072;
    --ja-lima-200: #E4F8AE;
    --ja-lima-100: #F2FCD9;

    /* ---- neutros -------------------------------------------------------- */
    --ja-cinza-900: #141B22;
    --ja-cinza-800: #1D2733;
    --ja-cinza-700: #3A4855;
    --ja-cinza-600: #5A6B7B;
    --ja-cinza-500: #7C8B99;
    --ja-cinza-400: #A8B4BF;
    --ja-cinza-300: #DCE3EA;
    --ja-cinza-200: #E9EEF3;
    --ja-cinza-100: #F2F5F8;
    --ja-cinza-50:  #F7F9FB;
    --ja-branco:    #FFFFFF;

    /* ---- semânticos de estado ------------------------------------------ */
    --ja-sucesso-600: #0F7D5B;
    --ja-sucesso-500: #17A67B;
    --ja-sucesso-200: #BFE8DA;
    --ja-sucesso-100: #E6F6F0;
    --ja-aviso-600:   #8A5600;
    --ja-aviso-500:   #E08A00;
    --ja-aviso-200:   #F6E0B8;
    --ja-aviso-100:   #FDF3E3;
    --ja-perigo-600:  #9E2B20;
    --ja-perigo-500:  #C0392B;
    --ja-perigo-200:  #F1CFCB;
    --ja-perigo-100:  #FBEAE8;

    /* ---- aliases semânticos -------------------------------------------- */
    --ja-primaria:        var(--ja-azul-600);
    --ja-primaria-escura: var(--ja-azul-700);
    --ja-primaria-clara:  var(--ja-azul-100);
    --ja-acento:          var(--ja-lima-500);
    --ja-acento-escura:   var(--ja-lima-600);
    --ja-acento-clara:    var(--ja-lima-100);

    --ja-texto:           var(--ja-cinza-800);
    --ja-texto-suave:     var(--ja-cinza-600);
    --ja-texto-fraco:     var(--ja-cinza-500);
    --ja-texto-invertido: var(--ja-branco);
    --ja-texto-link:      var(--ja-azul-600);
    --ja-texto-link-hover:var(--ja-azul-700);

    --ja-fundo:              var(--ja-cinza-100);
    --ja-fundo-escuro:       var(--ja-azul-900);
    --ja-superficie:         var(--ja-branco);
    --ja-superficie-suave:   var(--ja-cinza-50);
    --ja-superficie-marcada: var(--ja-azul-50);

    --ja-borda:       var(--ja-cinza-300);
    --ja-borda-forte: var(--ja-cinza-400);
    --ja-borda-foco:  var(--ja-azul-500);

    /* Os DOIS únicos fundos coloridos do sistema. Não criar outros. */
    --ja-hero-fundo: linear-gradient(158deg, var(--ja-azul-900) 0%, var(--ja-azul-700) 62%, var(--ja-azul-600) 100%);
    --ja-selo-fundo: linear-gradient(140deg, var(--ja-lima-400) 0%, var(--ja-lima-500) 100%);

    /* ---- tipografia ----------------------------------------------------- */
    --ja-fonte-base: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --ja-fonte-display: var(--ja-fonte-base);
    --ja-fonte-mono: "JetBrains Mono", "Cascadia Mono", Consolas, "Liberation Mono", Menlo, monospace;

    --ja-peso-normal: 400;
    --ja-peso-medio:  500;
    --ja-peso-semi:   600;
    --ja-peso-forte:  700;
    --ja-peso-extra:  800;

    --ja-texto-2xs:  11px;
    --ja-texto-xs:   12px;
    --ja-texto-sm:   13px;
    --ja-texto-md:   15px;
    --ja-texto-base: 16px;
    --ja-texto-lg:   18px;
    --ja-texto-xl:   21px;
    --ja-texto-2xl:  26px;
    --ja-texto-3xl:  32px;
    --ja-texto-4xl:  40px;
    --ja-texto-5xl:  52px;
    --ja-texto-6xl:  64px;

    --ja-altura-apertada: 1.15;
    --ja-altura-titulo:   1.22;
    --ja-altura-media:    1.4;
    --ja-altura-corpo:    1.55;
    --ja-altura-solta:    1.7;

    --ja-tracking-display: -0.03em;
    --ja-tracking-titulo:  -0.015em;
    --ja-tracking-normal:  0;
    --ja-tracking-rotulo:  0.06em;
    --ja-tracking-mono:    0.02em;

    --ja-display:  var(--ja-peso-extra) var(--ja-texto-5xl)/var(--ja-altura-apertada) var(--ja-fonte-display);
    --ja-titulo-1: var(--ja-peso-forte) var(--ja-texto-3xl)/var(--ja-altura-titulo) var(--ja-fonte-display);
    --ja-titulo-2: var(--ja-peso-forte) var(--ja-texto-2xl)/var(--ja-altura-titulo) var(--ja-fonte-display);
    --ja-titulo-3: var(--ja-peso-semi) var(--ja-texto-lg)/var(--ja-altura-media) var(--ja-fonte-base);
    --ja-corpo:    var(--ja-peso-normal) var(--ja-texto-base)/var(--ja-altura-corpo) var(--ja-fonte-base);
    --ja-corpo-sm: var(--ja-peso-normal) var(--ja-texto-md)/var(--ja-altura-corpo) var(--ja-fonte-base);
    --ja-rotulo:   var(--ja-peso-semi) var(--ja-texto-sm)/var(--ja-altura-media) var(--ja-fonte-base);
    --ja-eyebrow:  var(--ja-peso-forte) var(--ja-texto-xs)/var(--ja-altura-media) var(--ja-fonte-base);
    --ja-mono:     var(--ja-peso-medio) var(--ja-texto-sm)/var(--ja-altura-media) var(--ja-fonte-mono);

    /* ---- espaçamento (base 4px) ---------------------------------------- */
    --ja-esp-0: 0px;   --ja-esp-1: 4px;   --ja-esp-2: 8px;   --ja-esp-3: 12px;
    --ja-esp-4: 16px;  --ja-esp-5: 20px;  --ja-esp-6: 24px;  --ja-esp-8: 32px;
    --ja-esp-10: 40px; --ja-esp-12: 48px; --ja-esp-16: 64px; --ja-esp-20: 80px;
    --ja-esp-24: 96px;

    --ja-container:          1140px;
    --ja-container-estreito: 840px;
    --ja-lateral-largura:    240px;
    --ja-cabecalho-altura:   60px;

    --ja-secao-y:        44px;
    --ja-secao-y-grande: 80px;
    --ja-card-padding:   20px;
    --ja-gap-grid:       16px;
    --ja-gap-grid-grande:24px;

    /* ---- raios e elevação ---------------------------------------------- */
    --ja-raio-xs: 4px;  --ja-raio-sm: 6px;  --ja-raio-md: 10px;
    --ja-raio-lg: 14px; --ja-raio-xl: 20px; --ja-raio-pilula: 999px;

    --ja-sombra-0: none;
    --ja-sombra-1: 0 1px 2px rgba(11,32,51,.06);
    --ja-sombra-2: 0 2px 6px rgba(11,32,51,.07), 0 1px 2px rgba(11,32,51,.05);
    --ja-sombra-3: 0 8px 24px rgba(11,32,51,.10);
    --ja-sombra-4: 0 18px 48px rgba(11,32,51,.16);
    --ja-sombra-foco: 0 0 0 3px rgba(42,108,163,.28);
    --ja-sombra-foco-acento: 0 0 0 3px rgba(154,205,31,.35);
    --ja-sombra-interna: inset 0 1px 0 rgba(255,255,255,.6);

    --ja-borda-largura: 1px;
    --ja-borda-largura-forte: 2px;
    --ja-borda-padrao: 1px solid var(--ja-borda);

    /* ---- movimento ------------------------------------------------------ */
    --ja-dur-rapida: 120ms;
    --ja-dur-media:  180ms;
    --ja-dur-lenta:  280ms;
    --ja-ease-padrao:  cubic-bezier(.2,.6,.3,1);
    --ja-ease-saida:   cubic-bezier(.4,0,1,1);
    --ja-ease-entrada: cubic-bezier(0,0,.3,1);
    --ja-transicao-padrao:
        background-color var(--ja-dur-media) var(--ja-ease-padrao),
        border-color var(--ja-dur-media) var(--ja-ease-padrao),
        color var(--ja-dur-media) var(--ja-ease-padrao),
        box-shadow var(--ja-dur-media) var(--ja-ease-padrao);
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --ja-dur-rapida: 1ms;
        --ja-dur-media: 1ms;
        --ja-dur-lenta: 1ms;
    }
}
