/* ===========================================================================
   Canal Ético Curifest — fundações
   Tokens do handoff "Refatoração do canal de denúncia".
   =========================================================================== */

/* --- Fontes -------------------------------------------------------------- --
   Auto-hospedadas. O handoff pede Google Fonts, mas buscar fonte no Google
   entregaria o IP de cada denunciante a um terceiro — o oposto da garantia
   deste canal. Os arquivos são os mesmos; só a origem muda.                 */

@font-face {
  font-family: 'Baloo 2';
  src: url('/fonts/baloo2.woff2') format('woff2');
  font-weight: 400 800;
  font-display: swap;
}
@font-face {
  font-family: 'Nunito Sans';
  src: url('/fonts/nunitosans.woff2') format('woff2');
  font-weight: 300 800;
  font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('/fonts/plexmono.woff2') format('woff2');
  font-weight: 400 600;
  font-display: swap;
}

:root {
  /* --- Marca (extraída do logotipo) ------------------------------------- */
  --brand-red: #E1354A;
  --brand-orange: #F07C29;
  --brand-green: #7CBE45;
  --brand-blue: #2C93D0;

  /* --- Funcionais (versões acessíveis, >= 4.5:1) ------------------------ */
  --action: #17709F;
  --action-hover: #125A80;
  --action-soft-bg: #E3F1FA;
  --action-soft-bg-2: #E9F3FA;
  --action-soft-border: #B9DCF0;
  --action-soft-border-2: #8FC7E6;
  --action-on-soft: #0F5C86;
  --action-hover-border: #4FA3D1;

  --danger: #BE1E30;
  --danger-soft-bg: #FEF5F3;
  --danger-soft-border: #F5CEC8;
  --denuncia-body: #6E5B57;

  --warning-text: #A2540F;
  --warning-soft-bg: #FDF0E4;
  --success-text: #3F7320;
  --success-soft-bg: #EEF7E4;

  /* --- Neutros quentes (oklch) ------------------------------------------ */
  --canvas: oklch(0.975 0.008 80);
  --surface: #fff;
  --surface-alt: oklch(0.99 0.005 80);
  --surface-alt-2: oklch(0.985 0.006 80);
  --surface-muted: oklch(0.97 0.008 80);
  --surface-muted-2: oklch(0.96 0.008 80);

  --ink: oklch(0.24 0.02 60);
  --ink-2: oklch(0.27 0.02 60);
  --ink-3: oklch(0.3 0.02 60);
  --body: oklch(0.43 0.015 60);
  /* Piso de contraste para texto < 18px. Não clarear: reprova em 4.5:1. */
  --muted: oklch(0.5 0.018 60);
  --placeholder: oklch(0.54 0.014 70);

  --line: oklch(0.91 0.01 70);
  --line-2: oklch(0.87 0.012 70);
  --line-3: oklch(0.94 0.01 70);

  /* --- Tipografia ------------------------------------------------------- */
  --font-display: 'Baloo 2', 'Trebuchet MS', system-ui, sans-serif;
  --font-ui: 'Nunito Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* --- Raios ------------------------------------------------------------ */
  --r-input: 10px;
  --r-cta: 11px;
  --r-opt: 12px;
  --r-inner: 14px;
  --r-card: 18px;
  --r-pill: 999px;

  /* --- Sombras ---------------------------------------------------------- */
  --sh-card: 0 10px 30px rgba(60, 45, 40, 0.06);
  --sh-card-hover: 0 10px 22px rgba(60, 45, 40, 0.1);
  --sh-cta: 0 2px 6px rgba(23, 112, 159, 0.28);
  --sh-cta-hover: 0 10px 20px rgba(23, 112, 159, 0.3);
  --sh-soft: 0 1px 2px rgba(60, 45, 40, 0.04);
  --sh-open: 0 10px 26px rgba(60, 45, 40, 0.08);

  --ease: cubic-bezier(0.22, 0.8, 0.3, 1);
}

/* --- Reset ---------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.6;
  color: var(--body);
  background: var(--canvas);
  min-height: 100dvh;
  -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: none; cursor: pointer; }

:focus-visible { outline: 2px solid var(--action); outline-offset: 2px; border-radius: 4px; }
::selection { background: var(--action-soft-bg); }

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

@keyframes riseIn  { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes popIn   { from { opacity: 0; transform: scale(0.94); }      to { opacity: 1; transform: none; } }
@keyframes drawLine{ from { transform: scaleX(0); }                    to { transform: scaleX(1); } }
@keyframes softPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.55; transform: scale(0.82); }
}

/* Obrigatório manter, conforme o handoff. Zera também o atraso: com
   `backwards`, um delay preservado esconderia o conteúdo justamente de quem
   pediu menos movimento. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}