html,
body,
header,
.intro-2 {
    height: 100%;
}

/* Montserrat global para la intro */
main, main * {
    font-family: 'Montserrat', sans-serif;
}

@media (max-width: 740px) {

    html,
    body,
    header,
    .intro-2 {
        height: 900px;
    }
}

@media (min-width: 800px) and (max-width: 850px) {

    html,
    body,
    header,
    .intro-2 {
        height: 980px;
    }
}

.log-in-bg {
    background: url("../img/intro01.jpeg")no-repeat center center;
    background-size: cover;
}

.hm-gradient .full-bg-img {
    /*background: -webkit-linear-gradient(45deg,#68d0ff,#453cf5 75%);*/
    background: rgba(31, 30, 30, 0.5);

}

.form-rounded {
    border-radius: 2rem;
}


.full-width{
    width: 100%;
}

.semitrasparent {
    background: rgba(0, 0, 0, 0.5);

}

.semioverlay {
    background: rgba(31, 30, 30, 0.5);

}

.module-desc {
    font-size: 12px;
    color: #555;
}

.view .maski {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-attachment: fixed;
}

@media print
{
    .no-print, .no-print *
    {
        display: none !important;
    }
}

@keyframes fade-in {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Animated gradient for intro and platform sections */
@keyframes gradient-shift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.intro-gradient-bg {
    background: linear-gradient(135deg, #1a1a2e, #16213e, #0f3460, #1a1a3e, #0d2747);
    background-size: 300% 300%;
    animation: gradient-shift 12s ease infinite;
}

/* Feature cards hover */
.intro-feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15) !important;
}

/* Platform cards hover */
#information ~ div .col-md-4 > div[style*="border: 1px solid"]:hover {
    background: rgba(255,255,255,0.12) !important;
    border-color: rgba(100, 181, 246, 0.5) !important;
    transform: translateY(-4px);
}

/* Contact cards hover */
.card[style*="border-radius: 12px"]:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12) !important;
}

/* Smooth transitions for all interactive elements */
.intro-feature-card,
.card[style*="border-radius: 12px"],
div[style*="border: 1px solid rgba"] {
    transition: all 0.3s ease !important;
}