/*------------------------------------------------------------------
Project:	André Carneiro Nutri
Version:	0.3
Last change:	06/10/2025
Assigned to:	www.filipegribeiro.com 
Note: Later this project will be a React project with SOLID principles.
-------------------------------------------------------------------*/

/*------------------------------------------------------------------

01. General Setting
02. Navigation
03. Hero Section
04. About Section (Desktop)
05. Services Section
06. Testimonials Section
07. Appointment Section
08. ContactMe Section
09. Footer Section 
10. Responsive Media Querries
11. Acessibilidade
12. eBooks and Lectures Section
13. Curriculum Page Styles

-------------------------------------------------------------------*/

/*--------------------------------------------------
	01. General Settings
---------------------------------------------------*/

/* variables */

:root {
	/* colors */
	--main-color: #e9d699;
	--secondary-color: #185058;
	--hover-color: #092b30;
	--background-primary: #8aaeb4;
	--text-color-dark: #185058;
	--text-color-main: #ebca5d;
	--background-secondary: #fefae0;
	--paragraph-apresentation: #f0f0f0;

	--accent-color: #c97c5d; /* Tom terroso alaranjado para criar contrastes elegantes e destacar CTAs */
	--highlight-color: #eccbaf; /* Tom pastel suave para destacar secções ou áreas importantes */
	--button-primary: #d1b276; /* Cor de destaque para botões, complementa o tom principal */
	--button-hover-secondary: #146b6e; /* Uma variação mais vibrante do secondary-color para hover */
	--neutral-light: #e4e1d3; /* Tom neutro claro para fundos ou seções que precisem de separação suave */
	--neutral-dark: #3a4d4b; /* Tom escuro neutro que harmoniza bem com os azuis e verdes da paleta */
	--success-color: #78a678; /* Verde claro que combina bem para indicar sucesso ou confirmações */
	--warning-color: #e89b3e; /* Um tom de laranja queimado para chamar a atenção, como para alertas */
	--link-color: #247b83; /* Azul-esverdeado mais vibrante, ideal para links */

	/* Typography Variables */
	--button-font-size: 0.618rem;
	--button-font-size-mobile: 0.5rem;
	--button-padding: 0.875rem 3.275rem;
	--button-padding-mobile: 0.75rem 2.5rem;
	--button-font-weight: 700;
	--button-letter-spacing: 1px;
	--button-text-transform: uppercase;
}

/* fonts */

@font-face {
	font-family: 'Avenir Black';
	src: url('/font/AvenirLTStd-Black.otf') format('opentype');
	font-display: swap;
}

@font-face {
	font-family: 'Avenir Book';
	src: url('/font/AvenirLTStd-Book.otf') format('opentype');
	font-display: swap;
}

@font-face {
	font-family: 'Avenir Roman';
	src: url('/font/AvenirLTStd-Roman.otf') format('opentype');
	font-display: swap;
}

/************************* RESET ***********************************/

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	/* border: 1px solid orangered; */
}

a {
	text-decoration: none;
}

ul {
	list-style-type: none;
}

img {
	display: block !important;
}

main {
	display: block !important;
}

h1,
h2,
h3 {
	font-family: 'Avenir Black', sans-serif;
}

p,
a {
	font-family: 'Avenir Roman', sans-serif;
}

/* general settings */

html {
	scroll-behavior: smooth;
}

@media (max-width: 1075px) {
	html {
		font-size: 15px;
		font-weight: bold;
	}
}

@media (max-width: 991px) {
	html {
		font-size: 14px;
		font-weight: bold;
	}
}

@media (max-width: 940px) {
	html {
		font-size: 13px;
		font-weight: bold;
	}
}

@media (max-width: 860px) {
	html {
		font-size: 12px;
		font-weight: bold;
	}
}

@media (max-width: 768px) {
	html {
		font-size: 11px;
		font-weight: bold;
	}
}

@media (max-width: 480px) {
	html {
		font-size: 10px;
		font-weight: bold;
	}
}

body {
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	font-family: 'Avenir Book', sans-serif;
}

/* reusable css classes */

.container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 2rem;
}

@media (max-width: 480px) {
	.container {
		padding: 0 1rem;
	}
}

/*--------------------------------------------------
	02. Navigation
---------------------------------------------------*/

.header {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	box-sizing: border-box;
	height: 70px;
	padding: 2.5rem;
	background: var(--secondary-color);
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 100;
}

.header::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(to right, var(--main-color), var(--text-color-main), var(--main-color));
}

/* .logo {
	font-size: 2.5rem;
	font-weight: bold;
} */

.logo {
	display: inline-block;
}

.logo img {
	max-width: 110px; /* Ajustar conforme o tamanho desejado do logo */
	/* height: auto; */
	transition: transform 0.3s ease-in-out; /* Transição suave ao passar o cursor */
}

.logo img:hover {
	transform: scale(1.05); /* Aumentar ligeiramente ao passar o cursor */
}

a {
	color: white;
	font-weight: var(--button-font-weight);
	transition: all 0.3s ease;
}

a:hover {
	color: var(--text-color-main);
	border-radius: 2px;
}

/* verificar neste ponto abaixo para o tamanho das âncoras */

.nav,
.navbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1rem;
}

/* menu hamburger starts */

#webapp_cover {
	display: none;
}

@media (max-width: 767px) {
	/* body {
		overflow-x: hidden;
	} */

	.navbar {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-between;
		position: fixed;
		width: 50%;
		height: 100%;
		top: 69px;
		right: 0;
		background: var(--secondary-color);
		border: var(--text-color-main) solid 2px;
		font-size: 2rem;
		font-weight: bold;
		padding: 10rem 1rem;
		transition: all 1s ease;
		z-index: 10;
		transform: translateX(100%);
	}

	.navbar.active {
		transform: translateX(0);
	}
}

@media (max-width: 767px) {
	#webapp_cover {
		position: absolute;
		display: block;
		top: 2.75rem;
		right: 4rem;
		left: auto;
		width: 39px;
		margin: 0 auto;
		color: White;
		transform: translateY(-50%) scale(1);
	}

	#webapp_cover:hover {
		cursor: pointer;
		color: var(--text-color-main);
		opacity: 1;
	}
}

#menu_button {
	width: 39px;
	overflow: hidden;
}

#menu_checkbox {
	display: none;
}

#menu_label {
	position: relative;
	display: block;
	height: 29px;
	cursor: pointer;
}

#menu_label:before,
#menu_label:after,
#menu_text_bar {
	position: absolute;
	left: 0;
	width: 100%;
	height: 5px;
	background-color: #fff;
}

#menu_label:before,
#menu_label:after {
	content: '';
	transition: 0.4s cubic-bezier(0.68, -0.55, 0.27, 1.55) left;
}

#menu_label:before {
	top: 0;
}

#menu_label:after {
	top: 12px;
}

#menu_text_bar {
	top: 24px;
}

#menu_text_bar:before {
	content: 'MENU';
	position: absolute;
	top: 5px;
	right: 0;
	left: 0;
	font-size: 12px;
	font-weight: bold;
	font-family: 'Bambino Thin';
	text-align: center;
}

#menu_checkbox:checked + #menu_label:before {
	left: -39px;
}

#menu_checkbox:checked + #menu_label:after {
	left: 39px;
}

#menu_checkbox:checked + #menu_label #menu_text_bar:before {
	animation: moveUpThenDown 0.8s ease 0.2s forwards, shakeWhileMovingUp 0.8s ease 0.2s forwards, shakeWhileMovingDown 0.2s ease 0.8s forwards;
}

@keyframes moveUpThenDown {
	0% {
		top: 0;
	}
	50% {
		top: -27px;
	}
	100% {
		top: -14px;
	}
}

