/* ========================================================================== TEMA — Imersão Stormer Landing da Imersão Stormer, o presencial de 4 dias do Alexandre Wolwacz na Arena Liberta. Desenhado em 2026-09-21 a partir das duas páginas que já rodam (traderup.pro e lp.traderup.com.br). Identidade: a da Imersão, não a da Liberta Investimentos nem a da Copa. Verde #07cf30 sobre um preto mais fundo que o da casa, com Sora nos títulos. É o par que as duas páginas atuais já usam e que a auditoria de 18/09 registrou como a única coisa que NÃO precisa ser refeita. Trazer o #1ed760 institucional aqui apagaria a diferença entre o produto de educação e o site da corretora. Carregar DEPOIS de tokens.css e ANTES de base.css. ========================================================================== */ /* Sora, a display da Imersão. Variável, um arquivo por recorte de caractere, servida pelo próprio site — o §1 do contrato não aceita Google Fonts em produção. O @font-face mora aqui e não em tokens.css porque a família é deste projeto: todo site que copia o core declararia uma fonte que nunca vai usar. Crédito e licença em fontes/biblioteca/LICENCA.md. */ @font-face{ font-family:'Sora'; src:url('/imersao/fontes/Sora-latin.woff2') format('woff2'); font-weight:400 800;font-style:normal;font-display:swap; 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:'Sora'; src:url('/imersao/fontes/Sora-latin-ext.woff2') format('woff2'); font-weight:400 800;font-style:normal;font-display:swap; 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{ /* ---- Superfícies ---- #011412 desde 22/09, escolha do Gabriel no lugar do #050505 que veio das duas páginas no ar (passou por #021718 no meio do caminho, e ele puxou para o verde). Não é preto: é um verde tão fundo que só se percebe como temperatura, com 7% de luminosidade. Ele faz duas coisas que o preto chapado não fazia: dá à página uma cor própria, em vez do fundo neutro de qualquer LP escura, e sustenta melhor o verde do CTA, que sobre preto tendia a vibrar. Segue fundo o bastante para ficar atrás da foto e não competir com ela. */ --dark:#011412; --dark-rgb:1,20,18; /* O SEGUNDO ESCURO É O MESMO FUNDO, e é decisão do Gabriel em 21/09: "fundo preto sempre, sem fundo cinza". O core traz #131313 e este tema trouxe #0e1010, e nas duas os olhos dele leram cinza. A regra não mudou com o #021718: mudou a cor, não o princípio de ter uma só. Igualando os dois, ela passa a valer sozinha em todo lugar que consome o segundo tom, sem depender de ninguém lembrar: a dobra .sec-deep, o painel do conversao/select-custom e o card escuro do prova/carrossel-depoimentos. O contrato pede que os dois escuros sejam quase idênticos; aqui são idênticos, e quem separa card de fundo passa a ser o fio de --rule. */ --dark-2:#011412; /* A página não tem dobra clara: o --light-2 fica aqui só para o caso de uma aparecer, e puxa um verde quase imperceptível em vez do bege do core, porque bege ao lado de #07cf30 lê como sujeira. Quem usa o --light de verdade é peça pequena sobre foto, como os cartões que flutuam no card largo do bento. */ --light:#ffffff; --light-2:#eef1ee; /* ---- Marca ---- DOIS VERDES COM FUNÇÃO SEPARADA, e a separação é o ponto. Até 22/09 o #07cf30 era destaque E botão ao mesmo tempo, e numa tela só ele aparecia sete vezes: o fio do olho, o itálico do título, os quatro números da régua e os dois botões. O Gabriel cortou: "esse verde vai ficar apenas para o CTA e nada mais". --accent é o DESTAQUE, e só ele entra em texto: o itálico do , o fio do olho, o número da etapa, a data no topo. Foi menta (#8fe3b0) por algumas horas em 22/09 e o Gabriel trocou: "esse tom de verde não ficou legal". O #40d975 tem a mesma função, com mais saturação e menos leite. --cta é o BOTÃO, e nada além dele. Fica saturado de propósito: quando é a única coisa saturada da tela, ele não precisa ser grande para ser o próximo passo óbvio. Não é token do core: mora aqui e quem o consome é uma regra só, em pagina.css. --accent-2 segue verde escuro, para fio e gradiente de apoio. */ --accent:#40d975; --cta:#07cf30; --accent-2:#046b1c; /* ---- Tipografia ---- Sora nos títulos, Inter no texto. O mesmo par das páginas atuais. */ --display:'Sora','Manrope',-apple-system,'Segoe UI',sans-serif; --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif; /* ---- Forma ---- Arredondado, como os cards das duas páginas e como o resto da educação. Não é o flat editorial da Liberta Wealth. */ --radius-media:18px; --radius-pill:1000px; /* ---- Grid ---- 1360px desde 22/09. O Gabriel achou o conteúdo estreito, e estava: o número da coluna não é o que a página mostra. O .wrap tem 72px de respiro lateral de cada lado, então os 1240 viravam 1096 de conteúdo real, com mais 136px de margem de cada lado num monitor de 1512. Em 1360 o conteúdo fica em 1216, e o respiro continua o mesmo. */ --max:1360px; /* O cabeçalho deixou de ser menu e virou marca mais data, sobreposto ao hero e sem grudar: quem gruda agora é a barra de CTA do pé da página. O valor segue sendo lido pelo hero, que reserva este respiro no topo. */ --nav-h:96px; } /* ========================================================================== FIOS, ajustados ao fundo novo O core dá ao .sec-dark um fio cinza neutro (#242424), calculado para preto chapado. Sobre o #021718 esse cinza aparece como linha morna atravessando um campo frio, que é o jeito mais rápido de a página parecer suja. Trocado por branco com alpha: o fio passa a ser o próprio fundo clareado, então mantém a temperatura da superfície, e o mesmo valor serve se o fundo mudar de tom outra vez. O salto de luz é o mesmo de antes, cerca de 25 pontos. ========================================================================== */ .sec-dark,.sec-deep{ --rule:rgba(255,255,255,.11); --rule-2:rgba(255,255,255,.2); }