/*
Theme Name: ATIvales
Theme URI: https://ativales.com.br
Template: hello-elementor
Author: Respira Comunicação
Author URI: https://respiracomunicacao.com.br
Description: Desenvolvido pela agência Respira, o site institucional da ATIvales foi projetado para oferecer uma experiência moderna, intuitiva e totalmente responsiva. O layout adapta-se perfeitamente a diferentes dispositivos, garantindo navegação fluida em desktops, tablets e smartphones.
Tags: site institucional, responsivo, elementor, menu horizontal, design moderno, wordpress, agência respira, ativales, layout profissional, web design, interface intuitiva, navegação otimizada, desenvolvimento web, presença digital, experiência do usuário, ux ui, site corporativo
Version: 1.0.5
Updated: 2026-03-17
*/

#cookieadmin_notice,
.cookieadmin_consent_btns > * {
	font-size: 13px;
}

.filtro-btn,
.card-associado h3,
.card-associado a,
.card-associado p,
.evento-content h3,
.evento-content p,
.evento-content div,
.evento-content span,
#cookieadmin_notice,
.cookieadmin_consent_btns > * {
	font-family: var( --e-global-typography-text-font-family ), Sans-serif;
}

.cookieadmin_re_consent {
	display: none;
}

/* associados */

.filtro-categorias {
    text-align: center;
    margin-bottom: 40px;
}

.filtro-btn {
	font-weight: 500;
	font-size: 15px;
    background: var( --e-global-color-accent );
    color: white;
    border: none;
    padding: 4px 16px;
    margin: 5px;
    border-radius: 10px;
    cursor: pointer;
}

.filtro-btn:hover {
	background: var(--e-global-color-secondary);
}
.filtro-btn.active {
    background: var(--e-global-color-c0170f1);
}

.grid-associados {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.card-associado {
    border: 1px solid #ddd;
    padding: 20px;
    text-align: center;
    border-radius: 28px;
    transition: all 0.3s ease;
}

.card-associado:hover {
	/*transform: translateY(-1%);*/
	box-shadow: 1px 3px 10px rgba(0,0,0,0.2);
}

.card-associado .nome {
	min-height: 60px;
	margin: 10px auto;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-transform: uppercase;
}

.evento-content h3,
.card-associado h3 {
	font-weight: 600;
	font-size: 18px;
	line-height: 28px;
	color: var(--e-global-color-primary);
	margin: 0;
}

.card-associado a {
	color: var(--e-global-color-text);
	transition: all 0.3s ease;
}

.card-associado a:hover {
	color: var(--e-global-color-secondary);
}

.card-associado p {
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
}

.card-associado img {
    max-width: 200px;
    height: auto;
}

@media (max-width: 992px) {
    .grid-associados {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .grid-associados {
        grid-template-columns: 1fr;
    }
}

/* eventos */
.eventos-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
}

.evento-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
	border: 1px solid var( --e-global-color-primary );
    box-shadow: 0 10px 25px rgba(0,0,0,0.08);
    transition: 0.3s ease;
}

.evento-card:hover {
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

.evento-img img {
    width: 100%;
    height: 260px;
    object-fit: cover;
}

.evento-content {
    padding: 25px;
}

.evento-meta {
    display: flex;
    flex-direction: column;
    gap: 5px;
    font-size: 16px;
	line-height: 24px;
    color: #6b7280;
    margin: 15px 0;
}

.evento-btn {
    display: block;
    background: #f5b400;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 600;
	text-align: center;
    text-decoration: none;
    color: #000;
    transition: 0.3s;
}

.evento-btn:hover {
    background: #d89c00;
}

@media (max-width: 768px) {
    .eventos-grid {
        grid-template-columns: 1fr;
    }
}