/* =========================================
           GLOBAL
        ========================================= */

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html,
        body {
            width: 100%;
            max-width: 100%;
            overflow-x: hidden;
        }

        body {
            font-family: Arial, Helvetica, sans-serif;
            background: #ffffff;
        }

        img {
            max-width: 100%;
            height: auto;
            display: block;
        }

        a {
            text-decoration: none;
        }

        .container {
            width: 100%;
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 20px;
        }


        /* =========================================
           TOP PROMOTIONAL BAR
        ========================================= */

        .top-bar {
            width: 100%;
            background: #073b2a;
            color: #ffffff;
            border-bottom: 1px solid rgba(212, 175, 55, 0.45);
        }

        .top-bar-inner {
            min-height: 42px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

        .top-bar-text {
            padding: 8px 0;
            font-size: 13px;
            line-height: 20px;
            font-weight: 600;
			 animation: textBlink 1s ease-in-out infinite;
        }
@keyframes textBlink {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}
        .top-bar-text i {
            color: #d5b13e;
            margin: 0 5px;
        }

.top-bar1 {
            width: 100%;
            background: #d4af37;
            color: #000;
            border-bottom: 1px solid rgba(212, 175, 55, 0.45);
        }

        .top-bar-inner1 {
            min-height: 42px;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
        }

        .top-bar-text1 {
            padding: 8px 0;
            font-size: 13px;
            line-height: 20px;
            font-weight: 600;
			 
        }

        /* =========================================
           MAIN HEADER
        ========================================= */

        .main-header {
            width: 100%;
            background: #fffdf7;
            border-bottom: 1px solid #e8dfc5;
        }

        .header-inner {
            min-height: 125px;

            display: grid;

            /* LEFT LOGO + RIGHT 3 COLUMNS */
            grid-template-columns: 270px minmax(0, 1fr);

            align-items: center;

            gap: 35px;
        }


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

        .logo-area {
            width: 100%;
            min-width: 0;
        }

        .logo-area a {
            display: block;
            width: 100%;
        }

        .logo-area img {
            width: 100%;
            max-width: 100%;
            height: auto;
            margin: auto;
            object-fit: contain;
        }


        /* =========================================
           RIGHT SIDE - 3 COLUMNS
        ========================================= */

        .header-info {
            width: 100%;

            display: grid;

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

            align-items: stretch;
        }


        /* =========================================
           INFO COLUMN
        ========================================= */

        .info-column {
            min-width: 0;

            min-height: 75px;

            padding: 8px 20px;

            display: flex;
            align-items: center;

            gap: 12px;

            border-left: 1px solid #ded5b9;
        }


        /* =========================================
           ICON
        ========================================= */

        .info-icon {
            flex: 0 0 48px;

            width: 48px;
            height: 48px;

            border-radius: 50%;

            background: #073b2a;

            color: #d7b449;

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

            font-size: 19px;

            border: 2px solid #d7b449;
        }


        /* =========================================
           TEXT
        ========================================= */

        .info-content {
            min-width: 0;
        }

        .info-content .small-title {
            display: block;

            color: #000;

            font-size: 10px;

            text-transform: uppercase;

            letter-spacing: 0.8px;

            margin-bottom: 4px;
        }

        .info-content h3 {
            color: #073b2a;

            font-size: 14px;

            line-height: 20px;

            font-weight: 700;

            margin-bottom: 3px;
        }

        .info-content p {
            color: #000;

            font-size: 11px;

            line-height: 16px;
        }


        /* =========================================
           PHONE LINK
        ========================================= */

        .phone-link {
            color: #d4af37 !important;
        }

        .phone-link:hover {
            color: #a67d17 !important;
        }


        /* =========================================
           WHATSAPP LINK
        ========================================= */

        .whatsapp-link {
            color: #d4af37 !important;
        }

        .whatsapp-link:hover {
            color: #0d653e !important;
        }


        /* =========================================
           GOLD BOTTOM LINE
        ========================================= */

        .gold-line {
            width: 100%;
            height: 3px;

            background:
                linear-gradient(
                    90deg,
                    transparent,
                    #073b2a
,
                    #efd477,
                    #073b2a
,
                    transparent
                );
        }


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

        @media (max-width: 1050px) {

            .header-inner {
                grid-template-columns: 220px minmax(0, 1fr);
                gap: 20px;
            }

            .logo-area img {
                width: 100%;
            }

            .info-column {
                padding: 8px 12px;
                gap: 9px;
            }

            .info-icon {
                flex: 0 0 42px;
                width: 42px;
                height: 42px;
                font-size: 16px;
            }

            .info-content h3 {
                font-size: 12px;
            }

            .info-content p {
                font-size: 10px;
            }

        }


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

        @media (max-width: 800px) {

            .header-inner {
                grid-template-columns: 1fr;

                min-height: auto;

                padding-top: 20px;
                padding-bottom: 20px;

                gap: 20px;
            }

            .logo-area {
                text-align: center;
            }

            .logo-area img {
                width: 100%;
                margin: auto;
            }

            .header-info {
                grid-template-columns: repeat(3, minmax(0, 1fr));
            }

            .info-column {
                padding: 8px 10px;
            }

            .info-icon {
                flex: 0 0 38px;
                width: 38px;
                height: 38px;
                font-size: 14px;
            }

            .info-content .small-title {
                font-size: 8px;
            }

            .info-content h3 {
                font-size: 11px;
                line-height: 16px;
            }

            .info-content p {
                font-size: 9px;
                line-height: 13px;
            }

        }


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

        @media (max-width: 600px) {

            .container {
                padding-left: 14px;
                padding-right: 14px;
            }

            /* Top Bar */

            .top-bar-inner {
                min-height: 48px;
            }

            .top-bar-text {
                font-size: 11px;
                line-height: 17px;
                padding: 7px 3px;
            }


            /* Logo */

            .header-inner {
                padding-top: 16px;
                padding-bottom: 16px;
                gap: 18px;
            }

            .logo-area img {
                width: 100%;
            }


            /* 3 Columns -> Vertical */

            .header-info {
                grid-template-columns: 1fr;
                gap: 8px;
            }


            /* Info Box */

            .info-column {
                width: 100%;

               

                padding: 9px 12px;

                border: 1px solid #e5ddc6;

                border-radius: 6px;

                background: #073b2a;
            }

            .info-icon {
                flex: 0 0 42px;

                width: 42px;
                height: 42px;

                font-size: 16px;
            }

            .info-content .small-title {
                font-size: 9px;
				        color: #fff;
            }

            .info-content h3 {
                font-size: 20px;
                line-height: 18px;
				color:#d4af37;
            }

            .info-content p {
                font-size: 10px;
                line-height: 15px;
				color:#fff;
            }

        }


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

        @media (max-width: 380px) {

            .container {
                padding-left: 11px;
                padding-right: 11px;
            }

            .logo-area img {
                width: 100%;
            }

            .top-bar-text {
                font-size: 10px;
            }

        }

/* =========================================
   MARQUEE SECTION
========================================= */

.astrology-marquee {
    width: 100%;
    max-width: 100%;
    overflow: hidden;

    background: #d4af37;

    border-top: 1px solid #b28b1d;
    border-bottom: 1px solid #b28b1d;

    position: relative;
}


/* =========================================
   MARQUEE TRACK
========================================= */

.marquee-track {
    

    display: flex;
    align-items: center;

    animation: astrologyMarquee 28s linear infinite;

    will-change: transform;
}


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

.marquee-content {
    display: flex;
    align-items: center;

    flex-shrink: 0;

    white-space: nowrap;
}


/* =========================================
   TEXT
========================================= */

.marquee-content span {
    display: inline-flex;
    align-items: center;

    gap: 7px;

    padding: 11px 18px;

    color: #073b2a;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: .2px;
}


/* =========================================
   ICON
========================================= */

.marquee-content span i {
    font-size: 13px;
    color: #073b2a;
}


/* =========================================
   SEPARATOR
========================================= */

.marquee-content b {
    color: #073b2a;

    font-size: 16px;

    font-weight: 900;
}


/* =========================================
   ANIMATION
========================================= */

@keyframes astrologyMarquee {

    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }

}


/* =========================================
   HOVER - PAUSE
========================================= */

.astrology-marquee:hover .marquee-track {
    animation-play-state: paused;
}


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

@media (max-width: 600px) {

    .marquee-content span {
        font-size: 11px;
        padding: 10px 13px;
        gap: 5px;
    }

    .marquee-content span i {
        font-size: 11px;
    }

    .marquee-content b {
        font-size: 13px;
    }

}

/* =========================================
   IMAGE SLIDER
========================================= */

.image-slider {
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
}


/* =========================================
   SLIDER WRAPPER
========================================= */

.image-slider-wrapper {
    width: 100%;
    position: relative;
    overflow: hidden;
}


/* =========================================
   SLIDE
========================================= */

.image-slide {
    width: 100%;

    display: none;

    margin: 0;
    padding: 0;

    line-height: 0;
}

.image-slide.active {
    display: block;
}


/* =========================================
   IMAGE
========================================= */

.image-slide img {
    width: 100%;
    height: auto;

    display: block;

    margin: 0;
    padding: 0;

    object-fit: cover;
}


/* =========================================
   DESKTOP
========================================= */

@media (min-width: 1200px) {

    .image-slide img {
        width: 100%;
        height: auto;
    }

}


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

@media (max-width: 900px) {

    .image-slide img {
        width: 100%;
        height: auto;
    }

}


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

@media (max-width: 600px) {

    .image-slider {
        width: 100%;
        overflow: hidden;
    }

    .image-slide {
        width: 100%;
    }

    .image-slide img {
        width: 100%;
        height: auto;

        object-fit: cover;
    }

}

/* =========================================
   SECTION
========================================= */

.paper-service-section {
    width: 100%;
    overflow: hidden;

    padding: 75px 0 85px;

    background:
        radial-gradient(
            circle at top,
            #fffdf5 0%,
            #f7f2e3 55%,
            #ffffff 100%
        );
}


/* =========================================
   CONTAINER
========================================= */

