/* =========================================================================
   Eletro Futuro · Portal de Soluções — Design tokens
   Fonte das cores: logotipos oficiais (#2F2138, #F7AB36, #FECC00) e
   identidade da loja (theme-color #1A1A2E).
   ========================================================================= */

@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 200 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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Manrope";
  src: url("../fonts/manrope-latin-ext-wght-normal.woff2") format("woff2-variations");
  font-weight: 200 800; font-style: normal; font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-latin-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900; 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+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/inter-latin-ext-wght-normal.woff2") format("woff2-variations");
  font-weight: 100 900; font-style: normal; font-display: swap;
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Marca */
  --ef-ink-950: #0E0F20;   /* rodapé, primeiro plano */
  --ef-ink-900: #1A1A2E;   /* cor da loja: header, hero */
  --ef-ink-800: #24253F;   /* superfícies escuras elevadas */
  --ef-ink-700: #34365A;   /* bordas sobre escuro */
  --ef-ink-logo: #2F2138;  /* tinta do logotipo */
  --ef-amber: #F7AB36;     /* acento do logo colorido: CTA principal */
  --ef-amber-600: #DE8F14; /* hover do CTA */
  --ef-amber-100: #FFF3DC;
  --ef-yellow: #FECC00;    /* acento do logo negativo: filetes sobre escuro */

  /* Técnico (interação, links, foco, dados) */
  --ef-blue-700: #1F4FD1;
  --ef-blue-600: #2F63E8;
  --ef-blue-400: #7AA0FF;
  --ef-blue-50:  #EEF3FF;

  /* Neutros */
  --n-0: #FFFFFF;
  --n-25: #FAFBFC;
  --n-50: #F4F5F8;
  --n-100: #ECEEF3;
  --n-200: #DDE1E8;
  --n-300: #C5CAD5;
  --n-500: #8A90A0;
  --n-600: #5B6173;
  --n-700: #3D4255;
  --n-900: #1A1A2E;

  /* Estado */
  --ok: #1D7A52;
  --ok-50: #E8F5EE;
  --aviso: #8A5A00;
  --aviso-50: #FFF6E3;
  --erro: #B4232C;

  /* Fabricante (somente no logotipo SCAME) */
  --scame-coral: #FF665E;

  /* Semânticos */
  --bg: var(--n-0);
  --bg-sutil: var(--n-50);
  --texto: var(--n-900);
  --texto-2: var(--n-600);
  --borda: var(--n-200);
  --link: var(--ef-blue-700);
  --foco: var(--ef-blue-600);

  /* Tipografia */
  --f-display: "Manrope", "Segoe UI", system-ui, sans-serif;
  --f-texto: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --t-display: clamp(2.5rem, 1.4rem + 3.6vw, 4.25rem);  /* 40 → 68 */
  --t-h1: clamp(2.125rem, 1.4rem + 2.4vw, 3.25rem);      /* 34 → 52 */
  --t-h2: clamp(1.75rem, 1.3rem + 1.4vw, 2.5rem);        /* 28 → 40 */
  --t-h3: clamp(1.25rem, 1.1rem + .5vw, 1.5rem);         /* 20 → 24 */
  --t-h4: 1.125rem;
  --t-lead: clamp(1.0625rem, 1rem + .3vw, 1.25rem);
  --t-base: 1rem;
  --t-sm: .875rem;
  --t-xs: .75rem;

  /* Espaçamento (base 4) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px;
  --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px;
  --secao: clamp(64px, 5vw + 40px, 120px);

  /* Forma */
  --r-sm: 4px; --r-md: 8px; --r-lg: 14px; --r-pill: 999px;
  --sombra-1: 0 1px 2px rgba(16, 17, 34, .06), 0 1px 1px rgba(16, 17, 34, .04);
  --sombra-2: 0 10px 30px -12px rgba(16, 17, 34, .22), 0 2px 6px rgba(16, 17, 34, .06);
  --sombra-3: 0 30px 60px -20px rgba(16, 17, 34, .35);

  --largura: 1240px;
  --gutter: clamp(16px, 4vw, 40px);
  --header-h: 72px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}
