/* ════════════════════════════════════════════════════════════════════
   EMPREGARE — Identidade visual (Header + Footer) para o blog WordPress
   --------------------------------------------------------------------
   ⚠️ Este NÃO é o style.css do tema. Salve este arquivo como
      empregare-identidade.css na raiz do bone-child e enfileire-o pelo
      functions.php. NÃO substitua o style.css do bone-child (ele tem o
      cabeçalho "Template: bones" que registra o child theme).
   Autocontido: não depende do bundle empresa-global. Tokens fiéis a
   empresa/_tokens.scss; tudo escopado em .ev2-* p/ não vazar no blog.
   ════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════════
   TOKENS DA MARCA — CSS custom properties (fiel a empresa/_tokens.scss)
   Estes :root valores são a fonte da verdade. Use sempre var(--token).
   ════════════════════════════════════════════════════════════════════ */
:root {
    /* ── PRIMÁRIAS ── */
    --color-primary:          #3F3FD8;   /* Azul-violeta — marca, botões, ícones */
    --color-primary-dark:     #3128AF;   /* Hover de botões, links ativos */
    --color-primary-deeper:   #1C1660;   /* Fundos de seções escuras "light" */
    --color-primary-navy:     #151533;   /* Quase preto-azul — wordmark, sidebar */

    /* ── NEUTROS ── */
    --color-bg-page:          #F1F0FE;   /* Fundo do hero/header (lavanda claríssimo) */
    --color-bg-light:         #F9F9F9;   /* Seções alternadas, cards */
    --color-bg-white:         #FFFFFF;   /* Branco puro */
    --color-bg-muted:         #EFEFF4;   /* Cinza-azulado — divisores, tab track */

    /* ── TEXTO ── */
    --color-text-primary:     #1C1C2B;   /* Headings e parágrafos */
    --color-text-secondary:   #505069;   /* Subtítulos, labels */
    --color-text-muted:       #6E6E87;   /* Terciário, placeholders */
    --color-text-inverse:     #FFFFFF;   /* Texto sobre fundo escuro */

    /* ── SUPERFÍCIES ── */
    --color-surface-1:        #E1E1E9;   /* Bordas suaves, inputs */
    --color-surface-2:        #E0DEFB;   /* Tinte violeta (tiles de destaque) */
    --color-surface-3:        #CFCFDB;   /* Bordas mais definidas */

    /* ── ESCURA (seção IA) ── */
    --color-dark-bg:          #17171B;
    --color-dark-surface:     #1C1C23;
    --color-dark-badge:       #2D2D3E;

    /* ── ACENTO / STATUS ── */
    --color-accent-green:     #6ABB4F;
    --color-accent-yellow:    #FFD43C;
    --color-accent-purple:    #5F55E4;

    /* RGB helpers (para rgba() em CSS puro) */
    --rgb-primary:            63, 63, 216;
    --rgb-primary-navy:       21, 21, 51;
    --rgb-dark:               23, 23, 27;

    /* ── GRADIENTES ── */
    --gradient-hero:
        radial-gradient(52% 58% at 0% 100%, var(--color-bg-light) 0%, rgba(249, 249, 249, 0) 60%),
        radial-gradient(55% 62% at 94% 105%, rgba(249, 231, 181, .98) 0%, rgba(249, 231, 181, 0) 56%),
        radial-gradient(48% 55% at 0% -4%, rgba(197, 186, 245, .90) 0%, rgba(197, 186, 245, 0) 55%),
        linear-gradient(125deg, #E2DBFB 0%, #E9E4FB 46%, #EDE8F8 72%, #F1ECF7 100%);
    --color-hero-edge:  #F6F4FD;
    --gradient-dark:    radial-gradient(ellipse 80% 80% at 50% 40%, #2D2D50 0%, #17171B 62%);
    --gradient-cta:     linear-gradient(135deg, #E6E3ED 0%, #EAE7F5 100%);
    --gradient-brand:   linear-gradient(120deg, #3F3FD8 0%, #5F55E4 100%);
    --gradient-sheen:   linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.55) 50%, rgba(255,255,255,0) 100%);

    /* ── TIPOGRAFIA ── */
    --font-primary: 'Plus Jakarta Sans', 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;

    --fw-regular:    400;
    --fw-medium:     500;
    --fw-semibold:   600;
    --fw-bold:       700;
    --fw-extrabold:  800;

    /* Escala fluida (clamp) — mobile → desktop */
    --type-display: clamp(2.5rem, 1.6rem + 3.8vw, 3.5rem);
    --type-h2:      clamp(1.75rem, 1.2rem + 2.2vw, 2rem);
    --type-h3:      clamp(1.375rem, 1.1rem + 1vw, 1.5rem);
    --type-h4:      1.25rem;
    --type-h5:      1rem;
    --type-body-lg: 1rem;
    --type-body:    0.875rem;
    --type-small:   0.75rem;
    --type-xs:      0.625rem;

    --lh-tight:   1.15;
    --lh-snug:    1.3;
    --lh-normal:  1.5;
    --lh-relaxed: 1.7;

    --ls-tight:  -0.02em;
    --ls-wide:    0.05em;
    --ls-wider:   0.12em;

    /* ── ESPAÇAMENTO (escala 8px) ── */
    --space-1:   4px;
    --space-2:   8px;
    --space-3:   12px;
    --space-4:   16px;
    --space-5:   24px;
    --space-6:   32px;
    --space-7:   48px;
    --space-8:   64px;
    --space-9:   80px;
    --space-10:  96px;
    --space-11:  120px;

    --section-pad:    clamp(3.5rem, 2rem + 6vw, 6rem);
    --section-pad-lg: clamp(4.5rem, 2.5rem + 8vw, 7.5rem);

    /* ── LAYOUT ── */
    --container-max:    1200px;
    --container-narrow: 820px;
    --container-gutter: clamp(1.25rem, 0.5rem + 3vw, 2rem);
    --header-height:    76px;
    --topbar-height:    38px;

    --card-gutter: clamp(12px, 1.6vw, 24px);
    --card-radius: clamp(22px, 2.2vw, 34px);
    --card-mb:     clamp(12px, 1.4vw, 20px);

    /* ── BORDAS ── */
    --radius-sm:   6px;
    --radius-md:   12px;
    --radius-lg:   20px;
    --radius-xl:   32px;
    --radius-pill: 9999px;

    /* ── SOMBRAS ── */
    --shadow-sm:    0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
    --shadow-md:    0 4px 12px rgba(28,28,43,.08);
    --shadow-lg:    0 8px 32px rgba(28,28,43,.12);
    --shadow-xl:    0 24px 64px rgba(28,28,43,.16);
    --shadow-card:  0 2px 8px rgba(63,63,216,.08), 0 0 0 1px rgba(63,63,216,.06);
    --shadow-menu:  0 24px 60px -12px rgba(28,28,43,.22), 0 0 0 1px rgba(28,28,43,.05);
    --shadow-focus: 0 0 0 4px rgba(63,63,216,.22);

    /* ── TRANSIÇÕES ── */
    --t-fast:   150ms cubic-bezier(.4, 0, .2, 1);
    --t-normal: 250ms cubic-bezier(.4, 0, .2, 1);
    --t-slow:   400ms cubic-bezier(.4, 0, .2, 1);
    --ease-out-back: cubic-bezier(.34, 1.56, .64, 1);

    /* ── Z-INDEX ── */
    --z-header:   1000;
    --z-megamenu: 1010;
    --z-drawer:   1040;
    --z-overlay:  1030;
    --z-skip:     1100;
}

/* ════════════════════════════════════════════════════════════════════
   RESET MÍNIMO — só o necessário p/ header/footer renderizarem certo.
   Escopado nos componentes ev2-* para NÃO conflitar com o tema do blog.
   (não aplicamos reset global em *, para não bagunçar o conteúdo do post)
   ════════════════════════════════════════════════════════════════════ */
.ev2-topnav *,
.ev2-topnav *::before,
.ev2-topnav *::after,
.ev2-overlay,
.ev2-drawer *,
.ev2-drawer *::before,
.ev2-drawer *::after,
.ev2-footer *,
.ev2-footer *::before,
.ev2-footer *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.ev2-topnav,
.ev2-drawer,
.ev2-footer {
    font-family: var(--font-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: var(--lh-normal);
    color: var(--color-text-primary);
}

.ev2-topnav a,
.ev2-drawer a,
.ev2-footer a {
    color: inherit;
    text-decoration: none;
    transition: color var(--t-fast);
}

.ev2-topnav ul,
.ev2-drawer ul,
.ev2-footer ul {
    list-style: none;
}

.ev2-topnav img,
.ev2-drawer img,
.ev2-footer img {
    display: block;
    max-width: 100%;
    height: auto;
}

.ev2-topnav button,
.ev2-drawer button,
.ev2-footer button {
    /* ⚠️ NÃO usar 'font: inherit' aqui. Como este reset é escopado em
       '.ev2-topnav button' (especificidade 0,1,1), o shorthand 'font'
       sobrescreveria o font-size do '.ev2-nav__link' (0,1,0) e o botão do
       menu herdaria a fonte (maior) do <body> do tema do blog. Herdamos só
       a família; o tamanho vem das regras de cada componente. */
    font-family: inherit;
    color: inherit;
    background: none;
    border: none;
    cursor: pointer;
}

/* trava o scroll quando o drawer mobile está aberto */
body.ev2-no-scroll {
    overflow: hidden;
}

/* Skip link de acessibilidade */
.ev2-skip-link {
    position: absolute;
    top: -120px;
    left: var(--space-4);
    z-index: var(--z-skip);
    padding: var(--space-3) var(--space-5);
    background: var(--color-primary);
    color: var(--color-text-inverse);
    font-family: var(--font-primary);
    font-weight: var(--fw-semibold);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-lg);
    transition: top var(--t-normal);
    text-decoration: none;
}
.ev2-skip-link:focus { top: var(--space-4); }

/* Foco visível por teclado nos interativos do header/footer */
.ev2-topnav a:focus-visible,
.ev2-topnav button:focus-visible,
.ev2-drawer a:focus-visible,
.ev2-drawer button:focus-visible,
.ev2-footer a:focus-visible,
.ev2-footer button:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
    border-radius: var(--radius-sm);
}

/* Container (largura máxima da marca) */
.ev2-container {
    width: 100%;
    max-width: var(--container-max);
    margin-inline: auto;
    padding-inline: var(--container-gutter);
}

/* ════════════════════════════════════════════════════════════════════
   BOTÕES (pill shape) — usados no CTA do header e no drawer
   ════════════════════════════════════════════════════════════════════ */
.ev2-topnav .btn,
.ev2-drawer .btn,
.ev2-footer .btn {
    --btn-pad-y: 13px;
    --btn-pad-x: var(--space-6);
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    padding: var(--btn-pad-y) var(--btn-pad-x);
    border-radius: var(--radius-pill);
    border: 2px solid transparent;
    font-family: var(--font-primary);
    font-size: var(--type-body-lg);
    font-weight: var(--fw-semibold);
    line-height: 1;
    white-space: nowrap;
    text-align: center;
    cursor: pointer;
    user-select: none;
    text-decoration: none;
    transition: transform var(--t-normal), box-shadow var(--t-normal),
                background-color var(--t-normal), border-color var(--t-normal),
                color var(--t-normal);
}
.ev2-topnav .btn i,
.ev2-drawer .btn i,
.ev2-footer .btn i { font-size: 1.1em; line-height: 0; }
.ev2-topnav .btn:active,
.ev2-drawer .btn:active,
.ev2-footer .btn:active { transform: translateY(0) scale(.98); }

.ev2-topnav .btn-primary,
.ev2-drawer .btn-primary {
    background: var(--color-primary);
    color: var(--color-text-inverse);
    border-color: var(--color-primary);
}
.ev2-topnav .btn-primary:hover,
.ev2-drawer .btn-primary:hover {
    background: var(--color-primary-dark);
    border-color: var(--color-primary-dark);
    color: var(--color-text-inverse);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -8px rgba(var(--rgb-primary), .6);
}

.ev2-drawer .btn-secondary {
    background: var(--color-bg-white);
    color: var(--color-text-primary);
    border-color: var(--color-surface-1);
}
.ev2-drawer .btn-secondary:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
    transform: translateY(-2px);
    box-shadow: var(--shadow-sm);
}

