/* =========================================
   ABOUT POOJA
========================================= */

.about-pooja {


    margin: 0 auto;

    padding: 80px 0 80px;

    box-sizing: border-box;
}


/* =========================================
   HEADING
========================================= */

.about-pooja__heading {
    width: 100%;

    text-align: center;

    margin: 0 0 36px;
}


.about-pooja__title,
.about-pooja__subtitle {
    margin: 0;
    font-size: 48px;
    font-weight: 700;
}


/* Main heading */


/* Subtitle */

.about-pooja__subtitle {
    margin-top: 2px;
    line-height: 1.3;
}


/* =========================================
   IMAGES
========================================= */

.about-pooja__images {
    width: 100%;

    display: grid;

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

    gap: 23px;

    margin: 0 0 42px;
}


.about-pooja__image {
    width: 100%;

    height: 378px;

    display: block;

    object-fit: cover;

    object-position: center;

    border-radius: 7px;
}


/* =========================================
   CONTENT
========================================= */

.about-pooja__content {
    width: 100%;

    margin: 0;
}


/* =========================================
   ACF WYSIWYG CONTENT
========================================= */

/*
   Your ACF field produces something like:

   <div>Paragraph 1</div>

   <div></div>

   <div>Paragraph 2</div>

   <div>
       <div>
           <ul>
               <li>...</li>
           </ul>
       </div>
   </div>
*/

.about-pooja__description {
    width: 100%;

    display: grid;

    grid-template-columns: 1.1fr 1fr;

    column-gap: 55px;

    grid-template-rows: auto auto;

    align-items: start;

    box-sizing: border-box;

    color: #515151;
}


/* =========================================
   FIRST PARAGRAPH
========================================= */

.about-pooja__description>div:first-child {
    grid-column: 1;

    grid-row: 1;

    margin: 0 0 25px;

    padding: 0;


    line-height: 1.55;

    font-weight: 500;

    color: #515151;
}


/* =========================================
   EMPTY DIV
========================================= */

/*
   Removes the empty div that ACF inserts
   between paragraph 1 and paragraph 2.
*/

.about-pooja__description>div:nth-child(2):empty {
    display: none;
}


/* =========================================
   SECOND PARAGRAPH
========================================= */

.about-pooja__description>div:nth-child(3) {
    grid-column: 1;

    grid-row: 2;

    margin: 0;

    padding: 0;


    line-height: 1.65;

    font-weight: 400;

    color: #515151;
}


/* =========================================
   CERTIFICATION OUTER WRAPPER
========================================= */

.about-pooja__description>div:nth-child(4) {
    grid-column: 2;

    grid-row: 1 / span 2;

    align-self: start;

    margin: 0;

    padding: 0;
}


/* =========================================
   CERTIFICATION INNER WRAPPER
========================================= */

.about-pooja__description>div:nth-child(4)>div {
    margin: 0;

    padding: 0;
}


/* =========================================
   CERTIFICATION LIST
========================================= */

.about-pooja__description ul {
    list-style: none;

    margin: 0;

    padding: 0;
}


/* =========================================
   CERTIFICATION ITEM
========================================= */

.about-pooja__description ul li {
    position: relative;

    margin: 0 0 10px;

    padding: 0 0 0 28px;


    line-height: 1.45;

    font-weight: 400;

    color: #555555;

    box-sizing: border-box;
}


/* =========================================
   BLUE CHECK CIRCLE
========================================= */

.about-pooja__description ul li::before {
    content: "✓";

    position: absolute;

    left: 0;

    top: 1px;

    width: 18px;

    height: 18px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background: #0878b5;

    color: #ffffff;

    font-size: 15px;
    font-weight: 700;

    line-height: 18px;

    box-sizing: border-box;
}


.about-pooja__description ul li:last-child {
    margin-bottom: 0;
}


/* =========================================
   WYSIWYG ELEMENTS
========================================= */

.about-pooja__description strong {
    font-weight: 700;
}


.about-pooja__description em {
    font-style: italic;
}


.about-pooja__description a {
    color: #0878b5;

    text-decoration: underline;
}


/* =========================================
   DOWNLOAD BUTTON
========================================= */

.resume-button {

    display: flex;

    align-items: center;

    justify-content: center;
    margin-top: 40px;

}




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

