/* Estilos personalizados para SolDeCieneguilla */
/* Tipografías, colores de marca y base */

:root {
  --brand-primary: #2e7d32; /* verde bosque */
  --brand-accent: #d4a017;  /* dorado cálido */
  --brand-dark-surface: #1e2420; /* pizarra verdosa */
  --brand-light-surface: #f6f7f4; /* marfil suave */
  --brand-muted: #6b7a70; /* gris salvia */
  --font-body: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  --font-heading: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

body { font-family: var(--font-body); font-weight: 400; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
h1, h2, h3, h4, h5, h6,
.display-1, .display-2, .display-3, .display-4, .display-5, .display-6,
.navbar-brand { font-family: var(--font-heading); font-weight: 600; }
.btn { font-family: var(--font-body); }

.navbar :is(.navbar-brand, .nav-link) { transition: color .15s ease-in-out; }
.navbar :is(.navbar-brand, .nav-link):hover { color: var(--brand-accent) !important; }
/* Navbar por esquema de tema */
[data-bs-theme="dark"] .navbar.navbar-dark.bg-dark { background-color: var(--brand-dark-surface) !important; }
[data-bs-theme="light"] .navbar.navbar-dark.bg-dark { background-color: var(--brand-light-surface) !important; }
[data-bs-theme="light"] .navbar.navbar-dark :is(.navbar-brand, .nav-link) { color: var(--brand-dark-surface) !important; }
[data-bs-theme="light"] .navbar.navbar-dark .navbar-toggler { border-color: rgba(30,36,32,.25); }
/* Toggler hamburguesa visible en modo claro */
[data-bs-theme="light"] .navbar.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(30,36,32,0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
[data-bs-theme="light"] .navbar.navbar-dark .navbar-toggler { background-color: rgba(30,36,32,.06); }
/* Visibilidad del foquito (theme toggle) en modo claro/oscuro */
[data-bs-theme="light"] .navbar #themeIcon { color: var(--brand-accent) !important; opacity: .95; }
[data-bs-theme="dark"] .navbar #themeIcon { color: #fff !important; opacity: .95; }
[data-bs-theme="light"] .navbar .text-white { color: var(--brand-dark-surface) !important; }
[data-bs-theme="light"] .navbar .form-check-input { border-color: var(--brand-muted); }
[data-bs-theme="light"] .navbar .form-check-input:checked { background-color: var(--brand-primary); border-color: var(--brand-primary); }
.navbar .brand-logo { height: 60px; width: auto; }
.footer-logo { height: 40px; width: auto; }
/* Hero */
/* Encabezado con imagen de fondo y overlay para legibilidad */
.hero {
  min-height: 62vh;
  padding-top: 5rem; /* compensar navbar fija */
  background-image: url('../img/hero.jpg');
  background-size: cover;
  background-position: center;
  position: relative;
}
.hero .carousel,
.hero .carousel-inner,
.hero .carousel-item { height: 100%; }
.hero .carousel-item img { object-fit: cover; }
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.25) 100%);
}
.hero .container { position: relative; z-index: 2; }

#casaCarousel { border-radius: 1rem; overflow: hidden; }
#casaCarousel .carousel-item img { border-radius: 1rem; }
#casaCarousel .carousel-control-prev,
#casaCarousel .carousel-control-next { width: 3rem; }
#casaCarousel .carousel-control-prev-icon,
#casaCarousel .carousel-control-next-icon { width: 2.5rem; height: 2.5rem; border-radius: 50%; background-color: rgba(0,0,0,.35); filter: drop-shadow(0 2px 3px rgba(0,0,0,.35)); }
[data-bs-theme="dark"] #casaCarousel .carousel-control-prev-icon,
[data-bs-theme="dark"] #casaCarousel .carousel-control-next-icon { background-color: rgba(255,255,255,.25); }
[data-bs-theme="light"] #casaCarousel .carousel-control-prev-icon,
[data-bs-theme="light"] #casaCarousel .carousel-control-next-icon { background-color: rgba(0,0,0,.35); }