.ev2-topnav .btn-outline,
.ev2-header__cta.btn-outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.ev2-topnav .btn-outline:hover,
.ev2-header__cta.btn-outline:hover {
    background: var(--color-primary);
    color: var(--color-text-inverse);
    transform: translateY(-2px);
    box-shadow: 0 10px 24px -8px rgba(var(--rgb-primary), .55);
}

.ev2-drawer .btn-block { width: 100%; }

@media (prefers-reduced-motion: reduce) {
    .ev2-topnav .btn,
    .ev2-drawer .btn { transition: background-color var(--t-fast), color var(--t-fast); }
    .ev2-topnav .btn:hover,
    .ev2-drawer .btn:hover { transform: none !important; }
}

/* ════════════════════════════════════════════════════════════════════
   === HEADER === (TopBar + Header fluid + Mega menu)
   Breakpoints: nav desktop a partir de 1024px; ≤1023px usa drawer.
   ════════════════════════════════════════════════════════════════════ */

/* Wrapper sticky que agrupa topbar + header */
.ev2-topnav {
    position: sticky;
    top: 0;
    z-index: var(--z-header);
    background: var(--color-bg-white); /* fundo da página atrás do menu fluid */
}

/* ── TOPBAR ── */
.ev2-topbar {
    background: #EFEDFB;
    border-bottom: 1px solid rgba(var(--rgb-primary-navy), .06);
    color: var(--color-text-secondary);
    font-size: var(--type-small);
    line-height: 1;
    overflow: hidden;
    max-height: 48px;                 /* colapsa para 0 ao rolar a página */
    transition: max-height var(--t-normal), opacity var(--t-normal), visibility var(--t-normal);
}
.ev2-topbar__inner {
    min-height: var(--topbar-height);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
}
.ev2-topbar__msg {
    margin: 0;
    font-size: var(--type-small);
    color: var(--color-text-secondary);
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}
.ev2-topbar__msg a {
    color: var(--color-text-primary);
    font-weight: var(--fw-semibold);
    text-decoration: underline;
    text-decoration-color: var(--color-surface-3);
    text-underline-offset: 2px;
}
.ev2-topbar__msg a:hover { text-decoration-color: var(--color-primary); color: var(--color-primary); }

