/*
Theme Name:   IDEMP
Theme URI:    https://idemp.com.br
Description:  Tema filho do Hello Elementor para o IDEMP — Ecossistema de Educação Corporativa. Guarda os redirecionamentos 301 da consolidação de domínios e o CSS próprio, fora do alcance das atualizações do tema pai. Todo o layout é feito no Elementor.
Author:       Imagine.IDE
Author URI:   https://imagineide.com.br
Template:     hello-elementor
Version: 1.13.3
Text Domain:  idemp
*/

/* ---------------------------------------------------------------------------
   O sistema visual (paleta, tipografia, botões) vive nas Configurações do Site
   do Elementor — Global Colors e Global Fonts. Não repita cor nem fonte aqui.
   Este arquivo é só para o que o Elementor não alcança.
   --------------------------------------------------------------------------- */

/* Foco visível no teclado — o Hello não entrega e é requisito de acessibilidade. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--e-global-color-secondary, #0E3C83);
  outline-offset: 2px;
}

/* Rolagem suave para as âncoras internas, respeitando quem pediu menos movimento. */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* O cabeçalho fixo tem 80px; a âncora não pode parar debaixo dele. */
:target { scroll-margin-top: 96px; }

/* ---------------------------------------------------------------------------
   Cabeçalho e título da página
   --------------------------------------------------------------------------- */

/* Toda página é montada no Elementor e já traz o próprio H1 no hero.
   O título que o Hello imprime acima do conteúdo é sempre duplicado. */
body.elementor-page .page-header {
	display: none;
}

/* Entre 1025px e 1279px o menu tem 6 itens longos e pouca largura — ainda é
   desktop (o hambúrguer só entra em 1024px), então aperta em vez de quebrar. */
@media (min-width: 1025px) and (max-width: 1279px) {
	.elementor-location-header .elementor-nav-menu > li > a {
		font-size: 14px;
		padding-left: 5px;
		padding-right: 5px;
	}
}

/* ---------------------------------------------------------------------------
   Cabeçalho fixo que encolhe — 80px em repouso, 64px depois da rolagem.
   O Guia de Design Visual pede shrink suave e sombra 0 2px 6px rgba(0,0,0,.05).
   O Elementor marca .elementor-sticky--effects quando o header gruda.
   --------------------------------------------------------------------------- */
.elementor-location-header > .e-con {
	transition: min-height .28s ease, box-shadow .28s ease, padding .28s ease;
}
.elementor-location-header .elementor-sticky--effects {
	min-height: 64px !important;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .05);
}
.elementor-location-header .elementor-sticky--effects .elementor-widget-image img {
	max-height: 44px;
	transition: max-height .28s ease;
}
.elementor-location-header .elementor-widget-image img {
	transition: max-height .28s ease;
}

@media (max-width: 1024px) {
	.elementor-location-header .elementor-sticky--effects {
		min-height: 56px !important;
	}
}

/* ===========================================================================
   Camada de acabamento — cartões, ícones e microinterações
   O Guia de Design Visual pede transição de 0.25s nos botões, ícones com
   destaque colorido e hover nos cartões. Estas classes são aplicadas pelos
   containers das páginas (idmp-card, idmp-hero, idmp-rule).
   =========================================================================== */

/* O sinal de hover é uma BORDA que aparece — nada cresce nem se desloca.
   Crescer empurra o vizinho, treme no toque e o Guia pede microinteração
   discreta. A borda entra por dentro (inset), então não muda a caixa.
   As duas listas de sombra têm o mesmo número de itens de propósito: é o que
   deixa o navegador interpolar a borda de 0 para 2px em vez de piscar. */
.idmp-card,
.idmp-borda {
	position: relative;
	transition: box-shadow .28s ease;
	box-shadow: 0 1px 2px rgba(14, 60, 131, .05),
	            0 10px 28px -14px rgba(14, 60, 131, .16),
	            inset 0 0 0 0 rgba(244, 124, 32, 0);
}

.idmp-card:hover,
.idmp-borda:hover {
	box-shadow: 0 1px 2px rgba(14, 60, 131, .05),
	            0 16px 34px -18px rgba(14, 60, 131, .26),
	            inset 0 0 0 2px var(--e-global-color-2a908bb, #F47C20);
}

/* Ícone dentro de um quadrado arredondado tingido com a própria cor do ícone. */
.idmp-card .elementor-widget-icon-box .elementor-icon,
.idmp-ico .elementor-widget-icon-box .elementor-icon {
	width: 64px;
	height: 64px;
	border-radius: 18px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(14, 60, 131, .07);
	transition: background .25s ease, box-shadow .28s ease;
	box-shadow: inset 0 0 0 0 rgba(244, 124, 32, 0);
}

@supports (background: color-mix(in srgb, red 10%, transparent)) {
	.idmp-card .elementor-widget-icon-box .elementor-icon,
	.idmp-ico .elementor-widget-icon-box .elementor-icon {
		background: color-mix(in srgb, currentColor 14%, transparent);
	}
}

/* O quadrado do ícone ganha a borda na cor do próprio ícone. */
.idmp-card:hover .elementor-widget-icon-box .elementor-icon,
.idmp-borda:hover .elementor-widget-icon-box .elementor-icon {
	box-shadow: inset 0 0 0 2px currentColor;
}

/* Botões: a transição de 0.25s que o Guia especifica. O hover é um anel —
   a mesma ideia de borda dos cartões, por fora porque o botão é preenchido. */
.elementor-button {
	transition: background-color .25s ease, color .25s ease, box-shadow .28s ease;
	box-shadow: 0 0 0 0 rgba(244, 124, 32, 0);
}

.elementor-button:hover {
	box-shadow: 0 0 0 3px rgba(244, 124, 32, .32);
}

/* Filete laranja sob o título de seção, para dar ritmo à página. */
.idmp-rule .elementor-heading-title::after {
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	border-radius: 2px;
	background: var(--e-global-color-2a908bb, #F47C20);
	margin-top: 18px;
}

.idmp-rule.idmp-centro .elementor-heading-title::after {
	margin-left: auto;
	margin-right: auto;
}


/* Números grandes das estatísticas ganham peso. */
.idmp-stat .elementor-heading-title {
	letter-spacing: -.02em;
}

/* ===========================================================================
   Banda com sidebar de seção — o modelo de página interna dos documentos.
   .idmp-banda = a faixa de duas colunas abaixo do hero
   .idmp-side  = a coluna lateral, fixa ao rolar
   Atenção: o Elementor embrulha container "boxed" num .e-con-inner, então o
   combinador ">" não alcança os filhos. Todos os seletores aqui são de
   descendente de propósito.
   =========================================================================== */

.idmp-banda .idmp-side {
	flex: 0 0 262px;
	max-width: 262px;
	align-self: flex-start;
	position: sticky;
	top: 104px;
}

.idmp-banda .idmp-side + .e-con {
	flex: 1 1 0;
	min-width: 0;
}

/* Só as linhas de cartão quebram; blocos de imagem + texto ficam lado a lado. */
.idmp-banda .e-con-inner:has(> .idmp-card),
.idmp-banda .e-con-inner:has(> .idmp-ico) {
	flex-wrap: wrap;
}

.idmp-banda .idmp-card,
.idmp-banda .idmp-ico {
	flex: 1 1 calc(50% - 12px);
	min-width: 250px;
	max-width: none;
	width: auto;
}

.idmp-side .elementor-icon-list-text {
	transition: color .25s ease;
	line-height: 1.4;
}

.idmp-side .elementor-icon-list-item a:hover .elementor-icon-list-text {
	color: var(--e-global-color-2a908bb, #F47C20);
}

.idmp-side .elementor-widget-heading a {
	text-decoration: none;
}

@media (max-width: 1024px) {
	.idmp-banda {
		flex-wrap: wrap;
	}

	.idmp-banda .idmp-side {
		flex: 1 1 100%;
		max-width: none;
		position: static;
	}

	.idmp-banda .idmp-card,
	.idmp-banda .idmp-ico {
		flex: 1 1 100%;
	}
}

/* ===========================================================================
   Hero das páginas internas — um padrão só para o site inteiro.
   Faixa azul IDEMP com degradê, texto branco, sobrancelha em laranja-claro.
   A Home não usa: o Guia pede fundo branco com imagem humana no bloco 1.
   =========================================================================== */

.idmp-hero {
	position: relative;
	overflow: hidden;
	background-color: #0B2E68;

	/* A foto entra por variável: a camada de vidro é sempre a mesma e cada
	   página só troca --idmp-hero-foto, no mapa do fim do arquivo. */
	--idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/photo-of-multinational-cheerful-students-smiling-w-NXCYM8V-1536x1024.jpg");
	--idmp-hero-vidro: linear-gradient(90deg,
	                     rgba(6, 24, 56, .97) 0%,
	                     rgba(8, 33, 74, .94) 40%,
	                     rgba(11, 46, 104, .82) 62%,
	                     rgba(12, 52, 118, .54) 82%,
	                     rgba(14, 60, 131, .28) 100%);

	/* véu uniforme por baixo do degradê: há fotos claras no acervo, e sem ele
	   o lado direito do herói fica gritando mais alto do que o texto. */
	--idmp-hero-veu: linear-gradient(rgba(6, 24, 56, .10), rgba(6, 24, 56, .10));

	background-image: var(--idmp-hero-vidro), var(--idmp-hero-veu), var(--idmp-hero-foto);
	background-repeat: no-repeat, no-repeat, no-repeat;
	background-position: center center, center center, center center;
	background-size: cover, cover, cover;
}

/* No tablet e no telemóvel o texto ocupa a largura toda — o degradê deixa de
   ser da esquerda para a direita e passa a ser de cima para baixo. */
@media (max-width: 1024px) {
	.idmp-hero {
		--idmp-hero-vidro: linear-gradient(178deg,
		                     rgba(6, 24, 56, .96) 0%,
		                     rgba(9, 38, 86, .93) 55%,
		                     rgba(12, 52, 118, .86) 100%);
	}
}

/* Arco de luz no canto, para a faixa não ser cor chapada. */
.idmp-hero::before {
	content: "";
	position: absolute;
	top: -180px;
	right: -140px;
	width: 520px;
	height: 520px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(244, 124, 32, .16) 0%, rgba(244, 124, 32, 0) 70%);
	pointer-events: none;
}

.idmp-hero::after {
	content: "";
	position: absolute;
	left: -160px;
	bottom: -220px;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 174, 114, .12) 0%, rgba(59, 174, 114, 0) 70%);
	pointer-events: none;
}