@keyframes shakeWhileMovingUp {
	0% {
		transform: rotateZ(0);
	}
	25% {
		transform: rotateZ(-10deg);
	}
	50% {
		transform: rotateZ(0deg);
	}
	75% {
		transform: rotateZ(10deg);
	}
	100% {
		transform: rotateZ(0);
	}
}

@keyframes shakeWhileMovingDown {
	0% {
		transform: rotateZ(0);
	}
	80% {
		transform: rotateZ(3deg);
	}
	90% {
		transform: rotateZ(-3deg);
	}
	100% {
		transform: rotateZ(0);
	}
}

/* menu hamburger ends */

/*--------------------------------------------------
	03. Hero Section
---------------------------------------------------*/

.hero {
	position: relative;
	height: 100vh;
	margin-top: 75px;
	background-position: right;
	display: flex;
	align-items: center;
}

@media (max-width: 800px) {
	.hero {
		/* height: 100%; */
		width: 100%;
		margin-top: 70px;
	}
}

.slider {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.slider__item {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	transition: opacity 1s ease-in-out;
}

.slider__item.active {
	opacity: 1;
}

/* TODO Aqui acontece a animação do cartão Home com o transform */

.slider__item.active .slider__content {
	opacity: 1;
	transform: translateX(648px);
	transition: all 1s ease-in-out 300ms;
}

.slider__item.active .slider__content:hover {
	background-color: transparent;
	transition: none;
	transition: opacity 2s ease-in-out;
}

.slider__item:nth-child(1) {
	background: url('/imgs/webp/DSC00644.webp') no-repeat center top/cover;
	background-size: cover;
}

.slider__item:nth-child(2) {
	background: url('/imgs/visao-plana-de-alimentos-saudaveis-que-aumentam-a-imunidade.jpg') no-repeat center top/cover;
}

.slider__item:nth-child(3) {
	background: url('/imgs/DSC00631.jpg') no-repeat center top/cover;
}

.slider__item:nth-child(4) {
	background: url('/imgs/DSC00636.jpg') no-repeat center top/cover;
}

.slider__item:nth-child(5) {
	background: url('/imgs/ebook-back-crop-woman-with-tablet-red-cover.jpg') no-repeat center top/cover;
}

.slider__item:nth-child(6) {
	background: url('/imgs/IG-post_03\ copy\ \(1\).jpg') no-repeat center top/cover;
}

.slider__content {
	position: absolute;
	bottom: 110px;
	left: -600px;
	opacity: 0;
	width: 600px;
	padding: 2rem;
	z-index: 10;
	transition: opacity 0.5s ease-in-out;
	/* background-color: transparent; */
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente */
	backdrop-filter: blur(10px); /* Efeito de desfoque */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave */
	border-radius: 10px;
	border: #185058 solid 2px;
}

.slider__content:hover {
	background-color: transparent;
	transition: none;
	transition: opacity 0.5s ease-in-out;
}

.slider__content h2 {
	/* padding-top: 2.5rem; */
	font-size: 26px;
	font-weight: 700;
	color: var(--hover-color);
	margin: 0.5rem 0 1rem;
}

.slider__content h3 {
	position: relative;
	font-size: 20px;
	font-weight: 900;
	color: var(--text-color-dark);
	margin: 10px 0 20px;
}

.slider__content p {
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 5px;
	text-transform: uppercase;
}

.slider__content p:hover {
	color: var(--paragraph-apresentation);
	transition: 1s;
}

.slider__content span {
	font-size: 24px;
	color: var(--paragraph-apresentation);
}

.slider__content a {
	display: inline-block;
	color: var(--secondary-color);
	font-weight: var(--button-font-weight);
	letter-spacing: var(--button-letter-spacing);
	font-size: var(--button-font-size);
	text-transform: var(--button-text-transform);
	padding: var(--button-padding);
	text-decoration: none;
	border: solid var(--secondary-color) 2px;
	border-radius: 5px;
	cursor: pointer;
	transition: all 0.3s ease;
}

.slider__content a:hover {
	color: var(--paragraph-apresentation);
	background-color: var(--hover-color);
	border: solid var(--background-primary) 2px;
	transform: scale(1.05);
}

.btn_especialidade p {
	text-align: center;
	font-size: var(--button-font-size);
	font-weight: var(--button-font-weight);
	color: var(--hover-color);
	letter-spacing: var(--button-letter-spacing);
	text-transform: var(--button-text-transform);
}

.btn_especialidade p:hover {
	color: var(--paragraph-apresentation);
	transition: 1s;
}

/* Botões do Slider - Mobile First */
.slider__btns {
	position: absolute;
	bottom: 20px;
	left: 85%;
	transform: translateX(-50%);
	display: flex;
	gap: 1rem;
}

.slider-btn {
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente */
	backdrop-filter: blur(10px); /* Efeito de desfoque */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave */
	/* border-radius: 10px; */
	border: #185058 solid 2px;
	color: var(--hover-color);
	border: none;
	padding: 0.75rem;
	border-radius: 50%;
	cursor: pointer;
	transition: background-color 0.3s ease, transform 0.3s ease;
}

.slider-btn i {
	font-size: 1.5rem;
}

.slider-btn:hover {
	color: var(--text-color-dark);
	color: var(--text-color-main);
	background-color: var(--hover-color);
	border: solid var(--background-primary) 2px;
	transition: 1s;
	transform: scale(1.05);
	cursor: pointer;
}

.btns__wrapper {
	position: absolute;
	z-index: 100;
	bottom: 80px;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

/*--------------------------------------------------
	04. About Section
---------------------------------------------------*/

.about {
	height: 100vh;
	background: url(/imgs/webp/WhatsApp-Image-2025-03-10-at-00.00.28-_4_.webp) no-repeat center top/cover;
	display: flex;
	align-items: center;
	padding: 0 10%;
	margin-top: 4.5rem;
	/* padding: 2rem 1rem; */
}

.about-content {
	position: absolute;
	max-width: 600px;
	bottom: 150px;
	left: -600px;
	/* opacity: 0; */
	opacity: 1;
	padding: 2rem;
	z-index: 10;
	margin-top: 6rem;
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente */
	backdrop-filter: blur(10px); /* Efeito de desfoque */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave */
	border: #185058 solid 2px;
	border-radius: 10px;
	padding: 1rem;
	transform: translateX(648px);
	transition: all 1s ease-in-out 300ms;
}

.about__content:hover {
	background-color: transparent;
	transition: none;
	transition: opacity 0.5s ease-in-out;
}

/* AQUI ESTÁ UM FORMATO ERRADO DE TRANSIÇÃO MAS PODES REFORMULAR E APLICAR A TODAS AS TAGS!! */

/* .about-content:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0.7) 60%, rgba(0, 0, 0, 0) 92%);
	background: transparent;
	animation: showRight 1s ease forwards;
	animation-delay: 1.3s;
} */

.about-content h2 {
	position: relative;
	font-size: 26px;
	font-weight: 700;
	color: var(--secondary-color);
}

.about-content h3 {
	position: relative;
	text-align: center;
	font-size: 20px;
	font-weight: 900;
	color: var(--neutral-dark);
	margin: 10px 0 20px;
}

.about-content h4 {
	position: relative;
	text-align: center;
	font-size: 16px;
	font-weight: 900;
	color: var(--hover-color);
	margin-bottom: 2rem;
}

.about p {
	position: relative;
	font-size: 16px;
	font-weight: 900;
	text-align: center;
	color: var(--hover-color);
	margin: 20px 0 40px;
}

.btn-box {
	display: flex;
	justify-content: center;
	width: auto;
	gap: 30px;
	height: 50px;
}

/* .btn-box:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	animation: showRight 1s ease forwards;
	animation-delay: 1.9s;
	z-index: 2;
} */

.btn-box a {
	display: flex;
	justify-content: center;
	align-items: center;
	color: var(--secondary-color);
	max-width: 200px;
	font-weight: 700;
	letter-spacing: 1px;
	font-size: 0.618rem;
	text-transform: uppercase;
	padding: 0.875rem 3.275rem;
	font-weight: bold;
	text-decoration: none;
	border: solid var(--secondary-color) 2px;
	border-radius: 5px;
	cursor: pointer;
}

.btn-box a:hover {
	background-color: var(--hover-color);
	color: var(--paragraph-apresentation);
	border: solid var(--background-primary) 2px;
	transition: 1s;
	transform: scale(1.05);
	cursor: pointer;
}

.btn-box p {
	text-align: center;
	font-size: 10px;
	font-weight: 700;
	color: var(--link-color);
	letter-spacing: 5px;
	text-transform: uppercase;
}

a:nth-child(2):hover {
	color: var(--paragraph-apresentation);
	border: 2px solid var(--background-primary);
}

a:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 100%;
	z-index: -1;
	transition: 0.5s;
}

a:hover::before {
	width: 100%;
}

/* KEYFRAMES ANIMATION */
@keyframes showRight {
	100% {
		width: 0;
	}
}

/*--------------------------------------------------
    05. Services Section (Desktop)
---------------------------------------------------*/
.services {
	background: url('/imgs/vista-superior-de-alimentos-que-aumentam-a-imunidade-para-um-estilo-de-vida-saudavel.jpg') no-repeat center top/cover;
	height: 145vh;
	margin-top: 4.5rem;
	padding: 2rem 1rem;
}

/* Estilo dos Cartões na Secção Serviços */
.service-card {
	position: relative;
	margin: 1rem auto;
	max-width: 600px; /* Largura máxima */
	padding: 2rem; /* Padronizado com card inicial */
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente - Padronizado */
	backdrop-filter: blur(10px); /* Efeito de desfoque - Padronizado */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave - Padronizado */
	border-radius: 10px; /* Bordas arredondadas - Padronizado */
	border: #185058 solid 2px; /* Borda - Padronizado */
	text-align: left; /* Alinhamento do texto */
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Animação de hover */
.service-card:hover {
	transform: translateY(-10px); /* Levanta o cartão */
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.4); /* Sombra mais forte */
}

.services h2 {
	margin-top: 3rem; /* Adiciona espaço acima */
	margin-bottom: 2rem; /* Espaço entre o título e os cartões */
	font-size: 2.5rem; /* Tamanho para desktop */
	text-align: center;
}

/* Títulos dos cartões */
.service-card h3 {
	color: var(--text-color-dark); /* Cor do título - Padronizado */
	text-align: center;
	font-size: 20px; /* Padronizado com card inicial */
	font-weight: 900; /* Padronizado com card inicial */
	margin-bottom: 1rem;
}

/* Conteúdo do texto */
.service-card p {
	color: var(--hover-color);
	text-align: center;
	font-weight: 700; /* Padronizado com card inicial */
	font-size: 16px; /* Padronizado com card inicial */
	line-height: 1.5;
}

/* Botão "Saiba Mais" */
.service-card button {
	display: inline-block;
	color: var(--secondary-color);
	letter-spacing: var(--button-letter-spacing);
	font-size: var(--button-font-size);
	text-transform: var(--button-text-transform);
	font-weight: var(--button-font-weight);
	cursor: pointer;
	padding: var(--button-padding);
	text-decoration: none;
	border: solid var(--secondary-color) 2px;
	border-radius: 5px;
	background: transparent;
	transition: all 0.3s ease;
}

.service-card button:hover {
	color: var(--paragraph-apresentation);
	background-color: var(--hover-color);
	border: solid var(--background-primary) 2px;
	transform: scale(1.05);
}

/* Wrapper para centralizar o botão */
.service-card .button-wrapper {
	display: flex;
	justify-content: center;
	margin-top: 1.5rem;
}

/* Layout desktop */
.services-container {
	display: flex;
	flex-wrap: wrap;
	margin-top: 4rem;
	gap: 1.5rem;
	justify-content: center;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 2rem;
}

.service-card {
	flex: 0 1 calc(33.333% - 2rem); /* Três cartões por linha */
	min-width: 280px;
	max-width: 350px;
}

/* Ajuste para telas maiores */
@media (min-width: 1200px) {
	.services-container {
		gap: 2rem;
	}

	.service-card {
		flex: 0 1 calc(33.333% - 2.5rem);
	}
}

/* Ajuste para telas médias */
@media (max-width: 992px) {
	.services-container {
		gap: 1rem;
	}

	.service-card {
		flex: 0 1 calc(50% - 1rem);
	}
}

/* Ajuste para mobile */
@media (max-width: 767px) {
	.services-container {
		margin-top: 2rem;
		padding: 0 1rem;
	}

	.service-card {
		flex: 0 1 100%;
		margin: 0.5rem 0;
	}
}

/*--------------------------------------------------
	06. Testimonials Section
---------------------------------------------------*/
/* Geral da Secção de Testemunhos */
.testimonials {
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
	border-radius: 10px;
	border: #185058 solid 2px;
	text-align: left;
	max-width: 1200px;
	margin: 4rem auto 2rem;
	padding: 2rem;
}

.testimonials h2 {
	text-align: center;
	font-weight: 900;
	font-size: 26px;
	margin-bottom: 2rem;
	color: var(--hover-color);
}

/* Carousel */
.carousel {
	display: flex;
	overflow: hidden;
	margin-top: 2rem;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	flex-wrap: nowrap;
	position: relative;
	transition: transform 0.5s ease-in-out;
}

@media (max-width: 767px) {
	.testimonials {
		margin: 2rem 1rem;
		padding: 1rem;
	}

	.carousel {
		margin-top: 1rem;
	}
}

/* Grupo de slides - Esconder todos inicialmente */
.testimonial-slide-group {
	/* display: none; */
	gap: 2rem; /* Espaçamento entre os dois slides no grupo */
	flex-shrink: 0;
	width: 100%;
	max-width: 100%;
	transition: opacity 1s ease-in-out;
}

/* Grupo de slides - Esconder todos inicialmente */
.testimonial-slide-group {
	display: none;
	gap: 2rem; /* Espaçamento entre os dois slides no grupo */
}

/* Garantir que o grupo ativo fique visível */
.testimonial-slide-group.active {
	display: flex;
	opacity: 1;
	transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
}

/* Cada slide de testemunho */
.testimonial-slide {
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente - Padronizado */
	backdrop-filter: blur(10px); /* Efeito de desfoque - Padronizado */
	border: #185058 solid 2px; /* Padronizado com card inicial */
	color: white;
	padding: 2rem; /* Padronizado com card inicial */
	border-radius: 10px; /* Padronizado com card inicial */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Padronizado com card inicial */
	width: 100%;
	transition: color 0.3s ease;
}

/* Testemunho: Coluna com conteúdo */
.testimonial-content {
	text-align: left;
}

.testimonial-content h3 {
	font-size: 20px; /* Padronizado com card inicial */
	text-align: center;
	margin-bottom: 0.5rem;
	color: var(--text-color-dark); /* Padronizado com card inicial */
	font-weight: 900; /* Padronizado com card inicial */
}

.testimonial-content p {
	text-align: center;
	font-size: 16px; /* Padronizado com card inicial */
	margin-bottom: 1rem;
	color: var(--hover-color);
	font-weight: 700; /* Padronizado com card inicial */
}

.rating {
	font-size: 1rem;
	text-align: center;
}

/* Testemunho: Coluna com cliente */
.client-info {
	display: flex;
	/* flex-direction: row; */
	flex-direction: column;
	align-items: center;
	/* justify-content: center; */
	margin-left: 1rem;
}

.client-info img {
	width: 60px;
	height: 60px;
	border-radius: 50%;
	margin-bottom: 0.5rem;
}

.client-details h3 {
	font-size: 16px;
	color: var(--link-color);
	text-align: center;
}

.client-details p {
	font-size: 12px;
	text-align: center;
	color: var(--text-color-dark);
}

/* Controlos do Carousel */
.carousel-controls {
	margin-top: 1.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2rem;
	/* position: relative; */
	width: 100%;
}

/* Bolinhas do Carousel */
.indicator {
	width: 10px;
	height: 10px;
	background-color: #f0f0f0;
	border-radius: 50%;
	cursor: pointer;
}

.indicator.active {
	background-color: var(--warning-color); /* Cor da bolinha ativa */
}

.carousel-indicators {
	/* display: flex;
	gap: 0.5rem;
	justify-content: center;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	bottom: -1rem; */ /* Ajustar para não se sobrepor ao conteúdo */

	display: flex;
	justify-content: center;
	gap: 0.5rem;
}

/* Setas do Carousel */
.carousel-arrows {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 2rem;
	margin-top: 1.5rem;
	/* position: relative; */
	width: 100%;
	gap: 1rem;
	transform: scale(1.1);
}

.arrow-left,
.arrow-right {
	width: 40px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #092b30; /* Cor do fundo */
	color: #8aaeb4; /* Cor da seta */
	border-radius: 50%;
	cursor: pointer;
	font-size: 1.2rem;
}

/*--------------------------------------------------
	07. Appointment Section
---------------------------------------------------*/

/*--------------------------------------------------
	08. ContactMe Section
---------------------------------------------------*/

.contact-hero {
	background: url('/imgs/webp/WhatsApp-Image-2025-03-10-at-00.00.28-_4_.webp') no-repeat center center/cover;
	min-height: 100vh;
	margin-top: 70px;
	padding: 2rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-content {
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
	border-radius: 10px;
	border: var(--secondary-color) solid 2px;
	padding: 2rem;
	max-width: 600px;
	width: 100%;
	margin: 0 auto;
	text-align: center;
}

.contact-content h2 {
	color: var(--hover-color);
	font-size: 2rem;
	margin-bottom: 1rem;
}

.contact-content h3 {
	color: var(--text-color-dark);
	font-size: 1.5rem;
	margin-bottom: 1rem;
}

.contact-content p {
	color: var(--hover-color);
	font-size: 1.1rem;
	margin-bottom: 2rem;
}

/* Formulário de Contacto */
.contact-form-container {
	margin-top: 2rem;
}

.contact-form {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.form-group {
	margin-bottom: 1rem;
}

.form-group input,
.form-group select,
.form-group textarea {
	width: 100%;
	padding: 0.8rem;
	border: 2px solid var(--secondary-color);
	border-radius: 5px;
	background: rgba(255, 255, 255, 0.9);
	font-family: 'Avenir Book', sans-serif;
	transition: all 0.3s ease;
}

.form-group textarea {
	height: 100px;
	resize: vertical;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
	outline: none;
	border-color: var(--text-color-main);
	box-shadow: 0 0 5px rgba(235, 202, 93, 0.5);
}

.submit-btn {
	background-color: var(--secondary-color);
	color: white;
	padding: var(--button-padding);
	border: none;
	border-radius: 5px;
	font-size: var(--button-font-size);
	font-weight: var(--button-font-weight);
	letter-spacing: var(--button-letter-spacing);
	text-transform: var(--button-text-transform);
	cursor: pointer;
	transition: all 0.3s ease;
}

.submit-btn:hover {
	background-color: var(--hover-color);
	transform: translateY(-2px);
}

/* Seção de Informações de Contacto */
.contact-info-section {
	padding: 4rem 2rem;
	background-color: var(--background-secondary);
}

.contact-info-section h2 {
	text-align: center;
	color: var(--hover-color);
	font-size: 2rem;
	margin-bottom: 3rem;
}

.contact-info-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 2rem;
	max-width: 1200px;
	margin: 0 auto;
}

.contact-card {
	background: rgba(255, 255, 255, 0.2); /* Padronizado com card inicial */
	backdrop-filter: blur(10px); /* Padronizado com card inicial */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Padronizado com card inicial */
	border-radius: 10px; /* Padronizado com card inicial */
	border: #185058 solid 2px; /* Padronizado com card inicial */
	padding: 2rem; /* Padronizado com card inicial */
	text-align: center;
	transition: transform 0.3s ease;
}

.contact-card:hover {
	transform: translateY(-10px);
}

.contact-card i {
	font-size: 2.5rem;
	color: var(--secondary-color);
	margin-bottom: 1rem;
}

.contact-card h3 {
	color: var(--text-color-dark); /* Padronizado com card inicial */
	font-size: 20px; /* Padronizado com card inicial */
	font-weight: 900; /* Padronizado com card inicial */
	margin-bottom: 1rem;
}

.contact-card p {
	color: var(--button-hover-secondary);
	font-size: 16px; /* Padronizado com card inicial */
	font-weight: 700; /* Padronizado com card inicial */
	margin-bottom: 0.5rem;
}

/* Seção FAQ */
.faq-section {
	padding: 4rem 2rem;
	background-color: white;
}

.faq-section h2 {
	text-align: center;
	color: var(--hover-color);
	font-size: 2rem;
	margin-bottom: 3rem;
}

.faq-container {
	max-width: 800px;
	margin: 0 auto;
}

.faq-item {
	background: rgba(255, 255, 255, 0.2); /* Padronizado com card inicial */
	backdrop-filter: blur(10px); /* Padronizado com card inicial */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Padronizado com card inicial */
	border-radius: 10px; /* Padronizado com card inicial */
	border: #185058 solid 2px; /* Padronizado com card inicial */
	padding: 2rem; /* Padronizado com card inicial */
	margin-bottom: 1.5rem;
}

.faq-item h3 {
	color: var(--text-color-dark); /* Padronizado com card inicial */
	font-size: 20px; /* Padronizado com card inicial */
	font-weight: 900; /* Padronizado com card inicial */
	margin-bottom: 0.5rem;
}

.faq-item p {
	color: var(--button-hover-secondary);
	font-size: 16px; /* Padronizado com card inicial */
	font-weight: 700; /* Padronizado com card inicial */
}

/* Botão WhatsApp Flutuante */
.whatsapp-button {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	background-color: #25d366;
	color: white;
	padding: 1rem;
	border-radius: 50px;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease;
	z-index: 1000;
}

.whatsapp-button i {
	font-size: 1.5rem;
}

.whatsapp-button span {
	display: none;
}

.whatsapp-button:hover {
	transform: scale(1.1);
	background-color: #128c7e;
}

/* Media Queries para Mobile First */
@media (max-width: 768px) {
	.contact-hero {
		padding: 1rem;
		margin-top: 70px;
	}

	.contact-content {
		padding: 1.5rem;
	}

	.contact-content h2 {
		font-size: 1.8rem;
	}

	.contact-content h3 {
		font-size: 1.3rem;
	}

	.contact-info-container {
		grid-template-columns: 1fr;
	}

	.contact-card {
		margin: 0 1rem;
		padding: 2rem; /* Padronizado - mantém mesmo padding */
	}

	.contact-card h3 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.contact-card p {
		font-size: 16px; /* Padronizado - mantém mesmo tamanho */
	}

	.faq-item {
		padding: 2rem; /* Padronizado - mantém mesmo padding */
	}

	.faq-item h3 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.faq-item p {
		font-size: 16px; /* Padronizado - mantém mesmo tamanho */
	}

	.faq-section {
		padding: 2rem 1rem;
	}

	.whatsapp-button {
		bottom: 1.5rem;
		right: 1.5rem;
	}
}

@media (min-width: 768px) {
	.whatsapp-button span {
		display: inline;
	}
}

/* Estilo básico para a página de appointment vazia */
.appointment {
	background-color: var(--background-secondary);
	height: 100vh;
	margin-top: 70px;
	padding: 2rem 1rem;
}

/*--------------------------------------------------
    09. Footer Section
---------------------------------------------------*
/* Footer - Novo Design */
.footer {
	background: linear-gradient(to bottom, var(--secondary-color), var(--hover-color));
	color: white;
	padding: 4rem 2rem 0;
	position: relative;
}

.footer::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(to right, var(--main-color), var(--text-color-main), var(--main-color));
}

.footer-container {
	/* max-width: 1200px; */
	margin: 0 auto;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 3rem;
	padding-bottom: 3rem;
}

.footer-column {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.footer-column h2 {
	color: var(--text-color-main);
	font-size: 1.5rem;
	margin: 1.5rem;

	position: relative;
	padding-bottom: 0.5rem;
}

.footer-column h2::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 50px;
	height: 2px;
	background-color: var(--text-color-main);
}

.footer-column h3 {
	color: var(--main-color);
	font-size: 1.2rem;
	margin: 1.5rem 0;
}

.footer-column p {
	margin: 0.5rem 0;
	font-size: 1rem;
	color: var(--background-secondary);
	transition: color 0.3s ease;
}

.footer-column a {
	color: var(--background-primary);
	text-decoration: none;
	transition: all 0.3s ease;
	padding: 0.3rem 0;
}

.footer-column a:hover {
	/* color: var(--text-color-main); */
	transform: translateY(-2px);
}

.social-links {
	display: flex;
	gap: 1.5rem;
	margin-top: 1rem;
}

.social-links a {
	font-size: 1.2rem;
	padding: 0.5rem;
	border-radius: 50%;
	transition: all 0.3s ease;
}

.facebook:hover {
	color: #1877f2;
	transform: translateY(-3px);
}

.instagram:hover {
	background: linear-gradient(45deg, #405de6, #5851db, #833ab4, #c13584, #e1306c, #fd1d1d);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	transform: translateY(-3px);
}

.footer-list {
	list-style: none;
	padding: 0;
}

.footer-list li {
	margin: 0.8rem 0;
}

.footer-list a {
	position: relative;
	padding: 0.3rem 0;
}

.footer-list a::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 0;
	height: 1px;
	background-color: var(--text-color-main);
	transition: width 0.3s ease;
}

.footer-list a:hover::before {
	width: 100%;
}

/* Copyright Section - Novo Design */
.footer-bottom {
	background-color: var(--hover-color);
	padding: 1.5rem;
	text-align: center;
	position: relative;
}

.footer-bottom::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(to right, transparent, var(--text-color-main), transparent);
}