.ev2-topbar__actions {
    display: flex;
    align-items: center;
    gap: var(--space-5);
}
.ev2-topbar__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--color-text-primary);
    font-weight: var(--fw-medium);
}
.ev2-topbar__link:hover { color: var(--color-primary); }
.ev2-topbar__link i { color: var(--color-text-muted); }
.ev2-topbar__link:hover i { color: var(--color-primary); }

/* login da empresa em destaque (audiência principal do B2B) */
.ev2-topbar__link--strong {
    color: var(--color-primary);
    font-weight: var(--fw-semibold);
}
.ev2-topbar__link--strong i { color: var(--color-primary); }

/* some no mobile (logins migram para o drawer) */
@media (max-width: 767.98px) {
    .ev2-topbar__actions { display: none; }
    .ev2-topbar__inner { justify-content: center; }
}

/* ── HEADER (card branco flutuante, arredondado, com margem lateral) ── */
.ev2-header {
    background: transparent;
    padding: var(--card-mb) var(--card-gutter) 0;
}
.ev2-header__inner {
    min-height: 62px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-5);
    padding-inline: var(--space-5);
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    backdrop-filter: saturate(180%) blur(14px);
    border: 1px solid var(--color-surface-1);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--t-normal), background-color var(--t-normal);
}
.ev2-header__actions {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

/* CTA do header — esconde ao colapsar (vai p/ o drawer).
   Especificidade alta de propósito: o reset escopado '.ev2-topnav .btn'
   (0,2,0) define 'display: inline-flex' e venceria um '.ev2-header__cta'
   simples (0,1,0), deixando a CTA visível no mobile e estourando o topo. */
@media (max-width: 1023.98px) {
    .ev2-topnav .ev2-header__cta.btn { display: none; }
}
/* Faixa de desktop estreito (1024–1280px): folga p/ caber sem estourar */
@media (min-width: 1024px) and (max-width: 1280px) {
    .ev2-header__inner { gap: var(--space-3); padding-inline: var(--space-4); }
    .ev2-header__actions { gap: var(--space-2); }
    .ev2-header__cta { padding-inline: var(--space-4); }
}

/* Estado rolado: esconde a topbar, header encosta no topo */
.ev2-topnav.is-scrolled .ev2-topbar {
    max-height: 0;
    opacity: 0;
    visibility: hidden;
    border-bottom-color: transparent;
}
.ev2-topnav.is-scrolled .ev2-header { padding-top: var(--space-2); }
.ev2-topnav.is-scrolled .ev2-header__inner {
    background: var(--color-bg-white);
    box-shadow: var(--shadow-lg);
}

/* ── Logo ── */
.ev2-logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}
.ev2-logo img { height: 30px; width: auto; }
.ev2-logo:hover { opacity: .85; }