.paper-service-container {
    width: 100%;
    max-width: 1180px;

    margin: auto;

    padding: 0 20px;
}


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

.paper-service-heading {
    max-width: 700px;

    margin: 0 auto 75px;

    text-align: center;
}

.paper-service-heading span {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #a37a16;

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin-bottom: 9px;
}

.paper-service-heading span i {
    color: #073b2a;
}

.paper-service-heading h2 {
    color: #073b2a;

    font-size: 34px;

    line-height: 42px;

    margin-bottom: 12px;
}

.paper-service-heading p {
    color: #000;

    font-size: 14px;

    line-height: 23px;
}


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

.paper-service-grid {
    width: 100%;

    display: grid;

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

    gap: 35px;
}


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

.paper-service-card {
    min-width: 0;

    text-align: center;

    padding: 15px 18px 28px;

    background: #073b2a;

    border-radius: 12px;

    box-shadow:
        0 12px 35px rgba(7, 59, 42, 0.09);

    position: relative;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}

.paper-service-card:hover {
    transform: translateY(-8px);

    box-shadow:
        0 18px 45px rgba(7, 59, 42, 0.15);
}


/* =========================================
   PAPER CUT OUTER
========================================= */

.paper-cut {
    width: 190px;
    height: 190px;

    margin: -48px auto 25px;

    position: relative;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #ffffff;

    border-radius: 50%;

    box-shadow:
        0 8px 0 #eee4c9,
        0 14px 0 #f7f1df,
        0 20px 25px rgba(0,0,0,.10);
}


/* =========================================
   PAPER CUT LAYER
========================================= */

.paper-cut::before {
    content: "";

    position: absolute;

    inset: -9px;

    border-radius: 50%;

    border: 2px dashed #d3b052;

    transform: rotate(-7deg);

    pointer-events: none;
}


/* =========================================
   SECOND PAPER LAYER
========================================= */

.paper-cut::after {
    content: "";

    position: absolute;

    inset: -16px;

    border-radius: 50%;

    border: 1px solid #eadcae;

    transform: rotate(8deg);

    pointer-events: none;
}


/* =========================================
   INNER PAPER
========================================= */

.paper-cut-inner {
    width: 172px;
    height: 172px;

    border-radius: 50%;

    padding: 7px;

    background:
        linear-gradient(
            145deg,
            #fffef9,
            #eee5ca
        );

    box-shadow:
        inset 0 0 0 1px #d9c78f;

    position: relative;

    z-index: 2;
}


/* =========================================
   SERVICE IMAGE
========================================= */

.service-image {
    width: 100%;
    height: 100%;

    border-radius: 50%;

    overflow: hidden;

    border: 4px solid #ffffff;

    box-shadow:
        0 3px 12px rgba(0,0,0,.15);
}

.service-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform .5s ease;
}

.paper-service-card:hover
.service-image img {
    transform: scale(1.08);
}


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

.service-content {
    position: relative;

    z-index: 3;
}

.service-content h3 {
    color: #d4af37;

    font-size: 21px;

    line-height: 26px;

    margin-bottom: 9px;
}

.service-content p {
    color: #fff;

    font-size: 14px;

    line-height: 25px;

    max-width: 290px;

    margin: auto;
}


/* =========================================
   READ MORE
========================================= */

.service-content a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    margin-top: 15px;

    color: #a07818;

    font-size: 17px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: .5px;
}

.service-content a i {
    font-size: 10px;

    transition: transform .3s ease;
}

.service-content a:hover i {
    transform: translateX(4px);
}


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

@media (max-width: 900px) {

    .paper-service-section {
        padding-top: 65px;
    }

    .paper-service-grid {
        gap: 25px;
    }

    .paper-cut {
        width: 165px;
        height: 165px;
    }

    .paper-cut-inner {
        width: 149px;
        height: 149px;
    }

    .service-content h3 {
        font-size: 16px;
    }

}


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

@media (max-width: 600px) {

    .paper-service-section {
        padding: 60px 0 65px;
    }

    .paper-service-container {
        padding: 0 15px;
    }

    .paper-service-heading {
        margin-bottom: 48px;
    }

    .paper-service-heading h2 {
        font-size: 27px;
        line-height: 35px;
    }

    .paper-service-heading p {
        font-size: 12px;
        line-height: 20px;
    }

    .paper-service-grid {
        grid-template-columns: 1fr;
        gap: 70px;
    }

    .paper-service-card {
        padding-left: 18px;
        padding-right: 18px;
    }

    .paper-cut {
        width: 180px;
        height: 180px;
    }

    .paper-cut-inner {
        width: 161px;
        height: 161px;
    }

    .service-content h3 {
        font-size: 18px;
    }

}


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

@media (max-width: 380px) {

    .paper-service-heading h2 {
        font-size: 24px;
    }

    .paper-cut {
        width: 165px;
        height: 165px;
    }

    .paper-cut-inner {
        width: 147px;
        height: 147px;
    }

}

/* =========================================
   MAIN SECTION
========================================= */

.about-cta-section {
    width: 100%;
    overflow: hidden;
    background: #ffffff;
}


/* =========================================
   ABOUT CONTAINER
========================================= */

.about-cta-container {
    width: 100%;
    max-width: 1180px;

    margin: auto;

    padding: 80px 20px;
}


/* =========================================
   ABOUT WRAPPER
========================================= */

.about-wrapper {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 0.85fr)
        minmax(0, 1.15fr);

    gap: 70px;

    align-items: center;
}


/* =========================================
   IMAGE AREA
========================================= */

.about-image-area {
    min-width: 0;
    position: relative;
}

.about-image-frame {
    width: 100%;
  /*  max-width: 430px; */

    margin: auto;

    padding: 10px;

    background: #f4eedb;

    border: 1px solid #d5bd71;

    position: relative;
}


/* IMAGE */

.about-image-frame img {
    width: 100%;
   
    object-fit: cover;

    display: block;
}


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

.about-badge {
    position: absolute;

    right: -25px;
    bottom: 25px;

    width: 155px;

    padding: 15px;

    background: #073b2a;

    color: #ffffff;

    border-left: 4px solid #d4af37;

    box-shadow:
        0 8px 25px rgba(0,0,0,.16);
}

.about-badge i {
    color: #d4af37;

    font-size: 18px;

    margin-bottom: 8px;
}

.about-badge strong {
    display: block;

    font-size: 13px;

    margin-bottom: 4px;
}

.about-badge span {
    display: block;

    color: #d8d8d8;

    font-size: 10px;

    line-height: 15px;
}


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

.about-content {
    min-width: 0;
}

.about-label {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #a57b17;

    font-size: 11px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin-bottom: 10px;
}

.about-label i {
    color: #073b2a;
}

.about-content h2 {
    color: #073b2a;

    font-size: 36px;

    line-height: 1.18;

    margin-bottom: 18px;
}

.about-content h2 span {
    color: #a57b17;
}

.about-content > p {
    color: #000;

    font-size: 14px;

    line-height: 24px;

    margin-bottom: 12px;

    max-width: 620px;
}


/* =========================================
   FEATURES
========================================= */

.about-features {
    display: grid;

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

    gap: 15px;

    margin-top: 25px;

    margin-bottom: 25px;
}

.about-feature {
    min-width: 0;

    padding: 15px 12px;

    background: #faf8f0;

    border: 1px solid #eee4c7;

    border-radius: 5px;
}

.feature-icon {
    width: 35px;
    height: 35px;

    margin-bottom: 9px;

    display: flex;

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

    border-radius: 50%;

    background: #073b2a;

    color: #d4af37;

    font-size: 13px;
}

.about-feature strong {
    display: block;

    color: #073b2a;

    font-size: 11px;

    line-height: 16px;

    margin-bottom: 4px;
}

.about-feature span {
    display: block;

    color: #000;

    font-size: 9px;

    line-height: 14px;
}


/* =========================================
   ABOUT BUTTONS
========================================= */

.about-buttons {
    display: flex;

    align-items: center;

    gap: 10px;

    flex-wrap: wrap;
}

.about-call-btn,
.about-whatsapp-btn {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    min-height: 44px;

    padding: 0 18px;

    font-size: 12px;

    font-weight: 700;

    border-radius: 4px;

    transition: all .3s ease;
}

.about-call-btn {
    background: #073b2a;

    color: #ffffff;
}

.about-call-btn:hover {
    background: #0c4c37;
}

.about-whatsapp-btn {
    background: #d4af37;

    color: #073b2a;
}

.about-whatsapp-btn:hover {
    background: #e3c55f;
}


/* =========================================
   CTA SECTION
========================================= */

.cta-wrapper {
    width: 100%;

    position: relative;

    overflow: hidden;

    padding: 65px 20px;

    background:
        linear-gradient(
            135deg,
            #073b2a 0%,
            #0b4a34 50%,
            #062b1f 100%
        );

    text-align: center;
}


/* =========================================
   CTA PATTERN
========================================= */

.cta-pattern {
    position: absolute;

    width: 300px;
    height: 300px;

    border: 1px solid rgba(212,175,55,.15);

    border-radius: 50%;

    top: -150px;
    left: -80px;
}

.cta-pattern::before,
.cta-pattern::after {
    content: "";

    position: absolute;

    border: 1px solid rgba(212,175,55,.12);

    border-radius: 50%;
}

.cta-pattern::before {
    inset: 25px;
}

.cta-pattern::after {
    inset: 50px;
}


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

.cta-content {
    position: relative;

    z-index: 2;

    max-width: 750px;

    margin: auto;
}

.cta-label {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    color: #d8b449;

    font-size: 11px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;

    margin-bottom: 12px;
}

.cta-content h2 {
    color: #ffffff;

    font-size: 34px;

    line-height: 43px;

    margin-bottom: 12px;
}

.cta-content h2 span {
    color: #d8b449;
}

.cta-content > p {
    color: rgba(255,255,255,.78);

    font-size: 14px;

    line-height: 23px;

    margin-bottom: 25px;
}


/* =========================================
   CTA BUTTONS
========================================= */