/* Categorías cards */
/* Tarjetas de categorías con overlay y título centrado */
.category-card {
  position: relative;
  aspect-ratio: 16 / 9;
  display: grid;
  place-items: center;
  color: #fff;
}
.category-card :is(.carousel, .carousel-inner, .carousel-item) { width: 100%; height: 100%; }
.category-card .carousel-item img { width: 100%; height: 100%; object-fit: cover; }
.carousel.carousel-fade .carousel-item { opacity: 0; transition: opacity .8s ease-in-out; transform: none; }
.carousel.carousel-fade .carousel-item.active,
.carousel.carousel-fade .carousel-item-next.carousel-item-start,
.carousel.carousel-fade .carousel-item-prev.carousel-item-end { opacity: 1; }
.carousel.carousel-fade .active.carousel-item-start,
.carousel.carousel-fade .active.carousel-item-end { opacity: 0; }
.category-card .category-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.25);
  z-index: 2;
}
.category-card .category-content { position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; }
.category-card .category-title {
  font-size: clamp(1.25rem, 3.5vw, 2.25rem);
  font-weight: 600;
  text-transform: capitalize;
  text-shadow: 0 1px 2px rgba(0,0,0,.4);
  text-align: center;
  transition: color .15s ease-in-out;
  margin: 0;
}
/* removed duplicate rule by consolidating centering above */

.category-title:hover { color: var(--brand-primary); }

.category-pequenas { background-image: url(); background-size: cover; background-position: center; }
.category-pequenas .category-overlay { background: linear-gradient(0deg, rgba(222,176,0,.55), rgba(0,0,0,.25)); }
.category-grandes { background-image: url(); background-size: cover; background-position: center; }
.category-grandes .category-overlay { background: linear-gradient(0deg, rgba(0,123,255,.55), rgba(0,0,0,.25)); }

/* Features grid dentro de las cards */
.features-grid { grid-template-columns: 1fr 1fr; }
.features-grid li { color: var(--bs-secondary-color); }