.idmp-hero > * {
	position: relative;
	z-index: 1;
}

.idmp-hero h1.elementor-heading-title,
.idmp-hero h2.elementor-heading-title,
.idmp-hero h3.elementor-heading-title {
	color: #FFFFFF !important;
}

.idmp-hero h6.elementor-heading-title,
.idmp-hero h5.elementor-heading-title {
	color: #FFD1A6 !important;
}

.idmp-hero .elementor-widget-text-editor,
.idmp-hero .elementor-widget-text-editor p {
	color: #C6D8F2 !important;
}

.idmp-hero .elementor-icon-list-text {
	color: #E6EFFB !important;
}

/* Botão dentro do hero: branco sobre o azul. */
.idmp-hero .elementor-button {
	background-color: #FFFFFF !important;
	color: #0E3C83 !important;
}

.idmp-hero .elementor-button:hover {
	background-color: #3BAE72 !important;
	color: #FFFFFF !important;
}

/* ===========================================================================
   Caminho de migalhas no hero — "Início › Seção › Página"
   =========================================================================== */

.idmp-migalha p {
	margin: 0 0 6px;
	font-family: Montserrat, sans-serif;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: .02em;
	color: #9FBCE4 !important;
}

.idmp-migalha a {
	color: #FFD1A6 !important;
	text-decoration: none;
	transition: color .25s ease;
}

.idmp-migalha a:hover {
	color: #FFFFFF !important;
	text-decoration: underline;
}

.idmp-migalha i {
	font-style: normal;
	margin: 0 4px;
	opacity: .55;
}

.idmp-migalha span {
	color: #FFFFFF !important;
}

/* Nos hubs e páginas sem faixa azul a migalha continua legível. */
:not(.idmp-hero) > .elementor-widget-container > .idmp-migalha p {
	color: #4A4A4A !important;
}

/* ===========================================================================
   CAMADA 2026 — REDESENHO (31/08)
   O sistema de cor e tipografia continua nos Globals do kit. Aqui mora só o
   que o Elementor não alcança: forma, ritmo e microinteração.
   --------------------------------------------------------------------------- */

/* --- Botões: pílula, peso e uma elevação discreta ------------------------- */
.elementor-button { border-radius: 999px; padding: 15px 32px; font-weight: 600; }
/* (o anel de hover dos botões está na camada de acabamento, acima) */
.idmp-btn-ghost .elementor-button { background-color: transparent; }
.idmp-btn-ghost .elementor-button:hover { color: #FFFFFF; }

/* --- Hero da home -------------------------------------------------------- */
.idmp-hero-home { position: relative; overflow: hidden; }
.idmp-hero-home::before {
  content: ""; position: absolute; left: -14%; bottom: -34%;
  width: min(52vw, 680px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(240,246,251,.95), rgba(240,246,251,0) 70%);
  pointer-events: none;
}
.idmp-hero-home > .e-con-inner { position: relative; z-index: 1; }
.idmp-sobrancelha .elementor-heading-title { text-transform: uppercase; }
.idmp-lead p { max-width: 34em; }
.idmp-hero-arte img { border-radius: 24px; }

/* --- Selos de valor do hero ---------------------------------------------- */
.idmp-chips .elementor-widget { width: auto; }
.idmp-chips .elementor-icon-box-wrapper { align-items: center; }
.idmp-chips .elementor-icon-box-title { margin: 0; font-size: 15px; white-space: nowrap; }
.idmp-chips .elementor-icon-box-description { display: none; }
@media (max-width: 480px) { .idmp-chips .elementor-icon-box-title { white-space: normal; } }

/* --- Faixa de números ---------------------------------------------------- */
.idmp-banda-num { position: relative; overflow: hidden; }
.idmp-banda-num::after {
  content: ""; position: absolute; right: -6%; top: -60%;
  width: 420px; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(244,124,32,.28), rgba(244,124,32,0) 68%);
  pointer-events: none;
}
.idmp-banda-num > .e-con-inner { position: relative; z-index: 1; }
@media (max-width: 767px) { .idmp-banda-num .e-con > .e-con { width: 50% !important; } }