.cta-buttons {
    display: flex;

    justify-content: center;

    align-items: center;

    gap: 12px;

    flex-wrap: wrap;
}

.cta-call,
.cta-whatsapp {
    min-height: 46px;

    padding: 0 21px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    border-radius: 4px;

    font-size: 12px;

    font-weight: 700;

    transition: all .3s ease;
}

.cta-call {
    background: #d4af37;

    color: #073b2a;
}

.cta-call:hover {
    background: #ffffff;
}

.cta-whatsapp {
    border: 1px solid rgba(255,255,255,.6);

    color: #ffffff;

    background: transparent;
}

.cta-whatsapp:hover {
    background: #ffffff;

    color: #073b2a;
}


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

@media (max-width: 950px) {

    .about-cta-container {
        padding: 65px 20px;
    }

    .about-wrapper {
        gap: 45px;
    }

    .about-content h2 {
        font-size: 30px;
    }

    .about-features {
        gap: 9px;
    }

}


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

@media (max-width: 700px) {

    .about-cta-container {
        padding: 60px 15px;
    }

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

        gap: 45px;
    }

    .about-image-frame {
        max-width: 370px;
    }

    .about-badge {
        right: 0;
        bottom: 20px;
    }

    .about-content {
        text-align: center;
    }

    .about-content h2 {
        font-size: 27px;

        line-height: 35px;
    }

    .about-content > p {
        font-size: 13px;

        line-height: 22px;
    }

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

        text-align: left;
    }

    .about-feature {
        display: flex;

        align-items: center;

        gap: 12px;
    }

    .feature-icon {
        flex: 0 0 35px;

        margin-bottom: 0;
    }

    .about-buttons {
        justify-content: center;
    }


    /* CTA */

    .cta-wrapper {
        padding: 55px 15px;
    }

    .cta-content h2 {
        font-size: 26px;

        line-height: 34px;
    }

    .cta-content > p {
        font-size: 12px;

        line-height: 20px;
    }

}


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

@media (max-width: 380px) {

    .about-image-frame {
        max-width: 300px;
    }

    .about-badge {
        width: 135px;

        padding: 12px;
    }

    .about-content h2 {
        font-size: 24px;

        line-height: 31px;
    }

    .cta-content h2 {
        font-size: 23px;

        line-height: 31px;
    }

    .about-call-btn,
    .about-whatsapp-btn,
    .cta-call,
    .cta-whatsapp {
        width: 100%;
    }

}
/* =========================================================
   PREMIUM ISLAMIC SERVICES SECTION
   UNIQUE PREFIX: mkp2-
========================================================= */

.mkp2-services {
    width: 100%;
    max-width: 100%;
    position: relative;
    overflow: hidden;

    padding: 90px 0;

    background-color: #052d22;

    background-image:
        linear-gradient(
            rgba(3, 39, 29, 0.92),
            rgba(3, 39, 29, 0.92)
        ),
        url("images/bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    background-attachment: fixed;
}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.mkp2-services::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #a47a18 20%,
            #f1d26b 50%,
            #a47a18 80%,
            transparent 100%
        );
}


/* =========================================================
   CENTER GOLD GLOW
========================================================= */

.mkp2-services::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    left: 50%;
    top: 48%;

    transform: translate(-50%, -50%);

    background:
        radial-gradient(
            circle,
            rgba(212,175,55,.10) 0%,
            rgba(212,175,55,.04) 35%,
            rgba(212,175,55,0) 72%
        );

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   CONTAINER
========================================================= */

.mkp2-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    position: relative;

    z-index: 3;
}


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

.mkp2-heading {
    width: 100%;
    max-width: 720px;

    margin: 0 auto 58px;

    text-align: center;
}


/* SMALL LABEL */

.mkp2-eyebrow {
    display: inline-flex;

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

    gap: 8px;

    color: #e3bd51;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}

.mkp2-eyebrow i {
    color: #f1d36d;

    font-size: 13px;
}


/* MAIN HEADING */

.mkp2-heading h2 {
    margin: 10px 0 13px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    line-height: 46px;

    font-weight: 700;
}


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

.mkp2-heading-line {
    width: 100%;

    display: flex;

    align-items: center;

    justify-content: center;

    gap: 10px;

    margin-bottom: 14px;
}

.mkp2-heading-line span {
    width: 65px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d4af37
        );
}

.mkp2-heading-line span:last-child {
    background:
        linear-gradient(
            90deg,
            #d4af37,
            transparent
        );
}

.mkp2-heading-line i {
    color: #e1bd51;

    font-size: 10px;
}


/* DESCRIPTION */

.mkp2-heading p {
    max-width: 650px;

    margin: 0 auto;

    color: rgba(255,255,255,.72);

    font-size: 13px;

    line-height: 22px;
}


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

.mkp2-grid {
    width: 100%;

    display: grid;

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

    gap: 62px 30px;
}


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

.mkp2-card {
    width: 100%;

    min-width: 0;

    position: relative;

    background:
        linear-gradient(
            145deg,
            #fffef9 0%,
            #f8f0d8 100%
        );

    border: 1px solid rgba(212,175,55,.60);

    padding: 10px 0 25px;

    box-shadow:
        0 18px 40px rgba(0,0,0,.25),
        0 2px 0 rgba(255,255,255,.75) inset;

    transition:
        transform .35s ease,
        box-shadow .35s ease;

    /*
       TORN PAPER EDGE
    */

    clip-path: polygon(
        0 1%,
        5% 2%,
        10% 1%,
        15% 2%,
        20% 1%,
        25% 2%,
        30% 1%,
        35% 2%,
        40% 1%,
        45% 2%,
        50% 1%,
        55% 2%,
        60% 1%,
        65% 2%,
        70% 1%,
        75% 2%,
        80% 1%,
        85% 2%,
        90% 1%,
        95% 2%,
        100% 1%,

        99% 98%,
        95% 97%,
        90% 99%,
        85% 97%,
        80% 99%,
        75% 97%,
        70% 99%,
        65% 97%,
        60% 99%,
        55% 97%,
        50% 99%,
        45% 97%,
        40% 99%,
        35% 97%,
        30% 99%,
        25% 97%,
        20% 99%,
        15% 97%,
        10% 99%,
        5% 97%,
        1% 99%
    );
}


/* CARD HOVER */

.mkp2-card:hover {
    transform: translateY(-10px);

    box-shadow:
        0 27px 50px rgba(0,0,0,.32),
        0 2px 0 rgba(255,255,255,.8) inset;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.mkp2-photo {
    width: 100%;

    height: 220px;

    position: relative;

    margin-bottom: -20px;
}


/* =========================================================
   PAPER BACK LAYERS
========================================================= */

.mkp2-sheet {
    position: absolute;

    pointer-events: none;
}


/* FIRST PAPER */

.mkp2-sheet-a {
    z-index: 1;

    inset: 15px 12px 2px;

    background: #bda45f;

    transform:
        rotate(-3deg)
        translate(-5px, 4px);

    clip-path: polygon(
        1% 2%,
        10% 1%,
        20% 3%,
        30% 1%,
        40% 3%,
        50% 1%,
        60% 3%,
        70% 1%,
        80% 3%,
        90% 1%,
        99% 3%,

        98% 97%,
        90% 96%,
        80% 98%,
        70% 96%,
        60% 98%,
        50% 96%,
        40% 98%,
        30% 96%,
        20% 98%,
        10% 96%,
        1% 98%
    );
}


/* SECOND PAPER */

.mkp2-sheet-b {
    z-index: 2;

    inset: 11px 9px 2px;

    background: #eee4c8;

    transform:
        rotate(2deg)
        translate(4px, 3px);

    clip-path: polygon(
        1% 1%,
        10% 3%,
        20% 1%,
        30% 3%,
        40% 1%,
        50% 3%,
        60% 1%,
        70% 3%,
        80% 1%,
        90% 3%,
        99% 2%,

        98% 98%,
        90% 96%,
        80% 99%,
        70% 97%,
        60% 99%,
        50% 97%,
        40% 99%,
        30% 97%,
        20% 99%,
        10% 97%,
        1% 98%
    );
}


/* =========================================================
   MAIN IMAGE
========================================================= */

.mkp2-photo img {
    position: absolute;

    z-index: 3;

    top: 9px;
    left: 8px;

    width: calc(100% - 16px);

    height: calc(100% - 2px);

    display: block;

    object-fit: cover;

    box-shadow:
        0 9px 20px rgba(0,0,0,.18);

    clip-path: polygon(
        0 2%,
        7% 0,
        14% 2%,
        21% 0,
        28% 2%,
        35% 0,
        42% 2%,
        49% 0,
        56% 2%,
        63% 0,
        70% 2%,
        77% 0,
        84% 2%,
        91% 0,
        100% 2%,

        98% 98%,
        91% 96%,
        84% 99%,
        77% 97%,
        70% 99%,
        63% 97%,
        56% 99%,
        49% 97%,
        42% 99%,
        35% 97%,
        28% 99%,
        21% 97%,
        14% 99%,
        7% 97%,
        0 99%
    );

    transition:
        transform .5s ease;
}


/* IMAGE HOVER */

.mkp2-card:hover .mkp2-photo img {
    transform: scale(1.05);
}


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

.mkp2-card-body {
    position: relative;

    z-index: 5;

    padding: 0 22px;

    text-align: center;
}


/* =========================================================
   ROUND ICON
========================================================= */

.mkp2-icon {
    width: 44px;
    height: 44px;

    margin: -2px auto 11px;

    display: flex;

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

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #073f2d,
            #05291f
        );

    border: 3px solid #fffdf7;

    outline: 1px solid #c9a33a;

    color: #e0bb4d;

    font-size: 14px;

    box-shadow:
        0 5px 14px rgba(0,0,0,.18);
}


/* =========================================================
   TITLE
========================================================= */

.mkp2-card-body h3 {
    margin: 0 0 9px;

    color: #073b2a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 19px;

    line-height: 26px;

    font-weight: 700;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.mkp2-card-body p {
    max-width: 300px;

    min-height: 62px;

    margin: 0 auto 20px;

    color: #000;

    font-size: 13px;

    line-height: 20px;
}


/* =========================================================
   ACTION BUTTONS
========================================================= */

.mkp2-actions {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr);

    gap: 9px;
}