/* ── NAV DESKTOP ── */
.ev2-nav { display: none; }
@media (min-width: 1024px) { .ev2-nav { display: block; } }

.ev2-nav__list {
    display: flex;
    align-items: center;
    gap: var(--space-1);
}
@media (min-width: 1024px) and (max-width: 1280px) {
    .ev2-nav__list { gap: 0; }
    .ev2-nav__link { padding-inline: var(--space-2); font-size: var(--type-small); }
}

.ev2-nav__item { position: static; } /* mega usa o header como referência de largura */

.ev2-nav__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px var(--space-4);
    border-radius: var(--radius-pill);
    font-size: var(--type-body);
    font-weight: var(--fw-semibold);
    color: var(--color-text-primary);
    white-space: nowrap;
    transition: color var(--t-fast), background-color var(--t-fast);
}
/* Os itens do menu são <button>; o tema do blog (Bones) pode dar a eles uma
   borda/sombra própria com regra mais específica que o nosso reset. Removemos
   aqui com especificidade suficiente p/ vencer o tema. NÃO mexe no realce de
   hover/ativo, que vem só do background nas regras abaixo. */
.ev2-topnav .ev2-nav .ev2-nav__link,
.ev2-drawer .ev2-acc__head {
    border: 0;
    box-shadow: none;
    background-image: none;
}
.ev2-nav__link .chev {
    font-size: .72em;
    transition: transform var(--t-normal);
    color: var(--color-text-muted);
}
.ev2-nav__link:hover,
.ev2-nav__link[aria-expanded="true"] {
    color: var(--color-primary);
    background: rgba(var(--rgb-primary), .06);
}
.ev2-nav__link.is-active {
    color: var(--color-primary);
    background: rgba(var(--rgb-primary), .09);
}
.ev2-nav__link[aria-expanded="true"] .chev {
    transform: rotate(180deg);
    color: var(--color-primary);
}