/* --- O Método: o chevron entre as etapas --------------------------------- */
.idmp-passo { position: relative; }
@media (min-width: 1025px) {
  .idmp-passo:not(:last-child)::after {
    content: ""; position: absolute; top: 34px; right: -14px;
    width: 12px; height: 12px;
    border-top: 2px solid #C9D4E4; border-right: 2px solid #C9D4E4;
    transform: rotate(45deg);
  }
}
.idmp-passo .elementor-icon { transition: box-shadow .28s ease; box-shadow: 0 0 0 0 rgba(244,124,32,0); }
.idmp-passo:hover .elementor-icon { box-shadow: 0 0 0 4px rgba(244,124,32,.35); }
@media (max-width: 1024px) { .idmp-passos .idmp-passo { width: 50% !important; } }
@media (max-width: 600px)  { .idmp-passos .idmp-passo { width: 100% !important; } }

/* --- IDEMPFlix: faixa laranja de ponta a ponta --------------------------- */
/* (a cor do texto desta faixa mudou para branco em 1.8.0, no fim do arquivo) */
.idmp-flix img { border-radius: 16px; box-shadow: 0 24px 50px -28px rgba(0,0,0,.45); }

/* --- CTA final ----------------------------------------------------------- */
.idmp-cta-final { position: relative; overflow: hidden; }
.idmp-cta-final::before {
  content: ""; position: absolute; left: -8%; top: -70%;
  width: 520px; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle, rgba(59,174,114,.30), rgba(59,174,114,0) 68%);
  pointer-events: none;
}
.idmp-cta-final > .e-con-inner { position: relative; z-index: 1; }
.idmp-cta-final .elementor-heading-title { max-width: 900px; margin-inline: auto; }

/* --- Ritmo e forma, valendo para o site inteiro -------------------------- */
.idmp-eco img { border-radius: 20px; }
h1.elementor-heading-title { letter-spacing: -0.02em; }
h2.elementor-heading-title { letter-spacing: -0.015em; line-height: 1.15; }

/* --- Ajustes 31/08 (1.6.1) ----------------------------------------------- */
.idmp-chips .elementor-widget { width: calc(50% - 12px); }
@media (max-width: 767px) { .idmp-chips .elementor-widget { width: 100%; } }
.idmp-cta-lead p { max-width: 820px; margin-inline: auto; }
.idmp-flix .e-con-inner { gap: 48px; }