.mkp2-actions a {
    min-width: 0;

    min-height: 41px;

    padding: 0 7px;

    display: flex;

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

    gap: 6px;

    text-decoration: none;

    font-size: 10px;

    font-weight: 700;

    border-radius: 4px;

    transition:
        transform .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}


/* CALL BUTTON */

.mkp2-call {
    background:
        linear-gradient(
            135deg,
            #084532,
            #05291f
        );

    color: #ffffff;

    box-shadow:
        0 4px 10px rgba(4,40,29,.18);
}

.mkp2-call:hover {
    background:
        linear-gradient(
            135deg,
            #0b5a41,
            #073a2b
        );

    transform: translateY(-2px);
}


/* WHATSAPP BUTTON */

.mkp2-wa {
    background:
        linear-gradient(
            135deg,
            #e1bd4e,
            #c99d24
        );

    color: #073b2a;

    box-shadow:
        0 4px 10px rgba(165,126,22,.18);
}

.mkp2-wa:hover {
    background:
        linear-gradient(
            135deg,
            #f0d16d,
            #d5ad35
        );

    transform: translateY(-2px);
}


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

@media (max-width: 950px) {

    .mkp2-services {
        padding: 75px 0;
    }

    .mkp2-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 55px 22px;
    }

}


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

@media (max-width: 600px) {

    .mkp2-services {

        padding: 60px 0;

        /*
           Disable fixed background on mobile
           to prevent scrolling/shaking issues
        */

        background-attachment: scroll;
    }

    .mkp2-container {
        padding: 0 14px;
    }

    .mkp2-heading {
        margin-bottom: 45px;
    }

    .mkp2-heading h2 {
        font-size: 28px;

        line-height: 36px;
    }

    .mkp2-heading p {
        padding: 0 8px;

        font-size: 12px;

        line-height: 20px;
    }

    .mkp2-grid {
        grid-template-columns: 1fr;

        gap: 50px;
    }

    .mkp2-photo {
        height: 220px;
    }

    .mkp2-card-body {
        padding: 0 20px;
    }

}


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

@media (max-width: 380px) {

    .mkp2-services {
        padding: 50px 0;
    }

    .mkp2-container {
        padding: 0 12px;
    }

    .mkp2-heading h2 {
        font-size: 25px;

        line-height: 33px;
    }

    .mkp2-heading-line span {
        width: 40px;
    }

    .mkp2-photo {
        height: 195px;
    }

    .mkp2-card-body {
        padding: 0 16px;
    }

    .mkp2-card-body h3 {
        font-size: 17px;

        line-height: 24px;
    }

    .mkp2-card-body p {
        font-size: 10.5px;

        line-height: 18px;

        min-height: 55px;
    }

    .mkp2-actions a {
        min-height: 38px;

        font-size: 9px;
    }

}


/* =========================================================
   EXTRA SMALL DEVICES
========================================================= */

@media (max-width: 320px) {

    .mkp2-container {
        padding: 0 10px;
    }

    .mkp2-photo {
        height: 180px;
    }

    .mkp2-card-body {
        padding: 0 13px;
    }

    .mkp2-actions {
        gap: 6px;
    }

    .mkp2-actions a {
        font-size: 8.5px;

        gap: 4px;
    }

}
/* =========================================================
   COUNTER + WHY CHOOSE US
   MAULANA IMARAN KHAN
   UNIQUE CSS PREFIX: mik-
========================================================= */


/* =========================================================
   MAIN SECTION
========================================================= */

.mik-counter-why {
    width: 100%;
    max-width: 100%;

    position: relative;
    overflow: hidden;

    padding: 90px 0;

    background-color: #f7f1df;

    background-image:
        linear-gradient(
            rgba(247, 241, 223, 0.94),
            rgba(247, 241, 223, 0.94)
        ),
        url("images/bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    background-attachment: scroll;
}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.mik-counter-why::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #a67c1c 20%,
            #e5c55d 50%,
            #a67c1c 80%,
            transparent 100%
        );
}


/* =========================================================
   CENTER GOLD GLOW
========================================================= */

.mik-counter-why::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    background:
        radial-gradient(
            circle,
            rgba(197, 157, 49, 0.10) 0%,
            rgba(197, 157, 49, 0.04) 35%,
            transparent 72%
        );

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.mik-counter-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    position: relative;

    z-index: 3;
}


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

.mik-counter-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 18px;

    margin-top: 75px;
}


/* =========================================================
   COUNTER BOX
========================================================= */

.mik-counter-box {
    min-width: 0;

    position: relative;

    padding: 28px 15px;

    text-align: center;

    background:
        rgba(255, 255, 255, 0.76);

    border: 1px solid rgba(170, 132, 39, 0.35);

    box-shadow:
        0 8px 25px rgba(70, 57, 25, 0.08);

    backdrop-filter: blur(5px);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


/* COUNTER HOVER */

.mik-counter-box:hover {
    transform: translateY(-6px);

    background: #fffdf7;

    border-color:
        rgba(170, 132, 39, 0.70);

    box-shadow:
        0 16px 32px rgba(70, 57, 25, 0.14);
}


/* =========================================================
   COUNTER ICON
========================================================= */

.mik-counter-icon {
    width: 45px;
    height: 45px;

    margin: 0 auto 13px;

    display: flex;

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

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #084632,
            #05291f
        );

    border: 1px solid #c7a13a;

    color: #e2bd50;

    font-size: 15px;

    box-shadow:
        0 5px 12px rgba(0,0,0,.10);
}


/* =========================================================
   COUNTER NUMBER
========================================================= */

.mik-counter-number {
    color: #073b2a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 32px;

    line-height: 39px;

    font-weight: 700;
}

.mik-counter-number span {
    color: #a67b18;
}


/* =========================================================
   COUNTER TITLE
========================================================= */

.mik-counter-title {
    margin-top: 5px;

    color: #000;

    font-size: 11px;

    line-height: 18px;

    letter-spacing: .4px;
}


/* =========================================================
   WHY CHOOSE US WRAPPER
========================================================= */

.mik-why-wrapper {
    width: 100%;

    display: grid;

    grid-template-columns:
        minmax(0, 1.25fr)
        minmax(300px, .75fr);

    gap: 70px;

    align-items: center;
}


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

.mik-why-content {
    min-width: 0;
}


/* =========================================================
   SMALL LABEL
========================================================= */

.mik-why-label {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    color: #a67b18;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}

.mik-why-label i {
    color: #073b2a;

    font-size: 13px;
}


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

.mik-why-content h2 {
    margin: 10px 0 12px;

    color: #073b2a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    line-height: 46px;

    font-weight: 700;
}

.mik-why-content h2 span {
    color: #a67b18;
}


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

.mik-why-line {
    display: flex;

    align-items: center;

    gap: 8px;

    margin-bottom: 19px;
}

.mik-why-line span {
    width: 48px;

    height: 1px;

    background: #c9a33c;
}

.mik-why-line i {
    color: #b18728;

    font-size: 8px;
}


/* =========================================================
   INTRODUCTION
========================================================= */

.mik-why-intro {
    max-width: 650px;

    margin: 0 0 30px;

    color: #000;

    font-size: 15px;

    line-height: 23px;
}


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

.mik-feature-list {
    width: 100%;

    display: grid;

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

    gap: 22px 28px;
}


/* =========================================================
   FEATURE
========================================================= */

.mik-feature {
    min-width: 0;

    display: flex;

    align-items: flex-start;

    gap: 13px;
}


/* =========================================================
   FEATURE ICON
========================================================= */

.mik-feature-icon {
    flex: 0 0 40px;

    width: 40px;
    height: 40px;

    display: flex;

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

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #084632,
            #05291f
        );

    border: 1px solid #c9a33c;

    color: #e0bc51;

    font-size: 12px;

    box-shadow:
        0 4px 10px rgba(0,0,0,.08);
}


/* =========================================================
   FEATURE TEXT
========================================================= */

.mik-feature-text {
    min-width: 0;
}

.mik-feature-text h3 {
    margin: 0 0 5px;

    color: #073b2a;

    font-size: 14px;

    line-height: 20px;

    font-weight: 700;
}

.mik-feature-text p {
    margin: 0;

    color: #000;

    font-size: 13px;

    line-height: 18px;
}


/* =========================================================
   RIGHT VISUAL AREA
========================================================= */

.mik-why-visual {
    min-width: 0;

    display: flex;

    align-items: center;

    justify-content: center;
}


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

.mik-visual-paper {
    width: 100%;

    max-width: 340px;

    min-height: 390px;

    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    padding: 40px 30px;

    text-align: center;

    background:linear-gradient(
            145deg,
            #084632,
            #05291f
        );

    border: 1px solid rgba(172,132,40,.28);

    box-shadow:
        0 22px 45px rgba(60, 48, 18, 0.16);

    clip-path: polygon(
        0 2%,
        8% 0,
        16% 2%,
        24% 0,
        32% 2%,
        40% 0,
        48% 2%,
        56% 0,
        64% 2%,
        72% 0,
        80% 2%,
        88% 0,
        100% 2%,

        98% 98%,
        90% 96%,
        82% 99%,
        74% 97%,
        66% 99%,
        58% 97%,
        50% 99%,
        42% 97%,
        34% 99%,
        26% 97%,
        18% 99%,
        10% 97%,
        1% 99%
    );
}


/* =========================================================
   PAPER INNER BORDER
========================================================= */

.mik-visual-pattern {
    position: absolute;

    inset: 18px;

    border: 1px solid rgba(160,125,38,.25);

    pointer-events: none;
}


/* DECORATIVE DIAMONDS */

.mik-visual-pattern::before,
.mik-visual-pattern::after {
    content: "";

    position: absolute;

    width: 55px;
    height: 55px;

    border: 1px solid rgba(160,125,38,.25);

    transform: rotate(45deg);
}

.mik-visual-pattern::before {
    top: -28px;
    left: -28px;
}