.footer-bottom > div {
	max-width: 1200px;
	margin: 0 auto;
}

.footer-bottom p {
	color: var(--background-secondary);
	font-size: 0.9rem;
	margin: 0.5rem 0;
}

.maker {
	margin-top: 1rem;
}

.specific-letter {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-size: 0.85rem;
}

.specific-letter a {
	color: var(--text-color-main);
	transition: all 0.3s ease;
}

.specific-letter a:hover {
	color: var(--main-color);
	transform: translateY(-2px);
}

.creator-logo {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	transition: transform 0.3s ease;
}

.creator-logo:hover {
	transform: scale(1.1);
}

@media (max-width: 768px) {
	.footer {
		padding: 3rem 1rem 0;
	}

	.footer-container {
		grid-template-columns: 1fr;
		gap: 2rem;
	}

	.footer-column h2 {
		font-size: 1.3rem;
	}

	.footer-column h3 {
		font-size: 1.1rem;
	}

	.social-links {
		gap: 1rem;
	}

	.footer-bottom {
		padding: 1rem;
	}
}

/*--------------------------------------------------
	10. Responsive Media Querries
---------------------------------------------------*/
/*TODO Slider card do Home */

@media (max-width: 450px) {
	/* Reduz altura do hero para mobile */
	.hero {
		height: 70vh; /* Reduz altura do background */
		margin-top: 70px;
	}

	.slider {
		height: 70vh; /* Altura proporcional */
	}

	.slider__item {
		height: 70vh; /* Altura proporcional */
	}

	/* Card redimensionado proporcionalmente */
	.slider__content {
		width: 85%; /* Ocupa 85% da largura para melhor proporção */
		max-width: 280px; /* Largura máxima */
		padding: 1.2rem; /* Padding reduzido proporcionalmente */
		bottom: 20px; /* Mais próximo do bottom */
		left: 50%; /* Centraliza horizontalmente */
		transform: translateX(-50%); /* Centraliza */
		text-align: center; /* Centraliza todo o conteúdo do card */
	}

	.slider__item.active .slider__content {
		transform: translateY(-40%) translateX(-50%);
		transition: all 1s ease-in-out 300ms; /* Mantém a transição suave */
	}

	/* Aplica transform a todos os elementos filhos do slider__content quando ativo */
	.slider__item.active .slider__content * {
		position: relative; /* Garante que os elementos filhos respeitam o transform do pai */
	}

	/* Tamanhos de fonte proporcionais ao card menor - centralizados */
	.slider__content h2 {
		font-size: 18px; /* Reduzido proporcionalmente */
		margin: 0.3rem 0 0.6rem; /* Margens reduzidas */
		text-align: center; /* Centraliza h2 */
	}

	.slider__content h3 {
		font-size: 14px; /* Reduzido proporcionalmente */
		margin: 8px 0 12px; /* Margens reduzidas */
		text-align: center; /* Centraliza h3 */
	}

	.slider__content p {
		font-size: 11px; /* Reduzido proporcionalmente */
		letter-spacing: 3px; /* Letter-spacing ajustado */
		margin-bottom: 0.8rem;
		text-align: center; /* Centraliza p */
	}

	.slider__content span {
		font-size: 22px;
		color: var(--button-hover-secondary); /* Reduzido proporcionalmente */
		text-align: center; /* Centraliza span */
	}

	/* Botão proporcional ao card - centralizado */
	.slider__content a,
	.btn_especialidade {
		width: 75%;
		height: 35px;
		display: flex; /* Usa flexbox para centralizar */
		align-items: center;
		justify-content: center;
		text-align: center;
		margin: 0 auto; /* Centraliza o botão dentro do card */
	}

	.btn_especialidade a {
		align-items: center;
		justify-content: center;
		text-align: center;
	}

	.btn_especialidade p,
	.btn_especialidade_text {
		font-size: 12px; /* Fonte proporcional */
		letter-spacing: 1px;
		text-align: center; /* Centraliza texto do botão */
		width: 100%; /* Garante que ocupa toda largura do botão */
	}

	/* Reposicionar setas para melhor posicionamento - AINDA MAIORES */
	.slider__btns {
		bottom: 10px; /* Mais próximo do bottom */
		left: 50%;
		transform: translateX(-50%);
		gap: 1rem; /* Espaçamento ainda maior */
	}

	.slider-btn {
		padding: 1rem; /* Padding ainda maior */
		width: 65px; /* Botões ainda maiores */
		height: 65px; /* Botões ainda maiores */
		/* display: flex;
		align-items: center;
		justify-content: center; */
	}

	.slider-btn i {
		font-size: 2rem; /* Ícones ainda maiores */
	}

	.btns__wrapper {
		bottom: 5px; /* Reposicionado */
		left: 50%;
		transform: translateX(-75%);
		gap: 1rem; /* Espaçamento ainda maior */
	}
}

