/* =========================================================
   🎨 VARIÁVEIS GERAIS
========================================================= */
:root {
  --nav-h: 90px;
  --verde: #009b94;
  --amarelo: #ffc107;
  --cinza-claro: #f8f9fa;
  --texto: #222;
}

/* Reset */
* {
  box-sizing: border-box;
  animation: none !important;
  transition: none !important;
}

/* =========================================================
   🌐 GLOBAL
========================================================= */
body {
  font-family: "Inter", Arial, sans-serif;
  margin: 0;
  padding: 0;
  padding-top: var(--nav-h);
  color: var(--texto);
  background: var(--cinza-claro);
}

/* =========================================================
   🚀 NAVBAR
========================================================= */
.navbar {
  background-color: var(--verde);
  height: var(--nav-h);
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1030;
}

.logo-navbar { height: 46px; }

.navbar-toggler {
  border: 2px solid rgba(255,255,255,0.7);
  border-radius: 6px;
  padding: 6px 10px;
}

.navbar-toggler-icon {
  width: 24px;
  height: 2px;
  background: #fff;
  box-shadow: 0 6px 0 #fff, 0 12px 0 #fff;
}

.navbar-nav .nav-link {
  color:#fff !important; font-weight:600; text-transform:uppercase;
}

@media (max-width: 992px) {
  .navbar-collapse {
    background:var(--verde);
    padding:1rem;
    border-radius:0 0 10px 10px;
  }
}

/* =========================================================
   🖼️ BANNERS
========================================================= */
section {
  width:100%;
  position:relative;
  overflow:hidden;
}
section img {
  width:100%;
  height:auto;
  object-fit:contain;
}

/* =========================================================
   🟨 BOTÕES (tamanho)
========================================================= */

.img-regulamento-link,
.img-inscricao-link {
  width:300px;
  height:auto;
}

@media (max-width:1024px) {
  .img-regulamento-link, .img-inscricao-link { width:240px; }
}
@media (max-width:768px) {
  .img-regulamento-link, .img-inscricao-link { width:200px; }
}
@media (max-width:480px) {
  .img-regulamento-link, .img-inscricao-link { width:160px; }
}

/* =========================================================
   🎯 POSIÇÃO SIMPLIFICADA DOS BOTÕES NOS BANNERS
========================================================= */
/* === Desktop === */
.btn-banner12 { --top: 45%; --left: 70%; }
.btn-banner13 { --top: 80%; --left: 58.5%; }
.btn-banner14 { --top: 86%; --left: 50%; }
.btn-banner16-regulamento { --top: 80%; --left: 22%; }
.btn-banner16-inscricao { --top: 55%; --left: 75%; }

/* Base */
.btn-banner12,
.btn-banner13,
.btn-banner14,
.btn-banner16-regulamento,
.btn-banner16-inscricao {
  position: absolute;
  top: var(--top);
  left: var(--left);
  transform: translate(-50%, -50%);
  z-index: 15;
}

/* =========================================================
   📱 Tablet
========================================================= */
@media (max-width: 992px) {
  .btn-banner12 { --top: 45%; --left: 50%; }
  .btn-banner13 { --top: 82%; --left: 50%; }
  .btn-banner14 { --top: 88%; --left: 50%; }
  .btn-banner16-regulamento { --top: 78%; --left: 42%; }
  .btn-banner16-inscricao { --top: 78%; --left: 58%; }
}

/* =========================================================
   📱 Mobile
========================================================= */
@media (max-width: 768px) {
  .btn-banner12 { --top: 52%; --left: 70%; }
  .btn-banner13 { --top: 82%; --left: 67%; }
  .btn-banner14 { --top: 75%; --left: 50%; }
  .btn-banner16-regulamento { --top: 82%; --left: 22%; }
  .btn-banner16-inscricao { --top: 61%; --left: 75%; }
}

/* Extra Small */
@media (max-width: 480px) {
  .btn-banner14 { --top: 88%; --left: 50%; }
}

/* =========================================================
   🦶 RODAPÉ
========================================================= */
.rodape {
  position: relative;
  background: url("/img/17.png") no-repeat center bottom;
  background-size: cover;
  padding: 10px 0;
  color: #000;
}

.rodape-conteudo {
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding-left:20px;
}

.rodape-contato {
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:8px;
}

.rodape-contato img { width:26px; height:26px; }

.rodape-icones {
  display:flex;
  gap:10px;
  margin-top:15px;
}

.rodape-icones a img {
  width:28px;
  height:28px;
  opacity:.9;
}

/* ===== Mobile footer ===== */
@media (max-width: 768px) {
  .rodape {
    background: none !important;
    background-color:#f8f9fa;
    padding:30px 0;
  }

  .rodape-conteudo {
    align-items:flex-start !important;
    padding-left:20px;
    text-align:left;
  }

  .rodape-icones img { width:22px; height:22px; }
}