/* ==========================================================================
   THEME — tokens, reset, base e componentes compartilhados
   ========================================================================== */

/* 1) Tokens (cores, medidas, z-index, etc.) */
:root{
  --cor-verde: #26AD7D;
  --cor-azul: #004AAD;
  --cor-azul-escuro: #091253;
  --cor-preto: #000;
  --cor-branco: #fff;
  --cor-bege: #efeae1;

  --nav-h: 64px;
  --lazer-gutter: 2cm;   /* ~2 cm laterais no desktop */
  --lazer-gap: 0px;      /* gap base do Lazer */
}

/* 2) Reset + base */
*{ box-sizing: border-box; }
html, body{ height: 100%; }
body{
  font-family: "Segoe UI","Helvetica Neue",Arial,sans-serif;
  line-height: 1.6;
  margin: 0;
  color: var(--cor-preto);
  background: var(--cor-bege);
  overflow-x: hidden; /* evita barra horizontal global */
}

.hidden{ display:none !important; }
.alert{
  background:#fff3cd; border:1px solid #ffe69c; color:#664d03;
  padding:.75rem 1rem; border-radius:8px;
}
:focus-visible{ outline:3px solid rgba(0,74,173,.35); outline-offset:3px; }
.menu-open{ overflow:hidden; }

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