@media (max-width: 480px) {
	.about-content {
		max-width: 100vw;
		padding: 0.25rem;
		left: 0;
		transform: none;
		margin: 0 auto;
	}
}

@media (min-width: 450px) and (max-width: 566px) {
	.slider__content {
		width: 300px;
	}
}

@media (min-width: 567px) and (max-width: 670px) {
	.slider__content {
		width: 430px;
	}
}

@media (min-width: 670px) and (max-width: 768px) {
	.slider__content {
		width: 500px;
	}
}

@media (max-width: 453px) {
	.about-content h2 {
		text-align: center;
	}

	.btn-box a {
		width: 150px;
		font-size: 10px;
		letter-spacing: 2px;
		text-align: center;
	}

	.btn-box {
		width: auto;
		gap: 5px;
	}
}

@media (max-width: 635px) {
	.slider__item:nth-child(1) {
		background: url('/imgs/webp/DSC00644.webp') no-repeat center top/cover;
		background-position: 66%;
	}

	.slider__item:nth-child(1) h3 {
		/* color: var(--text-color-main); */
		margin-bottom: 1rem;
	}

	.slider__item:nth-child(1) a {
		align-content: center;
	}

	.slider__item:nth-child(2) {
		background: url('/imgs/webp/WhatsApp-Image-2025-03-10-at-00.00.26-_1_.webp') no-repeat center top/cover;
		background-position: 56%;
	}

	.slider__item:nth-child(2) p {
		font-size: 10px;
		letter-spacing: 2px;
		/* font-weight: 900 bolder; */
		color: var(--hover-color);
	}

	.slider__item:nth-child(2) h1 {
		font-size: 32px;
		font-weight: 900 bolder;
		color: var(--hover-color);
		margin-bottom: 1rem;
	}

	.btn-box a {
		width: 150px;
		font-size: 10px;
		letter-spacing: 2px;
		text-align: center;
	}

	.btn_especialidade p {
		font-size: 8px;
	}

	.slider__item:nth-child(1) {
		background: url('/imgs/webp/WhatsApp-Image-2025-03-10-at-00.00.29-_3_.webp') no-repeat center top/cover;
	}

	.slider__item:nth-child(3) {
		background: url('/imgs/Fotos Novas André/WhatsApp Image 2025-03-10 at 00.00.19.jpeg') no-repeat center top/cover;
		background-position: 70%;
	}

	.slider__item:nth-child(4) {
		background: url('/imgs/webp/WhatsApp-Image-2025-03-10-at-00.00.29-_4_.webp') no-repeat center top/cover;
		background-position: 70%;
	}

	.slider__item:nth-child(5) {
		background: url('') no-repeat center top/cover;
		background-position: 70%;
	}

	/*TODO Slider card do Home */

	/* .slider__content {
		width: 235px;
	} */

	.slider__content h2 {
		font-size: 26px;
	}

	/* .slider__btns {
		width: 150px;
	} */

	.btns__wrapper {
		right: -40px;
	}

	.btns__left,
	.btns__right {
		width: 25px;
		height: 25px;
	}

	.about {
		background: url('/imgs/Fotos Novas André/WhatsApp Image 2025-03-10 at 00.00.26 (6).jpeg') no-repeat center top/cover;
	}

	.about-content {
		max-width: 98vw;
		padding: 0.5rem;
		left: 0;
		transform: none;
		margin: 1rem;
		bottom: 100px;
	}

	.testimonials h2 {
		/* font-size: 1.8rem; */
		margin-top: 4rem;
		margin-bottom: 2rem;
	}

	/* .services {
		height: 120vh;
	} */

	/* .footer {
		bottom: 0;
		width: 100%;
	} */

	.footer-column h2 {
		font-size: 18px;
	}

	.footer-column h3 {
		font-size: 16px;
	}

	.footer-container p {
		font-size: 14px;
	}

	.footer-container a {
		font-size: 14px;
	}

	.footer-bottom {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 1rem;
	}

	.footer-bottom > div {
		width: 100%;
		text-align: center;
	}

	.maker {
		order: 2;
		margin-top: 0;
	}

	.footer-bottom > div:first-child {
		order: 1;
	}

	.footer-bottom p {
		font-size: 14px;
	}

	.specific-letter {
		margin-top: 1rem;
	}

	.maker p {
		font-size: 10px;
	}

	.maker a {
		font-size: 10px;
	}
}