/* ── MEGA MENU ── */
.ev2-mega-wrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    display: flex;
    justify-content: center;
    padding-top: 14px;           /* "ponte" para o hover não falhar */
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px) scale(.99);
    transform-origin: top center;
    transition: opacity var(--t-normal), transform var(--t-normal), visibility var(--t-normal);
    z-index: var(--z-megamenu);
}
.ev2-mega-wrap.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.ev2-mega {
    width: min(960px, calc(100vw - 2 * var(--container-gutter)));
    display: grid;
    grid-template-columns: 1.55fr 1fr;
    gap: var(--space-6);
    padding: var(--space-6);
    background: var(--color-bg-white);
    border: 1px solid var(--color-surface-1);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-menu);
    overflow: hidden;
}

.ev2-mega__col-label {
    font-size: var(--type-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-wider);
    text-transform: uppercase;
    color: var(--color-text-muted);
    margin-bottom: var(--space-3);  /* espaçamento POSITIVO (não cobrir a label no hover) */
}
.ev2-mega__col-label--group {
    margin-top: var(--space-4);
    padding-top: var(--space-4);
    border-top: 1px solid var(--color-surface-1);
}

.ev2-mega__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--space-2);
    align-content: start;
}

/* Item de link dentro do mega */
.ev2-mega-item {
    display: flex;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    transition: background-color var(--t-fast), transform var(--t-fast);
}
.ev2-mega-item__icon {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: var(--radius-md);
    background: var(--color-surface-2);
    color: var(--color-primary);
    font-size: 1.2rem;
    transition: background-color var(--t-normal), color var(--t-normal), transform var(--t-normal);
}
.ev2-mega-item__title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: var(--type-body);
    font-weight: var(--fw-bold);
    color: var(--color-text-primary);
    margin-bottom: 2px;
}
.ev2-mega-item__title .arrow {
    font-size: .8em;
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity var(--t-fast), transform var(--t-fast);
    color: var(--color-primary);
}
.ev2-mega-item__desc {
    font-size: var(--type-small);
    line-height: var(--lh-snug);
    color: var(--color-text-muted);
}
.ev2-mega-item:hover { background: var(--color-bg-page); }
.ev2-mega-item:hover .ev2-mega-item__icon {
    background: var(--color-primary);
    color: #fff;
    transform: translateY(-2px);
}
.ev2-mega-item:hover .ev2-mega-item__title .arrow {
    opacity: 1;
    transform: translateX(0);
}

