/* ---------- Base / Reset ---------- */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #1e1e1e;
  background: #fffaf6; /* tom terroso claro */
}

/* Paleta: vermelho fogo + terrosos + verde opcional */
:root{
  --red-700:#b22222;
  --red-800:#951b1b;
  --earth-100:#fffaf6;
  --earth-200:#efe2d3;
  --earth-300:#d4bfa5;
  --earth-700:#5b4633;
  --green-700:#0b6b2b;
  --text:#1e1e1e;
}

/* ---------- Containers / Layout ---------- */
.container{ width: min(1100px, 92%); margin: 0 auto; }
.section{ padding: 3rem 0; }
.section-title{ font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: 1rem; }
.lead{ font-size: 1.1rem; color:#2b2b2b; }
.grid-2{
  display: grid; gap: 1.2rem;
  grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 900px){ .grid-2{ grid-template-columns: 1fr; } }

/* ---------- Header / Navbar ---------- */
.site-header{
  position: sticky; top: 0; z-index: 1000;
  background: linear-gradient(90deg, var(--red-700), var(--red-800));
  color: #fff;
}
.navbar{ display:flex; align-items:center; justify-content:space-between; padding: .6rem 0; }
.logo{ color:#fff; text-decoration:none; font-weight:800; letter-spacing:.5px; }
.script{ font-family: "Dancing Script", cursive; font-size: 1.8rem; }
.nav-links{ list-style:none; display:flex; gap:.4rem; margin:0; padding:0; }
.nav-links a{
  color:#fff; text-decoration:none; padding:.55rem .8rem; border-radius:.5rem; font-weight:600;
}
.nav-links a:hover{ background:#ffffff22; }
.nav-links a.active{ background:#ffffff33; }
.badge{ background:#ffffff22; border: 1px solid #ffffff55; }

.hamburger{
  display:none; background:none; border:none; color:#fff; font-size:1.5rem; cursor:pointer;
}
@media (max-width: 920px){
  .hamburger{ display:block; }
  .nav-links{ 
    position:absolute; left:0; right:0; top:60px;
    background: linear-gradient(90deg, var(--red-700), var(--red-800));
    padding: .6rem .8rem; flex-direction:column; gap:.2rem; display:none;
  }
  .nav-links.open{ display:flex; }
}

/* ---------- Hero (tela cheia) ---------- */
.hero{
  position: relative;
  min-height: 85vh;
  display: grid; place-items: center;
  background: url("img/img/fundo.jpg") center/cover no-repeat;
  color:#fff;
}
.hero-overlay{
  position:absolute; inset:0; background: linear-gradient(180deg, #00000066, #00000088);
}
.hero-content{ position:relative; text-align:center; }
.hero-title{ font-size: clamp(2.2rem, 4.5vw, 3.6rem); margin-bottom:.5rem; }
.hero-subtitle{ font-size: clamp(1rem, 2vw, 1.25rem); opacity:.95; }
.hero-actions{ margin-top:1rem; display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; }

/* ---------- Cards / Blocos ---------- */
.card{
  background:#fff; border:1px solid #00000010; border-radius: .8rem;
  padding: 1.1rem 1.2rem; box-shadow: 0 4px 18px #0000000e;
}
.tip{ background: #f6efe9; border-color: #00000014; }
.quiz{ border-left: 6px solid var(--green-700); }

/* ---------- Botões ---------- */
.btn{
  display:inline-block; text-decoration:none; font-weight:700;
  padding:.7rem 1rem; border-radius:.6rem; color:#fff; background: var(--green-700);
  transition: transform .04s ease, filter .2s ease;
}
.btn:hover{ filter: brightness(1.05); transform: translateY(-1px); }
.btn-outline{
  background: transparent; border:2px solid #fff; color:#fff;
}
.btn-danger{ background: var(--red-700); }
.soft{ background: #5b4633; }

/* ---------- Listas e contatos ---------- */
.list{ padding-left:1.1rem; }
.list li{ margin:.35rem 0; }
.contacts{ list-style: none; padding-left: 0; }
.contacts li{ margin:.35rem 0; }
.contacts a{ color: var(--red-700); font-weight:700; text-decoration:none; }
.contacts a:hover{ text-decoration: underline; }

/* ---------- Carrossel ---------- */
.carousel{
  position:relative; overflow:hidden; border-radius: .8rem;
  border: 1px solid #00000012; background:#00000008;
}
.slides{ display:none; }
.slides img{ width:100%; height:auto; display:block; }
.control{
  position:absolute; top:50%; transform: translateY(-50%);
  background:#00000066; color:#fff; border:none; padding:.4rem .6rem;
  border-radius:.6rem; cursor:pointer; font-size:1.4rem;
}
.prev{ left:.5rem; } .next{ right:.5rem; }
.dots{ display:flex; gap:.4rem; justify-content:center; padding:.6rem; }
.dot{
  width:10px; height:10px; border-radius:50%; border:none; cursor:pointer;
  background:#b3b3b3;
}
.dot.active{ background: var(--red-700); }

/* ---------- Footer ---------- */
.site-footer{
  margin-top: 2rem; background:#111; color:#eee; text-align:center; padding: 1rem;
  font-size:.95rem;
}

/* ---------- Acessibilidade ---------- */
fieldset{ border: 1px solid #00000020; border-radius:.6rem; margin: .8rem 0; }
legend{ font-weight: 700; }
label{ display:block; margin:.2rem 0; cursor:pointer; }
.quiz-resultado{ margin-top:.6rem; font-weight:800; }