/* ============================================================
   Rapp Contabilidade — tokens de marca (design system do site da marca, tokens/colors.css)
   Paleta fechada de nove cores e duas fontes hospedadas no próprio site (CSP font-src 'self').
   ============================================================ */

/* Fontes variáveis (OFL) em WOFF2, só latim pt-BR (82 KB no total); acentos da Cormorant reposicionados e algarismos alinhados (26/10/2026). */
@font-face {
  font-family: "Archivo";
  src: url("../fonts/archivo.woff2") format("woff2");
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond.woff2") format("woff2");
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cormorant Garamond";
  src: url("../fonts/cormorant-garamond-italic.woff2") format("woff2");
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
}

:root {
  /* --- Paleta base --- */
  --rapp-navy-900: #1d3350;
  --rapp-navy-700: #254061;
  --rapp-orange-500: #f26824;
  --rapp-orange-400: #f79646;
  --rapp-peach-300: #fabaa1;
  --rapp-cream-50: #fbf9f5;
  --rapp-white: #ffffff;
  --rapp-taupe-600: #8a6f5e;
  --rapp-slate-600: #4a5568;

  /* --- Neutros do quadro aprovado (sand); o erro de campo é navy-900 com filete laranja (quadro) --- */
  --rapp-sand-100: #efeae0;
  --rapp-sand-300: #d9d2c6;

  /* --- Superfícies --- */
  --surface-page: var(--rapp-cream-50);
  --surface-card: var(--rapp-white);
  --surface-dark: var(--rapp-navy-900);
  --surface-dark-card: var(--rapp-navy-700);

  /* --- Texto --- */
  --text-heading: var(--rapp-navy-900);
  --text-body: var(--rapp-slate-600);
  --text-eyebrow: var(--rapp-slate-600);
  --text-on-dark: var(--rapp-cream-50);
  --text-on-dark-muted: rgba(251, 249, 245, 0.78);

  /* --- Acento e bordas --- */
  --accent: var(--rapp-orange-500);
  --border-light: var(--rapp-sand-300);
  --border-field: rgba(37, 64, 97, 0.6); /* 3,4:1: WCAG 1.4.11 (decisão D-2 do quadro) */
  --border-on-dark-strong: rgba(251, 249, 245, 0.3);

  /* --- Tipografia --- */
  --font-display: "Cormorant Garamond", Georgia, serif;
  --font-body: "Archivo", system-ui, sans-serif;
  --text-hero: clamp(40px, 5.6vw, 76px);
  --text-h2: clamp(30px, 3.2vw, 44px);

  /* --- Layout --- */
  --section-pad-y: 72px;
  --section-pad-x: 64px;
  --content-max: 1360px;
  --header-h: 88px;
  --header-h-rolado: 72px;

  /* --- Logo (vetor 982 x 469): o design system pede 168 px de largura no menu e nunca menos de 120 px.
     58 px de altura = 121 px de largura, o maior que cabe no cabeçalho de 88 px sem passar do mínimo. --- */
  --logo-h: 58px;
  --logo-h-rolado: 58px;
  --logo-h-celular: 58px;
  --logo-rodape-h: 64px;

  /* --- Forma --- */
  --radius-sharp: 2px;
  /* Item 20 da rodada 2 (27/10/2026): raio sutil dos cartões e a curva da faixa navy. */
  --radius-suave: 8px;
  --radius-curva: 48px;
  --radius-pill: 99px;
  --shadow-modal: 0 24px 80px rgba(29, 51, 80, 0.35);

  /* --- Movimento --- */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-reveal: 0.8s;
  --dur-hover: 0.3s;
}

@media (max-width: 720px) {
  :root {
    --section-pad-x: 24px;
    --section-pad-y: 48px;
    --header-h: 72px;
    --header-h-rolado: 68px;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-reveal: 0.01s;
    --dur-hover: 0.01s;
  }
}

/* O logo da marca não pode ficar abaixo de 120 px (design system): abaixo de 390 px o botão WhatsApp do cabeçalho
   fica só com o símbolo (o nome continua para o leitor de tela), e o logo inteiro cabe ao lado dele. */
@media (max-width: 389px) {
  .cta-celular { width: 44px; padding: 0 !important; }
  .cta-celular .cta-rotulo {
    position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
}

/* Altura única dos topos com vídeo (R-22: a mesma em todas as páginas com vídeo), por faixa de largura: a do maior
   conteúdo entre essas páginas, medido em 26/10/2026 (1440: 572 · 1080: 540 · 390: 529 · 320: 617), com folga. */
:root { --hero-altura: 588px; }
@media (max-width: 1080px) { :root { --hero-altura: 552px; } }
@media (max-width: 720px) { :root { --hero-altura: 544px; } }
@media (max-width: 389px) { :root { --hero-altura: 632px; } }

/* Título do topo do quadro CTB-A: frase longa em duas ou três linhas, sem o filete laranja embaixo. */
:root { --hero-titulo-largura: 26ch; }

/* Véu do topo com vídeo: 85%. */
:root { --veu-hero: 0.85; }
