/* --- ESTILOS PARA CLON STORE CABORCA --- */

:root {
  --color-fondo-oscuro: #221715;
  --color-fondo-claro: #6a4229;
  --color-acento-dorado: #cc9d55;
  --color-texto-beige: #fbebba;
  --font-titulos: 'Raleway', sans-serif;
}

/* --- ESTILOS GENERALES --- */
body, .bg-lighter { background-color: #fff; color: #333; }
h1, h2, h3, h4, h5, h6 { font-family: var(--font-titulos); font-weight: 700; color: #333; }
.rd-navbar-brand .logo-img { max-height: 200px; width: auto; }
.rd-navbar-mobile-brand .logo-img { max-height: 100px; }

/* --- HERO SECTION --- */
.hero-section-clonstore {
    position: relative; height: 100vh; display: flex; align-items: center; justify-content: center; text-align: center; color: #fff; overflow: hidden;
    background-image: url('../material/cover.jpg'); background-size: cover; background-position: center;
}
.hero-overlay-clonstore { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0, 0.6); z-index: 1; }
.hero-content-clonstore { position: relative; z-index: 2; max-width: 900px; padding: 20px; }
.hero-content-clonstore h1 { font-size: 3.5rem; font-weight: 800; color: #fff; text-shadow: 2px 2px 8px rgba(0,0,0,0.5); }
.hero-subtitle-clonstore { font-size: 1.3rem; font-weight: 300; color: rgba(255,255,255,0.9); }

/* --- BOTONES --- */
.btn-primary {
  background-color: var(--color-acento-dorado) !important; border-color: var(--color-acento-dorado) !important; color: #000 !important; font-weight: bold; text-transform: uppercase;
}
.btn-primary:hover {
  background-color: var(--color-texto-beige) !important; border-color: var(--color-texto-beige) !important; color: #000 !important;
}

/* --- SECCIÓN VENTAJAS --- */
.advantage-card { background: #fff; padding: 30px; text-align: center; border-radius: 8px; box-shadow: 0 5px 20px rgba(0,0,0,0.07); height: 100%; }
.advantage-icon { font-size: 2.5rem; color: var(--color-acento-dorado); margin-bottom: 15px; }
.advantage-card h6 { font-weight: 700; color: #333; }

/* --- GALERÍA Y SECCIONES OSCURAS --- */
.bg-custom-gradient { background: var(--color-fondo-oscuro); }
.bg-custom-gradient .title-block h5, .bg-custom-gradient .title-block p { color: var(--color-texto-beige); }
#paquetes .thumbnail-zoe:hover { box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
#paquetes .thumbnail-zoe figcaption { background: linear-gradient(0deg, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%); }
#paquetes .thumbnail-zoe-title { color: #fff; font-size: 1rem; }
.isotope.no-gutters > .isotope-item { padding: 2px; }

/* --- SECCIÓN VIDEOS --- */
.video-card { text-align: center; }
.video-card video { border-radius: 8px; box-shadow: 0 5px 20px rgba(0,0,0,0.1); margin-bottom: 15px; }
.video-card h6 { font-weight: 700; color: #333; }

/* --- NEWSLETTER --- */
#newsletter { background: var(--color-fondo-claro); }
#newsletter h5 { color: var(--color-texto-beige); }
#newsletter p { color: var(--color-texto-beige); }
#newsletter .form-subscribe .form-control { border: 2px solid #ddd; }
#newsletter .form-subscribe .btn { border-radius: 0 5px 5px 0 !important; }

/* --- FOOTER --- */
footer.page-footer { background-color: var(--color-fondo-oscuro); }
footer.page-footer .footer-title, footer.page-footer, footer.page-footer a, footer.page-footer .rights span { color: var(--color-texto-beige); }
footer.page-footer a:hover { color: var(--color-acento-dorado); }
footer.page-footer .form-control { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.2); color: #fff; }
footer.page-footer .form-control::placeholder { color: rgba(255,255,255,0.6); }

@media (max-width: 767px) {
    .hero-content-clonstore h1 { font-size: 2.5rem; }
}