/* Logo Styles with Montserrat - HEADER (Alineado a la derecha) */
.logo {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* HEADER a la derecha */
    position: relative;
}

.logo-linea-superior {
    display: flex;
    align-items: center;
    transform: skewX(-8deg);
    margin-bottom: -12px;
}

.logo-aguamarina {
    font-size: 2rem;
    color: var(--primary);
    line-height: 1;
    transform: skewX(8deg);
    margin-right: 0;
    white-space: nowrap;
}

.logo-olas {
    width: 115px;
    height: 57px;
    background-image: url('../images/favicon.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
    transform: skewX(8deg);
    margin-left: -35px;
    margin-bottom: 9px;
}

.logo-piscinas {
    font-size: 1.2rem;
    color: var(--secondary);
    letter-spacing: 2px;
    font-weight: 600;
    transform: skewX(-8deg);
    padding-right: 82px;
    white-space: nowrap;
    margin-top: -10px;
}

/* Footer Logo - VERSIÓN MEJORADA (Alineado a la izquierda) */
.footer-logo {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* FOOTER a la izquierda - CORREGIDO */
    position: relative;
    width: fit-content; /* Importante: que ocupe solo el espacio necesario */
}

.footer-logo .logo-linea-superior {
    display: flex;
    align-items: center;
    transform: skewX(-8deg);
    margin-bottom: -8px;
}

.footer-logo .logo-aguamarina {
    font-size: 1.8rem;
    color: var(--white);
    transform: skewX(8deg);
    white-space: nowrap;
}

.footer-logo .logo-olas {
    width: 95px; /* Tamaño proporcional al header */
    height: 47px; /* Tamaño proporcional al header */
    background-image: url('../images/favicon.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    transform: skewX(8deg);
    margin-left: -28px; /* Ajustado proporcionalmente */
    margin-bottom: 9px;
}

.footer-logo .logo-piscinas {
    font-size: 1rem;
    color: var(--secondary);
    letter-spacing: 2px;
    font-weight: 600;
    transform: skewX(-8deg);
    white-space: nowrap;
    margin-top: -10px;
    padding-right: 65px; /* ELIMINADO - no necesitamos forzar alineación */
    text-align: left; /* Alineado naturalmente a la izquierda */
    align-self: flex-end; /* Fuerza alineación izquierda */
}