/* Tablet (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
	.services {
		padding: 4rem 2rem;
		margin-top: 2rem;
	}

	.services h2 {
		font-size: 2.2rem;
		margin-top: 3rem;
		margin-bottom: 2.5rem;
	}

	.services-container {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
		margin-top: 2rem;
	}

	.service-card {
		padding: 2rem;
		margin: 0;
	}

	.service-card h3 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.service-card p {
		font-size: 16px; /* Padronizado - mantém mesmo tamanho */
		line-height: 1.6;
	}

	.button-wrapper button {
		padding: 0.8rem 1.5rem;
		font-size: 1rem;
	}

	/* Testimonials para tablet */
	.testimonials {
		padding: 4rem 2rem;
	}

	.testimonial-slide-group {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
	}

	.testimonial-slide {
		margin-bottom: 0;
	}

	/* Header para tablet */
	.header {
		padding: 2rem 2rem;
	}

	.logo img {
		max-width: 120px;
	}

	.navbar {
		gap: 1.5rem;
	}

	.navbar a {
		font-size: 1rem;
		padding: 0.5rem 1rem;
	}

	/* Hero section para tablet */
	.hero {
		margin-top: 0; /* Remove o espaço branco - background cobre até o header */
		height: 100vh;
		padding-top: 0; /* Remove padding-top para background cobrir completamente */
		position: relative; /* Garante posicionamento relativo */
	}

	.slider {
		height: 100vh; /* Garante altura completa */
		position: relative;
	}

	.slider__item {
		top: 0; /* Garante que começa do topo */
		height: 100vh; /* Altura completa incluindo área do header */
		background-position: center 10%; /* Desloca ligeiramente para baixo - igual à primeira screenshot */
		background-size: cover; /* Garante cobertura completa */
	}

	.slider__item:nth-child(1) {
		background: url('/imgs/webp/DSC00644.webp') no-repeat center center/cover;
		background-position: bottom -70px center;
	}

	.slider__content {
		bottom: 110px; /* Mesmo posicionamento do desktop */
		top: auto; /* Remove posicionamento top */
		transform: none; /* Remove transform de centralização */
		margin-top: 0; /* Remove margin-top */
	}

	.slider__item.active .slider__content {
		transform: translateX(648px); /* Mesmo transform do desktop */
	}

	.slider__content h2 {
		font-size: 26px; /* Mesmo tamanho do desktop */
	}

	.slider__content h3 {
		font-size: 20px; /* Mesmo tamanho do desktop */
	}

	.slider__content p {
		font-size: 16px; /* Mesmo tamanho do desktop */
	}

	.slider__content .btn_especialidade_text {
		font-size: var(--button-font-size); /* Mesmo tamanho do desktop */
	}

	.slider__content span {
		font-size: 24px; /* Mesmo tamanho do desktop */
	}

	.btn_especialidade {
		padding: 1rem 2rem;
		font-size: 1.1rem;
	}

	/* Footer para tablet */
	.footer-container {
		flex-direction: row;
		justify-content: space-around;
		padding: 3rem 2rem;
	}

	.footer-column {
		flex: 1;
		margin-bottom: 0;
		text-align: center;
	}

	.footer-column h2 {
		font-size: 1.8rem;
	}

	.footer-column h3 {
		font-size: 1.3rem;
	}

	.footer-column p {
		font-size: 1rem;
	}

	.social-links a {
		font-size: 1rem;
		padding: 0.5rem 1rem;
	}
}

