/* =========================================================================
   TOKENS — única fonte de verdade do sistema visual
   Euriale Voidela · derivado do Manual de Marca v2.0 e do Guia Técnico CCC v2
   Nunca escreva uma cor, fonte ou espaçamento fora deste arquivo.
   ========================================================================= */

/* ---------- Fontes self-hosted ---------- */
@font-face{font-family:'Montserrat';src:url('../fonts/montserrat-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../fonts/montserrat-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../fonts/montserrat-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../fonts/montserrat-800.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../fonts/montserrat-900.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}

@font-face{font-family:'Open Sans';src:url('../fonts/opensans-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Open Sans';src:url('../fonts/opensans-400i.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Open Sans';src:url('../fonts/opensans-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Open Sans';src:url('../fonts/opensans-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

@font-face{font-family:'Dancing Script';src:url('../fonts/dancingscript-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}


:root{

  /* =====================================================================
     COR — paleta oficial do Manual de Marca v2.0
     ===================================================================== */

  /* Laranja — ação, decisão, CTA. 15% da composição.
     ATENÇÃO: #ff6a0f é a cor de marca e só pode ser usada em ÁREA (fundo de
     bloco, filete, bullet, grafismo). Para TEXTO e para BOTÃO com texto branco
     use --ev-cta-* ou --ev-orange-txt, que passam no contraste 4.5:1 da WCAG AA. */
  --ev-orange:        #ff6a0f;   /* Laranja vivo — só área          */
  --ev-orange-soft:   #f18642;   /* Laranja claro — gradiente       */
  --ev-orange-hover:  #e55500;
  --ev-orange-txt:    #c74e00;   /* texto laranja sobre branco  4,65:1 */
  --ev-orange-txt-h:  #a03f00;   /* hover                       6,55:1 */
  --ev-cta-1:         #c94a00;   /* botão: início do gradiente  4,71:1 */
  --ev-cta-2:         #a83e00;   /* botão: fim do gradiente     6,26:1 */
  --ev-orange-08:     rgba(255,106,15,.08);
  --ev-orange-18:     rgba(255,106,15,.18);
  --ev-orange-35:     rgba(255,106,15,.35);

  /* Azul — base institucional. 60% + 25% da composição. */
  --ev-blue:          #0099e3;   /* Azul digital      */
  --ev-blue-mid:      #004e96;   /* Azul institucional*/
  --ev-blue-deep:     #0e3b5e;   /* Azul profundo     */
  --ev-blue-08:       rgba(0,78,150,.08);
  --ev-blue-25:       rgba(0,153,227,.25);

  /* Turquesa — acento pontual. Nunca em título ou bloco grande. */
  --ev-teal:          #44bed2;

  /* Neutros */
  --ev-ink:           #17364c;   /* texto principal   */
  --ev-muted:         #55677a;   /* texto de apoio   5,93:1 */
  --ev-faint:         #5f7382;   /* legenda, label   4,93:1 */
  --ev-line:          #dde4ef;   /* borda, divisor    */
  --ev-line-soft:     #eef1f6;
  --ev-white:         #ffffff;

  /* Fundos */
  --ev-bg:            #ffffff;
  --ev-bg-soft:       #eef1f6;
  --ev-bg-blue:       #eef7fc;
  --ev-bg-warm:       #fff5ee;
  --ev-bg-gradient:   linear-gradient(160deg,#eef1f6 0%,#dde4ef 100%);
  --ev-bg-deep:       linear-gradient(135deg,#0e3b5e 0%,#004e96 55%,#0099e3 100%);

  /* Gradientes de marca */
  --ev-grad-brand:    linear-gradient(90deg,#ff6a0f 0%,#f18642 24%,#0099e3 62%,#004e96 88%,#0e3b5e 100%);
  --ev-grad-cta:      linear-gradient(135deg,var(--ev-cta-1),var(--ev-cta-2));

  /* Semânticos */
  --ev-ok:            #157a52;
  --ev-wa:            #0d7c3e;   /* WhatsApp acessível  5,29:1 */
  --ev-warn:          #d64545;

  /* =====================================================================
     TIPOGRAFIA
     ===================================================================== */
  --ev-font-title: 'Montserrat', ui-sans-serif, system-ui, 'Segoe UI', Arial, sans-serif;
  --ev-font-body:  'Open Sans', ui-sans-serif, system-ui, 'Segoe UI', Arial, sans-serif;
  --ev-font-sig:   'Dancing Script', 'Segoe Script', cursive;

  /* Escala fluida — clamp(min, preferido, max) */
  --ev-fs-display: clamp(2.2rem, 5vw,   3.6rem);   /* 900 — só no hero da home */
  --ev-fs-h1:      clamp(1.9rem, 3.5vw, 3rem);     /* 900 */
  --ev-fs-h2:      clamp(1.5rem, 2.8vw, 2.4rem);   /* 800 */
  --ev-fs-h3:      clamp(1.1rem, 1.6vw, 1.3rem);   /* 700 */
  --ev-fs-h4:      1rem;                           /* 700 */
  --ev-fs-lead:    clamp(1rem, 1.4vw, 1.15rem);
  --ev-fs-body:    .95rem;
  --ev-fs-small:   .82rem;
  --ev-fs-tiny:    .72rem;
  --ev-fs-eyebrow: .68rem;

  --ev-lh-tight:  1.1;
  --ev-lh-snug:   1.25;
  --ev-lh-normal: 1.6;
  --ev-lh-loose:  1.8;

  --ev-ls-tight:  -.02em;
  --ev-ls-wide:   .08em;
  --ev-ls-eyebrow:.14em;

  /* =====================================================================
     ESPAÇAMENTO — escala de 4px
     ===================================================================== */
  --ev-s1:  4px;   --ev-s2:  8px;   --ev-s3: 12px;  --ev-s4: 16px;
  --ev-s5: 24px;   --ev-s6: 32px;   --ev-s7: 48px;  --ev-s8: 64px;
  --ev-s9: 96px;   --ev-s10:128px;

  /* Respiro vertical de seção — fluido */
  --ev-section-y: clamp(52px, 6.5vw, 96px);

  /* =====================================================================
     FORMA
     ===================================================================== */
  --ev-radius-sm:   8px;
  --ev-radius:     16px;
  --ev-radius-lg:  24px;
  --ev-radius-pill:50px;

  --ev-shadow-sm:    0 1px  6px rgba(14,59,94,.06);
  --ev-shadow:       0 2px 20px rgba(14,59,94,.08);
  --ev-shadow-hover: 0 12px 40px rgba(14,59,94,.14);
  --ev-shadow-cta:   0 6px 24px rgba(255,106,15,.35);
  --ev-shadow-cta-h: 0 10px 32px rgba(255,106,15,.5);

  --ev-border:      1px solid rgba(14,59,94,.06);
  --ev-border-line: 1px solid var(--ev-line);

  /* =====================================================================
     LAYOUT
     ===================================================================== */
  --ev-container:    1200px;
  --ev-container-sm:  820px;   /* texto corrido: 60–80 caracteres */
  --ev-gutter:  clamp(20px, 5vw, 32px);
  --ev-header-h: 76px;

  /* =====================================================================
     MOVIMENTO
     ===================================================================== */
  --ev-ease:      cubic-bezier(.22,.61,.36,1);
  --ev-ease-out:  cubic-bezier(.16,1,.3,1);
  --ev-dur-fast:  .18s;
  --ev-dur:       .28s;
  --ev-dur-slow:  .5s;

  /* Camadas */
  --ev-z-base: 1;
  --ev-z-sticky: 100;
  --ev-z-nav: 200;
  --ev-z-overlay: 300;
  --ev-z-modal: 400;
}

/* Respeita quem pediu menos movimento no sistema operacional */
@media (prefers-reduced-motion: reduce){
  :root{ --ev-dur-fast:.001s; --ev-dur:.001s; --ev-dur-slow:.001s; }
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
}