/*==================================================
CONVENIOS
==================================================*/

.agreements{

    width:100%;

    padding:90px 0;

    background:#ffffff;

}

.agreements-container{

    width:100%;
    max-width:1320px;

    margin:0 auto;

    padding:0 40px;

}

/*==================================================
TÍTULOS
==================================================*/

.agreements-subtitle{

    display:block;

    color:#F5A000;

    font-size:18px;

    font-weight:700;

    text-transform:uppercase;

    margin-bottom:12px;

}

.agreements h2{

    color:#123D83;

    font-size:54px;

    font-weight:800;

    margin-bottom:22px;

}

.agreements-description{

    max-width:850px;

    color:#222;

    font-size:19px;

    line-height:1.8;

    margin-bottom:55px;

}

/*==================================================
GRID
==================================================*/

.agreements-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:42px 34px;

}

/*==================================================
CARD
==================================================*/

.agreement-card{

    position:relative;

    background:#fff;

    border:3px solid #F5A000;

    border-radius:18px;

    padding:42px 30px 34px;

    text-align:center;

    transition:.35s;

}

.agreement-card:hover{

    transform:translateY(-8px);

    box-shadow:0 18px 35px rgba(0,0,0,.12);

}

/*==================================================
BADGE
==================================================*/

.agreement-badge{

    position:absolute;

    top:-20px;

    left:50%;

    transform:translateX(-50%);

    background:#F5A000;

    color:#fff;

    padding:8px 18px;

    border-radius:30px;

    font-size:15px;

    font-weight:700;

}

/*==================================================
LOGO
==================================================*/

/*==================================================
LOGO
==================================================*/

/*==================================================
LOGO
==================================================*/
.agreement-logo{

    width:180px;
    height:180px;

    margin:0 auto 28px;

    display:flex;
    justify-content:center;
    align-items:center;

    overflow:hidden;

}
.agreement-logo img{

    width:100%;
    height:100%;

    object-fit:contain;

    display:block;

    border-radius:18px;

}
/*==================================================
TEXTOS
==================================================*/

.agreement-card h3{

    color:#123D83;

    font-size:22px;

    font-weight:800;

    margin-bottom:12px;

}

.agreement-card p{

    color:#222;

    font-size:17px;

    line-height:1.7;

}

/*==================================================
CATEGORÍA
==================================================*/

.agreement-category{

    display:inline-flex;

    justify-content:center;

    align-items:center;

    padding:8px 18px;

    border-radius:25px;

    font-size:15px;

    font-weight:700;

    margin-bottom:18px;

}

.education{

    background:#B9E3A8;

    color:#2F7B16;

}

.affiliate{

    background:#B6C8E8;

    color:#123D83;

}

/*==================================================
TABLET
==================================================*/

@media(max-width:1100px){

.agreements-grid{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:992px){

.agreements{

padding:70px 0;

}

.agreements-container{

padding:0 28px;

}

.agreements h2{

font-size:44px;

}

.agreements-description{

font-size:17px;

}

}

/*==================================================
CELULAR
==================================================*/

@media(max-width:768px){

.agreements{

padding:60px 0;

}

.agreements-container{

padding:0 20px;

}

.agreements-grid{

grid-template-columns:1fr;

gap:35px;

}

.agreements-subtitle{

font-size:15px;

}

.agreements h2{

font-size:36px;

}

.agreements-description{

font-size:16px;

margin-bottom:45px;

}

.agreement-card{

padding:38px 22px 30px;

}

.agreement-logo{

width:110px;

height:110px;

}

.agreement-card h3{

font-size:20px;

}

.agreement-card p{

font-size:16px;

}

.agreement-category{

font-size:14px;

padding:7px 16px;

}

.agreement-badge{

font-size:13px;

padding:7px 16px;

}

}