/* Coluna de destaque (featured) do mega */
.ev2-mega-feature {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: var(--space-3);
    padding: var(--space-5);
    border-radius: var(--radius-md);
    background: var(--gradient-brand);
    color: #fff;
    overflow: hidden;
    isolation: isolate;
}
.ev2-mega-feature::before {
    content: "";
    position: absolute;
    inset: -40% 30% auto -30%;
    height: 220px;
    background: radial-gradient(circle, rgba(255,255,255,.35) 0%, transparent 60%);
    z-index: -1;
}
.ev2-mega-feature::after {
    content: "";
    position: absolute;
    right: -56px;
    top: -56px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    border: 18px solid rgba(255, 255, 255, .12);
    box-shadow: inset 0 0 0 14px rgba(255, 255, 255, .07);
    z-index: -1;
}
.ev2-mega-feature__tag {
    align-self: flex-start;
    font-size: var(--type-xs);
    font-weight: var(--fw-bold);
    letter-spacing: var(--ls-wide);
    text-transform: uppercase;
    padding: 5px 10px;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, .18);
}
.ev2-mega-feature__title {
    font-size: var(--type-h4);
    font-weight: var(--fw-bold);
    line-height: var(--lh-snug);
    color: #fff;
}
.ev2-mega-feature__text {
    font-size: var(--type-small);
    color: rgba(255, 255, 255, .82);
    line-height: var(--lh-snug);
}
.ev2-mega-feature__cta {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-2);
    font-weight: var(--fw-semibold);
    font-size: var(--type-body);
    color: #fff;
}
.ev2-mega-feature__cta i { transition: transform var(--t-normal); }
.ev2-mega-feature__cta:hover i { transform: translateX(4px); }

/* Cor por mega-menu (só o fundo muda) */
.ev2-mega-feature--sistemas { background: var(--gradient-brand); }
.ev2-mega-feature--quem     { background: linear-gradient(120deg, #2F7D32 0%, #3FB07A 100%); }
.ev2-mega-feature--investir { background: linear-gradient(120deg, #1C1660 0%, #3128AF 100%); }
.ev2-mega-feature--insights { background: linear-gradient(120deg, #5F55E4 0%, #8B7BF0 100%); }

/* marcador "abrir em nova aba" inline no mega/footer */
.ev2-ext { font-size: 0.7em; opacity: .6; }

/* ── BURGER (hambúrguer mobile) ── */
.ev2-burger {
    --bar: 2px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    padding: 0 10px;
    border-radius: var(--radius-md);
    border: 1px solid var(--color-surface-1);
    background: var(--color-bg-white);
}
.ev2-burger span {
    display: block;
    height: var(--bar);
    width: 100%;
    border-radius: var(--radius-pill);
    background: var(--color-text-primary);
    transition: transform var(--t-normal), opacity var(--t-fast);
    transform-origin: center;
}
.ev2-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ev2-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.ev2-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (min-width: 1024px) { .ev2-burger { display: none; } }

/* ════════════════════════════════════════════════════════════════════
   === DRAWER MOBILE / TABLET ===
   ════════════════════════════════════════════════════════════════════ */
.ev2-overlay {
    position: fixed;
    inset: 0;
    background: rgba(var(--rgb-primary-navy), .45);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--t-normal), visibility var(--t-normal);
    z-index: var(--z-overlay);
}
.ev2-overlay.is-open { opacity: 1; visibility: visible; }
@media (min-width: 1024px) { .ev2-overlay { display: none; } }

.ev2-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 88vw);
    display: flex;
    flex-direction: column;
    background: var(--color-bg-white);
    box-shadow: var(--shadow-xl);
    transform: translateX(100%);
    transition: transform var(--t-slow);
    z-index: var(--z-drawer);
    overflow: hidden;
}
.ev2-drawer.is-open { transform: translateX(0); }
@media (min-width: 1024px) { .ev2-drawer { display: none; } }

.ev2-drawer__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) var(--space-5);
    border-bottom: 1px solid var(--color-surface-1);
    flex-shrink: 0;
}
.ev2-drawer__head img { height: 28px; }

.ev2-drawer__close {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: var(--radius-md);
    font-size: 1.4rem;
    color: var(--color-text-secondary);
}
.ev2-drawer__close:hover { background: var(--color-bg-page); color: var(--color-primary); }

.ev2-drawer__body {
    flex: 1;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: var(--space-4) var(--space-5) var(--space-6);
}

.ev2-drawer__footer {
    flex-shrink: 0;
    padding: var(--space-5);
    border-top: 1px solid var(--color-surface-1);
    display: grid;
    gap: var(--space-3);
    background: var(--color-bg-light);
}

.ev2-drawer__meta {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: var(--space-2);
    font-size: var(--type-body);
}
.ev2-drawer__meta a { color: var(--color-text-secondary); font-weight: var(--fw-medium); }
.ev2-drawer__meta a:hover { color: var(--color-primary); }

/* Atalho do candidato no topo do menu (mobile/tablet) */
.ev2-drawer__candidate {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--space-4);
    margin-bottom: var(--space-4);
    border-radius: var(--radius-md);
    background: var(--color-bg-page);
    border: 1px solid var(--color-surface-2);
    color: var(--color-text-primary);
    transition: border-color var(--t-fast), background var(--t-fast);
}
.ev2-drawer__candidate-ico {
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    border-radius: var(--radius-sm);
    background: var(--color-primary);
    color: #fff;
    font-size: 1.05rem;
}
.ev2-drawer__candidate-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}
.ev2-drawer__candidate-title { font-size: var(--type-body); font-weight: var(--fw-semibold); }
.ev2-drawer__candidate-sub { font-size: var(--type-small); color: var(--color-text-secondary); }
.ev2-drawer__candidate-ext {
    flex-shrink: 0;
    font-size: .85rem;
    color: var(--color-text-muted);
}
.ev2-drawer__candidate:hover {
    border-color: var(--color-primary);
    background: var(--color-surface-2);
}
.ev2-drawer__candidate:hover .ev2-drawer__candidate-ext { color: var(--color-primary); }

