/* ==========================================================================
   PÁGINAS INSTITUCIONAIS
   ==========================================================================
   Arquivo:
   /css/institucional.css
========================================================================== */

/* ==================================================
   HERO INSTITUCIONAL
================================================== */
.hero-institucional{

	padding:90px 0 80px;

	background:
	linear-gradient(
		135deg,
		var(--cor-fundo),
		var(--cor-fundo-secundario)
	);

}


.hero-institucional .container{

	max-width:900px;

}


.hero-institucional h1{

	font-size:3rem;

	line-height:1.15;

	margin:20px 0;

}


.hero-institucional p{

	max-width:760px;

	font-size:1.15rem;

	line-height:1.8;

}

/* ==================================================
   SEÇÕES
================================================== */

.institucional-section{
	padding:70px 0;
}

.institucional-section:nth-child(even){
	background:var(--cor-fundo-secundario);
}

.institucional-section .container{
	max-width:1200px;
}

/* ==================================================
   SECTION HEADER
================================================== */

.institucional-section .section-header{
	margin-bottom:35px;
}

.institucional-section .section-header h2{
	margin-top:15px;
}

.institucional-section .section-header p{
	margin-top:15px;
}

/* ==================================================
   CONTEÚDO
================================================== */

.institucional-conteudo p{
	margin:0 0 22px;
	line-height:1.9;
}

.institucional-conteudo p:last-child{
	margin-bottom:0;
}

.institucional-conteudo strong{
	color:var(--cor-titulo);
}

/* ==================================================
   LISTAS
================================================== */

.institucional-conteudo ul{
	margin:25px 0;
	padding-left:22px;
}

.institucional-conteudo li{
	margin-bottom:14px;
	line-height:1.8;
}

/* ==================================================
   ÚLTIMA ATUALIZAÇÃO
================================================== */
/* ==================================================
   INSTITUCIONAL FINAL
================================================== */

.institucional-final{

    margin-top: 0px;

    padding: 24px 0;

    background:linear-gradient(
		180deg,
		rgba(225,114,83,.08) 0%,
		rgba(225,114,83,.02) 60%,
		transparent 100%
	);

}

.institucional-final .container{

    text-align:center;

}

.institucional-final p{

    margin:0;

    font-size:.70rem;

    color:var(--cor-texto-claro);

    line-height:1.6;

}

.institucional-final strong{

    color:var(--cor-destaque);

    font-weight:550;

}


/* ==================================================
   LINKS
================================================== */

.institucional-conteudo a{
	color:var(--cor-primaria);
	text-decoration:none;
	transition:color .25s ease;
}

.institucional-conteudo a:hover{
	color:var(--cor-hover);
	text-decoration:underline;
}

/* ==================================================
   ESPAÇAMENTO
================================================== */

.institucional-conteudo>*:last-child{
	margin-bottom:0;
}


/* ==================================================
   RESPONSIVO
================================================== */

@media (max-width:768px){

	.hero-institucional{
		padding:60px 0 45px;
	}

	.institucional-section{
		padding:50px 0;
	}

	.hero-institucional p,
	.institucional-conteudo p,
	.institucional-conteudo li{
		font-size:.97rem;
		line-height:1.75;
	}

}


/* ==================================================
   ODONTOLOGIA CASULO
   COMPONENTES ESPECÍFICOS
================================================== */


/* ==================================================
   RESPONSÁVEL TÉCNICA
================================================== */

.profile-layout{

	display:grid;
	grid-template-columns:320px 1fr;
	gap:50px;
	align-items:center;

}


.profile-image img{

	width:100%;
	height:auto;
	display:block;
	border-radius:12px;

}



.profile-content-subtitle{

	font-weight:600;
	color:var(--cor-primaria);
	margin-bottom:20px;

}



/* ==================================================
   CARDS GENÉRICOS
================================================== */

.cards-grid{

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

}



.info-card{

	padding:30px;
	background:var(--cor-fundo-secundario);
	border:1px solid var(--cor-borda);
	border-radius:12px;

}



.info-card-icon{

	width:50px;
	height:50px;
	display:flex;
	align-items:center;
	justify-content:center;
	margin-bottom:20px;
	font-size:1.4rem;
	color:var(--cor-primaria);

}



.info-card h3{

	margin-bottom:15px;

}



.info-card p{

	line-height:1.7;

}



/* ==================================================
   ÁREAS DE ATUAÇÃO
================================================== */

.feature-grid{

	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:25px;

}



.feature-card{

	display:flex;
	gap:20px;
	padding:25px;
	background:var(--cor-fundo-secundario);
	border:1px solid var(--cor-borda);
	border-radius:12px;

}



.feature-icon{

	min-width:45px;
	height:45px;
	display:flex;
	align-items:center;
	justify-content:center;
	color:var(--cor-primaria);
	font-size:1.3rem;

}



.feature-card h3{

	margin-bottom:10px;

}



.feature-card p{

	line-height:1.7;
	margin:0;

}



/* ==================================================
   BLOCO MÍDIA
================================================== */

.media-layout{

	display:grid;
	grid-template-columns:1fr 1fr;
	gap:45px;
	align-items:center;

}



.media-image img{

	width:100%;
	height:auto;
	display:block;
	border-radius:12px;

}



.media-content p{

	line-height:1.8;
	margin-bottom:22px;

}



/* ==================================================
   CTA INSTITUCIONAL
================================================== */

.institucional-cta{

	padding:70px 0;
	text-align:center;
	background:var(--cor-fundo);

}



.institucional-cta h2{

	margin-bottom:20px;

}



.institucional-cta p{

	max-width:700px;
	margin:0 auto 30px;
	line-height:1.8;

}





/* ==================================================
   RESPONSIVO - ODONTOLOGIA CASULO
================================================== */

@media(max-width:768px){


	.profile-layout{

		grid-template-columns:1fr;
		gap:30px;

	}


	.cards-grid{

		grid-template-columns:1fr;

	}



	.feature-grid{

		grid-template-columns:1fr;

	}



	.feature-card{

		padding:20px;

	}



	.media-layout{

		grid-template-columns:1fr;
		gap:30px;

	}



}