/*==========================================================
                    CERTIFICATIONS
==========================================================*/

.certifications{

    padding:140px 8%;
    position:relative;

}

/* Heading */

.certifications .section-heading{

    text-align:center;

}

.certifications .single-heading{

    margin-bottom:20px;

}

/* Divider */

.certifications .section-divider{

    display:flex;
    justify-content:center;
    align-items:center;
    gap:18px;
    margin-bottom:25px;

}

.certifications .section-divider .line{

    width:120px;
    height:2px;
    border-radius:50px;

    background:linear-gradient(
        to right,
        transparent,
        var(--sage),
        transparent
    );

}

.certifications .section-divider svg{

    width:18px;
    height:18px;
    color:var(--rose);

}

/* Intro */

.certificate-intro{

    max-width:760px;
    margin:0 auto 70px;
    text-align:center;
    color:var(--light-text);
    font-size:17px;
    line-height:1.9;
    font-style:italic;

}

/* Grid */

.certificate-grid{

    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(330px,1fr));
    gap:30px;

}

/* Card */

.certificate-card{

    padding:35px;
    border-radius:30px;
    transition:.35s ease;
    position:relative;
    overflow:hidden;

}

.certificate-card:hover{

    transform:translateY(-8px);
    box-shadow:0 25px 55px rgba(151,161,59,.15);

}

.certificate-card::before{

    content:"";

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:4px;

    background:linear-gradient(
        90deg,
        var(--rose),
        var(--sage)
    );

    transform:scaleX(0);
    transform-origin:left;
    transition:.35s;

}

.certificate-card:hover::before{

    transform:scaleX(1);

}

/* Icon */

.certificate-icon{

    width:65px;
    height:65px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:18px;

    background:var(--hover);

    margin-bottom:25px;

    transition:.35s;

}

.certificate-icon svg{

    width:28px;
    height:28px;

    color:var(--sage);

    transition:.35s;

}

.certificate-card:hover .certificate-icon{

    background:var(--blush);

    transform:rotate(-10deg);

}

.certificate-card:hover .certificate-icon svg{

    color:var(--rose);

}

/* Text */

.certificate-card h3{

    font-size:27px;
    color:var(--text);
    margin-bottom:10px;

}

.certificate-card h4{

    font-family:'Inter',sans-serif;
    font-size:16px;
    color:var(--sage);
    margin-bottom:10px;

}

.certificate-card p{

    margin-bottom:20px;

}

/* Verified */

.verify{

    display:flex;
    align-items:center;
    gap:10px;

    margin-bottom:18px;

    color:var(--sage);
    font-weight:600;

}

.verify svg{

    width:18px;
    height:18px;

}

/* Link */

.certificate-card a{

    color:var(--rose);
    font-weight:600;
    transition:.3s;

}

.certificate-card a:hover{

    letter-spacing:.5px;

}

/* Glow */

.certifications::before{

    content:"";

    position:absolute;

    width:350px;
    height:350px;

    border-radius:50%;

    background:rgba(244,223,230,.35);

    filter:blur(120px);

    top:0;
    left:-120px;

    z-index:-1;

}

.certifications::after{

    content:"";

    position:absolute;

    width:300px;
    height:300px;

    border-radius:50%;

    background:rgba(232,239,207,.45);

    filter:blur(120px);

    right:-100px;
    bottom:0;

    z-index:-1;

}


/*=====================================
        Certificate Intro
======================================*/

.certificate-intro{

    max-width:720px;

    margin:0 auto 70px;

    text-align:center;

    font-size:17px;

    line-height:1.8;

    font-style:italic;

    color:var(--light-text);

}

/* Mobile */

@media(max-width:900px){

    .certificate-grid{

        grid-template-columns:1fr;

    }

}