/* ============================================= */
/* --- ESTILOS SECCIÓN UBICACIÓN --- */
/* ============================================= */

.ubicacion-container {
    position: relative;
    width: 100%;
    min-height: 70vh;
    background-color: #050505;
    background-image: url('../media/images/backgrounds/background_ubicacion.png');
    background-size: cover;
    background-position: center;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 80px 5%;
    overflow: hidden;
}

.ubicacion-wrapper {
    width: 100%;
    max-width: 1400px;
    display: grid;
    grid-template-columns: 1fr 1.1fr; /* Columna derecha un poco más ancha para la foto */
    gap: 80px;
    align-items: center;
    z-index: 10;
}

/* --- COLUMNA IZQUIERDA --- */
.ubicacion-left {
    display: flex;
    flex-direction: column;
    gap: 45px;
}

.ubic-title {
    width: 100%;
    max-width: 500px;
    height: auto;
}

.ubic-info-list {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

.ubic-info-row {
    display: flex;
    align-items: center; /* Alinea icono y texto al centro vertical */
    gap: 20px;
}

.ubic-icon {
    height: 40px; /* Tamaño del icono */
    width: auto;
}

.ubic-text-img {
    height: 22px; /* Ajuste para que el texto se vea proporcional al icono */
    width: auto;
}

/* --- COLUMNA DERECHA (FOTO HOTEL) --- */
.ubicacion-right {
    display: flex;
    justify-content: flex-end;
}

.ubic-image-frame {
    position: relative;
    width: 100%;
    max-width: 650px;
}

.ubic-main-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 40px 0 40px 0; /* Esquinas asimétricas tecnológicas */
    box-shadow: 0 20px 40px rgba(0,0,0,0.7);
}

.ubic-corner {
    position: absolute;
    width: 50px;
    height: 50px;
    background-color: var(--primary-orange, #FF4500);
    z-index: -1;
}

.ubic-corner.top-right { top: -15px; right: -15px; }
.ubic-corner.bottom-left { bottom: -15px; left: -15px; }

/* ============================================= */
/* --- RESPONSIVO --- */
/* ============================================= */

@media (max-width: 1024px) {
    .ubicacion-wrapper {
        grid-template-columns: 1fr;
        gap: 60px;
        text-align: center;
    }
    
    .ubicacion-left { align-items: center; }
    
    .ubic-info-row {
        justify-content: center; /* Centra las filas en móvil */
    }

    .ubicacion-right { justify-content: center; }
}

@media (max-width: 768px) {
    .ubic-icon { height: 30px; }
    .ubic-text-img { height: 18px; }
    .ubic-title { max-width: 80%; }
}