.mik-visual-pattern::after {
    right: -28px;
    bottom: -28px;
}


/* =========================================================
   VISUAL SYMBOL
========================================================= */

.mik-visual-symbol {
    width: 76px;
    height: 76px;

    display: flex;

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

    margin-bottom: 22px;

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #084632,
            #05291f
        );

    border: 5px solid #efe3c2;

    outline: 1px solid #c8a441;

    color: #e2bd50;

    font-size: 25px;

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


/* =========================================================
   VISUAL TITLE
========================================================= */

.mik-visual-title {
    position: relative;

    color: #fff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 27px;

    line-height: 35px;
}

.mik-visual-title strong {
    display: block;

    color: #a47b1b;

    font-size: 31px;
}


/* =========================================================
   VISUAL DIVIDER
========================================================= */

.mik-visual-divider {
    display: flex;

    align-items: center;

    gap: 8px;

    margin: 18px 0 12px;
}

.mik-visual-divider span {
    width: 42px;

    height: 1px;

    background: #c6a13c;
}

.mik-visual-divider i {
    color: #b18727;

    font-size: 8px;
}


/* =========================================================
   VISUAL DESCRIPTION
========================================================= */

.mik-visual-paper p {
    margin: 0;

    color: #fff;

    font-size: 10px;

    line-height: 18px;

    letter-spacing: 1.2px;
}


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

@media (max-width: 950px) {

    .mik-counter-why {
        padding: 75px 0;
    }

    .mik-counter-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 16px;

        margin-bottom: 65px;
    }

    .mik-why-wrapper {
        grid-template-columns: 1fr;

        gap: 55px;
    }

    .mik-why-content {
        text-align: center;
    }

    .mik-why-line {
        justify-content: center;
    }

    .mik-why-intro {
        margin-left: auto;
        margin-right: auto;
    }

    .mik-feature-list {
        text-align: left;
    }

}


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

@media (max-width: 600px) {

    .mik-counter-why {
        padding: 60px 0;

        background-attachment: scroll;
    }

    .mik-counter-container {
        padding: 0 14px;
    }


    /* COUNTERS */

    .mik-counter-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 12px;

        margin-top: 50px;
    }

    .mik-counter-box {
        padding: 22px 8px;
    }

    .mik-counter-icon {
        width: 40px;
        height: 40px;

        margin-bottom: 10px;

        font-size: 12px;
    }

    .mik-counter-number {
        font-size: 25px;

        line-height: 32px;
    }

    .mik-counter-title {
        font-size: 9px;

        line-height: 15px;
    }


    /* WHY */

    .mik-why-content h2 {
        font-size: 29px;

        line-height: 37px;
    }

    .mik-why-intro {
        font-size: 12px;

        line-height: 21px;
    }


    /* FEATURES */

    .mik-feature-list {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .mik-feature {
        gap: 11px;
    }

    .mik-feature-icon {
        flex-basis: 38px;

        width: 38px;
        height: 38px;
    }


    /* RIGHT PAPER */

    .mik-visual-paper {
        max-width: 310px;

        min-height: 340px;

        padding: 35px 25px;
    }

}


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

@media (max-width: 380px) {

    .mik-counter-why {
        padding: 50px 0;
    }

    .mik-counter-container {
        padding: 0 11px;
    }


    /* COUNTER */

    .mik-counter-grid {
        gap: 9px;
    }

    .mik-counter-box {
        padding: 18px 5px;
    }

    .mik-counter-number {
        font-size: 22px;

        line-height: 29px;
    }

    .mik-counter-title {
        font-size: 8.5px;
    }


    /* HEADING */

    .mik-why-content h2 {
        font-size: 26px;

        line-height: 34px;
    }

    .mik-why-intro {
        font-size: 11px;

        line-height: 20px;
    }


    /* PAPER */

    .mik-visual-paper {
        min-height: 320px;

        padding: 30px 20px;
    }

    .mik-visual-symbol {
        width: 68px;
        height: 68px;

        font-size: 22px;
    }

    .mik-visual-title {
        font-size: 24px;
    }

    .mik-visual-title strong {
        font-size: 28px;
    }

}


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

@media (max-width: 320px) {

    .mik-counter-container {
        padding: 0 9px;
    }

    .mik-counter-box {
        padding: 16px 4px;
    }

    .mik-counter-number {
        font-size: 20px;
    }

    .mik-counter-title {
        font-size: 8px;
    }

    .mik-feature-text h3 {
        font-size: 13px;
    }

    .mik-feature-text p {
        font-size: 10px;
    }

}
/* =========================================================
   CLIENT FEEDBACK SECTION
   MAULANA IMARAN KHAN
   UNIQUE PREFIX: mik-feedback-
========================================================= */


/* =========================================================
   MAIN SECTION
========================================================= */

.mik-feedback {
    width: 100%;
    max-width: 100%;

    position: relative;
    overflow: hidden;

    padding: 90px 0;

    background-color: #062f22;

    background-image:
        linear-gradient(
            rgba(3, 38, 28, 0.93),
            rgba(3, 38, 28, 0.93)
        ),
        url("images/bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    background-attachment: scroll;
}


/* =========================================================
   TOP GOLD LINE
========================================================= */

.mik-feedback::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        linear-gradient(
            90deg,
            transparent 0%,
            #a67c1c 20%,
            #e5c75f 50%,
            #a67c1c 80%,
            transparent 100%
        );
}


/* =========================================================
   BACKGROUND GOLD GLOW
========================================================= */

.mik-feedback::after {
    content: "";

    position: absolute;

    width: 600px;
    height: 600px;

    left: 50%;
    top: 50%;

    transform: translate(-50%, -50%);

    background:
        radial-gradient(
            circle,
            rgba(212, 175, 55, 0.10) 0%,
            rgba(212, 175, 55, 0.04) 35%,
            transparent 72%
        );

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   CONTAINER
========================================================= */

.mik-feedback-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;

    position: relative;

    z-index: 3;
}


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

.mik-feedback-heading {
    width: 100%;
    max-width: 700px;

    margin: 0 auto 55px;

    text-align: center;
}


/* =========================================================
   LABEL
========================================================= */

.mik-feedback-label {
    display: inline-flex;

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

    gap: 8px;

    color: #e0bb4d;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}

.mik-feedback-label i {
    color: #f0d16d;

    font-size: 13px;
}


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

.mik-feedback-heading h2 {
    margin: 10px 0 13px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    line-height: 46px;

    font-weight: 700;
}

.mik-feedback-heading h2 span {
    color: #dfb94b;
}


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

.mik-feedback-line {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 9px;

    margin-bottom: 15px;
}

.mik-feedback-line span {
    width: 55px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d4af37
        );
}

.mik-feedback-line span:last-child {
    background:
        linear-gradient(
            90deg,
            #d4af37,
            transparent
        );
}

.mik-feedback-line i {
    color: #dfbd54;

    font-size: 8px;
}


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

.mik-feedback-heading p {
    max-width: 650px;

    margin: 0 auto;

    color:
        rgba(255,255,255,.70);

    font-size: 12px;

    line-height: 21px;
}


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

.mik-feedback-grid {
    width: 100%;

    display: grid;

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

    gap: 28px;
}


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

.mik-feedback-card {
    width: 100%;

    min-width: 0;

    position: relative;

    padding: 28px 25px 22px;

    background:
        linear-gradient(
            145deg,
            #fffef9 0%,
            #f3ead1 100%
        );

    border: 1px solid rgba(201,163,60,.55);

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

    transition:
        transform .35s ease,
        box-shadow .35s ease;

    /*
       PAPER CUT EDGE
    */

    clip-path: polygon(
        0 1%,
        8% 2%,
        16% 1%,
        24% 2%,
        32% 1%,
        40% 2%,
        48% 1%,
        56% 2%,
        64% 1%,
        72% 2%,
        80% 1%,
        88% 2%,
        100% 1%,

        99% 98%,
        91% 97%,
        83% 99%,
        75% 97%,
        67% 99%,
        59% 97%,
        51% 99%,
        43% 97%,
        35% 99%,
        27% 97%,
        19% 99%,
        11% 97%,
        1% 99%
    );
}


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

.mik-feedback-card:hover {
    transform: translateY(-9px);

    box-shadow:
        0 27px 48px rgba(0,0,0,.28);
}


/* =========================================================
   CLIENT TOP
========================================================= */

.mik-feedback-top {
    width: 100%;

    display: flex;

    align-items: center;

    gap: 12px;
}


/* =========================================================
   CLIENT IMAGE
========================================================= */

.mik-client-photo {
    width: 52px;
    height: 52px;

    flex: 0 0 52px;

    padding: 2px;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #d9b84d,
            #a47a1b,
            #e7cc70
        );

    box-shadow:
        0 5px 13px rgba(0,0,0,.15);
}


/* IMAGE */

.mik-client-photo img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 50%;

    border: 2px solid #fffdf7;
}


/* =========================================================
   CLIENT INFORMATION
========================================================= */

.mik-client-info {
    min-width: 0;

    flex: 1;
}

.mik-client-info h3 {
    margin: 0 0 3px;

    color: #073b2a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 16px;

    line-height: 21px;

    font-weight: 700;
}

.mik-client-info span {
    color: #8a8067;

    font-size: 9px;

    line-height: 14px;
}


/* =========================================================
   QUOTE ICON
========================================================= */

.mik-feedback-quote {
    flex: 0 0 auto;

    color: #d2ad43;

    font-size: 25px;

    line-height: 1;

    opacity: .65;
}


/* =========================================================
   STARS
========================================================= */

.mik-feedback-stars {
    margin: 20px 0 13px;

    color: #d5ac36;

    font-size: 11px;

    line-height: 15px;

    letter-spacing: 2px;
}


/* =========================================================
   FEEDBACK TEXT
========================================================= */

.mik-feedback-text {
    min-height: 100px;

    margin: 0;

    color: #000;

    font-size: 13px;

    line-height: 21px;
}


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

.mik-feedback-bottom {
     
    border-top:
        1px solid
        rgba(168,132,42,.20);
}