/* Mobile (max-width: 767px) */
@media (max-width: 767px) {
	.services {
		height: auto; /* Ajusta a altura para se adaptar ao conteúdo */
		margin-top: 3rem; /* Menor espaçamento no topo */
	}

	.services h2 {
		font-size: 1.8rem; /* Texto menor em dispositivos móveis */
		margin-top: 4rem; /* Mais espaço do header */
		margin-bottom: 2rem; /* Ajusta o espaçamento */
	}

	.service-card {
		max-width: 100%; /* Ocupa toda a largura */
		margin: 1rem auto;
		padding: 2rem; /* Padronizado - mantém mesmo padding */
	}

	.service-card h3 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.service-card p {
		font-size: 16px; /* Padronizado - mantém mesmo tamanho */
	}

	.services-container {
		display: block; /* Os cartões ficam empilhados */
		gap: 40px;
		margin-top: 3rem;
	}

	/* Uniformização de botões em mobile */
	/* .slider__content a,
	.service-card button,
	.submit-btn,
	.btn_especialidade p {
		font-size: var(--button-font-size-mobile);
		padding: var(--button-padding-mobile);
	} */

	/* Ajuste específico para botões especiais em mobile */
	.btn_especialidade p {
		font-size: 10px;
		letter-spacing: 2px;
	}

	.btn-box a {
		width: 170px;
		font-size: 10px;
		letter-spacing: 2px;
		text-align: center;
	}

	/* Uniformização de âncoras de navegação em mobile */
	.navbar a {
		font-size: 1.7rem;
		font-weight: var(--button-font-weight);
		letter-spacing: 0.5px;
		padding: 0.5rem 1rem;
	}
}

