html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }

/* ── Header glass ───────────────────────────────────────────────── */
.header-glass {
  background: rgba(250, 250, 247, 0.85);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(35, 52, 30, 0.08);
}

#main-header.scrolled .header-glass {
  background: rgba(250, 250, 247, 0.98);
  box-shadow: 0 10px 30px rgba(35, 52, 30, 0.06);
}

/* ── Nav links ──────────────────────────────────────────────────── */
.nav-link {
  position: relative;
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
  font-weight: 700;
  color: #23341E;
  border-radius: 0.5rem;
  transition: all 0.2s ease;
}
.nav-link:hover {
  background: rgba(160, 182, 36, 0.15);
}

.mobile-link {
  display: block;
  padding: 0.85rem 1rem;
  font-weight: 700;
  font-size: 0.95rem;
  color: #23341E;
  border-radius: 0.5rem;
  transition: background 0.2s;
}
.mobile-link:hover { background: rgba(160, 182, 36, 0.15); }

/* ── Grid pattern background ────────────────────────────────────── */
.grid-pattern {
  background-image:
    linear-gradient(rgba(160, 182, 36, 0.2) 1px, transparent 1px),
    linear-gradient(90deg, rgba(160, 182, 36, 0.2) 1px, transparent 1px);
  background-size: 40px 40px;
}

/* ── Glass cards ────────────────────────────────────────────────── */
.glass-card-light {
  background: rgba(255, 255, 255, 0.8);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}

.glass-card-dark {
  background: rgba(35, 52, 30, 0.5);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 0 24px 50px rgba(0, 0, 0, 0.3);
}

/* ── Hero Carousel ──────────────────────────────────────────────── */
#hero-carousel {
  position: relative;
}

#hero-carousel .hero-slide {
  position: absolute;
  inset: 0;
  transition: opacity 1s ease-in-out;
  z-index: 1;
}

#hero-carousel .hero-slide.active {
  opacity: 1 !important;
  z-index: 2;
}

/* Puntos indicadores */
.carousel-dot {
  cursor: pointer;
  outline: none;
}
.carousel-dot:hover {
  opacity: 0.8;
}

/* ── Responsive grid pattern ────────────────────────────────────── */
@media (max-width: 640px) {
  .grid-pattern { background-size: 25px 25px; }
}

/* ── Language Switcher ──────────────────────────────────────────── */
.lang-dropdown {
  min-width: 130px;
}
.lang-option {
  transition: background 0.15s, color 0.15s;
  cursor: pointer;
}
.lang-toggle {
  cursor: pointer;
  white-space: nowrap;
}