/* VERIFIED TEXT */

.mik-feedback-bottom span {
    display: inline-flex;

    align-items: center;

    gap: 6px;

    color: #8a722d;

    font-size: 9px;

    line-height: 15px;

    font-weight: 600;
}

.mik-feedback-bottom i {
    color: #0a563c;

    font-size: 10px;
}


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

@media (max-width: 950px) {

    .mik-feedback {
        padding: 75px 0;
    }

    .mik-feedback-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 23px;
    }

}


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

@media (max-width: 600px) {

    .mik-feedback {
        padding: 60px 0;

        background-attachment: scroll;
    }

    .mik-feedback-container {
        padding: 0 14px;
    }


    /* HEADING */

    .mik-feedback-heading {
        margin-bottom: 40px;
    }

    .mik-feedback-heading h2 {
        font-size: 29px;

        line-height: 37px;
    }

    .mik-feedback-heading p {
        font-size: 11px;

        line-height: 20px;
    }


    /* GRID */

    .mik-feedback-grid {
        grid-template-columns: 1fr;

        gap: 25px;
    }


    /* CARD */

    .mik-feedback-card {
        padding: 25px 21px 20px;
    }


    /* TEXT */

    .mik-feedback-text {
        min-height: auto;

        font-size: 11.5px;

        line-height: 21px;
    }


    /* CLIENT IMAGE */

    .mik-client-photo {
        width: 48px;
        height: 48px;

        flex-basis: 48px;
    }

}


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

@media (max-width: 380px) {

    .mik-feedback {
        padding: 50px 0;
    }

    .mik-feedback-container {
        padding: 0 11px;
    }


    /* HEADING */

    .mik-feedback-heading h2 {
        font-size: 26px;

        line-height: 34px;
    }


    /* HEADING LINE */

    .mik-feedback-line span {
        width: 40px;
    }


    /* CARD */

    .mik-feedback-card {
        padding: 23px 18px 19px;
    }


    /* CLIENT IMAGE */

    .mik-client-photo {
        width: 45px;
        height: 45px;

        flex-basis: 45px;
    }


    /* CLIENT NAME */

    .mik-client-info h3 {
        font-size: 15px;
    }


    /* FEEDBACK */

    .mik-feedback-text {
        font-size: 11px;

        line-height: 20px;
    }

}


/* =========================================================
   EXTRA SMALL DEVICES
========================================================= */

@media (max-width: 320px) {

    .mik-feedback-container {
        padding: 0 9px;
    }

    .mik-feedback-card {
        padding: 21px 16px 18px;
    }

    .mik-client-photo {
        width: 43px;
        height: 43px;

        flex-basis: 43px;
    }

    .mik-client-info h3 {
        font-size: 14px;
    }

    .mik-feedback-stars {
        font-size: 10px;

        letter-spacing: 1.5px;
    }

    .mik-feedback-text {
        font-size: 10.5px;

        line-height: 19px;
    }

}
/* =========================================================
   CALL TO ACTION SECTION
   MAULANA IMARAN KHAN
   UNIQUE PREFIX: mik-cta-
========================================================= */

.mik-cta {
    width: 100%;
    max-width: 100%;

    position: relative;
    overflow: hidden;

    padding: 80px 0;

    background-color: #063b2b;

    background-image:
        linear-gradient(
            rgba(3, 45, 33, 0.92),
            rgba(3, 45, 33, 0.92)
        ),
        url("images/bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    background-attachment: scroll;
}


/* =========================================================
   GOLD TOP & BOTTOM DECORATION
========================================================= */

.mik-cta::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #a67c1c,
            #e5c75f,
            #a67c1c,
            transparent
        );
}

.mik-cta::after {
    content: "";

    position: absolute;

    bottom: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #a67c1c,
            #e5c75f,
            #a67c1c,
            transparent
        );
}


/* =========================================================
   OVERLAY
========================================================= */

.mik-cta-overlay {
    position: absolute;

    inset: 0;

    background:
        radial-gradient(
            circle at center,
            rgba(211, 173, 56, 0.12),
            transparent 60%
        );

    pointer-events: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.mik-cta-container {
    width: 100%;
    max-width: 1000px;

    margin: 0 auto;

    padding: 0 20px;

    position: relative;

    z-index: 2;
}


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

.mik-cta-content {
    max-width: 800px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   LABEL
========================================================= */

.mik-cta-label {
    display: inline-flex;

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

    gap: 8px;

    color: #e2bd50;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 2px;

    text-transform: uppercase;
}

.mik-cta-label i {
    color: #f0d16d;

    font-size: 13px;
}


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

.mik-cta-content h2 {
    margin: 12px 0 14px;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 40px;

    line-height: 48px;

    font-weight: 700;
}

.mik-cta-content h2 span {
    display: block;

    color: #dfb94b;
}


/* =========================================================
   DECORATIVE LINE
========================================================= */

.mik-cta-line {
    display: flex;

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

    gap: 9px;

    margin-bottom: 17px;
}

.mik-cta-line span {
    width: 55px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #d4af37
        );
}

.mik-cta-line span:last-child {
    background:
        linear-gradient(
            90deg,
            #d4af37,
            transparent
        );
}

.mik-cta-line i {
    color: #dfbd54;

    font-size: 8px;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.mik-cta-content p {
    max-width: 650px;

    margin: 0 auto 28px;

    color:
        rgba(255,255,255,.76);

    font-size: 13px;

    line-height: 23px;
}


/* =========================================================
   BUTTON AREA
========================================================= */

.mik-cta-actions {
    display: flex;

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

    gap: 15px;

    flex-wrap: wrap;
}


/* =========================================================
   COMMON BUTTON
========================================================= */

.mik-cta-btn {
    min-width: 205px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    padding: 12px 20px;

    text-decoration: none;

    border-radius: 5px;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}


/* ICON */

.mik-cta-btn > i {
    width: 38px;
    height: 38px;

    display: flex;

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

    border-radius: 50%;

    font-size: 16px;
}


/* TEXT */

.mik-cta-btn span {
    display: flex;

    flex-direction: column;

    align-items: flex-start;

    text-align: left;

    font-size: 12px;

    font-weight: 700;
}

.mik-cta-btn small {
    margin-bottom: 2px;

    font-size: 9px;

    font-weight: 500;

    opacity: .75;
}


/* =========================================================
   CALL BUTTON
========================================================= */

.mik-cta-call {
    color: #073b2a;

    background:
        linear-gradient(
            135deg,
            #f5dc82,
            #c59b32
        );

    box-shadow:
        0 8px 20px rgba(0,0,0,.20);
}

.mik-cta-call > i {
    background: #073b2a;

    color: #e5c55d;
}

.mik-cta-call:hover {
    color: #073b2a;

    transform: translateY(-4px);

    box-shadow:
        0 13px 28px rgba(0,0,0,.28);
}


/* =========================================================
   WHATSAPP BUTTON
========================================================= */

.mik-cta-whatsapp {
    color: #ffffff;

    background:
        rgba(255,255,255,.10);

    border: 1px solid rgba(229,199,95,.65);

    backdrop-filter: blur(5px);
}

.mik-cta-whatsapp > i {
    background: #25D366;

    color: #ffffff;
}

.mik-cta-whatsapp:hover {
    color: #ffffff;

    background:
        rgba(255,255,255,.16);

    transform: translateY(-4px);

    box-shadow:
        0 13px 28px rgba(0,0,0,.22);
}


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

@media (max-width: 700px) {

    .mik-cta {
        padding: 70px 0;
    }

    .mik-cta-content h2 {
        font-size: 34px;

        line-height: 42px;
    }

}


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

@media (max-width: 600px) {

    .mik-cta {
        padding: 60px 0;
    }

    .mik-cta-container {
        padding: 0 15px;
    }

    .mik-cta-label {
        font-size: 9px;

        letter-spacing: 1.5px;
    }

    .mik-cta-content h2 {
        margin-top: 10px;

        font-size: 28px;

        line-height: 36px;
    }

    .mik-cta-content p {
        font-size: 11px;

        line-height: 20px;

        margin-bottom: 24px;
    }

    .mik-cta-actions {
        flex-direction: column;

        width: 100%;

        gap: 12px;
    }

    .mik-cta-btn {
        width: 100%;

        max-width: 320px;

        min-width: 0;
    }

}


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

@media (max-width: 380px) {

    .mik-cta {
        padding: 52px 0;
    }

    .mik-cta-container {
        padding: 0 11px;
    }

    .mik-cta-content h2 {
        font-size: 25px;

        line-height: 33px;
    }

    .mik-cta-content p {
        font-size: 10.5px;

        line-height: 19px;
    }

    .mik-cta-btn {
        max-width: 300px;

        padding: 10px 15px;
    }

}
/* =========================================================
   FAQ SECTION
   MAULANA IMARAN KHAN
   UNIQUE PREFIX: mik-faq-
========================================================= */

.mik-faq {
    width: 100%;
    max-width: 100%;

    position: relative;
    overflow: hidden;

    padding: 90px 0;

    background-color: #f5efdd;

    background-image:
        linear-gradient(
            rgba(245, 239, 221, 0.94),
            rgba(245, 239, 221, 0.94)
        ),
        url("images/bg.jpg");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    background-attachment: scroll;
}


/* =========================================================
   TOP GOLD BORDER
========================================================= */

.mik-faq::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #a67c1c,
            #e3c15b,
            #a67c1c,
            transparent
        );
}


/* =========================================================
   SOFT GOLD GLOW
========================================================= */

.mik-faq::after {
    content: "";

    position: absolute;

    width: 550px;
    height: 550px;

    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);

    background:
        radial-gradient(
            circle,
            rgba(193, 151, 43, .09),
            transparent 70%
        );

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   CONTAINER
========================================================= */

.mik-faq-container {
    width: 100%;
    max-width: 1100px;

    margin: 0 auto;

    padding: 0 20px;

    position: relative;

    z-index: 3;
}


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

.mik-faq-heading {
    max-width: 720px;

    margin: 0 auto 50px;

    text-align: center;
}


/* LABEL */