/* Acordeão de navegação dentro do drawer */
.ev2-acc { border-bottom: 1px solid var(--color-surface-1); }
.ev2-acc__head {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-4) 0;
    font-size: var(--type-body-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-primary);
    text-align: left;
}
.ev2-acc__head i { color: var(--color-text-muted); transition: transform var(--t-normal); }
.ev2-acc__head[aria-expanded="true"] i { transform: rotate(180deg); color: var(--color-primary); }
.ev2-acc__head[aria-expanded="true"] { color: var(--color-primary); }
.ev2-acc__head.is-active { color: var(--color-primary); }

.ev2-acc__link {
    display: block;
    padding: var(--space-4) 0;
    font-size: var(--type-body-lg);
    font-weight: var(--fw-semibold);
    color: var(--color-text-primary);
}
.ev2-acc__link:hover { color: var(--color-primary); }
.ev2-acc__link.is-active { color: var(--color-primary); }

.ev2-acc__panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--t-normal);
}
.ev2-acc__panel > div { overflow: hidden; }
.ev2-acc__panel.is-open { grid-template-rows: 1fr; padding-bottom: var(--space-3); }

.ev2-acc__sublink {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3);
    border-radius: var(--radius-md);
    color: var(--color-text-secondary);
}
.ev2-acc__sublink > i {
    width: 34px; height: 34px;
    display: grid; place-items: center;
    border-radius: var(--radius-sm);
    background: var(--color-surface-2);
    color: var(--color-primary);
    font-size: 1rem;
    flex-shrink: 0;
}
.ev2-acc__sublink span { font-size: var(--type-body); font-weight: var(--fw-medium); }
.ev2-acc__sublink .ev2-ext {
    width: auto; height: auto;
    padding: 0;
    background: none;
    border-radius: 0;
    color: inherit;
    font-size: 0.7em;
    opacity: .55;
}
.ev2-acc__sublink:hover {
    background: var(--color-bg-page);
    color: var(--color-primary);
}

/* ════════════════════════════════════════════════════════════════════
   === FOOTER === (fundo lavanda, marca + 4 colunas + barra legal)
   ════════════════════════════════════════════════════════════════════ */
.ev2-footer {
    position: relative;
    background: var(--color-bg-page);
    border-top: 1px solid var(--color-surface-1);
    padding-top: var(--space-7);
    overflow: hidden;
}
.ev2-footer::before {
    content: "";
    position: absolute;
    top: -160px;
    left: 50%;
    transform: translateX(-50%);
    width: 680px;
    height: 320px;
    background: radial-gradient(ellipse at center, rgba(var(--rgb-primary), .10) 0%, transparent 70%);
    pointer-events: none;
}

