@font-face{
    font-family: 'korolevheavy';
    src: url('/fonts/KorolevHeavy.otf');
}


body {
    margin: 0;
    min-height: 100vh;
    background: linear-gradient(to bottom, #9674B4 45%, #0054A6 90%);
    font-family: 'korolevheavy';
    color: white;
}

header{
    
    display: flex;
    justify-content: space-between;
    padding-top: 1%;
    padding-left: 1%;
    padding-right: 1%;
    align-items: center;
}
.logo-gobierno{
   
    & img{
        
        padding-top: 0%;
        margin-top: 0%;
        
        
    }
}

.hero{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    
    gap: 2px;
    
}
.hero__image{
    
}
.hero__title{
font-style: normal;
font-weight: 900;
font-size: 96px;
line-height: 96px;
color: #FFFFFF;

margin: 0;

}

.hero__text{
 
 font-family: Verdana, Geneva, Tahoma, sans-serif;
font-style: normal;
font-size: 20px;
line-height: 20px;
color: #FFFFFF;
max-width: 945px;
}

.system-card .card-img-top {
    width: 80px;
    height: 80px;
    object-fit: contain;
    display: block;
    margin: 20px auto 0;
}

.system-card .card {
    background: #F2E7FB !important;
    min-height: 200px
}
.system-card .card-text{
    min-height: 75px;
}
.system-card .card-title{
    color: #9674B4;
    font-weight: bolder;
}

.systems{
    margin-top: 2%;
    display: flex;
    gap: 1%;
    justify-content: center;
}
.btn-primary{
    background: #9674B4 !important;
    border-color: #9674B4 !important;
}
.btn{
    margin-left: 25%;
}




@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(25px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes zoomSoft {
    from {
        opacity: 0;
        transform: scale(0.92);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

header {
    animation: fadeDown 0.8s ease-out;
}

.hero__image {
    animation: zoomSoft 0.9s ease-out;
}

.hero__title {
    animation: fadeUp 0.9s ease-out;
}

.hero__text {
    animation: fadeUp 1.1s ease-out;
}


@keyframes fadeUpCards {
    from {
        opacity: 0;
        transform: translateY(35px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.system-card {
    opacity: 0;
    animation: fadeUpCards 0.7s ease-out forwards;
}

.system-card:nth-child(1) { animation-delay: 0.2s; }
.system-card:nth-child(2) { animation-delay: 0.35s; }
.system-card:nth-child(3) { animation-delay: 0.5s; }
.system-card:nth-child(4) { animation-delay: 0.65s; }



.system-card .btn {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.system-card .btn:hover {
    transform: translateY(-8px);
    box-shadow: 0 14px 30px rgba(0, 0, 0, 0.18);
}