:root {
                --azul-oscuro: #001a33; 
                --azul-terramar: #002855;
                --dorado: #C5A059;
                --dorado-claro: #fcf4e5;
                --blanco: #ffffff;
                --whatsapp: #128C7E;
            }

            body {
                font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
                margin: 0;
                background-color: var(--azul-oscuro);
                color: var(--blanco);
                text-align: center;
                line-height: 1.5;
                -webkit-font-smoothing: antialiased;
            }

            /* --- LANDING HERO --- */
            .landing-hero {
                background: linear-gradient(rgba(0,26,51,0.9), rgba(0,26,51,0.9)), url('../imagenes/burbujasOleo.webp');
                background-size: cover;
                /* ---background-position: center;--- */
                /* ---border-bottom: 4px solid var(--dorado);--- */
            }

            .perfil-yessica {
                display: block;
                margin: 0 auto 15px;
                max-width: 90%;
                width: 450px;
                height: auto;
                border-radius: 10px;
                border: 3px solid var(--dorado);
                object-fit: contain;
                margin-top:110px;
            }

            @import url('https://fonts.googleapis.com/css2?family=Great+Vibes&display=swap');




            .subtitle { font-size: 1.1rem; margin-bottom: 25px; opacity: 0.95; }
    
            .social-proof-bubble { 
                font-size: 0.85rem; 
                background: rgba(255,255,255,0.1); 
                padding: 5px 15px; 
                border-radius: 20px; 
                display: inline-block; 
                margin-bottom: 15px;
                border: 1px solid rgba(197, 160, 89, 0.4);
            }

                    /* --- SECCIÓN EQUIPO --- */
            .team-section {
                padding: 50px 20px;
                background: var(--azul-terramar);
                border-top: 2px solid var(--dorado);
            }
            .team-section h2 {
                color: var(--dorado);
                margin-bottom: 20px;
            }
            .img-equipo {
                width: 100%;
                max-width: 800px;
                height: auto;
                border-radius: 15px;
                border: 2px solid var(--dorado);
                box-shadow: 0 10px 30px rgba(0,0,0,0.4);
            }
            .team-description {
                max-width: 600px;
                margin: 20px auto 0;
                font-size: 1.1rem;
                color: var(--blanco);
            }

            /* --- SECCIÓN KITS --- */
            .kits-section { padding: 40px 20px; background: var(--blanco); color: var(--azul-oscuro); }
            .kits-section h2 { color: var(--azul-terramar); font-size: 1.7rem; margin-bottom: 10px; }
            .img-kits { width: 100%; max-width: 500px; height: auto; border-radius: 10px; margin-bottom: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.1); }
            
            .que-incluye { 
                background: var(--dorado-claro); 
                padding: 20px; border-radius: 12px; 
                text-align: left; max-width: 460px; margin: 0 auto;
                border: 1px dashed var(--dorado); color: var(--azul-terramar);
            }
            .que-incluye ul { list-style: none; padding: 0; margin: 10px 0 0 0; }
            .que-incluye li::before { content: "✨"; margin-right: 8px; }

            /* --- GRID BENEFICIOS --- */
            .grid-beneficios { display: flex; flex-direction: column; gap: 15px; padding: 30px 20px; }
            .card-mini { background: rgba(255,255,255,0.05); padding: 25px; border-radius: 15px; border: 1px solid rgba(197, 160, 89, 0.3); }
            .card-mini h3 { color: var(--dorado); margin: 0 0 10px 0; font-size: 1.3rem; }

            /* --- COMPONENTES GLOBALES REFORZADOS --- */
            .cta-google { 
                display: flex !important; /* Fuerza el comportamiento de bloque */
                justify-content: center !important; 
                align-items: center !important; 
                background-color: var(--whatsapp) !important; 
                color: #ffffff !important; 
                padding: 22px 30px !important; 
                font-size: 1.2rem !important; 
                font-weight: 800 !important; 
                text-decoration: none !important; /* Quita el subrayado de link */
                border-radius: 15px !important; 
                margin: 25px auto !important; 
                width: 85% !important; 
                max-width: 500px; /* Evita que sea gigante en tablets */
                box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4) !important; 
                transition: all 0.3s ease !important;
                border: none !important;
                cursor: pointer !important;
                text-transform: uppercase;
            }

            .cta-google:hover {
                transform: scale(1.05) !important;
                background-color: #1ebe57 !important; /* Un verde un poco más oscuro al pasar el mouse */
                box-shadow: 0 12px 30px rgba(37, 211, 102, 0.6) !important;
            }

            /* --- SECCIÓN FAQ (ESTILO PREMIUM OSCURO) --- */
            .faq-section { 
                padding: 60px 20px; 
                background-color: var(--azul-oscuro); 
                border-top: 1px solid rgba(197, 160, 89, 0.2);
                text-align: center; /* Título centrado */
            }

            .faq-container { 
                max-width: 750px; 
                margin: 0 auto; 
                text-align: left; /* Preguntas alineadas a la izquierda */
            }

            .faq-section h2 { 
                color: var(--dorado); 
                margin-bottom: 30px; 
                text-transform: uppercase;
            }

            .faq-item { 
                background: rgba(255, 255, 255, 0.05);
                margin-bottom: 15px; 
                border-radius: 10px;
                border: 1px solid rgba(197, 160, 89, 0.1); 
                padding: 20px; 
                cursor: pointer;
                transition: 0.3s;
            }

            .faq-item:hover {
                border-color: var(--dorado);
            }

            .faq-item h3 { 
                color: var(--dorado); 
                font-size: 1.1rem; 
                margin: 0; 
                display: flex;
                justify-content: space-between;
                align-items: center;
            }

            /* Para ocultar/mostrar la respuesta si decides usar el script de acordeón */
            .faq-answer {
                color: var(--blanco);
                opacity: 0.9;
                margin-top: 10px;
                font-size: 0.95rem;
                line-height: 1.4;
            }

                    /* --- ESTILOS DEL CARRUSEL --- */
            .carousel-container {
                /* Mantenemos tus dimensiones y posición */
                max-width: 800px;
                margin: 40px auto 0 auto;
                overflow: hidden;
                position: relative;
                border-radius: 20px;
                padding: 30px 10px;

                /* --- CAMBIOS PARA EL EFECTO GLASS NOTORIO --- */
                
                /* 1. Subimos la opacidad del blanco (del 5% al 20%) para dar "cuerpo" al vidrio */
                background: rgba(255, 255, 255, 0.20) !important;
                
                /* 2. Subimos agresivamente el desenfoque (del 15px al 45px) */
                /* Esto es lo que da la sensación de cristal esmerilado profundo */
                backdrop-filter: blur(45px) !important; 
                -webkit-backdrop-filter: blur(45px) !important;
                
                /* 3. Borde más brillante y un poco más grueso (1px -> 1.5px) */
                /* El borde es el "reflejo" del cristal, debe ser más notorio */
                border: 1.5px solid rgba(255, 255, 255, 0.35) !important;
                
                /* 4. Sombra más dramática para despegar el cristal del fondo oscuro */
                /* Una sombra doble: una suave y difusa, otra más fuerte y cercana */
                box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), 
                            0 0 10px rgba(255, 255, 255, 0.1) !important; 

                /* ------------------------------------------- */
            }

            .carousel-slide {
                display: flex;
                transition: transform 0.5s ease-in-out;
            }

            .carousel-item {
            min-width: 100%;
            box-sizing: border-box;
            /* Nueva configuración para centrado */
            height: 500px; /* Ajusta esta altura según prefieras (ej. 450px o 500px) */
            display: flex;
            align-items: center; /* Centra verticalmente */
            justify-content: center; /* Centra horizontalmente */
            background-color: rgba(0,0,0,0.2); /* Opcional: un fondo sutil para el espacio vacío */
                }

            .carousel-item img {
                max-width: 100%;
                max-height: 100%; /* Evita que la foto vertical se salga del contenedor */
                width: auto;
                height: auto;
                display: block;
                object-fit: contain; /* Mantiene la proporción sin recortar */
                border-radius: 8px;
            }


            /* --- BOTONES DE NAVEGACIÓN --- */
            .carousel-btn {
                position: absolute;
                top: 50%;
                transform: translateY(-50%);
                background: rgba(0, 26, 51, 0.7); /* Fondo azul oscuro semi-transparente */
                color: var(--dorado);
                border: 1px solid var(--dorado);
                font-size: 1.5rem;
                padding: 10px 15px;
                cursor: pointer;
                border-radius: 50%;
                z-index: 10;
                transition: background 0.3s;
            }

            .carousel-btn:hover {
                background: rgba(197, 160, 89, 0.9); /* Fondo dorado al pasar el mouse */
                color: var(--azul-oscuro);
            }

            .prev { left: 15px; }
            .next { right: 15px; }

            /* --- INDICADORES (PUNTOS) --- */
            .carousel-dots {
                text-align: center;
                position: absolute;
                bottom: 15px;
                width: 100%;
                z-index: 10;
            }

            .dot {
                cursor: pointer;
                height: 12px;
                width: 12px;
                margin: 0 5px;
                background-color: rgba(255, 255, 255, 0.5);
                border-radius: 50%;
                display: inline-block;
                transition: background-color 0.6s ease;
                border: 1px solid var(--dorado);
            }

            .dot.active, .dot:hover {
                background-color: var(--dorado);
            }

            .faq-section { padding: 50px 20px; background: var(--blanco); color: var(--azul-oscuro); }
            .faq-container { max-width: 700px; margin: 0 auto; text-align: left; }
            .faq-item { border-bottom: 1px solid var(--dorado); padding: 15px 0; cursor: pointer; }
            .faq-question { font-weight: bold; color: var(--azul-terramar); display: flex; justify-content: space-between; }
            .faq-answer { max-height: 0; overflow: hidden; transition: 0.3s ease; font-size: 0.95rem; color: #555; margin-top: 10px; }
            .faq-item.active .faq-answer { max-height: 200px; }
            .faq-item.active .faq-toggle { transform: rotate(45deg); }
            .faq-toggle { color: var(--dorado); transition: 0.3s; font-weight: bold; }

                    /* --- SECCIÓN VIDEO --- */
            .video-section {
                padding: 60px 20px;
                background: var(--azul-terramar);
                text-align: center;
            }

            .video-section h2 {
                color: var(--dorado);
                margin-bottom: 30px;
                text-transform: uppercase;
            }

            .video-container {
                position: relative;
                max-width: 800px;
                margin: 0 auto;
                aspect-ratio: 16 / 9; /* Mantiene la forma de video profesional */
                border-radius: 20px;
                overflow: hidden;
                border: 3px solid var(--dorado);
                box-shadow: 0 15px 40px rgba(0,0,0,0.5);
            }

            .video-container iframe {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: none;
            }

            .video-caption {
                margin-top: 20px;
                font-size: 1.1rem;
                color: var(--blanco);
                opacity: 0.9;
                font-style: italic;
            }

            .testimonio-vertical-container {
                display: flex;
                justify-content: center;
                background: var(--azul-terramar);
            }

            .short-card {
                max-width: 350px;
                width: 100%;
                /* EFECTO GLASS AZULADO */
                background: rgba(255, 255, 255, 0.1); 
                backdrop-filter: blur(15px);
                -webkit-backdrop-filter: blur(15px);
                
                border-radius: 20px;
                overflow: hidden;
                box-shadow: 0 15px 35px rgba(0,0,0,0.3);
                border: 1px solid rgba(255, 255, 255, 0.2);
                
                /* CENTRADO LOGIC */
                margin: 0 auto; /* Centra la tarjeta respecto al contenedor padre */
                display: flex;
                flex-direction: column;
            }

            .short-wrapper {
                position: relative;
                padding-bottom: 177.77%; /* Mantiene la proporción 9:16 de Shorts */
                height: 0;
                width: 100%;
            }

            .short-wrapper iframe {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                border: none;
            }

            /* Estilos para el texto dentro de la tarjeta glass */
            .testimonio-info {
                padding: 20px;
                text-align: center;
                color: white;
            }

            .testimonio-info p {
                font-size: 0.95rem;
                line-height: 1.5;
                margin-bottom: 10px;
                font-style: italic;
                color: rgba(255, 255, 255, 0.9);
            }

            .testimonio-info strong {
                color: var(--dorado);
                display: block;
                font-size: 0.85rem;
                text-transform: uppercase;
                letter-spacing: 1px;
            }

            /* Contenedor principal */
            .navbar {
                position: fixed;
                top: 0;
                width: 100%;
                height: 90px; /* Un poco más alto para dar aire */
                display: flex;
                justify-content: center; /* Centra horizontalmente */
                align-items: center; /* Centra verticalmente */
                background: rgba(6, 93, 223, 0.4);
                backdrop-filter: blur(25px);
                -webkit-backdrop-filter: blur(15px);
                z-index: 1000;
                /* Línea inferior sutil para dar profundidad */
                border-bottom: 1px solid rgba(255, 255, 255, 0.1);
                box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);   
                text-color: var(--dorado);
            }

            .nav-container {
                width: 100%;
                display: flex;
                justify-content: center;
            }

            /* Estilo del Nombre (Brand) */
            .brand-name a {

                text-decoration: none;
                font-family: 'Montserrat', sans-serif; /* Tipografía limpia y elegante */
                font-size: 24px;
                font-weight: 700;
                letter-spacing: 5px; /* Espaciado entre letras para lujo */
                text-transform: uppercase;
                color: #222;
                position: relative;
                transition: 0.4s;
            }

            /* Efecto visual al pasar el mouse */
            .brand-name a:hover {
                color: #c9a050; /* Cambia a un tono dorado/bronce */
                letter-spacing: 7px; /* Se expande ligeramente */
            }

            /* Línea decorativa inferior (opcional) */
            .brand-name a::after {
                content: '';
                position: absolute;
                width: 30%;
                height: 2px;
                background: #c9a050;
                bottom: -5px;
                left: 35%; /* Centra la línea */
                transition: 0.3s;
            }

            .brand-name a:hover::after {
                width: 60%;
                left: 20%;
            }

                        /* Clase unificada para fondos oscuros con burbujas */
            .bg-premium-dark {
                background: linear-gradient(rgba(0,26,51,0.9), rgba(0,26,51,0.9)), url('../imagenes/burbujasOleo.webp');
                background-size: cover;
                background-position: center;
                background-attachment: fixed; /* Opcional: da un efecto elegante al hacer scroll */
                color: var(--blanco);
            }

            .bg-morado-oleo {
                /* Mantenemos la imagen de burbujas, pero cambiamos el color del degradado a tonos morados profundos */
                background: linear-gradient(rgba(45, 0, 85, 0.92), rgba(25, 0, 50, 0.95)), url('../imagenes/burbujasOleo.webp');
                background-size: cover;
                background-position: center;
                background-attachment: fixed; /* Mantiene el efecto elegante al hacer scroll */
                color: var(--blanco); /* Asegura que el texto general sea blanco */
            }

            /* Ajuste específico para la sección de testimonios */
            .testimonials-section {
                padding: 60px 20px;
            }

            .testimonials-section h2 {
                font-family: 'Dancing Script', cursive; /* Misma fuente manuscrita que el Hero */
                color: var(--dorado); /* Cambiamos el azul neón por Dorado para contrastar con el morado */
                font-size: 3rem;
                text-transform: none;
                margin-bottom: 5px;
                text-shadow: 0 0 10px rgba(197, 160, 89, 0.3); /* Brillo sutil dorado */
            }

            .testimonials-section p {
                color: var(--blanco);
                opacity: 0.8;
                margin-bottom: 30px;
            }

                        /* Estilos para el nuevo logo en la navbar */
            .logo-img {
                height: 60px; /* Ajusta este valor según prefieras el grosor de tu barra */
                width: auto;  /* Mantiene la proporción original del logo */
                display: block;
                transition: transform 0.3s ease; /* Efecto suave al pasar el mouse */
            }

            .logo-img:hover {
                transform: scale(1.05); /* Un pequeño aumento al pasar el mouse le da un toque premium */
            }

            /* Ajuste para el contenedor si es necesario */
            .brand-name a {
                text-decoration: none;
                display: flex;
                align-items: center;
            }

            /* --- ESTILOS PARA EL HERO FULL SCREEN --- */

            .hero-con-fondo {
                position: relative; /* Necesario para la capa overlay */
                width: 100%;
                min-height: 100vh; /* Ocupa el 100% de la altura de la pantalla */
                
                /* CARGA DE LA IMAGEN DE FONDO */
                background-image: url('../imagenes/imagen_7.webp'); 
                background-repeat: no-repeat;

                /* --- ESTOS SON LOS CAMBIOS PARA EL ZOOM --- */
                
                /* 1. Zoom del 160% (Ajusta este número si quieres más o menos zoom) */
                background-size: 180%; 
                
                /* 2. Enfocamos el zoom en el rostro (55% horizontal, 35% vertical) */
                /* Esto evita que el zoom se vaya hacia el techo o hacia abajo */
                background-position: 75% 35%; 

                /* ------------------------------------------- */
                
                /* Centrado del contenido con Flexbox */
                display: flex;
                align-items: center; /* Centrado vertical */
                justify-content: center; /* Centrado horizontal */
                text-align: center;
                
                color: white; /* Color de texto por defecto */
                padding: 20px;
                overflow: hidden; /* Evita scrolls raros */
            }

            /* MEDIA QUERY IMPORTANTE PARA MÓVILES */
            /* En celular necesitamos más zoom porque la pantalla es más angosta */
            @media (max-width: 768px) {
                .hero-con-fondo {
                    background-size: 125%; /* Zoom mucho mayor en móvil */
                    background-position:72% 5%; /* Ajuste fino para centrar el rostro */
                }
            }

            /* Capa oscura translúcida sobre la foto para que el texto resalte */
            .hero-overlay {
            position: absolute;
            top: 0; 
            left: 0;
            width: 100%; 
            height: 100%;
            /* Un degradado que sea más oscuro donde está el texto y más claro sobre Yessica */
            background: linear-gradient(to right, rgba(255,255,255,0.2) 5%, rgba(255,255,255,0.1) 100%);
            z-index: 1;
        }

            /* Estilos para el contenido que flota sobre la foto */
            .hero-content {
                position: relative;
                z-index: 2; /* Se pone al frente de la capa oscura */
                max-width: 800px; /* Ancho máximo para que el texto no sea eterno */
            }

            /* --- AJUSTES DE ELEMENTOS EXISTENTES --- */


            .hero-con-fondo .subtitle {
                font-size: 1.2rem;
                line-height: 1.6;
                margin-bottom: 30px;
                opacity: 0.9;
            }

            /* Aseguramos que la burbuja y el botón tengan buen espaciado */
            .social-proof-bubble {
                margin-bottom: 25px;
            }

            .cta-google {
                margin-bottom: 10px;
            }

            /* MEDIA QUERY PARA MÓVILES (Importante para que la foto no tape el texto) */
            @media (max-width: 768px) {
                .hero-con-fondo {
                    background-position: center left; /* Ajusta la foto a la izquierda para ver a Yessica en vertical */
                }

            }

            .subtitle {
                /* Fondo con blanco translúcido */
                background: rgba(255, 255, 255, 0.15); 
                
                /* El truco del cristal: desenfoque del fondo */
                backdrop-filter: blur(12px); 
                -webkit-backdrop-filter: blur(12px); /* Soporte para Safari */
                
                /* Borde muy fino para dar sensación de borde de vidrio */
                border: 1px solid rgba(255, 255, 255, 0.2);
                
                /* Espaciado interno para que el texto no toque los bordes */
                padding: 25px;
                border-radius: 15px;
                
                /* Ajustes de texto */
                color: #ffffff;
                font-size: 1.15rem;
                line-height: 1.6;
                max-width: 750px;
                margin: 0 auto 30px auto; /* Centrado horizontal y espacio abajo */
                
                /* Sombra suave para despegar el bloque del fondo */
                box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.3);
            }

            h2 {
                /* Fuente moderna y fuerte (Montserrat es excelente para este look) */
                @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700&display=swap');
                font-family: 'Montserrat', sans-serif;
                
                /* Tamaño equilibrado */
                font-size: 2rem;
                
                /* EL COLOR DORADO (Tomado de tu logo) */
                color: #b89f5d; 
                
                /* Formato idéntico a la imagen */
                text-transform: uppercase; /* Todo en mayúsculas */
                letter-spacing: 2px;       /* Espaciado entre letras para mayor elegancia */
                font-weight: 700;
                
                /* Alineación y márgenes para que respiren */
                text-align: center;
                margin-top: 50px;
                margin-bottom: 30px;
                
                /* Sombra muy sutil para dar profundidad sobre el fondo azul */
                text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
                
                line-height: 1.2;
            }

            /* Ajuste para que en móviles no se vean gigantes */
            @media (max-width: 768px) {
                h2 {
                    font-family: 'Montserrat', sans-serif;
                
                    font-size: 1.5rem;
                    letter-spacing: 1.5px;
                    padding: 0 15px;
                }
            }

            #testimonios-imagen {
                position: relative;
                padding: 80px 20px;
                width: 100%;
                
                /* CONFIGURACIÓN DEL FONDO */
                background-image: linear-gradient(rgba(255, 255, 255, 0.1), rgba(10, 25, 47, 0.)), url('../imagenes/burbujasOleo.webp');
                background-size: cover;
                background-position: center;
                background-attachment: fixed; /* Efecto Parallax (fijo al hacer scroll) */
                background-repeat: no-repeat;
                
                color: white;
                overflow: hidden;
            }

            #testimonios-imagen h2 {
                /* Ya usa el estilo dorado que estandarizamos antes */
                margin-top: 0;
            }

            #testimonios-imagen p {
                font-size: 1.1rem;
                opacity: 0.9;
                letter-spacing: 1px;
            }

            /* Efecto opcional: un borde sutil al carrusel para que parezca una pantalla */
            .carousel-container {
                border: 1px solid rgba(184, 159, 93, 0.3); /* Dorado muy suave */
                border-radius: 15px;
                background: rgba(0, 0, 0, 0.2);
                padding: 10px;
                backdrop-filter: blur(5px);
            }


                        /* CONTENEDOR Y ESTRUCTURA */
            .container-tienda {
                max-width: 1100px;
                margin: 40px auto;
                padding: 20px;
                background: var(--blanco-tienda);
                
                border-radius: 15px;
                box-shadow: 0 10px 30px var(--sombra-tienda);
            }

            .product-grid-tienda {
                display: grid;
                grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
                gap: 40px;
                margin-top: 20px;
            }

            /* IMAGEN Y GALERÍA */
            .product-gallery-tienda img {
                width: 100%;
                border-radius: 12px;
                display: block;
                transition: transform 0.3s ease;
            }

            .product-gallery-tienda img:hover {
                transform: scale(1.03);
            }

            /* DETALLES DE PRODUCTO */
            .product-details-tienda h1 {
                font-size: 2.2rem;
                color: #003366;
                margin: 0 0 15px 0;
            }

            .badge-tienda {
                background: var(--azul-terramar-tienda);
                color: white;
                padding: 5px 12px;
                border-radius: 20px;
                font-size: 0.75rem;
                font-weight: bold;
                display: inline-block;
                margin-bottom: 15px;
            }

            .price-tag-tienda {
                font-size: 1.8rem;
                font-weight: bold;
                margin: 20px 0;
                color: #333;
                border-left: 4px solid var(--dorado-tienda);
                padding-left: 15px;
            }

            /* BOTÓN DE ACCIÓN */
            .btn-whatsapp-tienda {
                background-color: #25D366;
                color: white !important;
                text-decoration: none;
                display: block;
                padding: 18px;
                text-align: center;
                border-radius: 8px;
                font-weight: bold;
                font-size: 1.1rem;
                box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
                transition: all 0.3s ease;
            }

            .btn-whatsapp-tienda:hover {
                background-color: #1ebd5b;
                transform: translateY(-2px);
            }

            /* SECCIÓN DE INFORMACIÓN SEO */
            .info-section-tienda {
                margin-top: 40px;
                padding-top: 30px;
                border-top: 1px solid #eee;
            }

            .info-section-tienda h2 {
                color: var(--azul-terramar-tienda);
                font-size: 1.4rem;
            }

            .features-list-tienda {
                list-style: none;
                padding: 0;
            }

            .features-list-tienda li {
                margin-bottom: 12px;
                padding-left: 25px;
                position: relative;
            }

            .features-list-tienda li::before {
                content: "✓";
                position: absolute;
                left: 0;
                color: var(--dorado-tienda);
                font-weight: bold;
            }

            /* AJUSTE PARA LA NAVBAR EXISTENTE */
            .logo-img-tienda {
                height: 60px;
            }

            /* RESPONSIVE */
            @media (max-width: 768px) {
                .container-tienda {
                    margin: 20px;
                    padding: 15px;
                }
                .product-details-tienda h1 {
                    font-size: 1.7rem;
                }
            }