/* ==== RESET ==== */
* {margin:0; padding:0; box-sizing:border-box;}
body {font-family:'Poppins', sans-serif; color:#222; background:linear-gradient(135deg,#fff,#f7f7f7);}
a {text-decoration:none; color:inherit;}
img {max-width:100%; display:block; height:auto;}

/* ==== HEADER ==== */
.site-header {
  background:#fff;
  border-bottom:2px solid #0094d0;
  position:sticky; top:0; z-index:1000;
}
.header-inner {
  display:flex; align-items:center; justify-content:space-between;
  padding:0.5rem 1rem;
}
.brand {display:flex; align-items:center; gap:0.5rem; font-weight:600;}
.brand-text {font-size:0.9rem; color:#a40013;}

/* ==== NAV ==== */
.primary-nav {display:flex;}
.primary-nav ul {display:flex; gap:1rem; list-style:none;}
.primary-nav a {
  padding:0.5rem 0.75rem; border-radius:6px; transition:0.3s;
}
.primary-nav a:hover {background:#0094d0; color:#fff;}

/* ==== HAMBURGER ==== */
.nav-toggle {display:none; background:none; border:none; cursor:pointer;}
.hamburger, .hamburger::before, .hamburger::after {
  content:""; display:block; height:3px; width:25px;
  background:#a40013; margin:6px 0; border-radius:3px; transition:0.3s;
}

/* ==== HERO / CAROUSEL ==== */
.hero {position:relative;}
.carousel {position:relative; overflow:hidden;}
.slides {display:flex; transition:transform 0.6s ease;}
.slide {min-width:100%; position:relative;}
.slide img {
  width:100%;
  height:auto;
  max-height:50vh;
  object-fit:cover;
}
.slide-caption {
  position:absolute; bottom:15%; left:10%;
  background:rgba(87, 8, 8, 0.7); color:#fff; padding:1rem; border-radius:10px;
  max-width:300px; font-weight:600;
}

/* Controles */
.carousel-control {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(0,0,0,0.5); border:none; color:#fff; font-size:2rem;
  cursor:pointer; padding:0.5rem; border-radius:50%;
}
.prev {left:10px;} .next {right:10px;}
.carousel-dots {position:absolute; bottom:10px; left:50%; transform:translateX(-50%); display:flex; gap:0.5rem;}
.carousel-dots button {
  width:12px; height:12px; border-radius:50%; border:none; cursor:pointer;
  background:#fff; opacity:0.6; transition:0.3s;
}
.carousel-dots button.active {background:#a40013; opacity:1;}

/* ==== SECCIONES ==== */
.container {padding:2rem 1rem; max-width:1100px; margin:auto;}
h3 {font-weight:700; color:#a40013; margin-bottom:1rem;}
.btn {
  display:inline-block; background:#0094d0; color:#fff; padding:0.75rem 1.25rem;
  border-radius:8px; font-weight:600; transition:0.3s;
}
.btn:hover {background:#a40013;}

/* ==== FOOTER ==== */
.site-footer {text-align:center; padding:0.3rem; background:#a40013; color:#fff;}

/* ==== RESPONSIVE ==== */
@media (max-width:768px){
  .primary-nav {
    position:absolute;
    top:60px; 
    right:0;
    background:#fff;
    width:220px;
    flex-direction:column;
    border-left:2px solid #0094d0;
    z-index:9999;
    max-height:0;           /* cerrado */
    overflow:hidden;        /* oculta elementos cuando está cerrado */
    transition:max-height 0.4s ease;
  }
  .primary-nav.open {
    max-height:80vh;        /* abierto */
    overflow-y:auto;
  }
  .primary-nav ul {
    flex-direction:column;
    padding:1rem;
    gap:0.5rem;
  }
  .primary-nav li {
    border-bottom:1px solid #eee;
  }
  .nav-toggle {
    display:block;
  }
}