/* 3) Botões (compartilhados) */
.btn{ display:inline-block; padding:.8rem 1.5rem; border-radius:6px; font-weight:600; transition:.25s; }
.btn-primary{ background:#26ad7e7a; color:#fff; text-decoration:none; }
.btn-primary:hover{ background:#008b5b; }
.btn-outline{ border:2px solid #fff; color:#fff; text-decoration:none; }
.btn-outline:hover{ background:#fff; color:#004aad; }

/* 4) Header fixo + navegação (compartilhados) */
.top-nav.fixed{
  position:fixed; inset:0 auto auto 0; right:0; z-index:1000;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  transition: transform .24s ease, background .2s ease, box-shadow .2s ease;
}
.top-nav.fixed.hide{ transform: translateY(-100%); }
.top-nav.fixed.scrolled{
  background: rgba(0,0,0,.70);
  box-shadow: 0 6px 22px rgba(0,0,0,.18);
}
.top-nav{ display:block; padding:0 !important; }
.top-nav .nav-container{
  max-width:none; width:100%; margin:0;
  padding-left:24px; padding-right:24px;
  min-height: var(--nav-h);
  display:flex; align-items:center; justify-content:space-between;
}
.logo{ display:flex; align-items:center; margin-left:0; }
.logo-img{ height:40px; vertical-align:middle; }
.nav-links{ display:flex; align-items:center; gap:1rem; margin-right:0; }
.nav-links a{ color:#fff; text-decoration:none; font-weight:500; }
body.has-top-nav{ padding-top: var(--nav-h); }
@media (max-width:900px){ :root{ --nav-h:72px; } }

/* Menu mobile */
.hamburger{ display:none; }
@media (max-width:900px){
  .nav-links{ display:none !important; }
  .hamburger{
    display:inline-flex !important;
    width:44px; height:44px; align-items:center; justify-content:center;
    background:transparent; border:0; border-radius:8px; cursor:pointer;
  }
  .hamburger i{ font-size:22px; color:#fff; line-height:1; }
  .hamburger:active{ transform: scale(.97); }
}
.mobile-overlay{
  position:fixed; inset:0; z-index:1200;
  background: rgba(0,0,0,.55);
  opacity:0; pointer-events:none; transition:opacity .2s ease;
}
.mobile-overlay.open{ opacity:1; pointer-events:auto; }
.mobile-drawer{
  position:absolute; top:0; right:0;
  width:min(84vw,380px); height:100%;
  background:#0b0b0d; color:#e5e7eb;
  padding:16px; display:flex; flex-direction:column;
  transform: translateX(100%); transition: transform .26s ease;
  box-shadow:-12px 0 32px rgba(0,0,0,.25);
}
.mobile-overlay.open .mobile-drawer{ transform:translateX(0); }
.mobile-close{
  align-self:flex-end; background:transparent; border:0; color:#fff;
  font-size:28px; line-height:1; cursor:pointer; padding:6px;
}
.mobile-drawer a{
  color:#cbd5e1; text-decoration:none; padding:12px 4px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.mobile-drawer a:hover{ color:#fff; }

/* 5) Modal base compartilhado (lightboxes etc.) */
.modal-carousel{
  display:none; position:fixed; inset:0; z-index:3000;
  background: transparent !important;
  justify-content:center; align-items:center;
  touch-action: none;
}
.modal-carousel .close-modal{
  position:absolute; top:24px; right:28px; background:none; border:none;
  color:#fff; font-size:28px; cursor:pointer;
  text-shadow: 0 1px 2px rgba(0,0,0,.7), 0 0 8px rgba(0,0,0,.35);
}
.modal-carousel .modal-content{
  max-width:95vw; max-height:90vh; object-fit:contain;
  box-shadow: 0 14px 50px rgba(0,0,0,.35); border-radius: 8px;
  cursor: grab; user-select: none; will-change: transform; transform-origin:center;
}
.modal-carousel .modal-content:active{ cursor: grabbing; }
.modal-carousel .modal-nav{
  position:absolute; width:100%; top:50%; transform:translateY(-50%);
  display:flex; justify-content:space-between;
}
.modal-carousel .modal-prev,
.modal-carousel .modal-next{
  color:#fff; font-size:3rem; padding:0 1rem; cursor:pointer; user-select:none;
  text-shadow: 0 1px 2px rgba(0,0,0,.7), 0 0 8px rgba(0,0,0,.35);
}

/* 6) Seções genéricas */
.section{ padding:3rem 1rem; text-align:center; }
.section h2{
  font-size:2.2rem; font-weight:600; margin-bottom:1rem;
  padding-top:3rem; position:relative;
}
.section h2::after{
  content:""; display:block; width:60px; height:3px; background:var(--cor-verde);
  margin:.5rem auto 0; border-radius:3px;
}
.section .subtitulo-centro{
  color:#6b7280; letter-spacing:.12em; text-transform:uppercase; font-size:.9rem;
  margin-top:0; margin-bottom:1.2rem;
}

/* CTA + Footer */
.cta{
  background: linear-gradient(90deg,#005d69,#00727a);
  color:var(--cor-branco); width:100%; margin:0 !important; padding:3rem 1rem; text-align:center;
}
.cta h2{ margin:0 0 .5rem 0; font-size:2rem; font-weight:700; }
.cta p{ margin:0 0 1.25rem 0; font-size:1.05rem; }
.cta .btn-primary{ background:var(--cor-branco); color:var(--cor-verde); border:none; font-weight:700; }
.cta .btn-primary:hover{ filter:brightness(.76); }

.footer-dark{ background:#0b0b0d; color:#e5e7eb; }
.footer-dark .footer-top{ text-align:center; padding:2rem 1rem 1rem; border-bottom:1px solid rgba(255,255,255,.1); }
.footer-dark .slogan{ font-size:1.6rem; font-weight:300; margin:.25rem 0 1rem; }
.footer-dark .footer-logo{ height:64px; margin:.3rem 0 1rem; filter:brightness(1.1); }
.footer-dark .social{ display:flex; gap:.75rem; justify-content:center; font-size:1.1rem; }
.footer-dark .social a{ color:#e5e7eb; opacity:.8; }
.footer-dark .social a:hover{ opacity:1; }
.footer-dark .footer-links{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.5rem; max-width:1100px; margin:0 auto; padding:1.25rem 1rem 2rem;
}
.footer-dark .footer-links h4{ color:#fff; font-weight:600; margin:.4rem 0 .6rem; }
.footer-dark .footer-links a{ display:block; color:#cbd5e1; text-decoration:none; padding:.25rem 0; }
.footer-dark .footer-links a:hover{ color:#fff; }
.footer-dark .footer-bottom{
  text-align:center; color:#9ca3af; padding:1rem; border-top:1px solid rgba(255,255,255,.06);
}
@media (max-width:900px){ .footer-dark .footer-links{ grid-template-columns:1fr 1fr; } }