@media (max-width: 900px) {

    .about-pooja {
        width: calc(100% - 48px);
    }


    /* -----------------------------------------
       IMAGES
    ----------------------------------------- */

    .about-pooja__images {
        grid-template-columns: 1.5fr 1fr 1fr;

        gap: 15px;
    }


    .about-pooja__image {
        height: 300px;
    }


    /* -----------------------------------------
       CONTENT
    ----------------------------------------- */

    .about-pooja__description {
        column-gap: 30px;
    }


    /* -----------------------------------------
       FIRST PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:first-child {


        line-height: 1.55;

        margin-bottom: 22px;
    }


    /* -----------------------------------------
       SECOND PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(3) {


        line-height: 1.6;
    }


    /* -----------------------------------------
       CERTIFICATIONS
    ----------------------------------------- */

    .about-pooja__description ul li {


        line-height: 1.45;

        padding-left: 26px;
    }


    .about-pooja__description ul li::before {
        width: 17px;

        height: 17px;

        font-size: 9px;

        line-height: 17px;
    }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 700px) {

    .about-pooja {
        width: calc(100% - 32px);

        padding-top: 10px;
    }


    /* -----------------------------------------
       HEADING
    ----------------------------------------- */

    .about-pooja__heading {
        margin-bottom: 25px;
    }


    .about-pooja__title {
        font-size: 25px;

        line-height: 1.15;
    }


    .about-pooja__subtitle {
        margin-top: 2px;



        line-height: 1.3;
    }


    /* -----------------------------------------
       IMAGES
    ----------------------------------------- */

    .about-pooja__images {
        grid-template-columns: 1fr;

        gap: 15px;

        margin-bottom: 30px;
    }


    .about-pooja__image {
        height: 280px;

        border-radius: 7px;
    }


    /* -----------------------------------------
       CONTENT
       One column on mobile
    ----------------------------------------- */

    .about-pooja__description {
        display: block;
    }


    /* -----------------------------------------
       FIRST PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:first-child {
        margin: 0 0 18px;


        line-height: 1.55;
    }


    /* -----------------------------------------
       EMPTY DIV
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(2):empty {
        display: none;
    }


    /* -----------------------------------------
       SECOND PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(3) {
        margin: 0;

        line-height: 1.6;
    }


    /* -----------------------------------------
       CERTIFICATIONS
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(4) {
        margin-top: 25px;
    }


    .about-pooja__description ul {
        margin: 0;

        padding: 0;
    }


    .about-pooja__description ul li {
        margin-bottom: 10px;

        padding-left: 27px;


        line-height: 1.45;
    }


    .about-pooja__description ul li::before {
        top: 1px;

        width: 18px;

        height: 18px;

        font-size: 10px;

        line-height: 18px;
    }


    /* -----------------------------------------
       BUTTON
    ----------------------------------------- */

    .about-pooja__download-button {
        width: 196px;

        height: 40px;

        margin-top: 40px;
    }
}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 450px) {

    .about-pooja {
        width: calc(100% - 24px);

        padding-bottom: 35px;
    }


    /* -----------------------------------------
       HEADING
    ----------------------------------------- */

    .about-pooja__heading {
        margin-bottom: 22px;
    }


    .about-pooja__title {
        font-size: 22px;

        line-height: 1.15;
    }


    .about-pooja__subtitle {

        line-height: 1.3;
    }


    /* -----------------------------------------
       IMAGES
    ----------------------------------------- */

    .about-pooja__images {
        gap: 10px;

        margin-bottom: 25px;
    }


    .about-pooja__image {
        height: 240px;

        border-radius: 6px;
    }


    /* -----------------------------------------
       FIRST PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:first-child {

        line-height: 1.55;

        margin-bottom: 16px;
    }


    /* -----------------------------------------
       SECOND PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(3) {

        line-height: 1.6;
    }


    /* -----------------------------------------
       CERTIFICATIONS
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(4) {
        margin-top: 20px;
    }


    .about-pooja__description ul li {
        margin-bottom: 9px;

        padding-left: 25px;

        line-height: 1.45;
    }


    .about-pooja__description ul li::before {
        width: 17px;

        height: 17px;

        font-size: 9px;

        line-height: 17px;
    }


    /* -----------------------------------------
       BUTTON
    ----------------------------------------- */

    .about-pooja__download-button {
        width: 190px;

        height: 39px;

        margin-top: 35px;

    }
}


/* =========================================
   VERY SMALL MOBILE
========================================= */

@media (max-width: 350px) {

    .about-pooja {
        width: calc(100% - 20px);
    }


    /* -----------------------------------------
       HEADING
    ----------------------------------------- */

    .about-pooja__title {
        font-size: 20px;
    }





    /* -----------------------------------------
       IMAGE
    ----------------------------------------- */

    .about-pooja__image {
        height: 210px;
    }


    /* -----------------------------------------
       FIRST PARAGRAPH
    ----------------------------------------- */

    .about-pooja__description>div:first-child {


        line-height: 1.55;

        margin-bottom: 15px;
    }


    /* -----------------------------------------
       SECOND PARAGRAPH
    ----------------------------------------- */



    /* -----------------------------------------
       CERTIFICATIONS
    ----------------------------------------- */

    .about-pooja__description>div:nth-child(4) {
        margin-top: 18px;
    }


    .about-pooja__description ul li {
        padding-left: 23px;



        line-height: 1.45;
    }


    .about-pooja__description ul li::before {
        width: 16px;

        height: 16px;

        font-size: 8px;

        line-height: 16px;
    }
}