/* Nueva grilla de especificaciones estilo moderno */
.specs-divider { border-color: var(--brand-muted); opacity: .35; }
.specs-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; text-align: center; }
.specs-grid .spec-icon { font-size: 1.5rem; opacity: .9; }
.specs-grid .spec-label { color: var(--bs-secondary-color); font-size: .875rem; margin-top: .25rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.specs-grid .spec-value { font-weight: 600; font-size: 1rem; }
@media (max-width: 1199.98px) { .specs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1200px) { .specs-grid .spec-icon { font-size: 1.25rem; } .specs-grid .spec-label, .specs-grid .spec-value { font-size: .8125rem; } }

/* CTA íconos */
/* Íconos de llamada a la acción con hover adaptativo al tema */
.cta-icon { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: none; color: var(--bs-body-color); }
.cta-icon i { font-size: 2rem; width: 60px; height: 60px; display: grid; place-items: center; border: 1px solid var(--bs-border-color); border-radius: 50%; transition: all .15s ease-in-out; }
.cta-icon:hover i { background-color: var(--brand-primary); border-color: var(--brand-primary); color: #fff; }

.cta-icon .bi-whatsapp { color: #25D366; border-color: #25D366; }
.cta-icon .bi-facebook { color: #1877F2; border-color: #1877F2; }
.cta-icon .bi-instagram { color: #E1306C; border-color: #E1306C; }
.cta-icon .bi-tiktok { color: #EE1D52; border-color: #EE1D52; }
.cta-icon:hover .bi-whatsapp { background-color: #25D366; color: #fff; border-color: #25D366; }
.cta-icon:hover .bi-facebook { background-color: #1877F2; color: #fff; border-color: #1877F2; }
.cta-icon:hover .bi-instagram { background-image: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285AEB 90%); color: #fff; border-color: #d6249f; }
.cta-icon:hover .bi-tiktok { background-color: #EE1D52; color: #fff; border-color: #EE1D52; }

/* Footer */
/* Estado hover sutil para enlaces del pie */
footer a { opacity: .9; }
footer a:hover { opacity: 1; }
[data-bs-theme="dark"] footer a,
[data-bs-theme="dark"] footer .text-secondary { color: rgba(255,255,255,.88) !important; }
[data-bs-theme="dark"] footer a:hover { color: #fff !important; }
[data-bs-theme="light"] footer a,
[data-bs-theme="light"] footer .text-secondary { color: rgba(30,36,32,.85) !important; }

/* Footer por tema */
[data-bs-theme="light"] footer.bg-dark { background-color: #fff !important; color: var(--bs-body-color) !important; border-top: 1px solid var(--bs-border-color); }
[data-bs-theme="light"] footer.bg-dark a { color: var(--bs-body-color) !important; }
[data-bs-theme="light"] footer.bg-dark a:hover { color: var(--brand-primary) !important; }
[data-bs-theme="light"] footer.bg-dark .text-white { color: var(--brand-dark-surface) !important; }
[data-bs-theme="light"] footer.bg-dark .text-secondary { color: var(--bs-secondary-color) !important; }

[data-bs-theme="dark"] footer.bg-dark { background-color: var(--brand-dark-surface) !important; }

.card {
  --bs-card-border-radius: 1rem;
  --bs-card-inner-border-radius: 1rem;
}
.card { background-color: var(--brand-light-surface); overflow: hidden; }
[data-bs-theme="dark"] .card { background-color: #222a24; }

/* Hover rojo para enlaces de texto dentro de tarjetas */
.card .text-reset.text-decoration-none:hover { color: var(--brand-primary) !important; }

.card-img-top { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }

/* Paleta de botones y badges */
.btn-danger { background-color: var(--brand-accent); border-color: var(--brand-accent); }
.btn-danger:hover { background-color: #b8860b; border-color: #b8860b; }
.btn-outline-secondary { color: var(--brand-muted); border-color: var(--brand-muted); }
.btn-outline-secondary:hover { background-color: var(--brand-muted); color: #fff; }
.badge.text-bg-danger { background-color: var(--brand-accent) !important; color: #fff !important; }

.whatsapp-float {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1050;
  border-radius: 999px;
  box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15);
  padding: .5rem .875rem;
  font-weight: 600;
}

@media (max-width: 575.98px) {
  .whatsapp-float {
    width: 56px;
    height: 56px;
    padding: 0;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
  }
.whatsapp-float i { line-height: 1; }
}

/* Animación de scroll eliminada */

/* Offset para páginas con navbar fija y encabezado sin hero */
.content-offset { padding-top: 6rem; }
/* Reveal animations usando Bootstrap's fade */
.fade-slow { transition: opacity .6s ease-out, transform .6s ease-out !important; will-change: opacity, transform; }
.fade:not(.show) { opacity: 0; }
.fade.show { opacity: 1; }
.fade-up:not(.show) { transform: translateY(24px); }
.fade-left:not(.show) { transform: translateX(-18px); }
.fade-zoom:not(.show) { transform: scale(.96); }
.show.fade-up, .show.fade-left, .show.fade-zoom { transform: none; }
@media (prefers-reduced-motion: reduce) {
  .fade-slow { transition: 20px !important; }
  .fade-up:not(.show), .fade-left:not(.show), .fade-zoom:not(.show) { transform: 20px !important; }

/* Mejorar contraste de botones outline en modo oscuro */
[data-bs-theme="dark"] .btn-outline-dark { color: #fff; border-color: rgba(255,255,255,.6); }
[data-bs-theme="dark"] .btn-outline-dark:hover { color: #000; background-color: #fff; border-color: #fff; }
}

@media (max-width: 1200px) {
  .specs-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .specs-grid .spec-label { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
}