/* Versão Mobile - Mostrar apenas um testemunho por vez */
@media (max-width: 768px) {
	.testimonial-slide-group {
		flex-direction: column;
	}

	.testimonial-slide {
		max-width: 100%;
		margin-bottom: 1.5rem;
		padding: 2rem; /* Padronizado - mantém mesmo padding */
	}

	.testimonial-content h3 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.testimonial-content p {
		font-size: 16px; /* Padronizado - mantém mesmo tamanho */
	}
}

/* Estilos para telas maiores */
@media (min-width: 768px) {
	.logo img {
		max-width: 125px;
	}

	.slider__btns {
		bottom: 30px;
	}

	.slider-btn {
		padding: 1rem;
	}

	.slider-btn i {
		font-size: 2rem;
	}

	.btn-box a {
		font-size: 10px;
		letter-spacing: 2px;
		text-align: center;
	}

	.services {
		padding: 4rem 2rem;
	}

	.service {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 2rem;
	}

	.service p {
		flex: 1;
		padding-left: 1rem;
	}

	.footer {
		padding: 0;
	}
	.footer-container {
		flex-direction: row;
		justify-content: space-around;
		margin-left: 0;
		text-align: center;
	}

	.footer-column {
		flex: 1;
		margin-bottom: 0;
		text-align: center;
	}
}

@media (min-width: 1200px) {
	.slider__btns {
		bottom: 40px;
	}

	.slider-btn {
		padding: 1.25rem;
	}

	.slider-btn i {
		font-size: 2.5rem;
	}
}

/* Estilos para o feedback do formulário */
.form-status {
	margin-top: 1rem;
	padding: 1rem;
	border-radius: 5px;
	text-align: center;
	font-weight: bold;
	opacity: 0;
	animation: fadeIn 0.3s forwards;
}

.form-status.success {
	background-color: rgba(40, 167, 69, 0.2);
	color: #28a745;
	border: 1px solid #28a745;
}

.form-status.error {
	background-color: rgba(220, 53, 69, 0.2);
	color: #dc3545;
	border: 1px solid #dc3545;
}

/* Animação do spinner e mensagens */
@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(-10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.loading-spinner {
	display: inline-block;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}

/* Desativa o botão durante o envio */
.submit-btn:disabled {
	opacity: 0.7;
	cursor: not-allowed;
}

/*--------------------------------------------------
	11. Acessibilidade
---------------------------------------------------*/

/* Screen reader only text */
.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Focus styles for better accessibility */
button:focus,
input:focus,
select:focus,
textarea:focus,
a:focus {
	outline: 2px solid var(--accent-color);
	outline-offset: 2px;
}

/* Skip to main content link */
.skip-link {
	position: absolute;
	top: -40px;
	left: 6px;
	background: var(--secondary-color);
	color: white;
	padding: 8px;
	text-decoration: none;
	z-index: 1000;
}

.skip-link:focus {
	top: 6px;
}

/* High contrast mode support */
@media (prefers-contrast: high) {
	:root {
		--main-color: #000000;
		--secondary-color: #000000;
		--text-color-dark: #000000;
		--background-secondary: #ffffff;
	}
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Form validation styles */
input:invalid,
textarea:invalid,
select:invalid {
	border-color: #dc3545;
}

input:valid,
textarea:valid,
select:valid {
	border-color: #28a745;
}

/* Error message styling */
.error-message {
	color: #dc3545;
	font-size: 0.875rem;
	margin-top: 0.25rem;
	display: none;
}

input:invalid + .error-message,
textarea:invalid + .error-message,
select:invalid + .error-message {
	display: block;
}

/*--------------------------------------------------
	12. eBooks and Lectures Section
---------------------------------------------------*/

.ebook {
	padding: 8rem 2rem 4rem;
	background: var(--background-secondary);
	min-height: 100vh;
}

.ebook-content {
	max-width: 1200px;
	margin: 0 auto;
}

.ebook-content h2 {
	text-align: center;
	font-size: 2.5rem;
	color: var(--secondary-color);
	margin-bottom: 1rem;
}

.ebook-intro {
	text-align: center;
	font-size: 1.2rem;
	color: var(--text-color-dark);
	margin-bottom: 3rem;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}

.lectures-section,
.ebooks-section {
	margin-bottom: 4rem;
}

.lectures-section h3,
.ebooks-section h3 {
	font-size: 2rem;
	color: var(--secondary-color);
	margin-bottom: 2rem;
	text-align: center;
}

.lectures-section h3 i,
.ebooks-section h3 i {
	color: var(--accent-color);
	margin-right: 0.5rem;
}

.lectures-container,
.ebooks-container {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
	gap: 2rem;
	margin-bottom: 2rem;
}

.lecture-card,
.ebook-card {
	background: rgba(255, 255, 255, 0.2); /* Padronizado com card inicial */
	backdrop-filter: blur(10px); /* Padronizado com card inicial */
	border-radius: 10px; /* Padronizado com card inicial */
	border: #185058 solid 2px; /* Padronizado com card inicial */
	padding: 2rem; /* Padronizado com card inicial */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Padronizado com card inicial */
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.lecture-card:hover,
.ebook-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);
}

.lecture-card h4,
.ebook-card h4 {
	font-size: 20px; /* Padronizado com card inicial */
	font-weight: 900; /* Padronizado com card inicial */
	color: var(--text-color-dark); /* Padronizado com card inicial */
	margin-bottom: 1rem;
}

.lecture-card p,
.ebook-details p {
	color: var(--button-hover-secondary);
	font-size: 16px; /* Padronizado com card inicial */
	font-weight: 700; /* Padronizado com card inicial */
	line-height: 1.6;
	margin-bottom: 1.5rem;
}

.lecture-info,
.ebook-info {
	display: flex;
	gap: 1rem;
	margin-bottom: 1.5rem;
	flex-wrap: wrap;
}

.lecture-info span,
.ebook-info span {
	background: var(--highlight-color);
	color: var(--secondary-color);
	padding: 0.5rem 1rem;
	border-radius: 20px;
	font-size: 0.9rem;
	font-weight: bold;
}

.lecture-info i,
.ebook-info i {
	margin-right: 0.3rem;
}

.ebook-card {
	display: flex;
	flex-direction: column;
}

.ebook-cover {
	width: 100%;
	height: 200px;
	overflow: hidden;
	border-radius: 8px;
	margin-bottom: 1.5rem;
}

.ebook-cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ebook-details {
	flex: 1;
	display: flex;
	flex-direction: column;
}

.ebook-cta {
	background: var(--secondary-color);
	color: white;
	padding: 3rem 2rem;
	border-radius: 10px;
	text-align: center;
	margin-top: 3rem;
}

.ebook-cta h3 {
	font-size: 2rem;
	margin-bottom: 1rem;
	color: white;
}

.ebook-cta p {
	font-size: 1.1rem;
	margin-bottom: 2rem;
	opacity: 0.9;
}

/* Responsive Design for eBooks Section */
@media (max-width: 768px) {
	.ebook {
		padding: 6rem 1rem 3rem;
	}

	.ebook-content h2 {
		font-size: 2rem;
	}

	.lectures-container,
	.ebooks-container {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.lecture-card,
	.ebook-card {
		padding: 2rem; /* Padronizado - mantém mesmo padding */
	}

	.ebook-card {
		flex-direction: column;
	}

	.ebook-cover {
		height: 150px;
	}

	.ebook-cta {
		padding: 2rem 1rem;
	}

	.ebook-cta h3 {
		font-size: 1.5rem;
	}
}

@media (max-width: 480px) {
	.ebook-content h2 {
		font-size: 1.8rem;
	}

	.ebook-intro {
		font-size: 1rem;
	}

	.lecture-card h4,
	.ebook-card h4 {
		font-size: 20px; /* Padronizado - mantém mesmo tamanho */
	}

	.lecture-info,
	.ebook-info {
		flex-direction: column;
		gap: 0.5rem;
	}

	/* Uniformização adicional para telas muito pequenas */
	.slider__content a,
	.service-card button,
	.submit-btn {
		font-size: 0.45rem;
		padding: 0.6rem 2rem;
		letter-spacing: 0.5px;
	}
}

/*--------------------------------------------------
	13. Curriculum Page Styles
----------------------------------------------------*/

/* Curriculum Hero Section */
.curriculum-hero {
	height: 60vh;
	background: linear-gradient(135deg, var(--secondary-color) 0%, var(--hover-color) 100%);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin-top: 4.5rem;
	position: relative;
	overflow: hidden;
}

.curriculum-hero::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url('/imgs/DSC00632.jpg') no-repeat center center/cover;
	opacity: 0.3;
	z-index: 1;
}

.curriculum-hero-content {
	position: relative;
	z-index: 2;
	color: white;
	max-width: 800px;
	padding: 2rem;
}

.curriculum-hero h1 {
	font-size: 3.5rem;
	font-weight: 900;
	margin-bottom: 1rem;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.curriculum-hero h2 {
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: 1rem;
	color: var(--text-color-main);
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

.curriculum-subtitle {
	font-size: 1.2rem;
	font-weight: 600;
	opacity: 0.9;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}

/* Curriculum Content */
.curriculum-content {
	padding: 4rem 0;
	/* background: var(--background-primary); */
	position: relative;
}

.curriculum-content::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: url('/imgs/Fotos Novas André/WhatsApp Image 2025-03-10 at 00.00.28 (4).jpeg') no-repeat center center/cover;
	opacity: 0.1;
	z-index: 1;
}

.curriculum-section {
	margin-bottom: 4rem;
	padding: 2rem;
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente */
	backdrop-filter: blur(10px); /* Efeito de desfoque */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave */
	border: #185058 solid 2px;
	border-radius: 10px;
	position: relative;
	z-index: 2;
}

.curriculum-section h3 {
	font-size: 2rem;
	font-weight: 700;
	color: var(--secondary-color);
	margin-bottom: 2rem;
	display: flex;
	align-items: center;
	gap: 1rem;
	text-align: center;
}

.curriculum-section h3 i {
	color: var(--hover-color);
	font-size: 1.5rem;
}

.curriculum-item {
	margin-bottom: 2rem;
	padding: 1.5rem;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(5px);
	border-radius: 10px;
	border: 1px solid rgba(24, 80, 88, 0.3);
}

.curriculum-item h4 {
	font-size: 1.3rem;
	font-weight: 700;
	color: var(--secondary-color);
	margin-bottom: 0.5rem;
}

.institution {
	font-size: 1.1rem;
	font-weight: 600;
	color: var(--text-color-dark);
	margin-bottom: 0.3rem;
}

.period {
	font-size: 0.9rem;
	font-weight: 500;
	color: var(--text-color-main);
	margin-bottom: 1rem;
	font-style: italic;
}

.description {
	font-size: 1rem;
	line-height: 1.6;
	color: var(--text-color-dark);
}

/* Specializations Grid */
.specializations-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 2rem;
	margin-top: 2rem;
}

.specialization-item {
	text-align: center;
	padding: 2rem 1rem;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(5px);
	border-radius: 15px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	border: 1px solid rgba(24, 80, 88, 0.3);
}

.specialization-item:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
	border-color: var(--hover-color);
}

