/*********************************************************/
/*CSS MODE - MRPNET 2025
/*********************************************************/
/*CORES*/
:root {
  --cor_1: #025440;
  --cor_2: #5E8B93;
  --cor_3: #444444;
}
/*********************************************************/
.botao {padding: 10px 30px; color: #fff; background-color: var(--cor_1); border-radius: 10px; font-weight: 500; text-transform: uppercase; cursor: pointer;}
.botao:hover {background-color: var(--cor_2);}

.botao-borda {border: 1px solid #fff; background-color: transparent; border-radius: 50px; padding: 10px 25px; color: #fff; font-weight: 300; letter-spacing: 2px; text-transform: uppercase; position: absolute; right: 5%; bottom: 30px; cursor: pointer; transition: all 0.3s ease;}
.botao-borda:hover {background-color: var(--cor_2); box-shadow: 0 0 15px var(--cor_2);  transform: translateY(-3px);}

.botao-borda-v {border: 1px solid var(--cor_1); background-color: transparent; border-radius: 50px; padding: 10px 25px; color: var(--cor_1); font-weight: 300; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; transition: all 0.3s ease;}
.botao-borda-v:hover {background-color: var(--cor_1); box-shadow: 0 0 15px var(--cor_2);  transform: translateY(-3px); color: #fff;}

.botao-nborda {color: #000; font-weight: 500; letter-spacing: 2px; position: absolute; left: 0; bottom: 10px;}
.botao-nborda:hover {color: var(--cor_1); text-decoration: none !important;}

p {font-weight: 400; line-height: 30px;}
/*********************************************************/
/*HEADER DO SITE*/
header {width: 100%; position: relative; padding: 10px 0; z-index: 1000; background: var(--cor_1);}
header .content {display: flex; align-items: center; justify-content: space-between;}
header .logo {width: 150px; height: 100px;}
header .social li {display: inline-block; color: #fff; font-size: 1.2em; padding: 0 10px;}
header .social li:hover {color: var(--cor_2);}
/*********************************************************/
footer {width: 100%; display: table; padding-top: 20px; border-top: 25px solid var(--cor_1); background-position: center center;}
footer h2 {color: #fff; font-size: 0.9em; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; padding-bottom: 10px;}
footer p {color: #fff;}
footer a {color: #fff;}

footer .quadro {width: 25%; float: left; padding-right: 20px;}
footer .logo {width: 120px; height: 100px; margin: auto;}
footer .social li {display: inline-block; color: #fff; font-size: 1.2em; padding: 0 10px;}
footer .social li:hover {color: var(--cor_3);}
footer .dados li {color: #fff;}
footer .logo2 {width: 120px; height: 50px; margin: 0 auto; background-image: url(../images/unicamp.png);}
/*********************************************************/
.fim {padding: 40px 0 10px 0; text-align: center; width: 100%; display: table;}
.fim .content {border-top: 1px solid #fff; padding-top: 10px;}
.fim p {font-size: 0.8em; letter-spacing: 1px;}
.fim a:hover {color: var(--cor_3)}
/*********************************************************/
.home {width: 100%; display: table; height: calc(100% - 110px); background-position: center center; text-align: center;}
.home h1 {font-size: 1.6em; font-weight: 400; color: var(--cor_3); text-transform: uppercase; text-shadow: 2px 2px 4px rgba(0,0,0,0.5);}
.home .logo {width: 200px; height: 140px; display: inline-block; margin: 40px 0 20px 0;}
/*********************************************************/
.chamadas {width: 100%; display: table;}
.chamadas h1 {color: #fff; font-weight: 300; text-transform: uppercase; font-size: 1.2em; letter-spacing: 2px; margin-bottom: 20px;}
.chamadas h1 span {font-weight: 900; font-size: 2.4em;}
.chamadas p {color: #fff; text-align: justify;}
.chamadas .logo {width: 220px; height: 90px; margin-bottom: 20px; background-image: url(../images/diors.png);}
.chamadas .esquerda {width: 50%; min-height: 400px; background-position: center center; padding: 80px 10% 20px 5%; position: relative;}
.chamadas .direita {width: 50%; min-height: 400px; background-position: center center; padding: 80px 10% 20px 5%; position: relative;}
/*********************************************************/
.tela-1 {width: 100%; background-color: #F7F6FC; display: flex; padding: 60px 0; text-align: center;} 
.tela-1 h1 {color: var(--cor_1); text-transform: uppercase; margin-bottom: 40px; font-size: 3em; }
.tela-1 h2 {color: var(--cor_2); text-transform: uppercase; font-weight: 500; letter-spacing: 2px; font-size: 1em; padding: 20px 0 30px 0;}
.tela-1 p {color:var(--cor_3); font-size: 0.85em; line-height: 20px; letter-spacing: 1px;}
.tela-1 h2 a:hover {text-decoration: none !important; color: var(--cor_3);}
.tela-1 .quadro {width: 90%; margin: auto; background-image: url(../images/bg-logo.png); background-repeat: no-repeat; background-position: left top; min-height: 300px; position: relative; text-align: left;}
/*********************************************************/
.tela-2 {width: 100%; background-color: #F7F6FC; padding: 40px 0 60px 0;} 
.tela-2 h1 {transform: rotate(-180deg); writing-mode:vertical-rl; font-weight: 300; text-transform: uppercase; font-size: 1.2em; letter-spacing: 2px; margin-bottom: 20px; text-align: center;}
.tela-2 h1 span {color: var(--cor_1); font-weight: 900; font-size: 2.4em;}
.tela-2 h2 {color: #fff; font-weight: 600; font-size: 1.2em;}
.tela-2 .nome {width: 10%; float: left; padding-top: 140px;}
.tela-2 .centro {width: 60%; float: left;}
.tela-2 .centro p {color: #fff;}
.tela-2 .texto {width: 25%; float: right; padding-top: 240px;}
.tela-2 .individual {width: 100%; padding-top: 200px; position: relative;}
.tela-2 .quadro {width: 90%; margin: auto; background-color: var(--cor_2); border-radius: 20px; position: relative; min-height: 250px; padding: 180px 20px 20px 20px;}
.tela-2 .imagem {width: 80%; height: 360px; position: absolute; top: -200px; left: 10%;}
/*********************************************************/
.tela-3 {width: 100%; display: flex; padding: 60px 0;}
.tela-3 h1 {font-weight: 300; text-transform: uppercase; font-size: 1.2em; letter-spacing: 2px; margin-bottom: 20px; margin-bottom: 40px;}
.tela-3 h1 span {color: var(--cor_1); font-weight: 900; font-size: 2.4em;}
.tela-3 h2 {color: var(--cor_2); letter-spacing: 2px; font-size: 1em; padding-bottom: 10px;}
.tela-3 p {color:var(--cor_3); font-size: 0.85em; line-height: 20px; letter-spacing: 1px;}

.tela-3 .quadro {width: 95%; margin: 20px auto; border: 1px solid #bbb; border-radius: 20px; overflow: hidden;}
.tela-3 .imagem {width: 100%; height: 240px; background-position: center center;}
.tela-3 .texto {width: 100%; height: 270px; padding: 20px; position: relative;}
.tela-3 .botao-nborda {left: 20px;}
/*********************************************************/
.tela-4 {width: 100%; background-color: #F7F6FC; display: flex; padding: 60px 0;}
.tela-4 h1 {font-weight: 300; text-transform: uppercase; font-size: 1.2em; letter-spacing: 2px; margin-bottom: 40px; text-align: center; width: 100%;}

.tela-4 .slick-1 {position: relative; max-width:80%; margin: 0 auto;}
.tela-4 .quadro {width: 95%; margin: 0 auto; background: #fff; border: 1px solid #e6e6e6; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); padding: 40px 80px; position: relative;}
.tela-4 .quadro p {color:var(--cor_3); font-size: 1.1em; position: relative; padding-left: 10px; font-style: italic;}
.tela-4 .quadro p::before {content: "\201C"; position: absolute; left: -35px; top: 10px; font-size: 4em; color: rgba(2, 84, 64, 0.15); font-family: Georgia, serif;}
.tela-4 .quadro h2 {color: var(--cor_1); font-size: 1.2em; font-weight: 700; margin-top: 20px; letter-spacing: 1px; text-align: right;}

/* Slick controls customizados (apenas para slick-1) */
.tela-4 .slick-1 .slick-dots {bottom: -40px;}
.tela-4 .slick-1 .slick-dots li {margin: 0 6px;}
.tela-4 .slick-1 .slick-dots button {width: 12px; height: 12px; border-radius: 50%; background: #cfd8dc; border: none;}
.tela-4 .slick-1 .slick-dots .slick-active button {background: var(--cor_1); box-shadow: 0 0 0 4px rgba(2, 84, 64, 0.15);}

.tela-4 .slick-1 .slick-prev, 
.tela-4 .slick-1 .slick-next {width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--cor_1), var(--cor_2)); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); z-index: 2;}
.tela-4 .slick-1 .slick-prev {left: -60px;}
.tela-4 .slick-1 .slick-next {right: -60px;}
.tela-4 .slick-1 .slick-prev:before, 
.tela-4 .slick-1 .slick-next:before {color: #fff; font-size: 20px; line-height: 44px; opacity: 1;}

/* Hover suave no card */
.tela-4 .quadro:hover {transform: translateY(-3px); box-shadow: 0 15px 35px rgba(0,0,0,0.12);}
/*********************************************************/
.navegacao {width: 100%; display: table; padding: 10px 0; text-align: center; background-color: #f2f2f2;}
.navegacao li {display: inline-block; color: var(--cor_3); padding: 0 5px; font-size: 0.9em;}
.navegacao a {color: var(--cor_3)}
.navegacao a:hover {color: var(--cor_1);}
/*********************************************************/
.interna {width: 100%; display: flex; padding: 60px 0;}
/*********************************************************/
.sobre {position: relative; min-height: 950px; background-image: url(../images/bg-site.jpg);}
.sobre h1 {color: var(--cor_1); font-weight: 800; letter-spacing: 2px; font-size: 2.6em; margin-bottom: 40px;}
.sobre p {color: var(--cor_3);}
.sobre .direita {width: 65%; padding-top: 10%;}
.sobre .logo {width: 200px; height: 140px; background-position: center center; display: inline-block;}
.sobre .imagem {position: absolute; left: 0; bottom: 0; background-position: bottom left; height: 900px; width: 30%;}
/*********************************************************/
.espaco {position: relative; background-image: url(../images/bg-site.jpg);}
.espaco .destaque {color: var(--cor_2); font-size: 1.3em; font-weight: 500; margin-bottom: 30px; font-style: italic;}
.espaco .intro {text-align: center; margin-bottom: 60px;}
.espaco .intro h1 {color: var(--cor_1); font-size: 2.8em; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}
.espaco .intro p {color: var(--cor_3); max-width: 800px; margin: 0 auto;}

.espaco .caracteristicas {margin-bottom: 80px;}
.espaco .caracteristicas-grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; margin-top: 40px;}
.espaco .caracteristica-item {background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); padding: 30px; border-radius: 15px; text-align: center; box-shadow: 0 5px 15px rgba(2, 84, 64, 0.1); transition: all 0.3s ease; border-left: 4px solid var(--cor_2);}
.espaco .caracteristica-item:hover {transform: translateY(-5px); box-shadow: 0 10px 25px rgba(2, 84, 64, 0.15);}
.espaco .caracteristica-item h3 {color: var(--cor_1); font-size: 1.3em; font-weight: 600; margin-bottom: 15px;}
.espaco .caracteristica-item p {color: var(--cor_3); }

.espaco .galeria {margin-bottom: 80px;}
.espaco .galeria h2 {color: var(--cor_1); font-size: 2.2em; font-weight: 600; text-align: center; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 1px;}
.espaco .galeria-descricao {color: var(--cor_3); font-size: 1.1em; text-align: center; margin-bottom: 50px; max-width: 600px; margin-left: auto; margin-right: auto;}

.espaco .galeria-grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 20px; margin-top: 40px;}
.espaco .galeria-item {position: relative; overflow: hidden; border-radius: 15px; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); transition: all 0.3s ease;}
.espaco .galeria-item:hover {transform: scale(1.02); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);}
.espaco .galeria-imagem {width: 100%; height: 250px; background-size: cover; background-position: center; position: relative; transition: all 0.3s ease;}
.espaco .galeria-item:hover .galeria-imagem {transform: scale(1.1);}
.espaco .galeria-overlay {position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(2, 84, 64, 0.9)); color: white; padding: 20px; text-align: center; transform: translateY(100%); transition: all 0.3s ease;}
.espaco .galeria-item:hover .galeria-overlay {transform: translateY(0);}
.espaco .galeria-overlay span {font-size: 1em; font-weight: 500; text-transform: uppercase; letter-spacing: 1px;}
/*********************************************************/
.equipe {position: relative; background-image: url(../images/bg-site.jpg);}
.equipe .intro {text-align: center; margin-bottom: 80px;}
.equipe .intro h1 {color: var(--cor_1); font-size: 3em; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}
.equipe .intro p {color: var(--cor_3); max-width: 800px; margin: 0 auto;}

.equipe .cirurgias-equipe {margin-bottom: 80px;}
.equipe .medico-card {background: white; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); overflow: hidden; margin-bottom: 60px; transition: all 0.3s ease; min-height: 500px; }
.equipe .medico-card:hover {transform: translateY(-5px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);}

.equipe .medico-foto {position: relative; width: 100%; overflow: hidden;}
.equipe .medico-foto img {width: 100%; height: 100%; object-fit: cover; transition: all 0.3s ease;}
.equipe .medico-card:hover .medico-foto img {transform: scale(1.05);}

.equipe .medico-overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(45deg, rgba(2, 84, 64, 0.8), rgba(94, 139, 147, 0.8)); opacity: 0; transition: all 0.3s ease; display: flex; align-items: center; justify-content: center;}
.equipe .medico-card {display: grid; grid-template-columns: 400px 1fr; gap: 0; align-items:flex-start;}
.equipe .medico-card:hover .medico-overlay {opacity: 1;}
.equipe .social-links {display: flex; gap: 15px;}
.equipe .social-links a {color: white; font-size: 1.5em; width: 50px; height: 50px; border-radius: 50%; background: rgba(255, 255, 255, 0.2); display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; backdrop-filter: blur(10px);}
.equipe .social-links a:hover {background: rgba(255, 255, 255, 0.3); transform: scale(1.1);}

.equipe .medico-info {padding: 40px; display: flex; flex-direction: column; justify-content: center;}
.equipe .medico-info h2 {color: var(--cor_1); font-size: 2.2em; font-weight: 700; margin-bottom: 10px;}
.equipe .medico-info h3 {color: var(--cor_2); font-size: 1.3em; font-weight: 600; margin-bottom: 20px;}
.equipe .medico-historia {margin-bottom: 40px;}
.equipe .medico-historia h4 {color: var(--cor_1); font-size: 1.4em; font-weight: 600; margin-bottom: 20px; border-bottom: 2px solid var(--cor_2); padding-bottom: 10px;}
.equipe .medico-historia p {color: var(--cor_3);}
/*********************************************************/
.servicos {position: relative; background-image: url(../images/bg-site.jpg);}
.servicos .intro {text-align: center; margin-bottom: 80px;}
.servicos .intro h1 {color: var(--cor_1); font-size: 3em; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}
.servicos .botao-nborda {left: 20px;}

.servicos .grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; margin-bottom: 80px;}
.servicos .servico-card {background: white; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); overflow: hidden; transition: all 0.3s ease;}
.servicos .servico-card:hover {transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);}
.servicos .servico-imagem {position: relative; width: 100%; height: 250px; overflow: hidden;}
.servicos .servico-imagem img {width: 100%; height: 100%; object-fit: cover; transition: all 0.3s ease;}
.servicos .servico-card:hover .servico-imagem img {transform: scale(1.1);}
.servicos .servico-overlay {position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(45deg, rgba(2, 84, 64, 0.8), rgba(94, 139, 147, 0.8)); opacity: 0; transition: all 0.3s ease; display: flex; flex-direction: column; align-items: center; justify-content: center; color: white;}
.servicos .servico-card:hover .servico-overlay {opacity: 1;}
.servicos .servico-overlay i {font-size: 3em; margin-bottom: 10px;}
.servicos .servico-overlay span {font-size: 1em; font-weight: 600; text-transform: uppercase; letter-spacing: 1px;}

.servicos .servico-info {padding: 30px; position: relative; min-height: 280px;}
.servicos .servico-info h3 {color: var(--cor_1); font-size: 1.2em; font-weight: 700; margin-bottom: 15px;}
.servicos .servico-info a:hover {color: var(--cor_3);}
.servicos .servico-info p {color: var(--cor_3); font-size: 0.9em; line-height: 20px;}
/*********************************************************/
.trabalhos {position: relative; background-image: url(../images/bg-site.jpg);}
.trabalhos .intro {text-align: center; margin-bottom: 60px;}
.trabalhos .intro h1 {color: var(--cor_1); font-size: 3em; font-weight: 700; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}
.trabalhos .intro p {color: var(--cor_3); max-width: 800px; margin: 0 auto;}

.trabalhos .categorias-nav {display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; margin-bottom: 50px; padding: 0 20px;}
.trabalhos .categoria-btn {background: white; border: 2px solid var(--cor_1); color: var(--cor_1); padding: 10px 15px; border-radius: 15px; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; gap: 10px; font-size: 1em; font-weight: 500; justify-content: center;}
.trabalhos .categoria-btn:hover, .categoria-btn.active {background-color: var(--cor_2); color: white; transform: translateY(-3px); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);}
.trabalhos .categoria-btn span {text-align: center; line-height: 1.3;}

.trabalhos .categorias-content {margin-bottom: 80px;}
.trabalhos .categoria-section {display: none; animation: fadeIn 0.5s ease;}
.trabalhos .categoria-section.active {display: block;}

.trabalhos .categoria-header {text-align: center; margin-bottom: 40px; padding: 30px; background: linear-gradient(135deg, rgba(2, 84, 64, 0.05), rgba(94, 139, 147, 0.05)); border-radius: 15px; border-left: 5px solid var(--cor_1);}
.trabalhos .categoria-header h2 {color: var(--cor_1); font-size: 2.2em; font-weight: 700; margin-bottom: 15px;}

.trabalhos .documentos-lista { list-style: none; margin: 0; padding: 0; }
.trabalhos .documentos-lista li { display: flex; justify-content: space-between; align-items: center; background: #fff; padding: 12px 18px; margin-bottom: 8px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); transition: all 0.3s ease; }
.trabalhos .documentos-lista li:hover { background: #f9f9f9; }
.trabalhos .doc-nome { font-size: 1em; font-weight: 600; color: var(--cor_1); }
.trabalhos .btn-download { color: var(--cor_2); font-size: 1.2em; transition: transform 0.3s ease, color 0.3s ease; text-decoration: none; }
.trabalhos .btn-download:hover { transform: scale(1.2); color: var(--cor_1); }
/*********************************************************/
.diors {position: relative; background-image: url(../images/bg-site.jpg);}
.diors .hero {margin-bottom: 80px;}
.diors .hero-content {display: flex; align-items: center; gap: 60px; min-height: 500px;}
.diors .hero-text {flex: 1;}
.diors .hero-text h1 {color: var(--cor_1); font-size: 4.5em; font-weight: 800; margin-bottom: 10px; text-transform: lowercase; letter-spacing: -2px;}
.diors .hero-text h1 sup {font-size: 0.4em; color: var(--cor_2);}
.diors .hero-text h2 {color: var(--cor_2); font-size: 1.8em; font-weight: 600; margin-bottom: 25px; line-height: 1.3;}
.diors .hero-text h2 sup {font-size: 0.6em;}
.diors .hero-description {color: var(--cor_3); font-size: 1.2em; line-height: 1.7; margin-bottom: 30px;}
.diors .hero-description strong {color: var(--cor_1); font-weight: 700;}

.diors .hero-image {flex: 1; position: relative; text-align: center;}
.diors .hero-image img {max-width: 100%; height: auto; border-radius: 20px;}

.diors .benefits {margin-bottom: 80px; text-align: center;}
.diors .benefits h2 {color: var(--cor_1); font-size: 2.8em; font-weight: 700; margin-bottom: 50px; text-transform: uppercase; letter-spacing: 2px;}
.diors .benefits-grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 30px;}

.diors .benefit-item {background: white; padding: 40px 30px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; border-top: 4px solid var(--cor_2);}
.diors .benefit-item:hover {transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); border-top-color: var(--cor_1);}
.diors .benefit-icon {width: 80px; height: 80px; background: linear-gradient(135deg, var(--cor_1), var(--cor_2)); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 25px; color: white; font-size: 2em;}
.diors .benefit-item h3 {color: var(--cor_1); font-size: 1.4em; font-weight: 700; margin-bottom: 15px;}
.diors .benefit-item p {color: var(--cor_3); }

.diors .care {margin-bottom: 80px;}
.diors .care h2 {color: var(--cor_1); font-size: 2.8em; font-weight: 700; margin-bottom: 30px; text-align: center; text-transform: uppercase; letter-spacing: 2px;}
.diors .care h2 sup {font-size: 0.4em; color: var(--cor_2);}
.diors .care-intro {color: var(--cor_3); max-width: 80%; margin: 0 auto 50px;}

.diors .care-steps {display: flex; flex-direction: column; gap: 30px;}
.diors .care-step {display: flex; gap: 30px; background: white; padding: 30px; border-radius: 15px; box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1); transition: all 0.3s ease;}
.diors .care-step:hover {transform: translateX(10px); box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);}
.diors .step-number {flex-shrink: 0; width: 60px; height: 60px; background: linear-gradient(135deg, var(--cor_1), var(--cor_2)); color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.5em; font-weight: 700;}
.diors .step-content {flex: 1;}
.diors .step-content h3 {color: var(--cor_1); font-size: 1.3em; font-weight: 700; margin-bottom: 15px;}
.diors .step-content p {color: var(--cor_3); line-height: 1.6; margin-bottom: 15px;}
.diors .step-content strong {color: var(--cor_1); font-weight: 700;}
/*********************************************************/
.blog {position: relative; background-image: url(../images/bg-site.jpg);}
.blog .botao-nborda {left: 20px; font-size: 0.9em; letter-spacing: 1px;}
.blog .header {margin-bottom: 60px; text-align: center;}
.blog .intro h1 {color: var(--cor_1); font-size: 3.5em; font-weight: 800; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}

.blog .search {margin-bottom: 40px;}
.blog .search-form {display: flex; flex-direction: column; align-items: center; gap: 15px;}
.blog .search-input-group {display: flex; max-width: 500px; width: 100%; position: relative;}
.blog .search-input {flex: 1; padding: 15px 20px; border: 2px solid #e0e0e0; border-radius: 50px 0 0 50px; font-size: 1em; outline: none; transition: all 0.3s ease; font-family: var(--font_p);}
.blog .search-input:focus {border-color: var(--cor_2); box-shadow: 0 0 0 3px rgba(94, 139, 147, 0.1);}
.blog .search-btn {padding: 15px 25px; background: linear-gradient(135deg, var(--cor_1), var(--cor_2)); color: white; border: none; border-radius: 0 50px 50px 0; cursor: pointer; transition: all 0.3s ease;}
.blog .search-btn:hover {transform: translateX(2px); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);}

.blog .clear-search {color: var(--cor_2); text-decoration: none; font-size: 0.9em; display: flex; align-items: center; gap: 5px; transition: color 0.3s ease;}
.blog .clear-search:hover {color: var(--cor_1);}

.blog .grid {display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 30px; margin-bottom: 60px;}

.blog .card {background: white; border-radius: 20px; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); transition: all 0.3s ease; position: relative;}
.blog .card:hover {transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);}

.blog .card-image {position: relative; height: 250px; overflow: hidden;}
.blog .card-image img {width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease;}
.blog .card:hover .card-image img {transform: scale(1.05);}

.blog .card-content {padding: 25px;}
.blog .card-meta {display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; font-size: 0.85em; color: var(--cor_3);}
.blog .card-meta time {display: flex; align-items: center; gap: 5px;}

.blog .card-title {margin-bottom: 15px;}
.blog .card-title a {color: var(--cor_1); font-size: 0.8em; font-weight: 700; text-decoration: none; line-height: 1.4; transition: color 0.3s ease;}
.blog .card-title a:hover {color: var(--cor_3);}

.blog .card-excerpt {color: var(--cor_3); line-height: 1.6; margin-bottom: 20px; font-size: 0.95em;}
.blog .card-footer {display: flex; justify-content: space-between; align-items: center;}
/*********************************************************/
.no-results {grid-column: 1 / -1; text-align: center; padding: 60px 20px; background: white; border-radius: 20px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);}
.no-results-icon {color: var(--cor_2); font-size: 4em; margin-bottom: 20px;}
.no-results h3 {color: var(--cor_1); font-size: 1.8em; font-weight: 700; margin-bottom: 15px;}
.no-results p {color: var(--cor_3); font-size: 1.1em; line-height: 1.6; margin-bottom: 25px;}
.btn-primary {background-color: var(--cor_1); color: white; padding: 12px 30px; border-radius: 25px; text-decoration: none; font-weight: 600; transition: all 0.3s ease;}
.btn-primary:hover {transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2); background-color: var(--cor_2);}
/*********************************************************/
.pagination {padding: 30px; border-radius: 15px;  text-align: center; margin-bottom: 60px;}
.pagination-info {color: var(--cor_3); margin-bottom: 20px; font-size: 0.95em;}
.pagination-nav {display: flex; justify-content: center; align-items: center; gap: 10px; flex-wrap: wrap;}
.page-btn {padding: 10px 15px; border: 2px solid #e0e0e0; border-radius: 8px; color: var(--cor_3); text-decoration: none; font-weight: 600; transition: all 0.3s ease; min-width: 45px; text-align: center;}
.page-btn:hover, .page-btn.active {background: var(--cor_1); color: white; border-color: var(--cor_1); transform: translateY(-2px);}
.page-btn.first, .page-btn.last, .page-btn.prev, .page-btn.next {background: var(--cor_2); color: white; border-color: var(--cor_2);}
/*********************************************************/
.contato {position: relative; background-image: url(../images/bg-site.jpg);}
.contato .header {margin-bottom: 60px; text-align: center;}
.contato .intro h1 {color: var(--cor_1); font-size: 3.5em; font-weight: 800; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px;}
.contato .intro p {color: var(--cor_3); max-width: 800px; margin: 0 auto;}

.contato .grid {display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 60px;}

.contato .info {display: flex; flex-direction: column; gap: 25px;}
.contato .info-card {background: white; border-radius: 15px; padding: 30px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1); transition: all 0.3s ease;}
.contato .info-card:hover {transform: translateY(-5px); box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);}

.contato .info-header {display: flex; align-items: center; gap: 15px; margin-bottom: 10px; padding-bottom: 15px; border-bottom: 2px solid #f0f0f0;}
.contato .info-header i {color: var(--cor_1); font-size: 1.5em;}
.contato .info-header h3 {color: var(--cor_1); font-size: 1.2em; font-weight: 700;}

.contato .info-content {display: flex; flex-direction: column; gap: 10px;}
.contato .contact-item {display: flex; align-items: center; gap: 15px; padding: 10px 0;}
.contato .contact-item i {color: var(--cor_2); font-size: 1.2em; width: 20px;}
.contato .contact-item .label {color: var(--cor_3); font-size: 0.9em; font-weight: 600; display: block;}
.contato .contact-link {color: var(--cor_1); font-weight: 600; text-decoration: none; transition: color 0.3s ease;}
.contato .contact-link:hover {color: var(--cor_2);}

.contato .endereco-item {display: flex; align-items: flex-start; gap: 15px; margin-bottom: 15px;}
.contato .endereco-item i {color: var(--cor_2); font-size: 1.2em; margin-top: 3px;}
.contato  .endereco-text {display: flex; flex-direction: column; color: var(--cor_3); line-height: 1.6;}

.contato .form-card {background: white; border-radius: 15px; padding: 30px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);}
.contato .form-header {margin-bottom: 30px; text-align: center;}
.contato .form-header h3 {color: var(--cor_1); font-size: 1.8em; font-weight: 700; margin-bottom: 10px;}
.contato .form-header p {color: var(--cor_3); line-height: 1.6;}

.contato .contact-form {display: flex; flex-direction: column; gap: 20px;}
.contato .form-row {display: grid; grid-template-columns: 1fr 1fr; gap: 20px;}
.contato .form-group {position: relative;}
.contato .form-group i {padding-top: 30px;}
.contato .form-group label {color: var(--cor_1); font-weight: 600; margin-bottom: 8px; display: block;}
.contato .form-group input, .form-group select, .form-group textarea {width: 100%; padding: 15px 45px 15px 15px; border: 2px solid #e0e0e0; border-radius: 10px; font-size: 1em; transition: all 0.3s ease; background: white; font-family: var(--font_p);}
.contato .form-group input:focus, .form-group select:focus, .form-group textarea:focus {border-color: var(--cor_2); box-shadow: 0 0 0 3px rgba(94, 139, 147, 0.1); outline: none;}
.contato .form-icon {position: absolute; right: 15px; top: 50%; transform: translateY(-50%); color: var(--cor_3); pointer-events: none;}
.contato .form-group textarea + .form-icon {top: 90px;}
.contato .form-group textarea {resize: none; height: 160px; font-family: var(--font_p);}

.contato .form-actions {display: flex; gap: 15px; margin-top: 10px;}
.contato .btn-submit {flex: 1; padding: 15px 25px; border: none; border-radius: 10px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; display: flex; align-items: center; justify-content: center; gap: 8px;}
.contato .btn-submit {background-color: var(--cor_1); color: white;}
.contato .btn-submit:hover {transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);}

.contato iframe {width: 100%; height: 450px;}
.contato .mapa-section {margin-bottom: 60px;}
.contato .mapa-header {text-align: center; margin-bottom: 30px;}
.contato .mapa-header h3 {color: var(--cor_1); font-size: 2.2em; font-weight: 700; margin-bottom: 10px;}
.contato .mapa-header p {color: var(--cor_3); font-size: 1.1em;}
.contato .mapa-container {position: relative; border-radius: 15px; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);}
/*********************************************************/
.noticia-completa { max-width: 80%; margin: 0 auto; }
.noticia-imagem-destaque { position: relative; width: 80%; margin: 0 auto 30px auto; border-radius: 12px; overflow: hidden;  }
.noticia-imagem-destaque img { width: 100%; height: 100%; object-fit: cover; }
.noticia-header { margin-bottom: 40px; }
.noticia-titulo-principal { font-size: 1.6em; color: var(--cor_1); font-weight: 700; line-height: 1.3; margin-bottom: 20px; }
.noticia-meta { display: flex; align-items: center; gap: 20px; margin-bottom: 25px; padding-bottom: 20px; border-bottom: 2px solid #f1f2f6; }
.noticia-data-meta { display: flex; align-items: center; gap: 8px; color: var(--cor_5); font-size: 0.95rem; font-weight: 500; }
.noticia-data-meta i { color: var(--cor_1); }
.noticia-resumo-destaque { background: #f8f9fa; padding: 25px; border-radius: 10px; border-left: 4px solid var(--cor_1); font-size: 1em; line-height: 1.7; color: var(--cor_5); font-style: italic; }
.noticia-conteudo-completo { margin-bottom: 40px; text-align: justify; }

.noticia-acoes { display: flex; justify-content: space-between; align-items: center; padding-top: 30px; border-top: 2px solid #f1f2f6; flex-wrap: wrap; gap: 20px; }
.noticia-compartilhar { display: flex; align-items: center; gap: 15px; }
.noticia-compartilhar span { color: #7f8c8d; font-weight: 500; }
.btn-share { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; text-decoration: none; color: white; transition: all 0.3s ease; font-size: 1.1rem; }
.btn-share.facebook { background: #3b5998; }
.btn-share.facebook:hover { background: #2d4373; transform: translateY(-2px); box-shadow: 0 4px 15px rgba(59, 89, 152, 0.4); }
.btn-share.twitter { background: #1da1f2; } 
.btn-share.twitter:hover { background: #0d8bd9; transform: translateY(-2px); box-shadow: 0 4px 15px rgba(29, 161, 242, 0.4); }
.btn-share.whatsapp { background: #25d366; }
.btn-share.whatsapp:hover { background: #1ebe57; transform: translateY(-2px); box-shadow: 0 4px 15px rgba(37, 211, 102, 0.4); }
/*********************************************************/