/* Home — "Tudo em um só lugar" (recursos da plataforma).
   Identidade visual Mentorar v1.0 (2026). Variáveis --mentorar-* no style.css. */

.mtr-recursos {
	clear: both;
	width: 100%;
	box-sizing: border-box;
	/* continua o fundo claro em que a seção anterior termina */
	background: linear-gradient(180deg, #F7F9FD 0%, #fff 100%);
	padding: 16px 0 80px;
	font-family: Montserrat, Arial, sans-serif;
	color: var(--mentorar-texto);
}

.mtr-recursos__container {
	max-width: 1180px;
	margin: 0 auto;
	padding: 0 20px;
}

/* ---- Cabeçalho ---- */
.mtr-recursos__cabecalho { margin-bottom: 28px; }
.mtr-recursos .mtr-recursos__titulo {
	margin: 0 0 8px;
	font-family: Poppins, Arial, sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 2.6vw, 36px);
	line-height: 1.15;
	letter-spacing: -.015em;
	color: var(--mentorar-profundo);
}
.mtr-recursos .mtr-recursos__subtitulo {
	margin: 0;
	font-size: 17px;
	line-height: 1.5;
}

/* ---- Cartões ---- */
.mtr-recursos .mtr-recursos__lista {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.mtr-recursos__item {
	margin: 0;
	padding: 26px 16px 24px;
	border-radius: 16px;
	background: linear-gradient(180deg, #F5F8FD 0%, #EEF4FC 100%);
	box-shadow: inset 0 0 0 1px rgba(4, 112, 191, .07);
	text-align: center;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.mtr-recursos__item:hover {
	transform: translateY(-4px);
	box-shadow: inset 0 0 0 1px rgba(4, 112, 191, .12), 0 18px 36px -24px rgba(2, 26, 75, .45);
}

.mtr-recursos__icone {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	margin: 0 auto 14px;
	border-radius: 50%;
	background: #fff;
	color: var(--mentorar-azul);
	box-shadow: 0 6px 16px -10px rgba(4, 112, 191, .6);
	transition: background-color .2s ease, color .2s ease;
}
.mtr-recursos__icone svg { width: 26px; height: 26px; }
/* ao passar o mouse: círculo azul, ícone branco e um leve pulo */
.mtr-recursos__item:hover .mtr-recursos__icone {
	background: var(--mentorar-azul);
	color: #fff;
}
.mtr-recursos__item:hover .mtr-recursos__icone svg {
	animation: mtr-recursos-pulo .5s ease;
}
@keyframes mtr-recursos-pulo {
	40% { transform: translateY(-4px); }
	70% { transform: translateY(1px); }
}

.mtr-recursos .mtr-recursos__nome {
	margin: 0 0 8px;
	font-family: Poppins, Arial, sans-serif;
	font-weight: 600;
	font-size: 16px;
	line-height: 1.3;
	color: var(--mentorar-profundo);
}
.mtr-recursos .mtr-recursos__texto {
	margin: 0;
	font-size: 13px;
	line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
	.mtr-recursos__item,
	.mtr-recursos__icone { transition: none; }
	.mtr-recursos__item:hover .mtr-recursos__icone svg { animation: none; }
}

/* ---- Tablet: 3 por linha ---- */
@media (max-width: 1099px) {
	.mtr-recursos .mtr-recursos__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---- Celular: 2 por linha ---- */
@media (max-width: 639px) {
	.mtr-recursos { padding: 8px 0 56px; }
	.mtr-recursos .mtr-recursos__subtitulo { font-size: 16px; }
	.mtr-recursos .mtr-recursos__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
	.mtr-recursos__item { padding: 20px 12px; }
	.mtr-recursos__icone { width: 48px; height: 48px; }
	.mtr-recursos__icone svg { width: 22px; height: 22px; }
	.mtr-recursos .mtr-recursos__nome { font-size: 15px; }
}

/* ---- Seções antigas da Home substituídas pelas novas ----
   Conteúdo do construtor do tema (Muffin Builder), só escondido: nada é
   apagado, e para voltar a mostrar basta tirar a linha correspondente.
   Cada seletor tem uma "trava" para não pegar outra seção se a página mudar. */
/* "Plataforma Mentorar para Programas de Mentoria": 1ª seção, só texto */
.home #Content .entry-content > .mcb-section:first-child:not(:has(img, a)),
/* "Conheça Mais": a única com o link da demonstração e sem imagens */
.home #Content .mcb-section:has(a[href*="demonstracao.mentorar.com.br"]):not(:has(img)),
/* "A quem se destina essa rede?" (4 ilustrações). No ar, as imagens vêm com
   data-src (carregamento sob demanda); no local, com src. */
.home #Content .mcb-section:has(img[src*="/2016/03/Parcerias3.png"]),
.home #Content .mcb-section:has(img[data-src*="/2016/03/Parcerias3.png"]),
/* "Contatos" (fundo azul claro): a única "full-width" com o ícone do WhatsApp
   e sem formulário ("Entre em Contato", mais abaixo, tem formulário e fica) */
.home #Content .mcb-section.full-width:has(img[src*="/images/zap.png"]):not(:has(form)),
.home #Content .mcb-section.full-width:has(img[data-src*="/images/zap.png"]):not(:has(form)),
/* "O que podemos fazer por você?" (imagem da escada) */
.home #Content .mcb-section:has(img[src*="/2020/02/escada.png"]),
.home #Content .mcb-section:has(img[data-src*="/2020/02/escada.png"]),
/* vídeo + botão "Conheça a Plataforma Mentorar" + os 4 benefícios com
   hexágonos: é a única seção com vídeo */
.home #Content .mcb-section:has(.column_video),
/* linha "Suporte Técnico: (35) 99880-2224" do "Entre em Contato" */
.home #Content h4:has(a[href*="5535998802224"]) {
	display: none;
}
