/* ========================= */
/* styles.css */
/* ========================= */

* {
  box-sizing: border-box;
}

body{
margin:0;
font-family:'Inter',sans-serif;
background:#f3e8da;
color:#3b3b3b;
line-height:1.6;
letter-spacing:0.5px;
}

h1,h2{
font-family:'Playfair Display',serif;
font-weight:700;
line-height:1.2;
margin-bottom:20px;
}

.section{
padding:80px 20px;
max-width: 1500px;
margin:auto;
transition: all 0.3s ease;
}

#beneficios {
  padding: 150px 20px;
  max-width: 1300px;
  margin: 0 auto;
  text-align: center;
}

/* NAVBAR */
.navbar{
background: white;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
position:sticky;
top:0;
z-index:100;
}

.nav-container{
display:flex;
justify-content:space-between;
align-items:center;
padding:0px 10px;
max-width:1300px;
margin:auto;
}

nav a{
margin-left:20px;
text-decoration:none;
color:#444;
font-weight:600;
transition: color 0.3s ease;
}

nav a:hover {
color:#c99644;
}

/* LOGO */
.logo-area{
display:flex;
align-items:center;
}

.logo-img{
width:250px;
margin-right:10px;
transition: width 0.3s ease;
}

.logo-text span{
display:block;
font-size:12px;
color:#777;
}

/* HERO */
.hero{
min-height:80vh;
background: url('imagem-fundo.png');
background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
padding: 20px;
position:relative;
}

.hero::before {
content:'';
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
background:rgba(0,0,0,0.1);
z-index:1;
}

.hero-content{
max-width:780px;
position:relative;
z-index:2;
}

h1{
font-size:52px;
margin-bottom:10px;
}

.subtitle{
font-size:22px;
margin-bottom:10px;
}

.features{
font-size:18px;
color:#6b6b6b;
}/* ========================= */

.program{
margin-top:20px;
font-size:30px;
color:#d4c6ae;
font-weight:600;
}

/* BOTÕES */
.btn{
display:inline-block;
margin-top:25px;
padding:16px 32px;
background:#b8770f;
color:white;
text-decoration:none;
border-radius:8px;
font-weight:600;
font-size:16px;
transition: all 0.3s ease;
border:2px solid #c99644;
}

.btn:hover {
background:#a67c3a;
border-color:#a67c3a;
transform:translateY(-2px);
box-shadow:0 4px 12px rgba(201, 150, 68, 0.3);
}

/* GRID */
.grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:30px;
margin-top:40px;
}

.card{
background:white;
padding:30px;
border-radius:12px;
box-shadow:0 4px 20px rgba(0,0,0,0.1);
text-align:center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

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

.card ul {
  text-align:left;
  margin: 0.75rem 0 0 1.2rem;
  padding-left: 1.2rem;
}

.card ul li {
  margin-bottom: 0.35rem;
}

.card h3 {
  text-align: center;
  margin-bottom: 0.65rem;
}

.card p {
  text-align: justify;
  margin-bottom: 0.6rem;
}

/* PROGRAMA */
.program-section{
background:#faf7f2;
padding:80px 40px;
border-radius:0;
transition: background 0.3s ease;
}

#programa{
background-image:linear-gradient(rgba(250,247,242,0.86), rgba(250,247,242,0.86)), url('imagem_sem_fundo_1.png');
background-size:cover;
background-position:center;
background-repeat:no-repeat;
}

#programa .program-section{
background:transparent;
}

.program-section p,
.program-section > div > p {
margin-left: 20px;
margin-right: 20px;
}

.program-section h2 {
text-align: center;
}

.text-center{
text-align:center;
max-width:800px;
margin:auto;
font-size:18px;
margin-bottom:20px;
line-height:1.6;
}

/* SOBRE */
.about{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
transition: gap 0.3s ease;
}

.profile{
background-image:linear-gradient(rgba(255,255,255,0.88), rgba(255,255,255,0.88)), url('convertido_2.png');
background-size:cover;
background-position:center;
background-repeat:no-repeat;
padding:40px;
border-radius:12px;
box-shadow:0 4px 20px rgba(0,0,0,0.1);
text-align:center;
transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.profile:hover {
transform:translateY(-5px);
box-shadow:0 8px 30px rgba(0,0,0,0.15);
}

.logo{
width:160px;
height:160px;
border-radius:0;
/* removido círculo para exibir apenas imagem */
/* border:2px solid #c6a46c; */
display:flex;
align-items:center;
justify-content:center;
margin:auto;
overflow:visible;
}

.logo img {
width:100%;
height:100%;
object-fit:contain;
}

.profile .role {
margin-top:16px;
line-height:1.5;
}

.profile .contact-info {
margin-top:16px;
}

.name{
font-size:26px;
margin-top:10px;
}

.role{
color:#423e3e;
}

.contact-info{
margin-top:10px;
font-weight:500;
}


/* CONTATO */
.contact-section{
text-align:center;
padding:80px 20px;
background:#f9f5f0;
border-radius:0;
transition: background 0.3s ease;
}

/* FOOTER */
footer {
text-align: center;
padding: 1em 0;
height: auto;
color:#471919;
width:100%;
box-sizing:border-box;
font-size:15px;
}

/* WHATSAPP */
.whatsapp{
position:fixed;
bottom:25px;
    
background:#25D366;
color:white;
padding:16px 20px;
border-radius:40px;
font-weight:bold;
text-decoration:none;
transition: all 0.3s ease;
z-index:1000;
}

.whatsapp:hover {
background:#1da851;
transform:scale(1.05);
}

/* RESPONSIVO */
@media(max-width:850px){

.about{
grid-template-columns:1fr;
gap:20px;
}

.nav-container{
  flex-wrap:wrap;
  gap:12px;
}

nav{
  width:100%;
  text-align:center;
}

nav a{
  margin:8px 10px;
  display:inline-block;
  font-size:14px;
}

h1{
font-size:36px;
}

.section{
  padding:60px 20px;
}

.hero{
  min-height:70vh;
}

.btn{
  padding:14px 28px;
  font-size:14px;
}

.card{
  padding:20px;
}

.profile{
  padding:30px;
}

}