.specialization-item i {
	font-size: 3rem;
	color: var(--secondary-color);
	margin-bottom: 1rem;
}

.specialization-item h4 {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--secondary-color);
	margin-bottom: 1rem;
}

.specialization-item p {
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--text-color-dark);
}

/* Certifications List */
.certifications-list {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.certification-item {
	padding: 1.5rem;
	background: rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(5px);
	border-radius: 10px;
	border: 1px solid rgba(24, 80, 88, 0.3);
}

.certification-item h4 {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--secondary-color);
	margin-bottom: 0.5rem;
}

.certification-item p {
	font-size: 1rem;
	color: var(--text-color-dark);
	font-weight: 600;
}

/* Curriculum CTA */
.curriculum-cta {
	text-align: center;
	padding: 3rem 2rem;
	background: rgba(255, 255, 255, 0.2); /* Fundo semitransparente */
	backdrop-filter: blur(10px); /* Efeito de desfoque */
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); /* Sombra suave */
	border: #185058 solid 2px;
	border-radius: 10px;
	color: var(--text-color-dark);
	margin-top: 2rem;
	position: relative;
	z-index: 2;
}

.curriculum-cta h3 {
	font-size: 2.2rem;
	font-weight: 700;
	margin-bottom: 1rem;
	color: var(--secondary-color);
}

.curriculum-cta p {
	font-size: 1.2rem;
	margin-bottom: 2rem;
	color: var(--text-color-dark);
	opacity: 0.9;
}

.curriculum-cta .btn-box {
	justify-content: center;
	gap: 2rem;
}

/* Responsive Design for Curriculum */
@media (max-width: 768px) {
	.curriculum-hero h1 {
		font-size: 2.5rem;
	}

	.curriculum-hero h2 {
		font-size: 1.5rem;
	}

	.curriculum-subtitle {
		font-size: 1rem;
	}

	/* Background específico para mobile */
	.curriculum-content::before {
		background: url('/imgs/Fotos Novas André/WhatsApp Image 2025-03-10 at 00.00.28 (5).jpeg') no-repeat center center/cover;
		opacity: 0.15; /* Ligeiramente mais opaco para melhor contraste em mobile */
	}

	.curriculum-section {
		padding: 2rem; /* Padronizado - mantém mesmo padding */
		margin-bottom: 2rem;
	}

	.curriculum-section h3 {
		font-size: 1.5rem;
		flex-direction: column;
		text-align: center;
		gap: 0.5rem;
	}

	.specializations-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.curriculum-cta h3 {
		font-size: 1.8rem;
	}

	.curriculum-cta p {
		font-size: 1rem;
	}

	.curriculum-cta .btn-box {
		flex-direction: column;
		align-items: center;
		gap: 1rem;
	}
}

@media (max-width: 480px) {
	.curriculum-hero {
		height: 50vh;
	}

	.curriculum-hero h1 {
		font-size: 2rem;
	}

	.curriculum-hero h2 {
		font-size: 1.3rem;
	}

	/* Background otimizado para mobile pequeno */
	.curriculum-content::before {
		opacity: 0.2; /* Ainda mais opaco para melhor legibilidade em telas pequenas */
		background-position: center top; /* Ajuste de posicionamento para mobile */
	}

	.curriculum-section {
		padding: 1rem;
	}

	.curriculum-item {
		padding: 1rem;
	}

	.specialization-item {
		padding: 1.5rem 1rem;
	}

	.curriculum-cta {
		padding: 2rem 1rem;
	}
}