.mik-faq-label {
    display: inline-flex;

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

    gap: 8px;

    color: #a47a1b;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 1.8px;

    text-transform: uppercase;
}

.mik-faq-label i {
    color: #073b2a;

    font-size: 13px;
}


/* HEADING */

.mik-faq-heading h2 {
    margin: 10px 0 13px;

    color: #073b2a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 38px;

    line-height: 46px;

    font-weight: 700;
}

.mik-faq-heading h2 span {
    color: #a67b18;
}


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

.mik-faq-line {
    display: flex;

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

    gap: 9px;

    margin-bottom: 15px;
}

.mik-faq-line span {
    width: 55px;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c9a33c
        );
}

.mik-faq-line span:last-child {
    background:
        linear-gradient(
            90deg,
            #c9a33c,
            transparent
        );
}

.mik-faq-line i {
    color: #b58b28;

    font-size: 8px;
}


/* DESCRIPTION */

.mik-faq-heading p {
    max-width: 650px;

    margin: 0 auto;

    color: #000;

    font-size: 12px;

    line-height: 21px;
}


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

.mik-faq-grid {
    width: 100%;

    display: grid;

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

    gap: 16px 22px;
}


/* =========================================================
   FAQ ITEM
========================================================= */

.mik-faq-item {
    min-width: 0;

    background:
        linear-gradient(
            145deg,
            #fffefa,
            #f0e6c9
        );

    border: 1px solid
        rgba(170, 132, 39, .30);

    box-shadow:
        0 8px 22px rgba(70, 57, 25, .07);

    transition:
        border-color .3s ease,
        box-shadow .3s ease,
        transform .3s ease;

    overflow: hidden;
}


/* HOVER */

.mik-faq-item:hover {
    border-color:
        rgba(170, 132, 39, .60);

    box-shadow:
        0 12px 27px rgba(70, 57, 25, .11);

    transform: translateY(-2px);
}


/* =========================================================
   SUMMARY
========================================================= */

.mik-faq-item summary {
    min-height: 65px;

    padding: 16px 18px;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 15px;

    cursor: pointer;

    list-style: none;

    color: #073b2a;

    font-size: 12px;

    line-height: 19px;

    font-weight: 700;
}


/* REMOVE DEFAULT MARKER */

.mik-faq-item summary::-webkit-details-marker {
    display: none;
}

.mik-faq-item summary::marker {
    display: none;
}


/* =========================================================
   PLUS ICON
========================================================= */

.mik-faq-item summary > i {
    flex: 0 0 27px;

    width: 27px;
    height: 27px;

    display: flex;

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

    border-radius: 50%;

    background: #073b2a;

    color: #dfbd54;

    font-size: 9px;

    transition:
        transform .3s ease,
        background .3s ease;
}


/* OPEN ICON */

.mik-faq-item[open] summary > i {
    transform: rotate(45deg);

    background: #a67b18;

    color: #ffffff;
}


/* OPEN ITEM */

.mik-faq-item[open] {
    border-color:
        rgba(166,123,24,.65);

    box-shadow:
        0 12px 30px rgba(70,57,25,.13);
}


/* =========================================================
   ANSWER
========================================================= */

.mik-faq-answer {
    padding: 0 18px 18px;

    border-top:
        1px solid
        rgba(170,132,39,.18);
}

.mik-faq-answer p {
    margin: 14px 0 0;

    color: #000;

    font-size: 11px;

    line-height: 20px;
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.mik-faq-bottom {
    margin-top: 38px;

    display: flex;

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

    gap: 15px;

    text-align: center;
}

.mik-faq-bottom p {
    margin: 0;

    color: #6f6754;

    font-size: 15px;
}


/* BUTTON */

.mik-faq-bottom a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    padding: 10px 18px;

    text-decoration: none;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #084632,
            #05291f
        );

    border: 1px solid #c8a03b;

    border-radius: 4px;

    font-size: 16px;

    font-weight: 700;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}

.mik-faq-bottom a i {
    color: #e1bd50;
}

.mik-faq-bottom a:hover {
    transform: translateY(-3px);

    box-shadow:
        0 9px 20px rgba(0,0,0,.15);
}


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

@media (max-width: 850px) {

    .mik-faq {
        padding: 75px 0;
    }

    .mik-faq-grid {
        grid-template-columns: 1fr;
    }

}


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

@media (max-width: 600px) {

    .mik-faq {
        padding: 60px 0;

        background-attachment: scroll;
    }

    .mik-faq-container {
        padding: 0 14px;
    }


    /* HEADING */

    .mik-faq-heading {
        margin-bottom: 38px;
    }

    .mik-faq-heading h2 {
        font-size: 29px;

        line-height: 37px;
    }

    .mik-faq-heading p {
        font-size: 11px;

        line-height: 20px;
    }


    /* FAQ */

    .mik-faq-grid {
        gap: 12px;
    }

    .mik-faq-item summary {
        min-height: 60px;

        padding: 14px;

        font-size: 11px;

        line-height: 18px;
    }

    .mik-faq-item summary > i {
        flex-basis: 25px;

        width: 25px;
        height: 25px;
    }

    .mik-faq-answer {
        padding: 0 14px 15px;
    }

    .mik-faq-answer p {
        font-size: 10.5px;

        line-height: 19px;
    }


    /* BOTTOM */

    .mik-faq-bottom {
        flex-direction: column;

        gap: 11px;

        margin-top: 30px;
    }

}


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

@media (max-width: 380px) {

    .mik-faq {
        padding: 50px 0;
    }

    .mik-faq-container {
        padding: 0 11px;
    }

    .mik-faq-heading h2 {
        font-size: 26px;

        line-height: 34px;
    }

    .mik-faq-line span {
        width: 40px;
    }

    .mik-faq-item summary {
        padding: 13px;

        font-size: 10.5px;
    }

    .mik-faq-answer {
        padding-left: 13px;
        padding-right: 13px;
    }

}


/* =========================================================
   EXTRA SMALL
========================================================= */

@media (max-width: 320px) {

    .mik-faq-container {
        padding: 0 9px;
    }

    .mik-faq-item summary {
        font-size: 10px;

        line-height: 17px;
    }

}
/* =========================================================
   LIGHT ISLAMIC FOOTER
   NO BACKGROUND IMAGE / NO PNG REQUIRED
========================================================= */

.mik-light-footer {
    width: 100%;
    max-width: 100%;

    overflow: hidden;

    background: #f4ecd8;

    color: #173f31;
}


/* =========================================================
   MAIN FOOTER
========================================================= */

.mik-light-footer-top {
    position: relative;

    padding: 70px 0 45px;

    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(201,162,62,.15),
            transparent 42%
        ),
        #f4ecd8;
}


/* TOP GOLD LINE */

.mik-light-footer-top::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 5px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #b88b24,
            #e3c25b,
            #b88b24,
            transparent
        );
}


/* =========================================================
   CONTAINER
========================================================= */

.mik-light-footer-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    padding: 0 20px;
}


/* =========================================================
   BRAND
========================================================= */

.mik-light-footer-brand {
    display: flex;

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

    gap: 14px;

    text-align: center;
}


.mik-light-footer-logo {
    width: 58px;
    height: 58px;

    display: flex;

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

    border-radius: 50%;

    background:
        linear-gradient(
            145deg,
            #164d3b,
            #082e22
        );

    border: 2px solid #c79b34;

    color: #e7c75c;

    font-size: 21px;

    box-shadow:
        0 5px 18px rgba(48,65,47,.15);
}


.mik-light-footer-brand h2 {
    margin: 0;

    color: #174b38;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 25px;

    line-height: 31px;
}


.mik-light-footer-brand p {
    margin: 3px 0 0;

    color: #8b6b25;

    font-size: 9px;

    letter-spacing: 1.5px;

    text-transform: uppercase;
}


/* =========================================================
   DIVIDER
========================================================= */

.mik-light-footer-divider {
    display: flex;

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

    gap: 10px;

    margin: 25px auto 40px;
}


.mik-light-footer-divider span {
    width: 75px;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #c39a38
        );
}


.mik-light-footer-divider span:last-child {
    background:
        linear-gradient(
            90deg,
            #c39a38,
            transparent
        );
}


.mik-light-footer-divider i {
    color: #b78b27;

    font-size: 8px;
}


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

.mik-light-footer-grid {
    display: grid;

    grid-template-columns:
        1.25fr 1fr 1fr;

    gap: 22px;
}


/* =========================================================
   CARDS
========================================================= */

.mik-light-footer-card {
    padding: 28px 25px;

    background: #063b2b;

    border: 1px solid
        rgba(179,139,41,.25);

    border-radius: 8px;

    box-shadow:
        0 8px 24px rgba(69,62,40,.07);

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        border-color .3s ease;
}


.mik-light-footer-card:hover {
    transform: translateY(-5px);

    border-color:
        rgba(179,139,41,.55);

    box-shadow:
        0 14px 30px rgba(69,62,40,.12);
}


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

.mik-light-footer-icon {
    width: 42px;
    height: 42px;

    display: flex;

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

    margin-bottom: 15px;

    border-radius: 6px;

    background: #edf3ed;

    border: 1px solid
        rgba(26,78,58,.18);

    color: #a77d20;

    font-size: 14px;
}


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

.mik-light-footer-card h3 {
    margin: 0 0 13px;

    color: #e2bd50;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 18px;

    line-height: 24px;
}


/* =========================================================
   ABOUT TEXT
========================================================= */

.mik-light-footer-card p {
    margin: 0;

    color: #fff;

    font-size: 14px;

    line-height: 21px;
}


/* =========================================================
   SERVICES
========================================================= */

.mik-light-footer-card ul {
    list-style: none;

    padding: 0;
    margin: 0;
}


.mik-light-footer-card ul li {
    margin-bottom: 10px;
}


.mik-light-footer-card ul li:last-child {
    margin-bottom: 0;
}


.mik-light-footer-card ul li a {
    display: block;

    padding-left: 13px;

    position: relative;

    color: #fff;

    text-decoration: none;

    font-size: 10.5px;

    line-height: 17px;

    transition:
        color .3s ease,
        padding-left .3s ease;
}