.ev2-footer__top {
    position: relative;
    display: grid;
    grid-template-columns: 1.4fr repeat(4, 1fr);
    gap: var(--space-8) var(--space-6);
    padding-bottom: var(--space-9);
}

/* Coluna da marca */
.ev2-footer__brand { max-width: 320px; }
.ev2-footer__logo img { height: 32px; width: auto; }
.ev2-footer__tagline {
    margin-top: var(--space-4);
    font-size: var(--type-body);
    color: var(--color-text-secondary);
    line-height: var(--lh-normal);
}

/* Colunas de links */
.ev2-footer__col-title {
    font-weight: var(--fw-bold);
    color: var(--color-text-primary);
    margin-bottom: var(--space-4);
    letter-spacing: var(--ls-wide);
    text-transform: uppercase;
    font-size: var(--type-small);
}
.ev2-footer__links {
    display: grid;
    gap: var(--space-3);
}
.ev2-footer__links a {
    font-size: var(--type-body);
    color: var(--color-text-secondary);
    width: fit-content;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    transition: color var(--t-fast), transform var(--t-fast);
}
.ev2-footer__links a::before {
    content: "";
    width: 0;
    height: 1px;
    background: var(--color-primary);
    transition: width var(--t-normal);
}
.ev2-footer__links a:hover {
    color: var(--color-primary);
    transform: translateX(2px);
}
.ev2-footer__links a:hover::before { width: 10px; }
.ev2-footer__links .ev2-ext { font-size: 0.7em; opacity: .6; }

/* Barra legal inferior */
.ev2-footer__bottom {
    position: relative;
    border-top: 1px solid var(--color-surface-1);
    padding-block: var(--space-5);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-4);
    flex-wrap: wrap;
}
.ev2-footer__copy {
    font-size: var(--type-small);
    color: var(--color-text-muted);
}
.ev2-footer__legal {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}
.ev2-footer__legal a {
    font-size: var(--type-small);
    color: var(--color-text-muted);
}
.ev2-footer__legal a:hover { color: var(--color-primary); }

/* Faixa "É candidato?" (cross-link p/ o site do candidato) */
.ev2-footer__candidate {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-3) var(--space-4);
    padding-bottom: var(--space-5);
    margin-bottom: var(--space-8);
    border-bottom: 1px solid var(--color-surface-1);
    font-size: var(--type-body);
}
.ev2-footer__candidate-label {
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-weight: var(--fw-semibold);
    color: var(--color-text-primary);
}
.ev2-footer__candidate-label i { color: var(--color-primary); }
.ev2-footer__candidate a {
    display: inline-flex; align-items: center; gap: var(--space-2);
    font-weight: var(--fw-semibold);
    color: var(--color-primary);
    transition: color var(--t-fast);
}
.ev2-footer__candidate a:hover { color: var(--color-primary-dark); }
.ev2-footer__candidate a .ev2-ext { font-size: .7em; opacity: .6; }
.ev2-footer__candidate-sep {
    width: 1px; height: 16px;
    background: var(--color-surface-2);
}
@media (max-width: 480px) {
    .ev2-footer__candidate-sep { display: none; }
}

/* Redes sociais */
.ev2-social {
    display: flex;
    gap: var(--space-2);
}
.ev2-social a {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: var(--radius-pill);
    background: var(--color-bg-white);
    border: 1px solid var(--color-surface-1);
    color: var(--color-text-secondary);
    font-size: 1.05rem;
    transition: color var(--t-normal), background var(--t-normal), border-color var(--t-normal),
                transform var(--t-normal), box-shadow var(--t-normal);
}
.ev2-social a:hover {
    color: #fff;
    background: var(--color-primary);
    border-color: var(--color-primary);
    transform: translateY(-3px);
    box-shadow: 0 8px 18px -6px rgba(var(--rgb-primary), .6);
}

/* ═══ RESPONSIVO do footer ═══ */
@media (max-width: 1199.98px) {
    .ev2-footer__top { grid-template-columns: 1fr 1fr; }
    .ev2-footer__brand { grid-column: 1 / -1; max-width: none; }
}
@media (max-width: 767.98px) {
    .ev2-footer__top { gap: var(--space-7) var(--space-5); }
}
@media (max-width: 480px) {
    .ev2-footer__top { grid-template-columns: 1fr; }
    .ev2-footer__bottom { flex-direction: column; align-items: flex-start; }
    .ev2-footer__candidate { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    .ev2-social a:hover,
    .ev2-footer__links a:hover { transform: none; }
}
