/* ======================================
   NAVBAR
====================================== */

.navbar-custom{
    background: rgba(0,0,0,0.65);
    backdrop-filter: blur(8px);
    padding: 10px 0;
    transition: 0.3s;
}

/* LOGO */
.logo-navbar{
    width:70px;
    height:70px;
    object-fit:contain;
}

/* TEXTO MARCA */
.brand-text{
    font-size:26px;
    font-weight:700;
}

/* LINKS */
.menu-link{
    font-weight:700;
    color:white !important;
    transition:0.3s;
    position:relative;
}

.menu-link:hover{
    color:#0d6efd !important;
}

/* EFECTO LINEA */
.menu-link::after{
    content:'';
    position:absolute;
    width:0;
    height:2px;
    background:#0d6efd;
    left:0;
    bottom:0;
    transition:0.3s;
}

.menu-link:hover::after{
    width:100%;
}

/* BOTON */
.btn-primary{
    font-weight:700;
    box-shadow:0 4px 12px rgba(13,110,253,0.4);
}

/* MOBILE NAVBAR */
@media(max-width:992px){
    .navbar-custom{
        background:#000;
    }

    .logo-navbar{
        width:55px;
        height:55px;
    }
}

/* ======================================
   VIDEO HERO
====================================== */

.video-hero{
    position:relative;
    width:100%;
    height:100vh;
    overflow:hidden;
}

.video-bg{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
}

.overlay{
    position:absolute;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
}

.hero-content{
    position:relative;
    z-index:2;
    height:100%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}

.hero-content h1{
    font-size:60px;
}

@media(max-width:768px){
    .hero-content h1{
        font-size:35px;
    }
}

/* ======================================
   SECCION INFO MODERNA
====================================== */

.seccion-info{
    background:#f8f9fa;
}

/* IMAGEN IZQUIERDA */
.imagen-info{
    width:100%;
    height:500px;
    object-fit:cover;
    border-radius:0 50px 50px 0;
    display:block;
    box-shadow:0 15px 35px rgba(0,0,0,0.15);
}

/* TEXTO DERECHA */
.contenido-info{
    padding:60px;
}

.titulo-info{
    font-size:40px;
    line-height:1.2;
    color:#111;
    font-weight:700;
}

.contenido-info p{
    font-size:18px;
    color:#555;
    line-height:1.8;
}

/* RESPONSIVE */
@media (max-width:991px){

    .imagen-info{
        height:auto;
        border-radius:20px;
    }

    .contenido-info{
        padding:30px 20px;
        text-align:center;
    }

    .titulo-info{
        font-size:30px;
    }
}



/* TEXTO JUSTIFICADO */
.contenido-info p{
    text-align: justify;
}

/* TITULO AZUL BONITO */
.texto-azul{
  color:#0077ff;
    text-shadow:0 2px 8px rgba(0,119,255,0.2);

}




.card {
    transition: 0.3s;
    border-radius: 12px;
}

.card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
}

.card-img-top {
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}




/* CARD MODERNA */
.servicio-card{
    border: none;
    border-radius: 16px;
    overflow: hidden;
    transition: all 0.4s ease;
    background: #fff;
}

/* ZOOM IMAGEN */
.servicio-card img{
    height: 200px;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.servicio-card:hover img{
    transform: scale(1.1);
}

/* EFECTO HOVER CARD */
.servicio-card:hover{
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.25);
}

/* ICONOS */
.icono{
    font-size: 40px;
    color: #0d6efd;
}

/* BOTÓN ANIMADO */
.btn-animado{
    background: #0d6efd;
    color: white;
    padding: 10px 20px;
    border-radius: 30px;
    text-decoration: none;
    transition: all 0.3s ease;
    display: inline-block;
}

.btn-animado:hover{
    background: #084298;
    transform: scale(1.08);
    box-shadow: 0 8px 20px rgba(13,110,253,.4);
}