.mik-light-footer-card ul li a::before {
    content: "";

    position: absolute;

    left: 0;
    top: 6px;

    width: 5px;
    height: 5px;

    border-radius: 50%;

    background: #bd922e;
}


.mik-light-footer-card ul li a:hover {
    color: #e2bd50;

    padding-left: 17px;
}


/* =========================================================
   CONTACT
========================================================= */

.mik-light-contact {
    display: flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 15px;
}


.mik-light-contact > span {
    width: 35px;
    height: 35px;

    flex: 0 0 35px;

    display: flex;

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

    border-radius: 50%;

    background: #eef3ed;

    border: 1px solid
        rgba(29,81,61,.17);

    color: #a77d20;

    font-size: 10px;
}


.mik-light-contact > div {
    min-width: 0;

    display: flex;

    flex-direction: column;

    gap: 2px;
}


.mik-light-contact small {
    color: #aaa28e;

    font-size: 8px;

    line-height: 12px;
}


.mik-light-contact strong {
    color: #e2bd50;

    font-size: 10px;

    line-height: 15px;
}


.mik-light-contact a {
    color: #e2bd50;

    text-decoration: none;

    font-size: 10px;

    line-height: 15px;
}


.mik-light-contact a:hover {
    color: #fff;
}


/* WHATSAPP */

.mik-light-contact .mik-light-whatsapp {
    color: #159447;

    border-color:
        rgba(21,148,71,.20);
}


/* =========================================================
   CTA
========================================================= */

.mik-light-footer-cta {
    margin-top: 24px;

    padding: 20px 25px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    background:
        linear-gradient(
            100deg,
            #174b38,
            #0c382a
        );

    border-radius: 8px;

    box-shadow:
        0 10px 25px rgba(34,65,50,.15);
}


.mik-light-footer-cta span {
    display: block;

    margin-bottom: 4px;

    color: #e2c15c;

    font-size: 8px;

    font-weight: 700;

    letter-spacing: 1.5px;
}


.mik-light-footer-cta span i {
    margin-right: 5px;
}


.mik-light-footer-cta h3 {
    margin: 0;

    color: #ffffff;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 17px;

    line-height: 23px;
}


/* =========================================================
   BUTTONS
========================================================= */

.mik-light-footer-buttons {
    display: flex;

    gap: 9px;

    flex: 0 0 auto;
}


.mik-light-footer-buttons a {
    display: inline-flex;

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

    gap: 7px;

    padding: 11px 18px;

    border-radius: 5px;

    text-decoration: none;

    font-size: 9px;

    font-weight: 700;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.mik-light-call {
    color: #173d2e;

    background:
        linear-gradient(
            135deg,
            #f0d579,
            #bd902d
        );
}


.mik-light-call:hover {
    transform: translateY(-3px);

    box-shadow:
        0 7px 15px rgba(0,0,0,.2);
}


.mik-light-wa-btn {
    color: #ffffff;

    background:
        rgba(255,255,255,.10);

    border: 1px solid
        rgba(255,255,255,.25);
}


.mik-light-wa-btn i {
    color: #43d477;
}


.mik-light-wa-btn:hover {
    transform: translateY(-3px);

    background:
        rgba(255,255,255,.17);
}


/* =========================================================
   BOTTOM
========================================================= */

.mik-light-footer-bottom {
    background:linear-gradient(
            100deg,
            #174b38,
            #0c382a
        );

    border-top: 1px solid
        rgba(157,121,37,.18);
}


.mik-light-footer-bottom-inner {
    width: 100%;
    max-width: 1180px;

    margin: auto;

    padding: 16px 20px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;
}


.mik-light-footer-bottom p {
    margin: 0;

    color: #fff;

    font-size: 10px;
}


.mik-light-footer-bottom-inner > div {
    display: flex;

    align-items: center;

    gap: 10px;
}


.mik-light-footer-bottom a {
    color: #fff;

    text-decoration: none;

    font-size:10px;
}


.mik-light-footer-bottom a:hover {
    color: #e2bd50;
}


.mik-light-footer-bottom b {
    color: #b28a2a;

    font-size: 7px;
}


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

@media (max-width: 900px) {

    .mik-light-footer-grid {
        grid-template-columns: 1fr 1fr;
    }

    .mik-light-footer-card:first-child {
        grid-column: span 2;
    }

}


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

@media (max-width: 600px) {

    .mik-light-footer-top {
        padding: 55px 0 35px;
    }

    .mik-light-footer-container {
        padding: 0 13px;
    }


    .mik-light-footer-brand {
        flex-direction: column;

        gap: 9px;
    }


    .mik-light-footer-logo {
        width: 54px;
        height: 54px;

        font-size: 19px;
    }


    .mik-light-footer-brand h2 {
        font-size: 21px;

        line-height: 28px;
    }


    .mik-light-footer-brand p {
        font-size: 8px;
    }


    .mik-light-footer-divider {
        margin: 22px auto 32px;
    }


    .mik-light-footer-divider span {
        width: 45px;
    }


    .mik-light-footer-grid {
        grid-template-columns: 1fr;

        gap: 13px;
    }


    .mik-light-footer-card:first-child {
        grid-column: auto;
    }


    .mik-light-footer-card {
        padding: 23px 19px;
    }


    .mik-light-footer-cta {
        flex-direction: column;

        text-align: center;

        padding: 20px 14px;
    }


    .mik-light-footer-buttons {
        width: 100%;

        justify-content: center;
    }


    .mik-light-footer-buttons a {
        flex: 1;

        max-width: 145px;
    }


    .mik-light-footer-bottom-inner {
        flex-direction: column;

        justify-content: center;

        text-align: center;

        padding: 15px 12px;
    }


    .mik-light-footer-bottom-inner > div {
        flex-wrap: wrap;

        justify-content: center;
    }

}


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

@media (max-width: 380px) {

    .mik-light-footer-top {
        padding: 48px 0 30px;
    }


    .mik-light-footer-container {
        padding: 0 10px;
    }


    .mik-light-footer-brand h2 {
        font-size: 19px;
    }


    .mik-light-footer-card {
        padding: 20px 16px;
    }


    .mik-light-footer-cta h3 {
        font-size: 15px;
    }


    .mik-light-footer-buttons {
        flex-direction: column;
    }


    .mik-light-footer-buttons a {
        width: 100%;

        max-width: 100%;
    }

}
/* =========================================================
   FLOATING CALL + WHATSAPP
   MAULANA IMARAN KHAN
========================================================= */

.mik-floating-contact {
    position: fixed;

    left: 0;
    right: 0;
    bottom: 18px;

    width: 100%;

    padding: 0 18px;

    display: flex;

    align-items: center;
    justify-content: space-between;

    pointer-events: none;

    z-index: 99999;
}


/* =========================================================
   COMMON BUTTON
========================================================= */

.mik-floating-contact a {
    position: relative;

    min-width: 120px;

    height: 48px;

    padding: 5px 15px 5px 6px;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    border-radius: 30px;

    text-decoration: none;

    pointer-events: auto;

    box-shadow:
        0 7px 20px rgba(0,0,0,.22);

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.mik-floating-contact a:hover {
    transform: translateY(-4px);

    box-shadow:
        0 11px 25px rgba(0,0,0,.28);
}


/* =========================================================
   ICON
========================================================= */

.mik-float-icon {
    width: 38px;
    height: 38px;

    flex: 0 0 38px;

    display: flex;

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

    border-radius: 50%;

    font-size: 16px;
}


/* =========================================================
   TEXT
========================================================= */

.mik-float-text {
    font-size: 11px;

    font-weight: 700;

    letter-spacing: .3px;

    white-space: nowrap;
}


/* =========================================================
   CALL BUTTON - LEFT
========================================================= */

.mik-float-call {
    color: #ffffff;

    background:linear-gradient(135deg, #360202, #c60202);

    border: 1px solid
        rgba(218,183,72,.55);
}


.mik-float-call .mik-float-icon {
    color: #000;

    background:#fff;
}


/* =========================================================
   WHATSAPP BUTTON - RIGHT
========================================================= */

.mik-float-whatsapp {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #159447,
            #08752f
        );

    border: 1px solid
        rgba(255,255,255,.35);
}


.mik-float-whatsapp .mik-float-icon {
    color: #ffffff;

    background:
        rgba(255,255,255,.18);
}


/* =========================================================
   WHATSAPP PULSE
========================================================= */

.mik-wa-pulse {
    position: absolute;

    top: 0;
    left: 0;

    width: 48px;
    height: 48px;

    border-radius: 50%;

    border: 2px solid
        rgba(37,211,102,.65);

    animation: mikWhatsAppPulse 1.8s infinite;

    pointer-events: none;
}


@keyframes mikWhatsAppPulse {

    0% {
        transform: scale(.75);

        opacity: .9;
    }

    70% {
        transform: scale(1.45);

        opacity: 0;
    }

    100% {
        transform: scale(1.45);

        opacity: 0;
    }

}


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

@media (max-width: 600px) {

    .mik-floating-contact {
        bottom: 12px;

        padding: 0 10px;
    }


    .mik-floating-contact a {
        min-width: 108px;

        height: 44px;

        padding: 4px 12px 4px 5px;

        gap: 7px;
    }


    .mik-float-icon {
        width: 34px;
        height: 34px;

        flex-basis: 34px;

        font-size: 14px;
    }


    .mik-float-text {
        font-size: 10px;
    }


    .mik-wa-pulse {
        width: 44px;
        height: 44px;
    }

}


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

@media (max-width: 380px) {

    .mik-floating-contact {
        padding: 0 7px;

        bottom: 9px;
    }


    .mik-floating-contact a {
        min-width: 98px;

        height: 41px;

        padding-right: 10px;
    }


    .mik-float-icon {
        width: 31px;
        height: 31px;

        flex-basis: 31px;

        font-size: 13px;
    }


    .mik-float-text {
        font-size: 9px;
    }


    .mik-wa-pulse {
        width: 41px;
        height: 41px;
    }

}