/* --- Cabeçalho com CTA: o menu tem de caber numa linha (1.6.2) ------------ */
.elementor-location-header .elementor-nav-menu--main .elementor-item {
  font-size: 15px;
  padding-left: 9px;
  padding-right: 9px;
}
.elementor-location-header .elementor-widget-image img { max-width: 220px; }
@media (min-width: 1025px) and (max-width: 1420px) {
  .elementor-location-header .elementor-nav-menu--main .elementor-item {
    font-size: 13.5px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .elementor-location-header .elementor-widget-image img { max-width: 180px; }
}
/* A barra preta não encolhe nem gruda: quem gruda é o cabeçalho branco. */
.idmp-header-cta .elementor-button { padding: 13px 26px; white-space: nowrap; }

/* --- Cabeçalho: o menu manda na largura, logo e CTA ficam no seu tamanho (1.6.3) --- */
/* Ao grudar, o Elementor CLONA a linha do cabeçalho — o que era :last-child
   deixa de ser, e a regra silenciosamente para de casar. Por isso aqui nada
   depende de posição: só de classe própria. */
@media (min-width: 1366px) {
  .elementor-location-header .idmp-h-logo,
  .elementor-location-header .idmp-header-cta {
    width: auto !important;
    flex: 0 0 auto !important;
  }
  .elementor-location-header .idmp-h-nav {
    width: auto !important;
    flex: 1 1 auto !important;
  }
  .elementor-location-header .elementor-nav-menu--main { justify-content: center; }
  .elementor-location-header .elementor-nav-menu--main .elementor-item {
    padding-left: 7px;
    padding-right: 7px;
    font-size: 14.5px;
  }
}

/* --- Rodapé grande: 5 colunas numa linha ---------------------------------- */
.idmp-rodape-tit .elementor-heading-title { line-height: 1.3; }
.idmp-rodape-lista .elementor-icon-list-text { line-height: 1.45; }
@media (min-width: 1025px) {
  .idmp-rodape > .e-con-inner { flex-wrap: nowrap; }
}

/* --- Medida de leitura no herói das internas (1.6.4) --------------------- */
.idmp-hero .elementor-widget-text-editor p { max-width: 54em; }

/* --- Herói das internas: o título tem de ser branco em qualquer nível (1.6.5) --- */
.idmp-hero h1.elementor-heading-title,
.idmp-hero h2.elementor-heading-title,
.idmp-hero h4.elementor-heading-title,
.idmp-hero h6.elementor-heading-title { color: #FFFFFF !important; }

/* Cartão de formulário do Contato */
.idmp-form-card .elementor-field-group > label { font-weight: 600; }

/* ===========================================================================
   MENU LATERAL (1.7.3)
   Seis itens de topo mais o CTA pedem ~1360px de largura. Abaixo disso o menu
   horizontal quebrava em duas linhas — agora vira hambúrguer com painel
   deslizante à direita. O véu (.idmp-veu) e a classe .idmp-menu-aberto no body
   vêm do roteiro em functions.php.
   --------------------------------------------------------------------------- */

/* O véu vive no <body>, fora do cabeçalho, para escurecer a página inteira. */
.idmp-veu {
  position: fixed;
  inset: 0;
  background: rgba(11, 26, 54, .45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .32s ease;
  z-index: 9991;
}
body.idmp-menu-aberto .idmp-veu { opacity: 1; pointer-events: auto; }
body.idmp-menu-aberto { overflow: hidden; }

@media (max-width: 1365px) {

  /* O cabeçalho fica acima do véu, e o painel é filho dele. */
  .elementor-location-header { position: relative; z-index: 9993; }

  /* O backdrop-filter do cabeçalho faria dele o bloco de contenção de qualquer
     position:fixed dentro dele — o painel ficava preso à altura do cabeçalho.
     O fundo já é branco a 94%, o desfoque não faz falta. */
  .elementor-location-header .e-con,
  .elementor-location-header .e-con-inner {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .elementor-location-header .elementor-nav-menu--main { display: none !important; }

  .elementor-location-header .elementor-menu-toggle {
    display: flex !important;
    position: relative;
    z-index: 3;
  }

  /* O painel. O Elementor traz "stretch" (position:absolute mais largura e
     left inline), por isso aqui é preciso especificidade maior e !important. */
  .elementor-location-header .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    width: min(88vw, 360px) !important;
    max-width: none !important;
    height: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 92px 18px 40px !important;
    background: #FFFFFF !important;
    box-shadow: -24px 0 60px rgba(14, 60, 131, .18);
    overflow-y: auto !important;
    overscroll-behavior: contain;
    transform: translateX(100%) !important;
    visibility: hidden;
    transition: transform .32s cubic-bezier(.4, 0, .2, 1), visibility 0s .32s !important;
    z-index: 2 !important;
  }
  .elementor-location-header .elementor-menu-toggle.elementor-active + .elementor-nav-menu__container.elementor-nav-menu--dropdown {
    transform: translateX(0) !important;
    visibility: visible;
    transition: transform .32s cubic-bezier(.4, 0, .2, 1) !important;
  }

  /* A marca no topo do painel. Fica em position:fixed dentro do painel (que tem
     transform, logo é o bloco de contenção) para não rolar com a lista. */
  .elementor-location-header .elementor-nav-menu__container.elementor-nav-menu--dropdown::before {
    content: "";
    position: fixed;
    top: 26px;
    left: 18px;
    width: 152px;
    height: 46px;
    background: url("https://idemp.com.br/wp-content/uploads/2025/01/Design-sem-nome-20.png") no-repeat left center;
    background-size: contain;
  }

  /* Aberto, o X sai do lugar do menu e vai para o topo do painel. */
  body.idmp-menu-aberto .elementor-location-header .elementor-menu-toggle {
    position: fixed;
    top: 33px;
    right: 24px;
    z-index: 4;
  }

  /* Com o painel aberto, o CTA do cabeçalho sai da frente. */
  body.idmp-menu-aberto .idmp-header-cta {
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
  }

  /* Dentro do painel os itens são linhas de lista, não barras azuis. */
  .elementor-location-header .elementor-nav-menu--dropdown .elementor-item {
    background-color: transparent !important;
    color: #0E3C83 !important;
    font-size: 16px;
    font-weight: 600;
    padding: 15px 10px !important;
    border-bottom: 1px solid #E7EDF6;
    justify-content: flex-start;
  }
  .elementor-location-header .elementor-nav-menu--dropdown .elementor-item:hover,
  .elementor-location-header .elementor-nav-menu--dropdown .elementor-item.elementor-item-active {
    color: #F47C20 !important;
  }
  .elementor-location-header .elementor-nav-menu--dropdown .elementor-sub-item {
    font-size: 15px;
    font-weight: 400;
    padding-left: 26px !important;
    color: #3F5372 !important;
    border-bottom-style: dotted;
  }
  .elementor-location-header .elementor-nav-menu--dropdown .sub-arrow { margin-left: auto; }
}

/* Entre 1025 e 1365 ainda cabe o CTA ao lado do hambúrguer. */
@media (min-width: 1025px) and (max-width: 1365px) {
  .elementor-location-header .idmp-header-cta { display: flex !important; }
}


/* ===========================================================================
   1.8.0 — A FOTO DE CADA HERÓI
   Uma foto por página, sempre atrás da mesma camada de vidro: escura à
   esquerda, onde o texto assenta, e clara à direita, onde a foto respira.
   A Home fica de fora — ela usa .idmp-hero-home, fundo branco por decisão do
   Guia. Trocar a foto de uma página é trocar uma linha aqui.
   =========================================================================== */

/* Áreas de Aprendizado */
body.page-id-105 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-financeira.jpg"); }
body.page-id-140 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-pessoas.jpg"); }
body.page-id-173 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-empresarial.jpg"); }
body.page-id-180 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-publica.jpg"); }
body.page-id-202 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-estrategia.jpg"); }
body.page-id-726 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/shot-of-a-group-of-businesspeople-working-together-VMGYE8G-1536x1024.jpg"); }
body.page-id-927 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/photo-of-multinational-cheerful-students-smiling-w-NXCYM8V-1536x1024.jpg"); }

/* Quem somos */
body.page-id-563 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/photo-of-multinational-cheerful-students-smiling-w-NXCYM8V-1536x1024.jpg"); }
body.page-id-570 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/female-students-note-from-the-books-at-the-asian-g-RQRZFK4-1536x1024.jpg"); }
body.page-id-930 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/female-students-note-from-the-books-at-the-asian-g-RQRZFK4-1536x1024.jpg"); }
body.page-id-931 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-pessoas.jpg"); }
body.page-id-937 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/shot-of-a-group-of-businesspeople-working-together-VMGYE8G-1536x1024.jpg"); }

/* Soluções In Company */
body.page-id-261 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-empresarial.jpg"); }
body.page-id-932 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/cheerful-latin-businesswoman-using-laptop-with-boo-FA82N8N-1536x1024.jpg"); }
body.page-id-933 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-estrategia.jpg"); }
body.page-id-934 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-webinars.jpg"); }

/* Ecossistema */
body.page-id-865 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-estrategia.jpg"); }
body.page-id-368 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idempflix-hero-gestora-d.webp"); }
body.page-id-353 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-financeira.jpg"); }
body.page-id-313 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-empresarial.jpg"); }
body.page-id-296 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/american-teenage-girl-having-a-remote-video-call-w-ZAZZG6B-1536x1024.jpg"); }

/* Conteúdo e Contato */
body.page-id-926 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/view-over-shoulder-of-an-african-american-smart-fe-KUTSBJM-1536x1024.jpg"); }
body.page-id-935 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/view-over-shoulder-of-an-african-american-smart-fe-KUTSBJM-1536x1024.jpg"); }
body.page-id-936 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2026/09/idemp-hero-webinars.jpg"); }
body.page-id-382 .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/shot-of-a-group-of-businesspeople-working-together-VMGYE8G-1536x1024.jpg"); }

/* Blog: a lista e o artigo */
body.blog .idmp-hero,
body.archive .idmp-hero,
body.single-post .idmp-hero { --idmp-hero-foto: url("https://idemp.com.br/wp-content/uploads/2025/01/view-over-shoulder-of-an-african-american-smart-fe-KUTSBJM-1536x1024.jpg"); }

/* Com foto atrás, a arte de identidade da área ganha canto arredondado. */
.idmp-hero .elementor-widget-image img { border-radius: 18px; }

/* ===========================================================================
   1.8.0 — IDEMPFLIX: a faixa laranja passou a ler
   O título saía em azul institucional sobre laranja (3,4:1) e o texto em
   #16233F. O pedido é fonte branca — e branco sobre #F47C20 dá 2,3:1. Então a
   faixa escurece do lado do texto e mantém o laranja da marca do lado da
   imagem: onde o texto assenta, o contraste passa de 7:1.
   =========================================================================== */
.idmp-flix {
	background-color: #A8480A !important;
	background-image: linear-gradient(100deg, #93400A 0%, #A8480A 34%, #D2620F 74%, #F47C20 100%) !important;
}

.idmp-flix .elementor-heading-title,
.idmp-flix .elementor-widget-text-editor,
.idmp-flix .elementor-widget-text-editor p,
.idmp-flix .elementor-widget-text-editor strong,
.idmp-flix .elementor-widget-text-editor a {
	color: #FFFFFF !important;
}

@media (max-width: 767px) {
	.idmp-flix {
		background-image: linear-gradient(170deg, #93400A 0%, #A8480A 46%, #D2620F 100%) !important;
	}
}

/* ===========================================================================
   1.8.0 — O ARTIGO (modelo de post único, template 423)
   O corpo do post vem do editor do WordPress, não do Elementor: é aqui que
   ele ganha medida de leitura, ritmo e hierarquia.
   =========================================================================== */

.idmp-artigo .elementor-widget-theme-post-content { font-size: 18px; line-height: 1.78; color: #2E3A50; }
.idmp-artigo .elementor-widget-theme-post-content p { margin: 0 0 24px; }
.idmp-artigo .elementor-widget-theme-post-content > *:last-child { margin-bottom: 0; }

.idmp-artigo .elementor-widget-theme-post-content h2 {
	font-family: Montserrat, sans-serif;
	font-size: 32px;
	line-height: 1.25;
	letter-spacing: -.015em;
	color: var(--e-global-color-secondary, #0E3C83);
	margin: 46px 0 16px;
}

.idmp-artigo .elementor-widget-theme-post-content h3 {
	font-family: Montserrat, sans-serif;
	font-size: 22px;
	line-height: 1.3;
	color: #16233F;
	margin: 34px 0 12px;
}

.idmp-artigo .elementor-widget-theme-post-content ul,
.idmp-artigo .elementor-widget-theme-post-content ol { margin: 0 0 24px; padding-left: 22px; }
.idmp-artigo .elementor-widget-theme-post-content li { margin-bottom: 10px; }
.idmp-artigo .elementor-widget-theme-post-content li::marker { color: var(--e-global-color-2a908bb, #F47C20); }

.idmp-artigo .elementor-widget-theme-post-content a {
	color: var(--e-global-color-secondary, #0E3C83);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.idmp-artigo .elementor-widget-theme-post-content a:hover { color: var(--e-global-color-2a908bb, #F47C20); }

/* Citação: filete laranja à esquerda, sem aspas decorativas. */
.idmp-artigo .elementor-widget-theme-post-content blockquote {
	margin: 34px 0;
	padding: 4px 0 4px 24px;
	border-left: 4px solid var(--e-global-color-2a908bb, #F47C20);
	font-size: 21px;
	line-height: 1.55;
	color: #16233F;
	font-style: normal;
}

.idmp-artigo .elementor-widget-theme-post-content img { border-radius: 16px; }
.idmp-artigo .elementor-widget-theme-post-content figcaption { font-size: 14px; color: #6A7789; margin-top: 8px; }

/* A foto de capa do artigo. */
.idmp-artigo-capa img { border-radius: 20px; box-shadow: 0 24px 50px -30px rgba(14, 60, 131, .5); }

/* Data, autor e categoria, na mesma linha, sobre o herói. */
.idmp-post-meta .elementor-icon-list-item,
.idmp-post-meta .elementor-icon-list-text,
.idmp-post-meta a { color: #C6D8F2 !important; }
.idmp-post-meta .elementor-icon-list-icon i { color: #FFD1A6 !important; }
.idmp-post-meta a:hover { color: #FFFFFF !important; }

/* Partilha: os botões seguem a mesma regra de borda do resto do site. */
.idmp-partilha .elementor-share-btn { transition: box-shadow .28s ease; box-shadow: 0 0 0 0 rgba(244, 124, 32, 0); }
.idmp-partilha .elementor-share-btn:hover { box-shadow: 0 0 0 3px rgba(244, 124, 32, .32); }

/* Cartões da lista de artigos (arquivo e relacionados). */
.idmp-lista .elementor-post {
	background: #FFFFFF;
	border-radius: 18px;
	overflow: hidden;
	transition: box-shadow .28s ease;
	box-shadow: 0 1px 2px rgba(14, 60, 131, .05),
	            0 10px 28px -14px rgba(14, 60, 131, .16),
	            inset 0 0 0 0 rgba(244, 124, 32, 0);
}
.idmp-lista .elementor-post:hover {
	box-shadow: 0 1px 2px rgba(14, 60, 131, .05),
	            0 16px 34px -18px rgba(14, 60, 131, .26),
	            inset 0 0 0 2px var(--e-global-color-2a908bb, #F47C20);
}
.idmp-lista .elementor-post__text { padding: 0 22px 6px; }
.idmp-lista .elementor-post__meta-data { padding: 0 22px; color: #6A7789; }
.idmp-lista .elementor-post__title a { color: var(--e-global-color-secondary, #0E3C83); }
.idmp-lista .elementor-post__excerpt p { color: #4A5568; }

/* --- Acertos 1.8.1 -------------------------------------------------------- */
/* Nem todo herói alinha à esquerda: onde o título é centrado, a foto precisa
   de mais véu no meio. O degradê acima foi alargado por causa disso. */
.idmp-artigo .elementor-widget-theme-post-content h2:first-child,
.idmp-artigo .elementor-widget-theme-post-content h3:first-child { margin-top: 0; }

.idmp-lista .elementor-post__meta-data { font-size: 14px; margin-bottom: 8px; }
.idmp-lista .elementor-post__read-more { padding: 0 22px 20px; display: inline-block; font-weight: 600; }
.idmp-lista .elementor-post__thumbnail__link { margin-bottom: 18px; }
.idmp-lista .elementor-post__title { font-size: 22px; line-height: 1.3; } /* degrau H3 da escala */

/* Partilha: um pouco de ar acima, para não colar no fim do texto. */
.idmp-partilha { margin-top: 8px; }

/* ===========================================================================
   1.8.3 — O HERÓI DAS INTERNAS PASSOU A SER SÓ TEXTO SOBRE A FOTO
   Com fotografia de fundo, a arte à direita virava um segundo assunto no
   mesmo espaço. Ela saiu de 8 heróis (as 6 áreas, /solucoes e /ecossistema) e
   o texto ganhou medida própria — some no lado escuro do degradê e não
   atravessa para a parte clara.
   =========================================================================== */
.idmp-hero-so-texto > .e-con-inner > .e-con,
.idmp-hero-so-texto > .e-con { max-width: 720px; }

@media (max-width: 1024px) {
	.idmp-hero-so-texto > .e-con-inner > .e-con,
	.idmp-hero-so-texto > .e-con { max-width: none; }
}

/* ---------------------------------------------------------------------------
   No telemóvel a foto sobe: vira uma faixa no topo, e o texto vem abaixo dela,
   sobre o azul. Texto sobre foto em 390px não é leitura, é aposta.
   A faixa é o ::before (que no computador é o halo laranja): assim a foto
   recorta por "cover" e não estica.
   --------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.idmp-hero {
		background-image: none;
		background-color: #0B2E68;
		--padding-top: 236px !important;
	}

	.idmp-hero::before {
		top: 0;
		right: 0;
		left: 0;
		bottom: auto;
		width: auto;
		height: 208px;
		border-radius: 0;
		background-image: linear-gradient(180deg, rgba(6, 24, 56, 0) 52%, rgba(9, 38, 86, .55) 84%, rgba(11, 46, 104, .96) 100%), var(--idmp-hero-veu), var(--idmp-hero-foto);
		background-size: cover, cover, cover;
		background-position: center, center, center;
		background-repeat: no-repeat, no-repeat, no-repeat;
	}

	.idmp-hero::after { display: none; }
}

/* --- 1.8.4: nada de cor fixa dentro do texto do herói --------------------- */
/* Algumas manchetes trazem <span style="color:..."> do kit antigo. Sobre a
   foto escura, esse azul desaparece. No herói, tudo herda a cor do bloco. */
.idmp-hero .elementor-heading-title span,
.idmp-hero .elementor-heading-title b,
.idmp-hero .elementor-heading-title strong,
.idmp-hero .elementor-widget-text-editor span,
.idmp-hero .elementor-widget-text-editor strong { color: inherit !important; }

/* ===========================================================================
   1.8.6 — REVISÃO DO CLIENTE (01/09)
   =========================================================================== */

/* Vídeo do YouTube em proporção 16:9, dentro da coluna, com cantos da casa. */
.idmp-video-caixa {
	position: relative;
	padding-top: 56.25%;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 20px 44px -26px rgba(14, 60, 131, .45);
}

.idmp-video-caixa iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* O "Ver o calendário de cursos" colava no cartão azul-claro acima e repetia a
   cor do resto da página. Ganha respiro e o laranja da marca — com texto
   escuro, porque branco sobre #F47C20 dá 2,3:1. */
.idmp-btn-calendario { margin-top: 44px; }

.idmp-btn-calendario .elementor-button {
	background-color: var(--e-global-color-2a908bb, #F47C20) !important;
	color: #12203A !important;
}

.idmp-btn-calendario .elementor-button:hover {
	background-color: #D2620F !important;
	color: #FFFFFF !important;
}

/* Ícones sociais do rodapé: eram um quadrado escuro do Elementor no meio de um
   rodapé claro. Agora são círculos no azul da marca, laranja no hover. */
.elementor-location-footer .elementor-social-icon { transition: background-color .25s ease, box-shadow .28s ease; }

/* ===========================================================================
   1.8.7 — ESCALA TIPOGRÁFICA ÚNICA
   O tamanho mora nos Global Fonts do kit: H1 46/38/31, H2 32/29/26,
   H3 22, H4 19, H5 17, H6 15, corpo 17/17/16, botão 15.
   Aqui ficam só as duas exceções que a escala não cobre: o parágrafo de
   abertura (herói e lead da home), que pede um degrau acima do corpo, e o
   corpo do artigo, que é leitura longa.
   =========================================================================== */

.idmp-hero .elementor-widget-text-editor p,
.idmp-lead p {
	font-size: 19px;
	line-height: 1.62;
}

@media (max-width: 1024px) {
	.idmp-hero .elementor-widget-text-editor p,
	.idmp-lead p { font-size: 18px; }
}

@media (max-width: 767px) {
	.idmp-hero .elementor-widget-text-editor p,
	.idmp-lead p { font-size: 17px; }
}

/* O CTA de fecho fala mais alto do que um parágrafo comum, mas menos que um H2. */
.idmp-cta-lead p { font-size: 18px; }

/* A migalha também é um text-editor dentro do herói: precisa vir depois da
   regra do parágrafo de abertura, senão herda os 19px. */
.idmp-hero .idmp-migalha p {
	font-size: 13px;
	line-height: 1.5;
}


/* ---- 1.9.1 — segundo botao do heroi (Ver a trilha disponivel) ---- */
.idmp-hero .idmp-btn-ghost .elementor-button{background-color:transparent !important;color:#FFFFFF !important;box-shadow:inset 0 0 0 2px rgba(255,255,255,.75);}
.idmp-hero .idmp-btn-ghost .elementor-button:hover{background-color:#FFFFFF !important;color:#0E3C83 !important;box-shadow:inset 0 0 0 2px #FFFFFF;}
.idmp-hero-botoes{align-items:center;}
@media (max-width:767px){.idmp-hero-botoes .elementor-widget-button{width:100%;}.idmp-hero-botoes .elementor-button{width:100%;justify-content:center;}}

/* ---- 1.9.2 — cartao da trilha: microareas em duas colunas ---- */
.idmp-trilha{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 28px;}
.idmp-trilha > .elementor-widget{width:auto !important;max-width:100% !important;}
@media (max-width:767px){.idmp-trilha{grid-template-columns:1fr;}}


/* ---- 1.9.3 — e-books: capa ao lado do texto ---- */
.idmp-ebook{flex-direction:row !important;align-items:flex-start !important;}
.idmp-ebook > .idmp-ebook-capa{flex:0 0 118px !important;width:118px !important;max-width:118px !important;}
.idmp-ebook-capa img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 10px 22px rgba(14,60,131,.18);}
.idmp-ebook > .idmp-ebook-txt{flex:1 1 0 !important;min-width:0;width:auto !important;align-self:stretch;}
.idmp-ebook-txt > .idmp-ebook-btn{margin-top:auto !important;}
.idmp-ebook-txt h3{line-height:1.25;}
@media (max-width:480px){
.idmp-ebook{flex-direction:column !important;}
.idmp-ebook > .idmp-ebook-capa{flex-basis:auto !important;width:140px !important;max-width:140px !important;}
}

/* ---- 1.9.4 — botões lado a lado; laranja da marca sem o respiro do calendário ---- */
.idmp-botoes-linha{--width:100% !important;width:100% !important;max-width:960px;flex-direction:row !important;flex-wrap:wrap !important;justify-content:center !important;}
.idmp-botoes-linha > .elementor-widget-button{width:auto !important;max-width:100%;}
.idmp-btn-laranja .elementor-button{background-color:var(--e-global-color-2a908bb,#F47C20) !important;color:#12203A !important;}
.idmp-btn-laranja .elementor-button:hover{background-color:#D2620F !important;color:#FFFFFF !important;}

/* ---- 1.9.6 — corpo docente: todos os nomes numa grelha compacta ---- */
.idmp-docentes{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
.idmp-docente{flex-wrap:nowrap !important;width:auto !important;box-shadow:inset 0 0 0 1px #E3E9F2;transition:box-shadow .25s;}
.idmp-docente:hover{box-shadow:inset 0 0 0 2px var(--e-global-color-2a908bb,#F47C20);}
.idmp-docente > .idmp-doc-ini{flex:0 0 44px !important;width:44px !important;}
.idmp-doc-ini .elementor-heading-title{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#E8EFF9;color:var(--e-global-color-secondary,#0E3C83) !important;font:700 15px/1 Montserrat,sans-serif;letter-spacing:.02em;}
.idmp-docente > .idmp-doc-txt{flex:1 1 0 !important;min-width:0;width:auto !important;}
.idmp-doc-nome .elementor-heading-title{font:700 15px/1.3 Montserrat,sans-serif !important;margin:0;}
.idmp-doc-area .elementor-heading-title{font:400 13px/1.35 Lato,sans-serif !important;margin:0;}
@media (max-width:1024px){.idmp-docentes{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.idmp-docentes{grid-template-columns:1fr;gap:8px;}}


/* ---- 1.9.7 — pilares do Quem somos, cartões sóbrios das áreas, grelha do Ecossistema ---- */
.idmp-lead-centro{max-width:760px !important;width:100% !important;align-self:center !important;margin-left:auto !important;margin-right:auto !important;}
.idmp-lead-centro p{font-size:18px;line-height:1.7;}
.idmp-pilares{display:grid !important;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;max-width:1200px;margin:0 auto;}
.idmp-pilar{width:auto !important;box-shadow:inset 0 0 0 1px #E3E9F2;}
.idmp-pilar-letra .elementor-heading-title{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:14px;font:800 28px/1 Montserrat,sans-serif;background:color-mix(in srgb,currentColor 12%,transparent);}
@media (max-width:1024px){.idmp-pilares{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.idmp-pilares{grid-template-columns:1fr;}}

.idmp-area-card{box-shadow:inset 0 0 0 1px #DCE6F3;}
.idmp-area-card .elementor-icon,
.idmp-eco-card .elementor-icon{display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:14px;background:color-mix(in srgb,currentColor 13%,transparent);}

.idmp-eco-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;max-width:1080px;margin:0 auto;}
.idmp-eco-card{width:auto !important;box-shadow:inset 0 0 0 1px #E3E9F2;}
.idmp-eco-card > .idmp-eco-btn{margin-top:auto !important;}
@media (max-width:767px){.idmp-eco-grid{grid-template-columns:1fr;}}


/* ---- 1.9.9 — formulário da Lahar no Contato ---- */
.idmp-lahar-form iframe{width:100%;height:960px;border-radius:12px;}
@media (max-width:767px){.idmp-lahar-form iframe{height:1060px;}}


/* ---- 1.10.0 — formulário do CRM nas 6 macroáreas ---- */
.idmp-forma .idmp-form-card{padding:10px 24px;}
.idmp-form-crm iframe{display:block;width:100%;border:0;}
@media (max-width:1024px){.idmp-form-crm iframe{height:700px;}}
@media (max-width:767px){.idmp-forma .idmp-form-card{padding:10px 12px;}.idmp-form-crm iframe{height:760px;}}

/* ---- Depoimentos reais (doc do cliente, 21/09) ---- */
.idmp-depo-grid{display:flex;flex-wrap:wrap;gap:24px;align-items:stretch;}
.idmp-depo-grid>.idmp-depo{flex:1 1 calc(33.333% - 16px);min-width:262px;background:#FFFFFF;border:1px solid #E2E9F3;border-radius:20px;padding:34px 28px 26px;position:relative;transition:box-shadow .25s ease,transform .25s ease;}
.idmp-depo:hover{box-shadow:0 14px 34px rgba(14,60,131,.10);transform:translateY(-3px);}
.idmp-depo::before{content:"\201C";position:absolute;top:2px;left:22px;font-family:Georgia,'Times New Roman',serif;font-size:66px;line-height:1;color:#F47C20;opacity:.22;pointer-events:none;}
.idmp-depo .elementor-widget-text-editor{width:100%;}
.idmp-depo p{margin:0;}
.idmp-depo-fala{font-size:16px;line-height:1.65;color:#3C4858;margin-bottom:20px!important;}
.idmp-depo-autor{font-weight:700;font-size:15px;color:#0E3C83;}
.idmp-depo-cargo{font-size:14px;color:#6B7A90;margin-top:2px!important;}
.idmp-depo-curso{margin-top:14px!important;padding-top:12px;border-top:1px solid #EEF2F8;font-size:13px;font-weight:600;color:#F47C20;}
.idmp-depo-banda .idmp-depo-lead{color:#4A5A70;text-align:center;}
@media (max-width:1024px){.idmp-depo-grid>.idmp-depo{flex:1 1 calc(50% - 12px);}}
@media (max-width:767px){.idmp-depo-grid>.idmp-depo{flex:1 1 100%;padding:30px 22px 24px;}}
@media (prefers-reduced-motion:reduce){.idmp-depo{transition:none;}.idmp-depo:hover{transform:none;}}

.idmp-depo{display:flex;}
.idmp-depo>.elementor-widget-text-editor{flex:1 1 auto;display:flex;}
.idmp-depo>.elementor-widget-text-editor>.elementor-widget-container{display:flex;flex-direction:column;width:100%;}
.idmp-depo-curso{margin-top:auto!important;}

/* grelha: cartao orfao nao estica */
.idmp-depo-grid.e-con{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));gap:24px;align-items:stretch;}
.idmp-depo-grid>.idmp-depo{min-width:0;}


/* ---- 1.12.0 — Nossa história: linha do tempo; Metodologia de Ensino: o ciclo ---- */

/* A linha do tempo (930). O trilho é do container; a bolinha, de cada marco.
   Nada cresce no hover: o anel da bolinha engrossa, como nos cartões. */
.idmp-linha.e-con{position:relative;display:flex;flex-direction:column;gap:0;}
.idmp-linha::before{content:"";position:absolute;left:7px;top:8px;bottom:6px;width:2px;
  background:linear-gradient(180deg,#F47C20 0,#D9E3F1 12%,#D9E3F1 88%,rgba(217,227,241,0) 100%);}
.idmp-marco{position:relative;width:auto !important;max-width:none !important;
  padding:0 0 30px 34px !important;}
.idmp-marco:last-child{padding-bottom:0 !important;}
.idmp-marco::before{content:"";position:absolute;left:0;top:6px;width:16px;height:16px;border-radius:50%;
  background:#FFFFFF;box-shadow:inset 0 0 0 3px #0E3C83;transition:box-shadow .25s ease;}
.idmp-marco:hover::before{box-shadow:inset 0 0 0 5px #F47C20;}
.idmp-marco-ano{display:block;font-size:14px;font-weight:700;letter-spacing:.14em;color:#F47C20;margin-bottom:3px;}
.idmp-marco-fase{display:block;}
.idmp-marco-txt p{margin:0;}
.idmp-marco-manchete{font-weight:600;color:#0E3C83;margin:0 0 8px !important;}
.idmp-fecho{border-left:4px solid #F47C20;padding-left:24px !important;}
.idmp-fecho-assin{font-weight:700;color:#0E3C83;}
@media (max-width:767px){.idmp-marco{padding-left:28px !important;}}
@media (prefers-reduced-motion:reduce){.idmp-marco::before{transition:none;}}

/* O ciclo da metodologia (570). SVG no computador, lista numerada no telemóvel:
   sete rótulos num anel ficam ilegíveis abaixo de 600px. */
.idmp-ciclo{max-width:660px;margin:0 auto;}
.idmp-ciclo svg{display:block;width:100%;height:auto;}
.idmp-ciclo .ic-anel{fill:none;stroke:#E3EAF4;stroke-width:2;}
.idmp-ciclo .ic-seta{fill:none;stroke:#F47C20;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;}
/* Chevron aberto, não triângulo: um triângulo quase equilátero rodado 26 graus
   lê-se como «aponta para cima» e perde o sentido do ciclo. */
.idmp-ciclo .ic-pill{fill:#FFFFFF;stroke:#DCE6F3;stroke-width:1.5;}
.idmp-ciclo .ic-txt{font-family:Montserrat,-apple-system,sans-serif;font-size:17px;font-weight:600;fill:#0E3C83;text-anchor:middle;}
.idmp-ciclo .ic-miolo{fill:#F0F6FB;}
.idmp-ciclo .ic-sob{font-family:Montserrat,-apple-system,sans-serif;font-size:13px;font-weight:700;letter-spacing:.16em;fill:#F47C20;text-anchor:middle;}
.idmp-ciclo .ic-mtxt{font-family:Montserrat,-apple-system,sans-serif;font-size:19px;font-weight:700;fill:#0E3C83;text-anchor:middle;}
.idmp-ciclo-lista{display:none;margin:0;padding:0;list-style:none;counter-reset:ic;}
.idmp-ciclo-lista li{counter-increment:ic;position:relative;padding:12px 0 12px 46px;border-bottom:1px solid #EEF2F8;
  font-weight:600;color:#0E3C83;}
.idmp-ciclo-lista li:last-child{border-bottom:0;}
.idmp-ciclo-lista li::before{content:counter(ic);position:absolute;left:0;top:10px;width:30px;height:30px;border-radius:50%;
  background:#F0F6FB;color:#F47C20;font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;}
@media (max-width:600px){.idmp-ciclo svg{display:none;}.idmp-ciclo-lista{display:block;}}

/* Metodologia: os cinco traços ocupam a largura toda da banda (o padrão é 2 colunas). */
.idmp-banda .idmp-card.idmp-metodo{flex:1 1 100% !important;max-width:none;}
.idmp-metodo .elementor-icon-box-title{margin-bottom:6px;}

/* ---- 1.12.1 — a fase do marco é o título; o ano é a sobrancelha ---- */
.idmp-marco-fase{font-size:21px;font-weight:700;line-height:1.3;}
.idmp-marco-tit .elementor-heading-title{margin:0;}
.idmp-marco-txt{margin-top:2px;}
@media (max-width:767px){.idmp-marco-fase{font-size:19px;}}

/* ---- 1.12.2 — o widget do ciclo precisa de largura própria ----
   Um SVG com width:100% dentro de um pai de largura automática resolve para
   o tamanho intrínseco (300px) — o widget tem de declarar a largura. */
.idmp-ciclo{width:100%;}
.idmp-ciclo > .elementor-widget-container{width:100%;}

/* ---- 1.12.3 — o ciclo não passa de 620px ----
   O Elementor aplica max-width:100% em .e-con > .elementor-widget (0,2,0);
   a classe sozinha (0,1,0) perdia e o diagrama enchia a coluna toda. */
.e-con .idmp-ciclo.elementor-widget{max-width:620px !important;margin-left:auto;margin-right:auto;}

/* ===== 1.13.0 — IDEMPflix (368): jornada híbrida e módulos In Company, recriados das artes do cliente ===== */
.idmp-flix-sobrancelha{font:600 12px/1.2 Montserrat,sans-serif;letter-spacing:.28em;text-transform:uppercase;color:#5B6B82;margin:0 0 8px}
.idmp-flix-titulo{font:700 clamp(26px,3vw,36px)/1.15 Montserrat,sans-serif;color:#0E3C83!important;margin:0}
.idmp-flix-filete{display:block;width:56px;height:3px;border-radius:2px;background:#F47C20;margin:14px 0 16px}
.idmp-flix-linha{font:400 17px/1.55 Lato,sans-serif;color:#3D4A5C;margin:0 0 22px}

/* Jornada */
.idmp-jornada{position:relative;background:#fff;border:1px solid #E2E9F3;border-radius:20px;padding:32px;overflow:hidden}
.idmp-jornada::before{content:"";position:absolute;right:-120px;top:-120px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(244,124,32,.10),transparent 70%);pointer-events:none}
.idmp-jornada-chips{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 26px}
.idmp-chip{display:flex;align-items:center;gap:12px;border:1px solid #E2E9F3;border-radius:14px;padding:10px 16px;background:#fff}
.idmp-chip b{font:700 18px Montserrat,sans-serif;color:#16233F}
.idmp-chip span{border-left:1px solid #D5DEEA;padding-left:12px;font:400 13px/1.35 Lato,sans-serif;color:#5B6B82}
.idmp-jpassos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
.idmp-jpasso{position:relative;display:flex;flex-direction:column;border-radius:16px;background:#F0F6FB;padding:20px 18px 0;overflow:visible;transition:transform .25s,box-shadow .25s}
.idmp-jpasso:nth-child(even){background:#FFF4EA}
.idmp-jpasso:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(14,60,131,.12)}
.idmp-jpasso-n{font:700 34px/1 Montserrat,sans-serif;color:#0E3C83}
.idmp-jpasso-n::after{content:"";display:block;width:34px;height:3px;background:#F47C20;border-radius:2px;margin:10px 0 12px}
.idmp-jpasso h4{font:700 19px/1.2 Montserrat,sans-serif;color:#0E3C83 !important;margin:0 0 4px}
.idmp-jpasso p{font:400 15px/1.4 Lato,sans-serif;color:#3D4A5C;margin:0 0 16px}
.idmp-jpasso figure{margin:auto -18px 0!important;border-radius:0 0 16px 16px;overflow:hidden;aspect-ratio:16/10}
.idmp-jpasso img{width:100%;height:100%;object-fit:cover;display:block;border-radius:0!important;transition:transform .5s}
.idmp-jpasso:hover img{transform:scale(1.05)}
.idmp-jpasso:not(:last-child)::after{content:"";position:absolute;right:-21px;top:50%;width:10px;height:10px;border-top:2px solid #F47C20;border-right:2px solid #F47C20;transform:translateY(-50%) rotate(45deg)}
.idmp-jornada-lema{margin:24px 0 0;font:700 18px/1.4 Montserrat,sans-serif;color:#0E3C83}
.idmp-jornada-lema span{color:#F47C20}

/* Módulos In Company */
.idmp-modulos-topo{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 18px}
.idmp-selo{display:inline-block;font:700 13px Montserrat,sans-serif;color:#0E3C83;background:#F3EFEA;border-radius:8px;padding:6px 12px}
.idmp-selo--flix{background:#0E3C83;color:#fff}
.idmp-selo--flix em{font-style:normal;color:#F47C20}
.idmp-modulos-etapa{font:600 12px Montserrat,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#5B6B82;margin:26px 0 12px;display:flex;align-items:center;gap:10px}
.idmp-modulos-etapa::after{content:"";flex:1;height:1px;background:#E2E9F3}
.idmp-modulos{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.idmp-modulo{position:relative;min-height:190px;background:#fff;border:1px solid #E2E9F3;border-radius:16px;padding:20px 18px 64px;overflow:hidden;transition:transform .25s,box-shadow .25s,border-color .25s}
.idmp-modulo:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(14,60,131,.12);border-color:#C9D7EA}
.idmp-modulo-n{font:700 30px/1 Montserrat,sans-serif;color:#0E3C83}
.idmp-modulo-n::after{content:"";display:block;width:30px;height:3px;background:#F47C20;border-radius:2px;margin:10px 0 12px}
.idmp-modulo p{font:600 14.5px/1.4 Lato,sans-serif;color:#16233F;margin:0;position:relative;z-index:1}
.idmp-modulo::before{content:"";position:absolute;right:-34px;bottom:-34px;width:120px;height:120px;border-radius:50%;background:var(--tinta,#E8EFF9)}
.idmp-modulo i{position:absolute;right:18px;bottom:16px;color:#0E3C83}
.idmp-modulo:nth-child(3n+2){--tinta:#FFF0E3}
.idmp-modulo:nth-child(3n){--tinta:#E6F4EC}

/* Entrada ao rolar (só onde o navegador suporta; sem suporte fica visível). Usa translate, não transform, para não anular o hover. */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    .idmp-jpasso,.idmp-modulo{animation:idmp-sobe linear both;animation-timeline:view();animation-range:entry 5% cover 28%}
  }
}
@keyframes idmp-sobe{from{opacity:0;translate:0 28px}to{opacity:1;translate:none}}

@media (max-width:1024px){
  .idmp-jpassos{grid-template-columns:repeat(2,1fr)}
  .idmp-jpasso:nth-child(2)::after{display:none}
  .idmp-modulos{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:600px){
  .idmp-jornada{padding:22px 18px}
  .idmp-jpassos{grid-template-columns:1fr;gap:30px}
  .idmp-jpasso:nth-child(2)::after{display:block}
  .idmp-jpasso:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-20px;transform:translateX(-50%) rotate(135deg)}
  .idmp-modulos{grid-template-columns:1fr}
  .idmp-modulo{min-height:0}
}
/* 1.13.2 — capa do IDEMPflix: o rosto da gestora fica no terço de cima da foto */
body.page-id-368 .idmp-hero{background-position:50% 50%,50% 50%,50% 12% !important}