/* Reset & base */
* { box-sizing: border-box; }
body {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background: #f5f5f5;
  height: 100%;
}

/* ========== NAVBAR STYLES ========== */
.navbar {
  background: #ffffff;
  padding: 1rem 3rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.logo-container { display:flex; align-items:center; }
.logo { display:flex; align-items:center; gap:0.5rem; text-decoration:none; transition:transform .3s ease; }
.logo:hover { transform: scale(1.1); }
.logo-icon { width:48px; height:48px; }
.logo-text { font-size:1.5rem; font-weight:bold; color:#000000; }

.nav-menu {
  display:flex;
  align-items:center;
  gap:2.5rem;
  list-style:none;
  margin:0;
  padding:0;
}

.nav-link {
  color:#000000;
  text-decoration:none;
  font-size:1rem;
  font-weight:500;
  transition:all .3s ease;
  position:relative;
  padding-bottom:2px;
}

.nav-link:hover { color:#dc0000; text-decoration:underline; }

.icon-button {
  background:none;
  border:none;
  cursor:pointer;
  padding:.5rem;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:transform .2s ease;
}

.icon-button:hover { transform: scale(1.1); }

.icon-button svg { width:24px; height:24px; transition:fill .3s ease; }
.icon-button:hover svg { fill:#dc0000; }

.search-bar {
  position:absolute;
  top:100%;
  left:0;
  right:0;
  background:#ffffff;
  box-shadow:0 4px 12px rgba(0,0,0,0.15);
  padding:1.5rem 3rem;
  transform: translateY(-100%);
  opacity:0;
  visibility:hidden;
  transition: all .3s ease;
  z-index:1000;
}

.search-bar.active {
  transform: translateY(0);
  opacity:1;
  visibility:visible;
}

.search-container {
  display:flex;
  align-items:center;
  gap:1rem;
  max-width:600px;
  margin:0 auto;
  position:relative;
}

.search-input {
  flex:1;
  padding:.75rem 1rem;
  border:2px solid #e0e0e0;
  border-radius:8px;
  font-size:1rem;
  outline:none;
  transition:border-color .3s ease;
}

.search-input:focus { border-color:#dc0000; }

.search-submit {
  background:#dc0000;
  border:none;
  padding:.75rem;
  border-radius:8px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:background-color .3s ease;
}

.search-submit:hover { background:#b30000; }
.search-submit svg { width:20px; height:20px; fill:white; }

.search-close {
  background:none;
  border:none;
  font-size:1.5rem;
  cursor:pointer;
  color:#666;
  padding:.5rem;
  border-radius:50%;
  width:40px;height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.search-close:hover { background:#f0f0f0; color:#dc0000; }

/* ========== MAIN CONTENT STYLES ========== */
.main-section {
  padding:4rem 2rem;
  text-align:center;
  min-height:80%;
  display:flex;
  align-items:center;
  justify-content:center;
  background: url('https://images.unsplash.com/photo-1481627834876-b7833e8f5570?ixlib=rb-4.0.3&auto=format&fit=crop&w=2070&q=80') center/cover no-repeat;
  position: relative;
}

.main-section::before {
  content: '';
  position:absolute;
  top:0; left:0; right:0; bottom:0;
  background: inherit;
  filter: blur(8px);
  z-index:-1;
}

.section-divider { height:4px; background:#dc0000; margin:0; border:none; }

/* ========== CARDS SECTION ========== */
.cards-section { padding:4rem 2rem; background:#f8f9fa; }
.cards-container { max-width:1200px; margin:0 auto; }
.card-header { text-align:center; margin-bottom:3rem; }

.card-title {
  background:#ffffff;
  color:#dc0000;
  border:2px solid #dc0000;
  padding:1rem 2rem;
  border-radius:8px;
  font-size:1.5rem;
  font-weight:600;
  display:inline-block;
  margin:0;
  box-shadow:0 2px 8px rgba(0,0,0,0.1);
}

.card-title:hover { transform:scale(1.05); box-shadow:0 4px 15px rgba(0,0,0,0.2); }

.cards-grid {
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap:2rem;
  margin-top:2rem;
}

.card {
  padding:2rem;
  border-radius:12px;
  box-shadow:0 4px 15px rgba(0,0,0,0.1);
  transition: transform .3s ease, box-shadow .3s ease;
  cursor:pointer;
  text-decoration:none;
  display:block;
}

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

.card-red { background:#dc0000; color:#ffffff; }
.card-white { background:#ffffff; color:#dc0000; border:2px solid #dc0000; }

.card-heading { font-size:1.5rem; font-weight:700; margin:0 0 1rem 0; line-height:1.3; }
.card-text { font-size:1rem; line-height:1.6; margin:0; opacity:0.9; }
.card-white .card-text { opacity:0.8; }

.main-container { max-width:600px; margin:0 auto; }

.main-title {
  font-size:4rem;
  font-weight:800;
  color:#ffffff;
  margin:0 0 3rem 0;
  text-shadow:0 4px 20px rgba(0,0,0,0.8), 0 2px 10px rgba(0,0,0,0.6);
}

.button-container { display:flex; gap:2rem; justify-content:center; flex-wrap:wrap; }

.access-button {
  display:flex; align-items:center; gap:.75rem;
  padding:1.25rem 2rem; border:none; border-radius:12px;
  font-size:1.1rem; font-weight:600; cursor:pointer; transition:all .3s ease;
  box-shadow:0 4px 15px rgba(0,0,0,0.1); min-width:200px; text-decoration:none;
}

/* spacer dentro do grid de cards: ocupa uma célula vazia */
.card-spacer {
  /* força o grid a alocar uma célula — altura mínima discreta */
  min-height: 1px;
  width: 100%;
  background: transparent;
  pointer-events: none;
}


.button-icon { width:24px; height:24px; fill:currentColor; }

.access-button.restricted { background:#dc0000; color:white; }
.access-button.restricted:hover { background:#b30000; transform:translateY(-2px); box-shadow:0 6px 20px rgba(220,0,0,0.3); }

.access-button.open { background:#28a745; color:white; }
.access-button.open:hover { background:#218838; transform:translateY(-2px); box-shadow:0 6px 20px rgba(40,167,69,0.3); }

/* ========== FOOTER STYLES ========== */
.footer { background:#000000; color:#ffffff; padding:3rem 2rem 1rem; }
.footer-container { max-width:1200px; margin:0 auto; }
.footer-content { display:grid; grid-template-columns: repeat(auto-fit, minmax(250px,1fr)); gap:2rem; margin-bottom:2rem; }

.footer-section h3 {
  color:#dc0000; font-size:1.2rem; font-weight:600; margin:0 0 1rem 0;
  border-bottom:2px solid #dc0000; padding-bottom:.5rem;
}

.footer-section p, .footer-section li {
  font-size:.9rem; line-height:1.6; margin:0 0 .5rem 0; color:#ecf0f1;
}

.footer-section ul { list-style:none; padding:0; margin:0; }

.footer-section a { color:#ecf0f1; text-decoration:none; transition:color .3s ease; }
.footer-section a:hover { color:#dc0000; text-decoration:underline; }

.footer-bottom { border-top:1px solid #333333; padding-top:1rem; text-align:center; }
.footer-bottom p { font-size:.85rem; color:#bdc3c7; margin:0; }

.footer-logo { display:flex; align-items:center; gap:.75rem; margin-bottom:1rem; }
.footer-logo-icon { width:32px; height:32px; }
.footer-logo-text { font-size:1.1rem; font-weight:600; color:#ffffff; }

/* Responsivo */
@media (max-width:768px) {
  .navbar { padding:1rem; flex-wrap:wrap; gap:1rem; }
  .nav-menu { gap:1rem; flex-wrap:wrap; justify-content:center; }
  .logo-text { font-size:1.2rem; }
  .nav-link { font-size:0.9rem; }
  .search-bar { padding:1rem; }
  .search-container { flex-direction:column; gap:.5rem; }
  .search-input { width:100%; }
  .main-title { font-size:2.5rem; }
  .button-container { flex-direction:column; gap:1rem; align-items:center; }
  .access-button { width:100%; max-width:300px; }
  .cards-grid { grid-template-columns:1fr; gap:1.5rem; }
  .card { padding:1.5rem; }
  .card-heading { font-size:1.3rem; }
  .card-text { font-size:.95rem; }
}