﻿body {
    margin: 0;
}

header {
    background-color: #502b57;
    padding: 10px 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative; /* para ubicar el teléfono */
    height: 170px; /* un poco más que el logo de 150px */
}

.logo-centro img.logo {
    height: 150px;
    width: auto;
}

.telefono-contenedor {
    position: absolute;
    bottom: 0; /* pegado abajo */
    right: 20px; /* margen derecho */
}

.telefono {
    width: 200px;
    height: auto;
}
/* Imagen adaptable */
.imagen-contenedor {
    display: flex;
    justify-content: center;
}

.imagen-adaptable {
    width: 100%;
    max-width: 1200px;
    height: auto;
}


/* Botón de WhatsApp flotante */
.whatsapp-boton {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
}

    .whatsapp-boton img {
        width: 200px;
        height: 60px;
        transition: transform 0.2s ease;
    }

        .whatsapp-boton img:hover {
            transform: scale(1.1);
        }

.galeria {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 20px 0;
}

    .galeria img {
        max-width: 1200px;
        width: 100%;
        height: auto;
        margin-bottom: 15px;
    }


.pie-pagina {
    text-align: center;
    margin-top: 20px;
}

    .pie-pagina img {
        max-width: 1200px;
        width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }

/* Mostrar/Ocultar según dispositivo */
.footer-pc {
    display: block !important;
}

.footer-movil {
   
    display: none !important;
}

@media (min-width: 601px) {
    .galeria img:not(:first-child) {
        display: none;
    }
}
/* Ajuste para móviles */
@media (max-width: 600px) {
    header {
        flex-direction: column;
        height: auto;
        padding-bottom: 10px;
    }
    .galeria img:first-child {
        display: none;
    }

    .galeria img {
        display: block;
        max-width: 310px; /* ancho máximo */
        width: 95%; /* ocupa 95% del ancho disponible */
        margin: 0 auto 15px; /* centrado y separación */
    }

    .logo-centro img.logo {
        height: 100px; /* Logo más pequeño en móvil */
    }

    .telefono-contenedor {
        position: static;
        margin-top: 10px;
    }

    .telefono {
        width: 150px;
    }

    /* WhatsApp barra inferior */
    .whatsapp-boton {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #f59f92;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 80px;
        z-index: 1000;
        transform: none; /* Evita desplazamientos previos */
    }

        .whatsapp-boton img {
        margin-top:5px;
            height: 60px;
            width:auto;
            
        }

            .whatsapp-boton img:hover {
                transform: scale(1);
     }
    .footer-pc {
        display: none !important;
    }

    .footer-movil {
        display: block !important;
        max-width: 310px;
        width: 95%;
        margin: 0 auto;
        height: auto;
    }

    .pie-pagina {
        padding-bottom: 120px; /* espacio para botón WhatsApp */
    }
        .pie-pagina img {
          
            width: 100%;
            height: auto;
            display: block;
            margin: 0 auto;
            max-width: 394px;
        }

}