/* ============================================================
   IQRA HOMEPAGE CSS
   Generated from existing Blade CSS without design changes.
============================================================ */


/* SOURCE: resources/views/frontend/home/styles/hero.blade.php */
/* ============================================================
   HERO
============================================================ */

.iqra-home-hero,
.iqra-home-hero *,
.iqra-identity,
.iqra-identity *,
.iqra-programs,
.iqra-programs * {
    box-sizing: border-box;
}

.iqra-home-hero {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background: #000000;
}

.iqra-hero-stage {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 1;
    overflow: hidden;
    background: #000000;
}

.iqra-hero-slide {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
    visibility: hidden;

    pointer-events: none;

    overflow: hidden;

    transition:
        opacity .55s ease,
        visibility .55s ease;
}

.iqra-hero-slide.is-active {
    z-index: 2;

    opacity: 1;
    visibility: visible;

    pointer-events: auto;
}

.iqra-responsive-banner-picture {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;
}

.iqra-hero-image {
    position: absolute;
    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    border: 0;
}

.iqra-hero-slide::before,
.iqra-hero-slide::after {
    display: none;
    content: none;
}

.iqra-hero-content {
    position: absolute;
    z-index: 10;

    top: 50%;

    left: max(
        5%,
        calc((100% - 1180px) / 2)
    );

    width: min(680px, 80%);

    transform: translateY(-50%);
}

.iqra-hero-arabic {
    margin: 0 0 8px;

    color: #ffffff;

    direction: rtl;
    text-align: left;

    font-size: clamp(16px, 1.6vw, 25px);
    line-height: 1.5;
    font-weight: 600;

    text-shadow:
        0 2px 8px
        rgba(0, 0, 0, .75);
}

.iqra-hero-title {
    max-width: 720px;

    margin: 0;

    color: #ffffff;

    font-size: clamp(30px, 4vw, 62px);
    line-height: 1.12;
    font-weight: 800;

    text-shadow:
        0 3px 12px
        rgba(0, 0, 0, .78);
}

.iqra-hero-subtitle {
    max-width: 640px;

    margin: 12px 0 0;

    color: #ffffff;

    font-size: clamp(14px, 1.4vw, 19px);
    line-height: 1.65;
    font-weight: 500;

    text-shadow:
        0 2px 8px
        rgba(0, 0, 0, .75);
}

.iqra-hero-actions {
    display: flex;
    align-items: center;

    gap: 12px;

    margin-top: 18px;
}

.iqra-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 42px;

    padding: 9px 18px;

    border:
        1px solid
        rgba(255, 255, 255, .8);

    border-radius: 5px;

    background: #0d3b2e;
    color: #ffffff;

    font: inherit;
    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.iqra-hero-button:hover {
    background: #082b21;
    border-color: #ffffff;
    color: #ffffff;
}

.iqra-hero-arrow {
    position: absolute;
    z-index: 30;

    top: 50%;

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

    width: 42px;
    height: 42px;

    margin: 0;
    padding: 0;

    transform: translateY(-50%);

    border:
        1px solid
        rgba(255, 255, 255, .55);

    border-radius: 50%;

    background: rgba(0, 0, 0, .28);

    color: #ffffff;

    font-size: 24px;
    line-height: 1;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease;
}

.iqra-hero-arrow:hover {
    background: rgba(0, 0, 0, .55);
    border-color: #ffffff;
}

.iqra-hero-prev {
    left: 18px;
}

.iqra-hero-next {
    right: 18px;
}

.iqra-hero-dots {
    position: absolute;
    z-index: 30;

    left: 50%;
    bottom: 14px;

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

    gap: 8px;

    transform: translateX(-50%);
}

.iqra-hero-dot {
    width: 9px;
    height: 9px;

    margin: 0;
    padding: 0;

    border: 1px solid #ffffff;
    border-radius: 50%;

    background: transparent;

    cursor: pointer;

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

.iqra-hero-dot.is-active {
    background: #ffffff;
    transform: scale(1.3);
}


@media (
    min-width: 768px
)
and (
    max-width: 991px
) {
    .iqra-hero-stage {
        aspect-ratio: 3 / 1;
    }

    .iqra-hero-content {
        left: 5%;
        width: 75%;
    }

    .iqra-hero-title {
        font-size: clamp(26px, 5vw, 42px);
    }
}


@media (max-width: 767px) {
    .iqra-hero-stage {
        display: block;

        height: auto;

        aspect-ratio: auto;
    }

    .iqra-hero-slide {
        position: relative;
        inset: auto;

        display: none;

        height: auto;
    }

    .iqra-hero-slide.is-active {
        position: relative;

        display: block;

        height: auto;
    }

    .iqra-responsive-banner-picture {
        position: relative;
        inset: auto;

        height: auto;
    }

    .iqra-hero-image {
        position: relative;
        inset: auto;

        width: 100%;
        height: auto;

        object-fit: contain;
    }

    .iqra-hero-content {
        top: 50%;

        left: 18px;
        right: 18px;

        width: auto;
        max-width: calc(100% - 36px);

        transform: translateY(-50%);
    }

    .iqra-hero-title {
        font-size: clamp(19px, 6vw, 28px);
    }

    .iqra-hero-subtitle {
        margin-top: 6px;

        font-size: 11px;
        line-height: 1.4;
    }

    .iqra-hero-arabic {
        margin-bottom: 5px;
        font-size: 14px;
    }

    .iqra-hero-actions {
        margin-top: 9px;
    }

    .iqra-hero-button {
        min-height: 31px;

        padding: 5px 10px;

        font-size: 11px;
    }

    .iqra-hero-arrow {
        width: 30px;
        height: 30px;

        font-size: 18px;
    }

    .iqra-hero-prev {
        left: 7px;
    }

    .iqra-hero-next {
        right: 7px;
    }

    .iqra-hero-dots {
        bottom: 7px;
        gap: 6px;
    }

    .iqra-hero-dot {
        width: 7px;
        height: 7px;
    }
}


/* IQRA_HERO_INTRINSIC_RATIO_START */

/*
|--------------------------------------------------------------------------
| Hero uses the active image's real aspect ratio
|--------------------------------------------------------------------------
*/

.iqra-home-hero {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
}


/*
|--------------------------------------------------------------------------
| Stage
|--------------------------------------------------------------------------
|
| Do not force 3:1, 2:1, 4:5 or any fixed height.
| The active slide image determines the final hero height.
|
*/

.iqra-home-hero .iqra-hero-stage {
    position: relative !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio: auto !important;

    overflow: hidden !important;
}


/*
|--------------------------------------------------------------------------
| Slides
|--------------------------------------------------------------------------
|
| Inactive slides are removed from layout.
| Active slide becomes relative so its image creates stage height.
|
*/

.iqra-home-hero .iqra-hero-slide {
    position: absolute !important;
    inset: 0 !important;

    display: none !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    opacity: 0;
    visibility: hidden;

    overflow: hidden !important;
}


.iqra-home-hero .iqra-hero-slide.is-active {
    position: relative !important;
    inset: auto !important;

    display: block !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    opacity: 1 !important;
    visibility: visible !important;
}


/*
|--------------------------------------------------------------------------
| Picture
|--------------------------------------------------------------------------
*/

.iqra-home-hero .iqra-responsive-banner-picture {
    position: relative !important;
    inset: auto !important;

    display: block !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio: auto !important;

    overflow: visible !important;
}


/*
|--------------------------------------------------------------------------
| Actual banner image
|--------------------------------------------------------------------------
|
| width:100% + height:auto = original uploaded image ratio.
| No object-fit cover, therefore no cropping.
|
*/

.iqra-home-hero .iqra-hero-image,
.iqra-home-hero .iqra-responsive-banner-picture img {
    position: relative !important;
    inset: auto !important;

    display: block !important;

    width: 100% !important;
    height: auto !important;

    min-height: 0 !important;
    max-height: none !important;

    aspect-ratio: auto !important;

    object-fit: contain !important;
    object-position: center !important;

    margin: 0 !important;
    padding: 0 !important;
}


/*
|--------------------------------------------------------------------------
| Overlay content
|--------------------------------------------------------------------------
*/

.iqra-home-hero .iqra-hero-content {
    position: absolute !important;
    z-index: 10;

    top: 50%;
    transform: translateY(-50%);
}


/*
|--------------------------------------------------------------------------
| Desktop / Tablet / Mobile
|--------------------------------------------------------------------------
|
| Same rule everywhere.
| Desktop image keeps desktop image ratio.
| Mobile <source> keeps mobile_image ratio.
|
*/

@media (max-width: 991px) {

    .iqra-home-hero .iqra-hero-stage,
    .iqra-home-hero .iqra-hero-slide.is-active,
    .iqra-home-hero .iqra-responsive-banner-picture,
    .iqra-home-hero .iqra-hero-image {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        aspect-ratio: auto !important;
    }
}


@media (max-width: 767px) {

    .iqra-home-hero .iqra-hero-image,
    .iqra-home-hero .iqra-responsive-banner-picture img {
        width: 100% !important;
        height: auto !important;

        object-fit: contain !important;
        object-position: center !important;
    }
}


@media (max-width: 560px) {

    .iqra-home-hero .iqra-hero-stage,
    .iqra-home-hero .iqra-hero-slide.is-active {
        height: auto !important;
        min-height: 0 !important;
        aspect-ratio: auto !important;
    }
}

/* IQRA_HERO_INTRINSIC_RATIO_END */

/* SOURCE: resources/views/frontend/home/styles/identity.blade.php */
/* ============================================================
   OUR IDENTITY
============================================================ */

.iqra-identity {
    position: relative;

    width: 100%;

    padding:
        clamp(
            65px,
            7vw,
            105px
        )
        0;

    overflow: hidden;

    background: #ffffff;
}

.iqra-identity::before {
    content: "";

    position: absolute;

    top: -210px;
    right: -210px;

    width: 430px;
    height: 430px;

    border:
        1px solid
        rgba(7, 77, 58, .06);

    border-radius: 50%;

    pointer-events: none;
}

.iqra-identity-container {
    position: relative;
    z-index: 2;

    width:
        min(
            1220px,
            calc(100% - 40px)
        );

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1.05fr)
        minmax(390px, .95fr);

    align-items: center;

    gap:
        clamp(
            44px,
            6vw,
            78px
        );
}


/* ============================================================
   IDENTITY GALLERY
============================================================ */

.iqra-identity-media {
    min-width: 0;
}

.iqra-identity-gallery {
    display: grid;

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

    gap: 12px;

    height: 560px;
}

.iqra-identity-main-card {
    min-width: 0;
    height: 100%;

    margin: 0;

    display: flex;
    flex-direction: column;

    overflow: hidden;

    border: 1px solid #dce5e0;
    border-radius: 22px;

    background: #ffffff;
}

.iqra-identity-main-button {
    position: relative;

    display: block;

    flex: 1 1 auto;

    min-height: 0;

    width: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    border: 0;

    background: #eef3f0;

    cursor: zoom-in;
}

.iqra-identity-main-image-wrap {
    position: absolute;
    inset: 0;

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

    overflow: hidden;

    background: #eef3f0;
}

.iqra-identity-main-image {
    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    object-fit: contain;
    object-position: center;

    border: 0;

    background: #eef3f0;

    transition:
        opacity .16s ease,
        transform .16s ease;
}

.iqra-identity-main-image.is-changing {
    opacity: .32;

    transform:
        scale(.992);
}

.iqra-identity-badge {
    position: absolute;
    z-index: 4;

    top: 15px;
    left: 15px;

    max-width:
        calc(100% - 80px);

    padding: 7px 11px;

    overflow: hidden;

    border:
        1px solid
        rgba(255, 255, 255, .7);

    border-radius: 999px;

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

    color: #07503d;

    font-size: 9px;
    line-height: 1.2;
    font-weight: 900;

    text-overflow: ellipsis;
    white-space: nowrap;

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

.iqra-identity-expand {
    position: absolute;
    z-index: 5;

    right: 13px;
    bottom: 13px;

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

    width: 38px;
    height: 38px;

    border:
        1px solid
        rgba(255, 255, 255, .7);

    border-radius: 50%;

    background:
        rgba(5, 72, 55, .9);

    color: #ffffff;

    font-size: 17px;
}

.iqra-identity-main-caption {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    flex: 0 0 auto;

    min-height: 65px;

    padding: 11px 15px;

    border-top:
        1px solid
        #e4ebe7;

    background: #ffffff;
}

.iqra-identity-main-caption > div {
    min-width: 0;
}

.iqra-identity-main-caption small {
    display: block;

    margin-bottom: 2px;

    color: #ad842f;

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .12em;
}

.iqra-identity-main-title {
    display: block;

    overflow: hidden;

    color: #173f34;

    font-size: 12px;
    line-height: 1.35;
    font-weight: 800;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.iqra-identity-main-caption > span {
    flex: 0 0 auto;

    color: #87958e;

    font-size: 8px;
}


/* ============================================================
   IDENTITY THUMBNAILS
============================================================ */

.iqra-identity-thumbnails {
    display: flex;
    flex-direction: column;

    gap: 9px;

    width: 126px;
    height: 560px;
    max-height: 560px;

    padding:
        1px 4px
        1px 1px;

    overflow-x: hidden;
    overflow-y: auto;

    overscroll-behavior: contain;

    scrollbar-width: thin;

    scrollbar-color:
        #aabdb4
        transparent;
}

.iqra-identity-thumbnails::-webkit-scrollbar {
    width: 4px;
}

.iqra-identity-thumbnails::-webkit-scrollbar-track {
    background: transparent;
}

.iqra-identity-thumbnails::-webkit-scrollbar-thumb {
    border-radius: 999px;

    background: #aabdb4;
}

.iqra-identity-thumb {
    display: block;

    flex: 0 0 auto;

    width: 100%;

    padding: 5px;

    overflow: hidden;

    appearance: none;

    border: 1px solid #dce5e0;
    border-radius: 13px;

    outline: none;

    background: #ffffff;

    color: inherit;

    text-align: left;

    cursor: pointer;

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

.iqra-identity-thumb:hover {
    border-color: #809e91;

    transform:
        translateY(-1px);
}

.iqra-identity-thumb.is-selected {
    border-color: #07513e;

    box-shadow:
        0 0 0 2px
        rgba(7, 81, 62, .12);
}

.iqra-identity-thumb:focus-visible {
    border-color: #07513e;

    box-shadow:
        0 0 0 3px
        rgba(7, 81, 62, .15);
}

.iqra-identity-thumb-image {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    aspect-ratio: 1 / 1;

    overflow: hidden;

    border-radius: 8px;

    background: #eef3f0;
}

.iqra-identity-thumb-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: contain;
    object-position: center;

    background: #eef3f0;
}

.iqra-identity-thumb-title {
    display: block;

    width: 100%;

    margin-top: 6px;

    padding:
        0 2px
        2px;

    overflow: hidden;

    color: #39554c;

    font-size: 8px;
    line-height: 1.35;
    font-weight: 700;

    text-overflow: ellipsis;
    white-space: nowrap;
}


/* ============================================================
   IDENTITY EMPTY
============================================================ */

.iqra-identity-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-height: 500px;

    gap: 7px;

    padding: 30px;

    border:
        1px dashed
        #cbd9d3;

    border-radius: 20px;

    background: #f8faf9;

    text-align: center;
}

.iqra-identity-empty strong {
    color: #17483a;

    font-size: 20px;
}

.iqra-identity-empty span {
    color: #7b8c84;

    font-size: 12px;
    line-height: 1.6;
}


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

.iqra-identity-content {
    min-width: 0;
}

.iqra-identity-kicker {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    margin-bottom: 14px;

    color: #ad842f;

    font-size: 11px;
    font-weight: 900;
}

.iqra-identity-kicker::before {
    content: "";

    width: 29px;
    height: 1px;

    background: #ad842f;
}

.iqra-identity-heading {
    max-width: 650px;

    margin: 0;

    color: #073f32;

    font-size:
        clamp(
            36px,
            4.3vw,
            60px
        );

    line-height: 1.1;
    font-weight: 800;

    letter-spacing: -.025em;
}

.iqra-identity-description {
    max-width: 680px;

    margin: 21px 0 0;

    color: #5b6f67;

    font-size:
        clamp(
            14px,
            1.15vw,
            17px
        );

    line-height: 1.85;
}


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

.iqra-identity-cards {
    display: grid;

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

    gap: 11px;

    margin-top: 28px;
}

.iqra-identity-card {
    position: relative;

    min-width: 0;
    min-height: 124px;

    padding: 19px;

    overflow: hidden;

    border: 1px solid #e0e7e3;
    border-radius: 15px;

    background: #fcfdfc;

    transition:
        transform .2s ease,
        border-color .2s ease;
}

.iqra-identity-card:hover {
    transform:
        translateY(-2px);

    border-color:
        rgba(7, 79, 59, .28);
}

.iqra-identity-card-number {
    display: block;

    margin-bottom: 10px;

    color: #ad842f;

    font-size: 9px;
    font-weight: 900;
}

.iqra-identity-card h3 {
    margin: 0;

    color: #073f32;

    font-size: 19px;
    line-height: 1.25;
}

.iqra-identity-card p {
    margin: 7px 0 0;

    color: #708079;

    font-size: 11px;
    line-height: 1.55;
}

.iqra-identity-card::after {
    content: "";

    position: absolute;

    left: 19px;
    bottom: 0;

    width: 27px;
    height: 2px;

    background: #b68a32;
}


/* ============================================================
   IDENTITY ACTIONS
============================================================ */

.iqra-identity-actions {
    display: flex;
    flex-wrap: wrap;

    gap: 10px;

    margin-top: 27px;
}

.iqra-identity-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    min-height: 43px;

    padding: 9px 16px;

    border-radius: 8px;

    font-size: 12px;
    font-weight: 900;

    text-decoration: none;

    transition:
        transform .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.iqra-identity-action-primary {
    border: 1px solid #07513d;

    background: #07513d;
    color: #ffffff;
}

.iqra-identity-action-primary:hover {
    background: #053e30;
    border-color: #053e30;
    color: #ffffff;

    transform:
        translateY(-1px);
}

.iqra-identity-action-secondary {
    border: 1px solid #d6e0db;

    background: #ffffff;
    color: #07513d;
}

.iqra-identity-action-secondary:hover {
    border-color: #07513d;
    color: #07513d;

    transform:
        translateY(-1px);
}


/* ============================================================
   IDENTITY LIGHTBOX
============================================================ */

body.iqra-identity-lightbox-open {
    overflow: hidden;
}

.iqra-identity-lightbox[hidden] {
    display: none !important;
}

.iqra-identity-lightbox {
    position: fixed;
    z-index: 99999;

    inset: 0;

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

    padding:
        clamp(
            12px,
            4vw,
            44px
        );
}

.iqra-identity-lightbox-backdrop {
    position: absolute;
    inset: 0;

    background:
        rgba(0, 0, 0, .84);

    backdrop-filter:
        blur(5px);
}

.iqra-identity-lightbox-dialog {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    width:
        min(
            1100px,
            100%
        );

    max-height:
        calc(100vh - 30px);

    overflow: hidden;

    border:
        1px solid
        rgba(255, 255, 255, .14);

    border-radius: 16px;

    background: #0c110f;

    box-shadow:
        0 30px 90px
        rgba(0, 0, 0, .48);
}

.iqra-identity-lightbox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 15px;

    min-height: 61px;

    padding: 11px 15px;

    border-bottom:
        1px solid
        rgba(255, 255, 255, .1);
}

.iqra-identity-lightbox-head > div {
    min-width: 0;
}

.iqra-identity-lightbox-head small {
    display: block;

    color: #c6a55d;

    font-size: 7px;
    font-weight: 900;

    letter-spacing: .13em;
}

.iqra-identity-lightbox-title {
    display: block;

    margin-top: 3px;

    overflow: hidden;

    color: #ffffff;

    font-size: 12px;
    line-height: 1.35;

    text-overflow: ellipsis;
    white-space: nowrap;
}

.iqra-identity-lightbox-close {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 36px;

    width: 36px;
    height: 36px;

    padding: 0;

    border:
        1px solid
        rgba(255, 255, 255, .2);

    border-radius: 50%;

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

    color: #ffffff;

    font-size: 23px;

    cursor: pointer;
}

.iqra-identity-lightbox-image-wrap {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 0;

    flex: 1 1 auto;

    width: 100%;

    padding: 12px;

    overflow: hidden;

    background: #070a09;
}

.iqra-identity-lightbox-image {
    display: block;

    width: auto;
    height: auto;

    max-width: 100%;

    max-height:
        calc(100vh - 120px);

    object-fit: contain;
    object-position: center;
}


/* ============================================================
   IDENTITY RESPONSIVE
============================================================ */

@media (max-width: 1050px) {
    .iqra-identity-container {
        grid-template-columns:
            minmax(0, .95fr)
            minmax(340px, 1.05fr);

        gap: 38px;
    }

    .iqra-identity-gallery {
        grid-template-columns:
            minmax(0, 1fr)
            108px;

        height: 500px;
    }

    .iqra-identity-thumbnails {
        width: 108px;
        height: 500px;
        max-height: 500px;
    }
}


@media (max-width: 900px) {
    .iqra-identity-container {
        grid-template-columns: 1fr;

        gap: 42px;
    }

    .iqra-identity-media,
    .iqra-identity-content {
        width: 100%;
        max-width: 760px;
    }

    .iqra-identity-media {
        margin: 0 auto;
    }
}


@media (max-width: 767px) {
    .iqra-identity {
        padding:
            45px 0
            55px;
    }

    .iqra-identity::before {
        display: none;
    }

    .iqra-identity-container {
        width:
            calc(100% - 28px);

        gap: 35px;
    }

    .iqra-identity-gallery {
        display: block;

        height: auto;
    }

    .iqra-identity-main-card {
        width: 100%;
        height: auto;

        border-radius: 16px;
    }

    .iqra-identity-main-button {
        display: block;

        width: 100%;

        aspect-ratio: 4 / 5;

        flex: none;
    }

    .iqra-identity-main-image {
        width: 100%;
        height: 100%;

        object-fit: contain;
    }

    .iqra-identity-thumbnails {
        display: flex;
        flex-direction: row;

        width: 100%;
        height: auto;

        max-width: 100%;
        max-height: none;

        gap: 8px;

        margin-top: 10px;

        padding:
            1px 1px
            7px;

        overflow-x: auto;
        overflow-y: hidden;

        scroll-snap-type:
            x proximity;
    }

    .iqra-identity-thumbnails::-webkit-scrollbar {
        width: auto;
        height: 4px;
    }

    .iqra-identity-thumb {
        flex:
            0 0
            94px;

        width: 94px;
        min-width: 94px;

        scroll-snap-align: start;
    }

    .iqra-identity-heading {
        font-size:
            clamp(
                32px,
                10vw,
                46px
            );
    }

    .iqra-identity-description {
        margin-top: 17px;

        font-size: 14px;
        line-height: 1.75;
    }

    .iqra-identity-cards {
        gap: 9px;

        margin-top: 24px;
    }

    .iqra-identity-card {
        min-height: 116px;

        padding: 15px;
    }

    .iqra-identity-card h3 {
        font-size: 17px;
    }

    .iqra-identity-card p {
        font-size: 10px;
    }

    .iqra-identity-actions {
        margin-top: 23px;
    }
}


@media (max-width: 430px) {
    .iqra-identity-thumb {
        flex-basis: 84px;

        width: 84px;
        min-width: 84px;
    }

    .iqra-identity-main-caption {
        min-height: 58px;

        padding: 9px 11px;
    }

    .iqra-identity-main-caption > span {
        display: none;
    }

    .iqra-identity-cards {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

    .iqra-identity-card {
        min-height: 120px;

        padding:
            14px 12px;
    }

    .iqra-identity-card h3 {
        font-size: 16px;
    }

    .iqra-identity-actions {
        display: grid;

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

    .iqra-identity-action {
        width: 100%;

        padding: 8px 9px;

        font-size: 11px;
    }
}


@media (max-width: 350px) {
    .iqra-identity-cards,
    .iqra-identity-actions {
        grid-template-columns: 1fr;
    }
}

/* SOURCE: resources/views/frontend/home/styles/programs.blade.php */
/* ============================================================
   PROFESSIONAL PROGRAMS SECTION
============================================================ */

.iqra-programs {
    position: relative;

    padding:
        clamp(
            68px,
            7vw,
            105px
        )
        0;

    overflow: hidden;

    background: #f6f4ed;
}

.iqra-programs::before {
    content: "";

    position: absolute;

    left: -190px;
    bottom: -250px;

    width: 430px;
    height: 430px;

    border:
        1px solid
        rgba(180, 140, 57, .12);

    border-radius: 50%;

    pointer-events: none;
}

.iqra-programs-container {
    position: relative;
    z-index: 2;

    width:
        min(
            1220px,
            calc(100% - 40px)
        );

    margin: 0 auto;
}


/* ============================================================
   PROGRAMS HEADER
============================================================ */

.iqra-programs-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;

    gap: 35px;

    margin-bottom:
        clamp(
            32px,
            4vw,
            48px
        );
}

.iqra-programs-heading-wrap {
    min-width: 0;
}

.iqra-programs-kicker {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    margin-bottom: 13px;

    color: #ae842f;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: .04em;
}

.iqra-programs-kicker::before {
    content: "";

    width: 28px;
    height: 1px;

    background: #ae842f;
}

.iqra-programs-title {
    max-width: 780px;

    margin: 0;

    color: #073f32;

    font-size:
        clamp(
            34px,
            4.2vw,
            57px
        );

    line-height: 1.12;
    font-weight: 800;

    letter-spacing: -.025em;
}

.iqra-programs-all {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    flex: 0 0 auto;

    min-height: 42px;

    padding:
        8px 0;

    color: #07503d;

    font-size: 12px;
    font-weight: 900;

    text-decoration: none;
}

.iqra-programs-all-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 29px;
    height: 29px;

    border:
        1px solid
        #ccd9d3;

    border-radius: 50%;

    background: #ffffff;

    transition:
        transform .2s ease,
        border-color .2s ease;
}

.iqra-programs-all:hover {
    color: #07503d;
}

.iqra-programs-all:hover
.iqra-programs-all-icon {
    border-color: #07503d;

    transform:
        translateX(3px);
}


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

.iqra-programs-grid {
    display: grid;

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

    gap: 18px;
}

.iqra-program-card {
    position: relative;

    display: flex;
    flex-direction: column;

    min-width: 0;
    min-height: 330px;

    padding:
        clamp(
            24px,
            2.4vw,
            32px
        );

    overflow: hidden;

    border:
        1px solid
        #dddcd4;

    border-radius: 3px;

    background: #ffffff;

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

.iqra-program-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(7, 79, 59, .34);

    box-shadow:
        0 18px 46px
        rgba(19, 57, 45, .07);
}

.iqra-program-card::after {
    content: "";

    position: absolute;

    left: 32px;
    right: 32px;
    bottom: 0;

    height: 3px;

    background: #0a503d;

    transform:
        scaleX(0);

    transform-origin: left;

    transition:
        transform .28s ease;
}

.iqra-program-card:hover::after {
    transform:
        scaleX(1);
}


/* ============================================================
   PROGRAM CARD TOP
============================================================ */

.iqra-program-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;

    gap: 15px;

    margin-bottom: 35px;
}

.iqra-program-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    flex: 0 0 46px;

    border:
        1px solid
        #e1dfd6;

    border-radius: 50%;

    background: #faf9f4;

    color: #c59c43;

    font-size: 22px;
    line-height: 1;
}

.iqra-program-number {
    color: #b18a38;

    font-size: 10px;
    line-height: 1;
    font-weight: 900;

    letter-spacing: .08em;
}


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

.iqra-program-card-body {
    display: flex;
    flex-direction: column;

    flex: 1 1 auto;
}

.iqra-program-card-title {
    margin: 0;

    color: #102c25;

    font-size:
        clamp(
            22px,
            1.8vw,
            28px
        );

    line-height: 1.28;
    font-weight: 800;
}

.iqra-program-card-description {
    margin:
        16px 0 0;

    color: #6a746f;

    font-size: 14px;
    line-height: 1.75;
}

.iqra-program-card-link {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;

    width: 100%;

    margin-top: auto;

    padding-top: 28px;

    color: #07503d;

    font-size: 13px;
    font-weight: 900;

    text-decoration: none;
}

.iqra-program-card-link-text {
    display: inline-block;

    border-bottom:
        1px solid
        rgba(7, 80, 61, .28);
}

.iqra-program-card-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    border:
        1px solid
        #d6dfdb;

    border-radius: 50%;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease,
        border-color .2s ease;
}

.iqra-program-card:hover
.iqra-program-card-arrow {
    border-color: #07503d;

    background: #07503d;
    color: #ffffff;

    transform:
        translateX(3px);
}


/* ============================================================
   PROGRAM EMPTY STATE
============================================================ */

.iqra-programs-empty {
    grid-column:
        1 / -1;

    padding: 35px;

    border:
        1px dashed
        #ccd7d2;

    background: #ffffff;

    color: #73817b;

    text-align: center;
}


/* ============================================================
   PROGRAM RESPONSIVE
============================================================ */

@media (max-width: 980px) {
    .iqra-programs-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }
}


@media (max-width: 640px) {
    .iqra-programs {
        padding:
            56px 0
            62px;
    }

    .iqra-programs::before {
        display: none;
    }

    .iqra-programs-container {
        width:
            calc(100% - 28px);
    }

    .iqra-programs-header {
        align-items: flex-start;
        flex-direction: column;

        gap: 16px;

        margin-bottom: 27px;
    }

    .iqra-programs-title {
        font-size:
            clamp(
                31px,
                9vw,
                42px
            );
    }

    .iqra-programs-all {
        min-height: 34px;
    }

    .iqra-programs-grid {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .iqra-program-card {
        min-height: 0;

        padding: 23px;

        border-radius: 4px;
    }

    .iqra-program-card-top {
        margin-bottom: 23px;
    }

    .iqra-program-icon {
        width: 42px;
        height: 42px;

        flex-basis: 42px;

        font-size: 20px;
    }

    .iqra-program-card-title {
        font-size: 23px;
    }

    .iqra-program-card-description {
        margin-top: 12px;

        font-size: 13px;
        line-height: 1.7;
    }

    .iqra-program-card-link {
        padding-top: 22px;
    }
}


/* IQRA PROGRAM CARD HOVER ENHANCEMENT START */

/*
|--------------------------------------------------------------------------
| Premium animated hover
|--------------------------------------------------------------------------
*/

.iqra-program-card {
    position: relative;
    isolation: isolate;

    overflow: hidden;

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


/*
|--------------------------------------------------------------------------
| Full-width animated bottom line
|--------------------------------------------------------------------------
*/

.iqra-program-card::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    width: 100%;
    height: 3px;

    background: #07513d;

    transform: scaleX(0);

    transform-origin: left center;

    transition:
        transform .34s
        cubic-bezier(.22, .61, .36, 1);

    z-index: 3;
}


/*
|--------------------------------------------------------------------------
| Hover state
|--------------------------------------------------------------------------
*/

@media (hover: hover) and (pointer: fine) {

    .iqra-program-card:hover {
        transform: translateY(-6px);

        border-color:
            rgba(7, 81, 61, .48);

        background: #ffffff;

        box-shadow:
            0 18px 42px
            rgba(7, 63, 50, .09);
    }


    .iqra-program-card:hover::after {
        transform: scaleX(1);
    }


    /*
    |--------------------------------------------------------------------------
    | Icon animation
    |--------------------------------------------------------------------------
    */

    .iqra-program-icon {
        transition:
            transform .28s ease,
            border-color .28s ease,
            background .28s ease,
            color .28s ease;
    }

    .iqra-program-card:hover
    .iqra-program-icon {
        transform:
            translateY(-2px)
            rotate(5deg)
            scale(1.05);

        border-color:
            rgba(7, 81, 61, .28);

        background: #f2f7f4;

        color: #07513d;
    }


    /*
    |--------------------------------------------------------------------------
    | Title
    |--------------------------------------------------------------------------
    */

    .iqra-program-card-title {
        transition:
            color .25s ease;
    }

    .iqra-program-card:hover
    .iqra-program-card-title {
        color: #07513d;
    }


    /*
    |--------------------------------------------------------------------------
    | CTA arrow
    |--------------------------------------------------------------------------
    */

    .iqra-program-card-arrow {
        transition:
            transform .25s ease,
            background .25s ease,
            border-color .25s ease,
            color .25s ease;
    }

    .iqra-program-card:hover
    .iqra-program-card-arrow {
        transform: translateX(4px);

        border-color: #07513d;

        background: #07513d;

        color: #ffffff;
    }


    /*
    |--------------------------------------------------------------------------
    | CTA underline
    |--------------------------------------------------------------------------
    */

    .iqra-program-card-link-text {
        position: relative;

        border-bottom: 0;
    }

    .iqra-program-card-link-text::after {
        content: "";

        position: absolute;

        left: 0;
        right: 0;
        bottom: -3px;

        height: 1px;

        background: #07513d;

        transform: scaleX(.35);

        transform-origin: left center;

        transition:
            transform .28s ease;
    }

    .iqra-program-card:hover
    .iqra-program-card-link-text::after {
        transform: scaleX(1);
    }
}


/*
|--------------------------------------------------------------------------
| Keyboard accessibility
|--------------------------------------------------------------------------
*/

.iqra-program-card:focus-within {
    border-color: #07513d;

    box-shadow:
        0 0 0 3px
        rgba(7, 81, 61, .08);
}

.iqra-program-card:focus-within::after {
    transform: scaleX(1);
}


/*
|--------------------------------------------------------------------------
| Touch devices
|--------------------------------------------------------------------------
*/

@media (hover: none) {

    .iqra-program-card {
        transform: none;
    }

    .iqra-program-card::after {
        transform: scaleX(1);

        height: 2px;

        opacity: .75;
    }
}


/*
|--------------------------------------------------------------------------
| Reduced motion
|--------------------------------------------------------------------------
*/

@media (prefers-reduced-motion: reduce) {

    .iqra-program-card,
    .iqra-program-card::after,
    .iqra-program-icon,
    .iqra-program-card-arrow,
    .iqra-program-card-link-text::after {
        transition: none !important;
    }
}

/* IQRA PROGRAM CARD HOVER ENHANCEMENT END */

/* SOURCE: resources/views/frontend/home/styles/management.blade.php */
/* ============================================================
   IQRA HOME TOP GAP + MANAGEMENT FINAL FIX START
============================================================ */

html,
body {
    margin: 0 !important;
    padding: 0 !important;
}

body {
    overflow-x: hidden;
}

body > .site-header,
.site-header {
    top: 0 !important;
    margin-top: 0 !important;
    transform: none !important;
}

.site-header + main,
main#main-content,
main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

main > .iqra-home-hero:first-child,
#main-content > .iqra-home-hero:first-child {
    margin-top: 0 !important;
}

.iqra-management-section {
    position: relative;
    padding: clamp(65px, 7vw, 96px) 0 !important;
    background: #f7f5ed !important;
}

.iqra-management-section .container {
    display: block !important;
}

.iqra-management-head {
    display: block !important;
    width: 100% !important;
    max-width: 760px !important;
    margin: 0 0 clamp(30px, 4vw, 44px) !important;
    padding: 0 !important;
    text-align: left !important;
}

.iqra-management-kicker {
    display: block !important;
    width: 100% !important;
    margin: 0 0 9px !important;
    color: #b28a32 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
}

.iqra-management-heading {
    display: block !important;
    width: 100% !important;
    margin: 0 0 12px !important;
    color: #073f34 !important;
    font-size: clamp(36px, 4.3vw, 56px) !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
}

.iqra-management-intro {
    display: block !important;
    width: 100% !important;
    max-width: 690px !important;
    margin: 0 !important;
    color: #68776f !important;
    font-size: 15px !important;
    line-height: 1.8 !important;
}

.iqra-management-section .management-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    width: 100% !important;
    align-items: stretch !important;
}

.iqra-management-section .management-card {
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(7, 63, 52, .13) !important;
    border-radius: 15px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 26px rgba(7, 63, 52, .045) !important;
    transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

.iqra-management-section .management-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(178, 138, 50, .35) !important;
    box-shadow: 0 18px 42px rgba(7, 63, 52, .08) !important;
}

.iqra-management-section .management-photo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: none !important;
    width: 100% !important;
    min-height: 0 !important;
    aspect-ratio: 4 / 5 !important;
    margin: 0 !important;
    overflow: hidden !important;
    background: #f1f2ee !important;
    text-decoration: none !important;
}

.iqra-management-section .management-photo img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #f1f2ee !important;
}

.iqra-management-section .management-photo-placeholder {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    color: #0b4938 !important;
    font-size: 56px !important;
    font-weight: 800 !important;
}

.iqra-management-section .management-content {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    min-width: 0 !important;
    padding: 20px 20px 22px !important;
}

.iqra-management-section .management-title {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    min-height: 27px !important;
    margin: 0 0 10px !important;
    padding: 4px 9px !important;
    border: 1px solid rgba(178, 138, 50, .30) !important;
    border-radius: 4px !important;
    background: #fffdf7 !important;
    color: #987526 !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.iqra-management-section .management-name {
    width: 100% !important;
    margin: 0 0 8px !important;
    color: #073f34 !important;
    font-size: clamp(20px, 1.8vw, 24px) !important;
    font-weight: 800 !important;
    line-height: 1.28 !important;
}

.iqra-management-section .management-name a {
    color: inherit !important;
    text-decoration: none !important;
}

.iqra-management-section .management-bio {
    display: -webkit-box !important;
    width: 100% !important;
    min-height: calc(1.7em * 2) !important;
    max-height: calc(1.7em * 2) !important;
    margin: 0 0 14px !important;
    overflow: hidden !important;
    color: #68776f !important;
    font-size: 13px !important;
    line-height: 1.7 !important;
    text-overflow: ellipsis !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    line-clamp: 2 !important;
}

.iqra-management-section .management-view-more {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-top: auto !important;
    color: #0b4938 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
}

.iqra-management-section .management-view-more b {
    color: #b28a32 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
}

.iqra-management-section .management-view-more:hover {
    color: #987526 !important;
}

@media (max-width: 1050px) {
    .iqra-management-section .management-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 680px) {
    .iqra-management-section {
        padding: 52px 0 !important;
    }

    .iqra-management-section .management-grid {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    .iqra-management-heading {
        font-size: clamp(32px, 10vw, 44px) !important;
    }
}

/* IQRA HOME TOP GAP + MANAGEMENT FINAL FIX END */

/* SOURCE: resources/views/frontend/home/styles/contact.blade.php */
/* ============================================================
   HOME CONTACT SECTION
============================================================ */

.iqra-home-contact,
.iqra-home-contact * {
    box-sizing: border-box;
}


.iqra-home-contact {
    position: relative;

    width: 100%;

    padding:
        clamp(70px, 8vw, 110px)
        0;

    overflow: hidden;

    background: #0a3f32;
}


.iqra-home-contact::before {
    content: "";

    position: absolute;

    top: -230px;
    right: -190px;

    width: 480px;
    height: 480px;

    border:
        1px solid
        rgba(255, 255, 255, .08);

    border-radius: 50%;

    pointer-events: none;
}


.iqra-home-contact-grid {
    position: relative;
    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(0, .86fr)
        minmax(0, 1.14fr);

    gap:
        clamp(45px, 7vw, 90px);

    align-items: center;
}


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

.iqra-home-contact-info {
    min-width: 0;
}


.iqra-home-contact-kicker {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 13px;

    color: #d7b566;

    font-size: 11px;
    font-weight: 900;
}


.iqra-home-contact-kicker::before {
    content: "";

    width: 28px;
    height: 1px;

    background: #d7b566;
}


.iqra-home-contact-info h2 {
    max-width: 620px;

    margin: 0;

    color: #ffffff;

    font-size:
        clamp(37px, 4.3vw, 58px);

    line-height: 1.1;
    font-weight: 800;
}


.iqra-home-contact-intro {
    max-width: 590px;

    margin:
        19px
        0
        0;

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

    font-size: 14px;
    line-height: 1.85;
}


.iqra-home-contact-details {
    display: grid;

    gap: 0;

    margin-top: 35px;

    border-top:
        1px solid
        rgba(255, 255, 255, .12);
}


.iqra-home-contact-item {
    display: grid;

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

    gap: 20px;

    padding:
        17px
        0;

    border-bottom:
        1px solid
        rgba(255, 255, 255, .12);
}


.iqra-home-contact-item-label {
    color: #d7b566;

    font-size: 10px;
    font-weight: 800;
}


.iqra-home-contact-item strong,
.iqra-home-contact-item a {
    color: #ffffff;

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

    line-height: 1.6;

    text-decoration: none;
}


.iqra-home-contact-note {
    display: flex;

    align-items: flex-start;

    gap: 12px;

    margin-top: 27px;
}


.iqra-home-contact-note > span {
    flex: 0 0 32px;

    width: 32px;
    height: 1px;

    margin-top: 8px;

    background: #d7b566;
}


.iqra-home-contact-note p {
    margin: 0;

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

    font-size: 10px;
    line-height: 1.7;
}


/* ============================================================
   FORM
============================================================ */

.iqra-home-contact-form-wrap {
    min-width: 0;
}


.iqra-home-contact-form {
    padding:
        clamp(27px, 3.5vw, 43px);

    border:
        1px solid
        rgba(255, 255, 255, .15);

    border-radius: 15px;

    background: #ffffff;

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


.iqra-home-contact-form-head {
    margin-bottom: 27px;
}


.iqra-home-contact-form-head > span {
    display: block;

    margin-bottom: 7px;

    color: #b38a35;

    font-size: 8px;
    font-weight: 900;

    letter-spacing: .14em;
}


.iqra-home-contact-form-head h3 {
    margin: 0;

    color: #073f32;

    font-size:
        clamp(23px, 2.4vw, 31px);

    line-height: 1.25;
}


.iqra-home-contact-fields {
    display: grid;

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

    gap:
        16px
        14px;
}


.iqra-home-contact-fields label {
    display: grid;

    gap: 7px;

    min-width: 0;
}


.iqra-home-contact-fields label > span {
    color: #52675f;

    font-size: 10px;
    font-weight: 800;
}


.iqra-home-contact-fields input,
.iqra-home-contact-fields textarea {
    width: 100%;

    margin: 0;

    border:
        1px solid
        #dce4df;

    border-radius: 7px;

    outline: 0;

    background: #fbfcfb;

    color: #183d31;

    font: inherit;

    font-size: 13px;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}


.iqra-home-contact-fields input {
    height: 47px;

    padding:
        0 13px;
}


.iqra-home-contact-fields textarea {
    min-height: 140px;

    padding: 12px 13px;

    resize: vertical;

    line-height: 1.65;
}


.iqra-home-contact-fields input:focus,
.iqra-home-contact-fields textarea:focus {
    border-color: #0a6049;

    background: #ffffff;

    box-shadow:
        0
        0
        0
        3px
        rgba(10, 96, 73, .08);
}


.iqra-home-contact-field-full {
    grid-column: 1 / -1;
}


.iqra-home-contact-submit {
    display: inline-flex;

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

    gap: 13px;

    min-height: 46px;

    margin-top: 19px;

    padding:
        9px
        19px;

    border:
        1px solid
        #07503d;

    border-radius: 7px;

    background: #07503d;

    color: #ffffff;

    font: inherit;

    font-size: 12px;
    font-weight: 900;

    cursor: pointer;

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


.iqra-home-contact-submit b {
    color: #ddb85f;

    font-size: 16px;
    font-weight: 500;

    transition:
        transform .2s ease;
}


.iqra-home-contact-submit:hover {
    background: #053d2f;

    transform: translateY(-1px);
}


.iqra-home-contact-submit:hover b {
    transform: translateX(3px);
}


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

@media (max-width: 900px) {

    .iqra-home-contact-grid {
        grid-template-columns: 1fr;

        gap: 40px;
    }


    .iqra-home-contact-info,
    .iqra-home-contact-form-wrap {
        width: 100%;
        max-width: 760px;

        margin:
            0 auto;
    }

}


@media (max-width: 600px) {

    .iqra-home-contact {
        padding:
            55px
            0
            62px;
    }


    .iqra-home-contact::before {
        display: none;
    }


    .iqra-home-contact-info h2 {
        font-size:
            clamp(34px, 10vw, 44px);
    }


    .iqra-home-contact-item {
        grid-template-columns: 1fr;

        gap: 5px;
    }


    .iqra-home-contact-fields {
        grid-template-columns: 1fr;
    }


    .iqra-home-contact-field-full {
        grid-column: auto;
    }


    .iqra-home-contact-form {
        padding:
            23px
            18px;
    }


    .iqra-home-contact-submit {
        width: 100%;
    }

}


/* IQRA CONTACT FORM HIGHLIGHT START */

/* ============================================================
   FULL CONTACT FORM HIGHLIGHT
============================================================ */

.iqra-home-contact-form {
    position: relative !important;

    overflow: hidden !important;

    border:
        2px solid
        #0b6049 !important;

    border-radius:
        16px !important;

    background:
        #ffffff !important;

    box-shadow:
        0 0 0 4px rgba(11, 96, 73, .08),
        0 22px 58px rgba(0, 0, 0, .13) !important;

    transition:
        border-color .22s ease,
        box-shadow .22s ease,
        transform .22s ease !important;
}


/* Gold top accent */

.iqra-home-contact-form::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        #c69a42;

    z-index: 3;
}


/* Entire form highlight while typing */

.iqra-home-contact-form:focus-within {
    border-color:
        #07503d !important;

    box-shadow:
        0 0 0 5px rgba(198, 154, 66, .16),
        0 24px 65px rgba(0, 0, 0, .16) !important;

    transform:
        translateY(-2px);
}


/* ============================================================
   FIELD HIGHLIGHT
============================================================ */

.iqra-home-contact-fields input,
.iqra-home-contact-fields textarea {
    border:
        1px solid
        #ccdcd5 !important;

    background:
        #fbfdfc !important;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease !important;
}


.iqra-home-contact-fields input:hover,
.iqra-home-contact-fields textarea:hover {
    border-color:
        rgba(11, 96, 73, .45) !important;
}


.iqra-home-contact-fields input:focus,
.iqra-home-contact-fields textarea:focus {
    border-color:
        #0b6049 !important;

    background:
        #ffffff !important;

    box-shadow:
        0 0 0 3px
        rgba(11, 96, 73, .10) !important;

    outline:
        none !important;
}


/* ============================================================
   MESSAGE AREA
============================================================ */

.iqra-home-contact-field-full {
    position: relative;
}


.iqra-home-contact-field-full textarea {
    min-height:
        155px !important;

    border:
        1.5px solid
        #9bbdaf !important;
}


.iqra-home-contact-field-full textarea:focus {
    border:
        2px solid
        #07503d !important;

    box-shadow:
        0 0 0 4px
        rgba(7, 80, 61, .09) !important;
}


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

.iqra-home-contact-form-head {
    position: relative;

    padding-bottom:
        21px;

    margin-bottom:
        25px !important;

    border-bottom:
        1px solid
        #e1e9e5;
}


.iqra-home-contact-form-head::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: -1px;

    width: 55px;
    height: 2px;

    background:
        #c69a42;
}


/* ============================================================
   SUBMIT BUTTON
============================================================ */

.iqra-home-contact-submit {
    min-width:
        145px;

    border:
        1px solid
        #07503d !important;

    background:
        #07503d !important;

    box-shadow:
        0 8px 22px
        rgba(7, 80, 61, .14);
}


.iqra-home-contact-submit:hover {
    background:
        #043e2f !important;

    box-shadow:
        0 12px 28px
        rgba(7, 80, 61, .20);
}


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

@media (max-width: 600px) {

    .iqra-home-contact-form {
        border-radius:
            13px !important;

        box-shadow:
            0 0 0 3px rgba(11, 96, 73, .07),
            0 16px 38px rgba(0, 0, 0, .10) !important;
    }


    .iqra-home-contact-field-full textarea {
        min-height:
            145px !important;
    }

}

/* IQRA CONTACT FORM HIGHLIGHT END */



/* ============================================================
   CONTACT VOICE RECORDER
============================================================ */

.iqra-contact-submit-row {
    display: flex;
    align-items: stretch;
    gap: 12px;
    margin-top: 19px;
}


.iqra-contact-submit-row
.iqra-home-contact-submit {
    margin-top: 0 !important;
}


.iqra-contact-voice-start {
    display: inline-flex;

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

    gap: 9px;

    min-width: 155px;
    min-height: 46px;

    padding:
        9px
        16px;

    border:
        1px solid
        #c69a42;

    border-radius:
        7px;

    background:
        #fffaf0;

    color:
        #07503d;

    font: inherit;

    font-size:
        11px;

    font-weight:
        900;

    cursor: pointer;

    transition:
        background .2s ease,
        border-color .2s ease,
        transform .2s ease;
}


.iqra-contact-voice-start > span {
    font-size: 17px;
}


.iqra-contact-voice-start:hover {
    transform:
        translateY(-1px);

    border-color:
        #b5892f;

    background:
        #fff6df;
}


.iqra-contact-voice-panel {
    margin-top:
        13px;

    padding:
        14px;

    border:
        1px solid
        #d4e1db;

    border-radius:
        9px;

    background:
        #f8fbf9;
}


.iqra-contact-voice-status {
    display: flex;

    align-items: center;

    gap: 8px;

    color:
        #31564b;

    font-size:
        10px;
}


.iqra-contact-voice-status time {
    margin-left:
        auto;

    color:
        #7d8d85;

    font-weight:
        900;
}


.iqra-contact-voice-dot {
    width: 9px;
    height: 9px;

    border-radius:
        50%;

    background:
        #aebbb5;
}


.iqra-contact-voice-dot.is-recording {
    background:
        #c44949;

    box-shadow:
        0 0 0 5px
        rgba(196,73,73,.12);

    animation:
        iqraVoicePulse
        1.2s
        infinite;
}


@keyframes iqraVoicePulse {

    50% {
        box-shadow:
            0 0 0 9px
            rgba(196,73,73,.03);
    }

}


.iqra-contact-voice-recording,
.iqra-contact-voice-preview {
    margin-top:
        13px;
}


.iqra-contact-voice-stop,
.iqra-contact-voice-delete {
    min-height:
        38px;

    padding:
        0
        13px;

    border-radius:
        6px;

    font: inherit;

    font-size:
        10px;

    font-weight:
        900;

    cursor: pointer;
}


.iqra-contact-voice-stop {
    border:
        1px solid
        #b54c4c;

    background:
        #b54c4c;

    color:
        #ffffff;
}


.iqra-contact-voice-preview audio {
    display: block;

    width: 100%;

    margin-bottom:
        10px;
}


.iqra-contact-voice-delete {
    border:
        1px solid
        #d8dfdb;

    background:
        #ffffff;

    color:
        #9a4545;
}


.iqra-contact-voice-help {
    margin:
        11px
        0
        0;

    color:
        #849189;

    font-size:
        9px;

    line-height:
        1.65;
}


.iqra-home-contact-submit:disabled {
    opacity:
        .55;

    cursor:
        not-allowed;

    transform:
        none !important;
}


@media (max-width: 600px) {

    .iqra-contact-submit-row {
        display: grid;

        grid-template-columns:
            1fr;

        gap:
            9px;
    }


    .iqra-contact-submit-row
    .iqra-home-contact-submit,
    .iqra-contact-voice-start {
        width: 100%;
    }

}

/* SOURCE: resources/views/frontend/home/sections/notices.blade.php BLOCK 1 */
/* ============================================================
   IQRA NOTICE BOARD
============================================================ */

.iqra-notice-section,
.iqra-notice-section * {
    box-sizing: border-box;
}


.iqra-notice-section {
    position: relative;

    padding:
        clamp(
            46px,
            5vw,
            72px
        )
        0;

    background:
        #f5f7f4;
}


.iqra-notice-container {
    width:
        min(
            1220px,
            calc(
                100%
                -
                40px
            )
        );

    margin:
        0 auto;
}


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

.iqra-notice-header {
    display: flex;

    align-items:
        flex-end;

    justify-content:
        space-between;

    gap:
        28px;

    margin-bottom:
        24px;
}


.iqra-notice-header-content {
    max-width:
        720px;
}


.iqra-notice-kicker {
    display:
        inline-flex;

    align-items:
        center;

    gap:
        9px;

    margin-bottom:
        10px;

    font-size:
        12px;

    font-weight:
        800;

    letter-spacing:
        .06em;

    color:
        #b27e13;
}


.iqra-notice-kicker::before {
    content:
        "";

    width:
        28px;

    height:
        2px;

    background:
        #d7aa31;
}


.iqra-notice-header h2 {
    margin:
        0;

    font-size:
        clamp(
            32px,
            4vw,
            52px
        );

    line-height:
        1.08;

    font-weight:
        800;

    letter-spacing:
        -.025em;

    color:
        #0b4d3a;
}


.iqra-notice-header p {
    margin:
        12px
        0
        0;

    font-size:
        15px;

    line-height:
        1.7;

    color:
        #647069;
}


.iqra-notice-all {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        44px;

    padding:
        10px
        18px;

    border:
        1px solid
        #0b6249;

    border-radius:
        9px;

    background:
        #0b6249;

    color:
        #ffffff;

    text-decoration:
        none;

    font-size:
        12px;

    font-weight:
        800;

    white-space:
        nowrap;
}


/* ============================================================
   PANEL
============================================================ */

.iqra-notice-panel {
    padding:
        20px;

    border:
        1px solid
        rgba(
            11,
            77,
            58,
            .10
        );

    border-radius:
        18px;

    background:
        #ffffff;

    box-shadow:
        0
        18px
        50px
        rgba(
            22,
            47,
            35,
            .05
        );
}


.iqra-notice-other {
    margin-top:
        22px;
}


.iqra-notice-group-title {
    margin-bottom:
        9px;

    padding-bottom:
        9px;

    border-bottom:
        1px solid
        rgba(
            11,
            77,
            58,
            .12
        );

    font-size:
        12px;

    font-weight:
        800;

    color:
        #b27e13;
}


.iqra-notice-list {
    display:
        grid;

    gap:
        8px;
}


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

.iqra-notice-card {
    display:
        grid;

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

    align-items:
        center;

    gap:
        12px;

    min-height:
        64px;

    padding:
        8px
        10px
        8px
        14px;

    border:
        1px solid
        rgba(
            11,
            77,
            58,
            .13
        );

    border-left:
        3px solid
        transparent;

    border-radius:
        10px;

    background:
        #ffffff;
}


.iqra-notice-card.is-latest {
    border-left-color:
        #d9aa29;
}


.iqra-notice-content {
    min-width:
        0;
}


/* ============================================================
   META
============================================================ */

.iqra-notice-meta {
    display:
        flex;

    align-items:
        center;

    flex-wrap:
        nowrap;

    gap:
        6px;

    min-width:
        0;

    margin-bottom:
        4px;
}


.iqra-notice-latest,
.iqra-notice-branch {
    display:
        inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0
        0
        auto;

    min-height:
        21px;

    padding:
        3px
        8px;

    border-radius:
        999px;

    font-size:
        9px;

    font-weight:
        800;

    line-height:
        1;

    white-space:
        nowrap;
}


.iqra-notice-latest {
    background:
        #f7e9bd;

    color:
        #9b6e0a;
}


.iqra-notice-branch {
    background:
        #eaf3ee;

    color:
        #09674d;
}


.iqra-notice-date {
    min-width:
        0;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    font-size:
        10px;

    font-weight:
        600;

    color:
        #737d77;
}


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

.iqra-notice-card h3 {
    min-width:
        0;

    margin:
        0;

    overflow:
        hidden;

    text-overflow:
        ellipsis;

    white-space:
        nowrap;

    font-size:
        15px;

    font-weight:
        800;

    line-height:
        1.2;
}


.iqra-notice-card h3 a {
    color:
        #073f31;

    text-decoration:
        none;
}


/* ============================================================
   ACTION BOX
============================================================ */

.iqra-notice-actions {
    display:
        grid;

    grid-template-columns:
        1fr;

    grid-template-rows:
        repeat(
            2,
            25px
        );

    align-self:
        center;

    width:
        94px;

    min-width:
        94px;

    gap:
        4px;
}


.iqra-notice-action {
    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        25px;

    min-height:
        25px;

    padding:
        2px
        5px;

    border-radius:
        6px;

    text-decoration:
        none;

    font-size:
        9px;

    font-weight:
        800;

    line-height:
        1;

    white-space:
        nowrap;
}


.iqra-notice-action.view {
    border:
        1px solid
        #d9aa29;

    background:
        #d9aa29;

    color:
        #073f31;
}


.iqra-notice-action.download {
    border:
        1px solid
        #0a654b;

    background:
        #0a654b;

    color:
        #ffffff;
}


.iqra-notice-action.download.disabled {
    cursor:
        not-allowed;

    opacity:
        .38;
}


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

@media (
    max-width: 900px
) {

    .iqra-notice-header {
        align-items:
            flex-start;

        flex-direction:
            column;

        gap:
            16px;
    }


    .iqra-notice-all {
        min-height:
            40px;
    }
}


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

@media (
    max-width: 640px
) {

    .iqra-notice-section {
        padding:
            28px
            0;
    }


    .iqra-notice-container {
        width:
            calc(
                100%
                -
                14px
            );
    }


    .iqra-notice-header {
        margin-bottom:
            14px;
    }


    .iqra-notice-header h2 {
        font-size:
            28px;
    }


    .iqra-notice-header p {
        margin-top:
            8px;

        font-size:
            12px;

        line-height:
            1.55;
    }


    .iqra-notice-kicker {
        margin-bottom:
            7px;

        font-size:
            9px;
    }


    .iqra-notice-all {
        width:
            100%;

        min-height:
            36px;

        padding:
            7px
            12px;

        font-size:
            10px;
    }


    .iqra-notice-panel {
        padding:
            8px;

        border-radius:
            12px;
    }


    .iqra-notice-other {
        margin-top:
            13px;
    }


    .iqra-notice-group-title {
        margin-bottom:
            6px;

        padding-bottom:
            6px;

        font-size:
            9px;
    }


    .iqra-notice-list {
        gap:
            6px;
    }


    .iqra-notice-card {
        grid-template-columns:
            minmax(
                0,
                1fr
            )
            68px;

        gap:
            6px;

        min-height:
            56px;

        padding:
            6px
            6px
            6px
            8px;

        border-radius:
            8px;
    }


    .iqra-notice-meta {
        gap:
            3px;

        margin-bottom:
            3px;
    }


    .iqra-notice-latest,
    .iqra-notice-branch {
        min-height:
            17px;

        padding:
            2px
            5px;

        font-size:
            7px;
    }


    .iqra-notice-date {
        font-size:
            7px;
    }


    .iqra-notice-card h3 {
        font-size:
            10px;

        line-height:
            1.15;
    }


    .iqra-notice-actions {
        width:
            68px;

        min-width:
            68px;

        grid-template-rows:
            repeat(
                2,
                21px
            );

        gap:
            3px;
    }


    .iqra-notice-action {
        height:
            21px;

        min-height:
            21px;

        padding:
            1px
            3px;

        border-radius:
            5px;

        font-size:
            7px;
    }
}


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

@media (
    max-width: 380px
) {

    .iqra-notice-card {
        grid-template-columns:
            minmax(
                0,
                1fr
            )
            62px;
    }


    .iqra-notice-actions {
        width:
            62px;

        min-width:
            62px;
    }


    .iqra-notice-action {
        font-size:
            6.5px;
    }
}

/* SOURCE: resources/views/frontend/home/sections/notices.blade.php BLOCK 2 */
/* IQRA NOTICE VISIBILITY LAYOUT FINAL */

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

.iqra-notice-section {
    position: relative !important;
    width: 100% !important;
    display: block !important;
    overflow: visible !important;
}

.iqra-notice-container {
    display: block !important;
    width: min(1220px, calc(100% - 40px)) !important;
    max-width: 1220px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


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

.iqra-notice-header {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    width: 100% !important;
    gap: 24px !important;
}

.iqra-notice-header-content {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 760px !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.iqra-notice-kicker,
.iqra-notice-header h2,
.iqra-notice-header p {
    opacity: 1 !important;
    visibility: visible !important;
}

.iqra-notice-header h2 {
    display: block !important;
    color: #0b4d3a !important;
}

.iqra-notice-header p {
    display: block !important;
    color: #647069 !important;
}

.iqra-notice-all {
    flex: 0 0 auto !important;
    display: inline-flex !important;
}


/* ============================================================
   PANEL
============================================================ */

.iqra-notice-panel {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: visible !important;
}

.iqra-notice-group {
    display: block !important;
    width: 100% !important;
}

.iqra-notice-list {
    display: grid !important;
    width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
}


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

.iqra-notice-card {
    position: relative !important;

    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        96px !important;

    align-items: center !important;

    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;

    min-height: 64px !important;

    padding:
        8px
        10px
        8px
        14px !important;

    gap: 12px !important;

    overflow: visible !important;
}


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

.iqra-notice-content {
    display: block !important;

    position: relative !important;

    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    overflow: visible !important;

    transform: none !important;
}


/* ============================================================
   META
============================================================ */

.iqra-notice-meta {
    display: flex !important;

    align-items: center !important;

    flex-wrap: wrap !important;

    width: 100% !important;

    gap: 6px !important;

    margin:
        0
        0
        4px !important;

    opacity: 1 !important;
    visibility: visible !important;
}

.iqra-notice-latest,
.iqra-notice-branch,
.iqra-notice-date {
    opacity: 1 !important;
    visibility: visible !important;
}


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

.iqra-notice-card h3 {
    display: block !important;

    position: relative !important;

    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;

    height: auto !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    overflow: hidden !important;

    white-space: nowrap !important;
    text-overflow: ellipsis !important;

    color: #073f31 !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;

    transform: none !important;
}

.iqra-notice-card h3 a {
    display: inline !important;

    opacity: 1 !important;
    visibility: visible !important;

    color: #073f31 !important;

    text-decoration: none !important;
}

.iqra-notice-original-title {
    display: inline !important;

    opacity: 1 !important;
    visibility: visible !important;

    color: inherit !important;

    text-transform: none !important;

    unicode-bidi: plaintext;
}


/* ============================================================
   RIGHT ACTION BOX
============================================================ */

.iqra-notice-actions {
    display: grid !important;

    grid-template-columns: 1fr !important;

    grid-template-rows:
        repeat(2, 25px) !important;

    grid-column: 2 !important;

    align-self: center !important;

    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;

    height: auto !important;

    gap: 4px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    overflow: visible !important;
}

.iqra-notice-action {
    display: flex !important;

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

    width: 100% !important;

    height: 25px !important;
    min-height: 25px !important;

    margin: 0 !important;

    padding:
        2px
        5px !important;

    border-radius: 6px !important;

    font-size: 9px !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    text-decoration: none !important;

    white-space: nowrap !important;
}


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

@media (max-width: 900px) {

    .iqra-notice-header {
        align-items: flex-start !important;
        flex-direction: column !important;
    }

}


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

@media (max-width: 640px) {

    .iqra-notice-container {
        width: calc(100% - 14px) !important;
    }

    .iqra-notice-panel {
        width: 100% !important;
        padding: 8px !important;
    }

    .iqra-notice-card {
        grid-template-columns:
            minmax(0, 1fr)
            68px !important;

        width: 100% !important;

        min-height: 56px !important;

        padding:
            6px
            6px
            6px
            8px !important;

        gap: 6px !important;
    }

    .iqra-notice-content {
        width: 100% !important;
        min-width: 0 !important;
    }

    .iqra-notice-meta {
        flex-wrap: nowrap !important;

        gap: 3px !important;

        overflow: hidden !important;
    }

    .iqra-notice-latest,
    .iqra-notice-branch {
        flex: 0 0 auto !important;
    }

    .iqra-notice-date {
        min-width: 0 !important;

        overflow: hidden !important;

        text-overflow: ellipsis !important;

        white-space: nowrap !important;
    }

    .iqra-notice-card h3 {
        width: 100% !important;

        font-size: 10px !important;

        line-height: 1.2 !important;

        white-space: nowrap !important;

        overflow: hidden !important;

        text-overflow: ellipsis !important;
    }

    .iqra-notice-actions {
        grid-column: 2 !important;

        width: 68px !important;
        min-width: 68px !important;
        max-width: 68px !important;

        grid-template-rows:
            repeat(2, 21px) !important;

        gap: 3px !important;
    }

    .iqra-notice-action {
        height: 21px !important;
        min-height: 21px !important;

        padding:
            1px
            3px !important;

        font-size: 7px !important;
    }

}


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

@media (max-width: 380px) {

    .iqra-notice-card {
        grid-template-columns:
            minmax(0, 1fr)
            62px !important;
    }

    .iqra-notice-actions {
        width: 62px !important;
        min-width: 62px !important;
        max-width: 62px !important;
    }

}

/* SOURCE: resources/views/frontend/home/sections/notices.blade.php BLOCK 3 */
/* ============================================================
   NOTICE FINAL STABLE LAYOUT
============================================================ */

.iqra-notice-section,
.iqra-home-notices {
    width: 100% !important;
    overflow: visible !important;
}


.iqra-notice-container,
.iqra-home-notices-container {
    width: min(
        1220px,
        calc(100% - 40px)
    ) !important;

    max-width: 1220px !important;

    margin-left: auto !important;
    margin-right: auto !important;
}


.iqra-notice-panel,
.iqra-home-notices-board {
    width: 100% !important;
    min-width: 0 !important;
}


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

.iqra-notice-card,
.iqra-home-notice-card {
    display: grid !important;

    grid-template-columns:
        minmax(0, 1fr)
        96px !important;

    align-items: center !important;

    width: 100% !important;
    min-width: 0 !important;

    gap: 12px !important;
}


.iqra-notice-content,
.iqra-home-notice-main {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;
}


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

.iqra-notice-card h3,
.iqra-home-notice-title {
    display: block !important;

    width: 100% !important;
    min-width: 0 !important;

    opacity: 1 !important;
    visibility: visible !important;

    color: #073f31 !important;

    text-transform: none !important;
}


.iqra-notice-card h3 a,
.iqra-home-notice-title a,
.iqra-notice-original-title {
    opacity: 1 !important;
    visibility: visible !important;

    color: #073f31 !important;

    text-transform: none !important;
}


/* ============================================================
   ACTIONS
============================================================ */

.iqra-notice-actions,
.iqra-home-notice-actions {
    display: grid !important;

    grid-template-columns:
        1fr !important;

    grid-template-rows:
        repeat(2, 27px) !important;

    width: 96px !important;
    min-width: 96px !important;
    max-width: 96px !important;

    gap: 4px !important;

    margin: 0 !important;
    padding: 0 !important;

    align-self: center !important;
}


.iqra-notice-action,
.iqra-home-notice-btn {
    display: flex !important;

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

    width: 100% !important;

    height: 27px !important;
    min-height: 27px !important;

    padding: 2px 6px !important;

    border-radius: 6px !important;

    font-size: 9px !important;
    font-weight: 800 !important;

    line-height: 1 !important;

    white-space: nowrap !important;

    text-decoration: none !important;
}


/* View */

.iqra-notice-action.view,
.iqra-home-notice-btn-view {
    border: 1px solid #dcad27 !important;

    background: #dcad27 !important;

    color: #073f31 !important;
}


/* Download */

.iqra-notice-action.download,
.iqra-home-notice-btn-download {
    border: 1px solid #086148 !important;

    background: #086148 !important;

    color: #ffffff !important;
}


.iqra-notice-action.download.disabled,
.iqra-home-notice-btn-download.is-disabled {
    opacity: .48 !important;
}


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

@media (max-width: 640px) {

    .iqra-notice-container,
    .iqra-home-notices-container {
        width: calc(100% - 14px) !important;
    }


    .iqra-notice-card,
    .iqra-home-notice-card {
        grid-template-columns:
            minmax(0, 1fr)
            70px !important;

        gap: 6px !important;

        min-height: 56px !important;
    }


    .iqra-notice-actions,
    .iqra-home-notice-actions {
        width: 70px !important;
        min-width: 70px !important;
        max-width: 70px !important;

        grid-template-rows:
            repeat(2, 22px) !important;

        gap: 3px !important;
    }


    .iqra-notice-action,
    .iqra-home-notice-btn {
        height: 22px !important;
        min-height: 22px !important;

        padding: 1px 3px !important;

        font-size: 7.5px !important;
    }


    .iqra-notice-card h3,
    .iqra-home-notice-title {
        font-size: 10px !important;

        line-height: 1.2 !important;

        overflow: hidden !important;

        text-overflow: ellipsis !important;

        white-space: nowrap !important;
    }

}

/* SOURCE: resources/views/frontend/home/sections/branches.blade.php BLOCK 1 */
/* ============================================================
   SECTION
============================================================ */

.iqra-branches-pro,
.iqra-branches-pro * {
    box-sizing: border-box;
}

.iqra-branches-pro {
    position: relative;

    padding:
        clamp(
            70px,
            8vw,
            110px
        )
        0;

    overflow: hidden;

    background:
        #f8f6ef;
}

.iqra-branches-pro::before {
    content: "";

    position: absolute;

    top: -220px;
    right: -190px;

    width: 440px;
    height: 440px;

    border:
        1px solid
        rgba(173,132,47,.08);

    border-radius: 50%;

    pointer-events: none;
}

.iqra-branches-container {
    position: relative;
    z-index: 2;

    width:
        min(
            1220px,
            calc(100% - 40px)
        );

    margin:
        0 auto;
}


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

.iqra-branches-header {
    max-width:
        760px;

    margin-bottom:
        40px;
}

.iqra-branches-kicker {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom:
        12px;

    color:
        #b18832;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .05em;
}

.iqra-branches-kicker::before {
    content: "";

    width:
        30px;

    height:
        1px;

    background:
        #b18832;
}

.iqra-branches-header h2 {
    margin:
        0;

    color:
        #073f32;

    font-size:
        clamp(
            35px,
            4.5vw,
            56px
        );

    line-height:
        1.1;

    font-weight:
        800;

    letter-spacing:
        -.025em;
}

.iqra-branches-header p {
    max-width:
        720px;

    margin:
        15px
        0
        0;

    color:
        #687970;

    font-size:
        15px;

    line-height:
        1.8;
}


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

.iqra-branches-grid {
    display: grid;

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

    gap:
        24px;

    align-items:
        stretch;
}


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

.iqra-branch-card {
    position: relative;

    display: flex;

    flex-direction:
        column;

    min-width: 0;

    padding:
        27px;

    overflow:
        hidden;

    border:
        1px solid
        #dde4df;

    border-radius:
        20px;

    background:
        #ffffff;

    box-shadow:
        0 20px 60px
        rgba(14,55,43,.055);

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

.iqra-branch-card::before {
    content: "";

    position:
        absolute;

    top: 0;
    left: 27px;

    width:
        72px;

    height:
        4px;

    border-radius:
        0
        0
        999px
        999px;
}

.iqra-branch-card.male::before {
    background:
        #087059;
}

.iqra-branch-card.female::before {
    background:
        #a85180;
}

.iqra-branch-card:hover {
    transform:
        translateY(-4px);

    border-color:
        rgba(7,80,61,.28);

    box-shadow:
        0 28px 70px
        rgba(14,55,43,.09);
}


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

.iqra-branch-card-top {
    display: flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap: 16px;

    margin-bottom:
        17px;
}

.iqra-branch-label {
    display: inline-flex;

    align-items:
        center;

    gap: 7px;

    min-height:
        31px;

    padding:
        6px 11px;

    border:
        1px solid
        #d9e3df;

    border-radius:
        999px;

    background:
        #f8fbf9;

    color:
        #07503d;

    font-size:
        10px;

    font-weight:
        900;
}

.iqra-branch-label::before {
    content: "";

    width:
        7px;

    height:
        7px;

    border-radius:
        50%;

    background:
        currentColor;
}

.iqra-branch-number {
    display: inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-width:
        39px;

    height:
        29px;

    padding:
        0
        9px;

    border:
        1px solid
        #dce4e0;

    border-radius:
        999px;

    color:
        #718078;

    font-size:
        9px;

    font-weight:
        900;
}


/* ============================================================
   TITLE + DESCRIPTION
============================================================ */

.iqra-branch-card > h3 {
    margin:
        0;

    color:
        #073f32;

    font-size:
        clamp(
            29px,
            3vw,
            42px
        );

    line-height:
        1.1;

    font-weight:
        800;

    letter-spacing:
        -.025em;
}

.iqra-branch-description {
    display:
        -webkit-box;

    min-height:
        calc(1.75em * 2);

    margin:
        12px
        0
        0;

    overflow:
        hidden;

    color:
        #687970;

    font-size:
        12px;

    line-height:
        1.75;

    -webkit-box-orient:
        vertical;

    line-clamp:
        2;

    -webkit-line-clamp:
        2;
}


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

.iqra-branch-image {
    display: block;

    width:
        100%;

    aspect-ratio:
        16 / 9;

    margin-top:
        21px;

    overflow:
        hidden;

    border:
        1px solid
        #e0e7e3;

    border-radius:
        14px;

    background:
        #edf4f0;

    text-decoration:
        none;
}

.iqra-branch-image img {
    display: block;

    width:
        100%;

    height:
        100%;

    object-fit: contain;

    object-position:
        center;

    transition:
        transform
        .35s ease;
}

.iqra-branch-card:hover
.iqra-branch-image img {
    transform:
        scale(1.025);
}

.iqra-branch-image-empty {
    display: flex;

    flex-direction:
        column;

    align-items:
        center;

    justify-content:
        center;

    width:
        100%;

    height:
        100%;

    background:
        linear-gradient(
            135deg,
            #edf5f1,
            #f8f5eb
        );

    color:
        #0a503d;
}

.iqra-branch-image-empty > span {
    display: flex;

    align-items:
        center;

    justify-content:
        center;

    width:
        54px;

    height:
        54px;

    border:
        1px solid
        rgba(7,80,61,.18);

    border-radius:
        50%;

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

    font-size:
        22px;

    font-weight:
        900;
}

.iqra-branch-image-empty strong {
    margin-top:
        10px;

    font-size:
        13px;
}

.iqra-branch-image-empty small {
    margin-top:
        3px;

    color:
        #85938c;

    font-size:
        9px;

    font-weight:
        700;
}


/* ============================================================
   EXISTING SIX STATS
============================================================ */

.iqra-branch-stats {
    display: grid;

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

    gap:
        10px;

    margin-top:
        17px;
}

.iqra-branch-stat {
    min-width: 0;

    padding:
        14px;

    border:
        1px solid
        #e5e4dc;

    border-radius:
        11px;

    background:
        #fbfaf6;

    transition:
        transform .18s ease,
        border-color .18s ease;
}

.iqra-branch-stat:hover {
    transform:
        translateY(-2px);

    border-color:
        rgba(177,136,50,.32);
}

.iqra-branch-stat strong {
    display: block;

    color:
        #073f32;

    font-size:
        21px;

    line-height:
        1;

    font-weight:
        900;
}

.iqra-branch-stat span {
    display: block;

    margin-top:
        7px;

    color:
        #718078;

    font-size:
        10px;

    font-weight:
        700;
}


/* ============================================================
   দ্রুত লিংক
============================================================ */

.iqra-branch-quick-links {
    display: flex;

    flex-wrap:
        wrap;

    gap:
        8px;

    margin-top:
        18px;
}

.iqra-branch-quick-links a {
    display: inline-flex;

    align-items:
        center;

    justify-content:
        center;

    min-height:
        34px;

    padding:
        6px
        11px;

    border:
        1px solid
        #dbe4df;

    border-radius:
        7px;

    background:
        #ffffff;

    color:
        #07503d;

    font-size:
        10px;

    font-weight:
        800;

    text-decoration:
        none;

    transition:
        border-color .18s ease,
        background .18s ease,
        transform .18s ease;
}

.iqra-branch-quick-links a:hover {
    transform:
        translateY(-1px);

    border-color:
        #07503d;

    background:
        #f4f8f6;
}


/* ============================================================
   FULL WIDTH PROFESSIONAL BUTTON
============================================================ */

.iqra-branch-full-button {
    position: relative;

    display: flex;

    align-items:
        center;

    justify-content:
        space-between;

    gap:
        18px;

    width:
        100%;

    min-height:
        54px;

    margin-top:
        auto;

    padding:
        12px
        18px;

    border-radius:
        10px;

    background:
        #07503d;

    color:
        #ffffff;

    font-size:
        12px;

    font-weight:
        900;

    text-decoration:
        none;

    box-shadow:
        0 13px 30px
        rgba(7,80,61,.15);

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

.iqra-branch-quick-links
+ .iqra-branch-full-button {
    margin-top:
        22px;
}

.iqra-branch-full-button b {
    display: inline-flex;

    align-items:
        center;

    justify-content:
        center;

    flex: 0 0 31px;

    width:
        31px;

    height:
        31px;

    border-radius:
        50%;

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

    color:
        #e1ba5c;

    font-size:
        16px;

    font-weight:
        500;

    transition:
        transform .2s ease;
}

.iqra-branch-full-button:hover {
    transform:
        translateY(-1px);

    background:
        #063e30;

    color:
        #ffffff;

    box-shadow:
        0 17px 36px
        rgba(7,80,61,.21);
}

.iqra-branch-full-button:hover b {
    transform:
        translateX(3px);
}


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

@media (max-width: 1050px) {

    .iqra-branches-grid {
        grid-template-columns:
            1fr;
    }

}


@media (max-width: 700px) {

    .iqra-branches-pro {
        padding:
            55px
            0
            65px;
    }

    .iqra-branches-container {
        width:
            calc(100% - 28px);
    }

    .iqra-branch-card {
        padding:
            20px;

        border-radius:
            16px;
    }

    .iqra-branch-card > h3 {
        font-size:
            29px;
    }

    .iqra-branch-stats {
        grid-template-columns:
            repeat(
                2,
                minmax(0,1fr)
            );
    }

}


@media (max-width: 430px) {

    .iqra-branch-card {
        padding:
            17px;
    }

    .iqra-branch-image {
        aspect-ratio:
            4 / 3;
    }

    .iqra-branch-stat {
        padding:
            12px;
    }

    .iqra-branch-quick-links a {
        width:
            calc(50% - 4px);
    }

}





/* IQRA BRANCH FULL IMAGE CANONICAL START */

/*
|--------------------------------------------------------------------------
| আপলোড করা শাখার ছবি সম্পূর্ণ দৃশ্যমান থাকবে।
|--------------------------------------------------------------------------
*/

.iqra-branch-card-pro img {
    max-width: 100% !important;
    max-height: 100% !important;
}


/*
|--------------------------------------------------------------------------
| Known branch image frames
|--------------------------------------------------------------------------
*/

.iqra-branch-card-pro .iqra-branch-photo,
.iqra-branch-card-pro .iqra-branch-photo-frame,
.iqra-branch-card-pro .iqra-branch-image,
.iqra-branch-card-pro .iqra-branch-image-frame,
.iqra-branch-card-pro .iqra-branch-media,
.iqra-branch-card-pro .iqra-branch-cover,
.iqra-branch-card-pro .branch-image,
.iqra-branch-card-pro .branch-photo {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;

    overflow: hidden !important;

    background: #ffffff !important;
}


/*
|--------------------------------------------------------------------------
| Full image - never crop
|--------------------------------------------------------------------------
*/

.iqra-branch-card-pro .iqra-branch-photo img,
.iqra-branch-card-pro .iqra-branch-photo-frame img,
.iqra-branch-card-pro .iqra-branch-image img,
.iqra-branch-card-pro .iqra-branch-image-frame img,
.iqra-branch-card-pro .iqra-branch-media img,
.iqra-branch-card-pro .iqra-branch-cover img,
.iqra-branch-card-pro .branch-image img,
.iqra-branch-card-pro .branch-photo img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    max-width: 100% !important;
    max-height: 100% !important;

    object-fit: contain !important;
    object-position: center center !important;

    background: #ffffff !important;

    transform: none !important;
}


/*
|--------------------------------------------------------------------------
| Never zoom/crop image on card hover
|--------------------------------------------------------------------------
*/

.iqra-branch-card-pro:hover
.iqra-branch-photo img,

.iqra-branch-card-pro:hover
.iqra-branch-photo-frame img,

.iqra-branch-card-pro:hover
.iqra-branch-image img,

.iqra-branch-card-pro:hover
.iqra-branch-image-frame img,

.iqra-branch-card-pro:hover
.iqra-branch-media img,

.iqra-branch-card-pro:hover
.iqra-branch-cover img,

.iqra-branch-card-pro:hover
.branch-image img,

.iqra-branch-card-pro:hover
.branch-photo img {
    transform: none !important;

    object-fit: contain !important;
}


/* IQRA BRANCH FULL IMAGE CANONICAL END */

/* SOURCE: resources/views/frontend/home/sections/admission-cta.blade.php BLOCK 1 */
.iqra-home-admission,
.iqra-home-admission * {
    box-sizing: border-box;
}

.iqra-home-admission {
    position: relative;
    padding: clamp(58px, 7vw, 92px) 0;
    overflow: hidden;
    background: #ffffff;
}

.iqra-home-admission-container {
    width: min(1220px, calc(100% - 40px));
    margin: 0 auto;
}

.iqra-home-admission-card {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: clamp(30px, 5vw, 70px);
    padding: clamp(34px, 5vw, 64px);
    overflow: hidden;
    border: 1px solid rgba(26, 78, 58, .14);
    border-radius: 4px;
    background: #f8f6ef;
}

.iqra-home-admission-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #163f31;
}

.iqra-home-admission-badge {
    position: absolute;
    top: clamp(24px, 3vw, 38px);
    right: clamp(24px, 3vw, 40px);
    font-size: clamp(42px, 6vw, 82px);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.05em;
    color: rgba(22, 63, 49, .07);
    pointer-events: none;
    user-select: none;
}

.iqra-home-admission-content {
    position: relative;
    z-index: 2;
    max-width: 770px;
}

.iqra-home-admission-kicker {
    margin-bottom: 14px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: .08em;
    color: #9b762d;
}

.iqra-home-admission-content h2 {
    max-width: 780px;
    margin: 0;
    font-size: clamp(30px, 4vw, 54px);
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -.025em;
    color: #163f31;
}

.iqra-home-admission-description {
    max-width: 720px;
    margin: 20px 0 0;
    font-size: clamp(15px, 1.4vw, 17px);
    line-height: 1.85;
    color: #59625e;
}

.iqra-home-admission-features {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
}

.iqra-home-admission-feature {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 14px;
    border: 1px solid rgba(22, 63, 49, .14);
    background: rgba(255, 255, 255, .68);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    color: #27483b;
}

.iqra-home-admission-actions {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    min-width: 220px;
}

.iqra-home-admission-primary,
.iqra-home-admission-secondary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 13px 24px;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    transition:
        background-color .22s ease,
        color .22s ease,
        border-color .22s ease,
        transform .22s ease;
}

.iqra-home-admission-primary {
    border: 1px solid #163f31;
    background: #163f31;
    color: #ffffff;
}

.iqra-home-admission-primary:hover {
    border-color: #0e3025;
    background: #0e3025;
    color: #ffffff;
    transform: translateY(-2px);
}

.iqra-home-admission-secondary {
    border: 1px solid rgba(22, 63, 49, .28);
    background: transparent;
    color: #163f31;
}

.iqra-home-admission-secondary:hover {
    border-color: #163f31;
    background: #ffffff;
    color: #163f31;
    transform: translateY(-2px);
}

@media (max-width: 900px) {
    .iqra-home-admission-card {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .iqra-home-admission-actions {
        flex-direction: row;
        min-width: 0;
    }

    .iqra-home-admission-primary,
    .iqra-home-admission-secondary {
        flex: 1;
    }
}

@media (max-width: 640px) {
    .iqra-home-admission {
        padding: 48px 0;
    }

    .iqra-home-admission-container {
        width: min(100% - 28px, 1220px);
    }

    .iqra-home-admission-card {
        padding: 30px 22px;
    }

    .iqra-home-admission-badge {
        top: 20px;
        right: 20px;
    }

    .iqra-home-admission-features {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .iqra-home-admission-feature,
    .iqra-home-admission-primary,
    .iqra-home-admission-secondary {
        width: 100%;
    }

    .iqra-home-admission-actions {
        flex-direction: column;
    }
}

/* SOURCE: resources/views/frontend/home/sections/principal.blade.php BLOCK 1 */
/* ============================================================
   প্রধান শিক্ষক / মুহতামিম
============================================================ */

.iqra-principal-section,
.iqra-principal-section * {
    box-sizing: border-box;
}


.iqra-principal-section {
    position: relative;

    width: 100%;

    padding:
        clamp(75px, 8vw, 115px)
        0;

    overflow: hidden;

    background: #ffffff;
}


.iqra-principal-section::before {
    content: "";

    position: absolute;

    top: -190px;
    left: -180px;

    width: 390px;
    height: 390px;

    border:
        1px solid
        rgba(177,136,50,.10);

    border-radius: 50%;

    pointer-events: none;
}


.iqra-principal-container {
    position: relative;

    z-index: 2;

    display: grid;

    grid-template-columns:
        minmax(320px, .88fr)
        minmax(0, 1.12fr);

    align-items: center;

    gap:
        clamp(45px, 7vw, 90px);

    width:
        min(
            1220px,
            calc(100% - 40px)
        );

    margin:
        0 auto;
}


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

.iqra-principal-media {
    min-width: 0;
}


.iqra-principal-photo-card {
    position: relative;

    max-width: 500px;

    overflow: hidden;

    border:
        1px solid
        #dae3de;

    border-radius:
        22px;

    background:
        #ffffff;

    box-shadow:
        0 22px 65px
        rgba(7,63,50,.07);
}


.iqra-principal-photo-card::before {
    content: "";

    position: absolute;

    z-index: 4;

    top: 0;
    left: 31px;

    width: 74px;
    height: 4px;

    border-radius:
        0
        0
        999px
        999px;

    background:
        #b48a34;
}


.iqra-principal-photo {
    display: flex;

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

    width: 100%;

    aspect-ratio:
        4 / 5;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            #edf4f0,
            #f8f4e9
        );
}


.iqra-principal-photo img {
    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    object-fit: contain;

    object-position:
        center bottom;

    background:
        #f4f6f2;
}


.iqra-principal-placeholder {
    display: flex;

    flex-direction: column;

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

    gap: 11px;

    width: 100%;
    height: 100%;
}


.iqra-principal-placeholder span {
    display: inline-flex;

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

    width: 92px;
    height: 92px;

    border:
        1px solid
        #cadbd2;

    border-radius: 50%;

    background:
        #ffffff;

    color:
        #07503d;

    font-size: 42px;

    font-weight: 900;
}


.iqra-principal-placeholder small {
    color: #7d8c85;

    font-size: 10px;

    font-weight: 800;
}


.iqra-principal-photo-caption {
    display: flex;

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

    gap: 18px;

    min-height: 90px;

    padding:
        17px
        21px;

    border-top:
        1px solid
        #e5ebe8;

    background:
        #ffffff;
}


.iqra-principal-photo-caption strong {
    display: block;

    color:
        #073f32;

    font-size: 15px;

    font-weight: 900;
}


.iqra-principal-photo-caption span:not(
    .iqra-principal-caption-mark
) {
    display: block;

    margin-top: 5px;

    color:
        #7d8b84;

    font-size: 11px;

    font-weight: 700;
}


.iqra-principal-caption-mark {
    display: inline-flex;

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

    flex:
        0 0
        40px;

    width: 40px;
    height: 40px;

    border:
        1px solid
        #dde5e1;

    border-radius:
        50%;

    color:
        #b58b34;

    font-size: 13px;
}


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

.iqra-principal-content {
    min-width: 0;
}


.iqra-principal-top {
    display: flex;

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

    gap: 20px;

    margin-bottom:
        22px;
}


.iqra-principal-kicker {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    color:
        #b18732;

    font-size: 11px;

    font-weight: 900;

    letter-spacing:
        .04em;
}


.iqra-principal-kicker::before {
    content: "";

    width: 34px;
    height: 1px;

    background:
        #b18732;
}


.iqra-principal-number {
    display: inline-flex;

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

    width: 42px;
    height: 30px;

    border:
        1px solid
        #dce5e0;

    border-radius:
        999px;

    color:
        #7d8d85;

    font-size: 9px;

    font-weight: 900;
}


.iqra-principal-heading {
    max-width: 780px;

    margin: 0;

    color:
        #073f32;

    font-size:
        clamp(
            38px,
            4.4vw,
            60px
        );

    line-height:
        1.17;

    font-weight:
        800;

    letter-spacing:
        -.025em;
}


.iqra-principal-message-wrap {
    position: relative;

    margin-top:
        31px;

    padding-left:
        31px;

    border-left:
        2px solid
        #d9b259;
}


.iqra-principal-quote {
    position: absolute;

    top: -16px;
    left: 24px;

    color:
        rgba(181,139,52,.30);

    font-family:
        Georgia,
        serif;

    font-size:
        66px;

    line-height: 1;
}


.iqra-principal-message {
    position: relative;

    z-index: 2;

    margin: 0;

    color:
        #61736b;

    font-size:
        15px;

    line-height:
        2;
}


.iqra-principal-signature {
    display: flex;

    align-items: center;

    gap: 14px;

    margin-top:
        28px;
}


.iqra-principal-signature > span {
    width: 48px;
    height: 1px;

    background:
        #b58b34;
}


.iqra-principal-signature strong {
    display: block;

    color:
        #083f32;

    font-size:
        13px;

    font-weight: 900;
}


.iqra-principal-signature small {
    display: block;

    margin-top: 4px;

    color:
        #839189;

    font-size:
        10px;
}


.iqra-principal-button {
    display: inline-flex;

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

    gap: 40px;

    min-width: 210px;

    min-height: 51px;

    margin-top:
        31px;

    padding:
        10px
        17px;

    border-radius:
        9px;

    background:
        #07503d;

    color:
        #ffffff !important;

    font-size:
        12px;

    font-weight:
        900;

    text-decoration:
        none !important;

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


.iqra-principal-button b {
    color:
        #dfb95d;

    font-size:
        17px;

    font-weight:
        500;
}


.iqra-principal-button:hover {
    transform:
        translateY(-2px);

    background:
        #063e30;
}


.iqra-principal-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 31px;
}

.iqra-principal-actions .iqra-principal-button {
    margin-top: 0;
}

.iqra-principal-button--hadith {
    border: 1px solid #07503d;
    background: #ffffff;
    color: #07503d !important;
}

.iqra-principal-button--hadith b {
    color: #b18732;
}

.iqra-principal-button--hadith:hover {
    background: #f5f8f6;
    color: #07503d !important;
}

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

@media (max-width: 950px) {

    .iqra-principal-container {
        grid-template-columns:
            minmax(270px, .85fr)
            minmax(0, 1.15fr);

        gap:
            40px;
    }


    .iqra-principal-heading {
        font-size:
            clamp(
                32px,
                5vw,
                46px
            );
    }

}


@media (max-width: 760px) {

    .iqra-principal-section {
        padding:
            58px
            0
            66px;
    }


    .iqra-principal-container {
        grid-template-columns:
            1fr;

        width:
            calc(
                100% - 28px
            );

        gap:
            38px;
    }


    .iqra-principal-photo-card {
        width: 100%;
        max-width: 520px;

        margin:
            0 auto;
    }


    .iqra-principal-heading {
        font-size:
            clamp(
                31px,
                9vw,
                43px
            );
    }


    .iqra-principal-message-wrap {
        padding-left:
            21px;
    }


    .iqra-principal-message {
        font-size:
            14px;

        line-height:
            1.9;
    }


    .iqra-principal-button {
        width: 100%;
    }

}

/* SOURCE: resources/views/frontend/home/sections/achievements.blade.php BLOCK 1 */
/* ============================================================
           TRUST SECTION
        ============================================================ */

        .iqra-trust-section,
        .iqra-trust-section * {
            box-sizing: border-box;
        }


        .iqra-trust-section {
            position: relative;

            width: 100%;

            padding:
                clamp(
                    70px,
                    7vw,
                    105px
                )
                0;

            overflow: hidden;

            background: #f7f5ee;
        }


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

        .iqra-trust-header {
            width: 100%;
            max-width: 760px;

            margin:
                0 auto
                clamp(
                    35px,
                    4vw,
                    50px
                );

            text-align: center;
        }


        .iqra-trust-kicker {
            display: inline-flex;

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

            gap: 10px;

            margin-bottom: 12px;

            color: #b28731;

            font-size: 11px;
            font-weight: 900;

            line-height: 1.3;

            letter-spacing: .05em;
        }


        .iqra-trust-kicker::before,
        .iqra-trust-kicker::after {
            content: "";

            width: 26px;
            height: 1px;

            background: #c69a42;
        }


        .iqra-trust-heading {
            margin: 0;

            color: #073f32;

            font-size:
                clamp(
                    38px,
                    4.4vw,
                    58px
                );

            font-weight: 800;

            line-height: 1.08;
        }


        .iqra-trust-description {
            max-width: 650px;

            margin:
                16px auto
                0;

            color: #6c7b75;

            font-size: 14px;

            line-height: 1.8;
        }


        /* ============================================================
           CENTERED FLEX GRID
        ============================================================ */

        .iqra-trust-grid {
            display: flex !important;

            flex-wrap: wrap !important;

            justify-content: center !important;

            align-items: stretch !important;

            gap: 18px !important;

            width: 100%;
        }


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

        .iqra-trust-card {
            --trust-accent: #087255;
            --trust-soft: #edf8f4;
            --trust-border: #cae2da;
            --trust-number: #054c39;

            position: relative;

            display: flex !important;

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

            flex:
                0 1
                calc(
                    25% - 14px
                ) !important;

            width:
                calc(
                    25% - 14px
                ) !important;

            max-width: 290px;
            min-width: 230px;

            min-height: 285px !important;

            padding:
                35px
                24px
                30px !important;

            overflow: hidden;

            border:
                1px solid
                var(--trust-border) !important;

            border-radius: 16px !important;

            background:
                var(--trust-soft) !important;

            box-shadow:
                0
                10px
                30px
                rgba(18, 52, 42, .045);

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


        .iqra-trust-card::before {
            content: "";

            position: absolute;

            top: 0;
            left: 0;

            width: 100%;
            height: 4px;

            background:
                var(--trust-accent);

            transform:
                scaleX(.20);

            transform-origin:
                center;

            transition:
                transform .3s ease;
        }


        .iqra-trust-card:hover {
            transform:
                translateY(-6px);

            border-color:
                var(--trust-accent) !important;

            box-shadow:
                0
                20px
                46px
                rgba(18, 52, 42, .09);
        }


        .iqra-trust-card:hover::before {
            transform:
                scaleX(1);
        }


        /* ============================================================
           COLORS
        ============================================================ */

        .iqra-trust-card-1 {
            --trust-accent: #087255;
            --trust-soft: #edf8f4;
            --trust-border: #cae2da;
            --trust-number: #054c39;
        }


        .iqra-trust-card-2 {
            --trust-accent: #bd861f;
            --trust-soft: #fff7e6;
            --trust-border: #ead4a2;
            --trust-number: #80570d;
        }


        .iqra-trust-card-3 {
            --trust-accent: #367c9d;
            --trust-soft: #edf7fb;
            --trust-border: #c3dce7;
            --trust-number: #285f78;
        }


        .iqra-trust-card-4 {
            --trust-accent: #955e7b;
            --trust-soft: #fbf0f6;
            --trust-border: #e2ccda;
            --trust-number: #704158;
        }


        .iqra-trust-card-5 {
            --trust-accent: #81743a;
            --trust-soft: #faf7e9;
            --trust-border: #ddd5ae;
            --trust-number: #605523;
        }


        .iqra-trust-card-6 {
            --trust-accent: #557565;
            --trust-soft: #eff6f2;
            --trust-border: #ccddd4;
            --trust-number: #3d594b;
        }


        /* ============================================================
           INDEX
        ============================================================ */

        .iqra-trust-card-index {
            position: absolute;

            top: 22px;
            left: 24px;

            display: inline-flex;

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

            min-width: 36px;
            height: 26px;

            padding: 0 9px;

            border:
                1px solid
                var(--trust-border);

            border-radius: 999px;

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

            color:
                var(--trust-accent);

            font-size: 10px !important;

            font-weight: 900 !important;

            line-height: 1;
        }


        /* ============================================================
           DOT
        ============================================================ */

        .iqra-trust-card-dot {
            position: absolute;

            top: 29px;
            right: 26px;

            width: 9px;
            height: 9px;

            border-radius: 50%;

            background:
                var(--trust-accent);

            box-shadow:
                0
                0
                0
                5px
                rgba(255, 255, 255, .72);
        }


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

        .iqra-trust-card-content {
            position: relative;
            z-index: 2;

            display: flex !important;

            flex-direction: column !important;

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

            width: 100%;

            margin-top: 20px;

            text-align: center !important;
        }


        /* ============================================================
           NUMBER + SUFFIX
        ============================================================ */

        .iqra-trust-value {
            display: inline-flex !important;

            align-items: flex-start !important;
            justify-content: center !important;

            gap: 5px !important;

            width: auto !important;

            max-width: 100%;

            margin: 0 auto !important;

            white-space: nowrap;
        }


        /*
        |--------------------------------------------------------------------------
        | MAIN NUMBER
        |--------------------------------------------------------------------------
        */

        .iqra-trust-section
        .iqra-trust-card
        .iqra-trust-value
        .iqra-trust-number {
            display: inline-block !important;

            margin: 0 !important;
            padding: 0 !important;

            color:
                var(--trust-number) !important;

            font-size:
                clamp(
                    64px,
                    5vw,
                    82px
                ) !important;

            font-weight:
                900 !important;

            line-height:
                .88 !important;

            letter-spacing:
                -.055em !important;

            opacity:
                1 !important;

            visibility:
                visible !important;
        }


        /*
        |--------------------------------------------------------------------------
        | BIG BOLD SUFFIX
        |--------------------------------------------------------------------------
        |
        | Examples:
        | 6+
        | 60+
        | 98%
        |
        */

        .iqra-trust-section
        .iqra-trust-card
        .iqra-trust-value
        .iqra-trust-suffix {
            display: inline-block !important;

            flex: 0 0 auto !important;

            margin:
                5px
                0
                0
                3px !important;

            padding: 0 !important;

            color:
                var(--trust-accent) !important;

            font-size:
                clamp(
                    31px,
                    3vw,
                    43px
                ) !important;

            font-weight:
                900 !important;

            line-height:
                .95 !important;

            letter-spacing:
                -.035em !important;

            opacity:
                1 !important;

            visibility:
                visible !important;
        }


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

        .iqra-trust-value-line {
            display: block !important;

            width: 42px;
            height: 3px;

            margin:
                24px
                auto
                17px !important;

            border-radius: 999px;

            background:
                var(--trust-accent);

            transition:
                width .25s ease;
        }


        .iqra-trust-card:hover
        .iqra-trust-value-line {
            width: 66px;
        }


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

        .iqra-trust-section
        .iqra-trust-card
        .iqra-trust-title {
            display: block !important;

            width: 100%;

            margin: 0 !important;

            color:
                var(--trust-number) !important;

            font-size:
                18px !important;

            font-weight:
                800 !important;

            line-height:
                1.45 !important;

            text-align:
                center !important;

            opacity:
                1 !important;
        }


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

        .iqra-trust-decoration {
            position: absolute;

            right: -52px;
            bottom: -60px;

            width: 150px;
            height: 150px;

            border:
                25px solid
                rgba(255, 255, 255, .38);

            border-radius: 50%;

            pointer-events: none;
        }


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

        @media (max-width: 1000px) {

            .iqra-trust-grid {
                max-width: 760px;
            }


            .iqra-trust-card {
                flex:
                    0 1
                    calc(
                        50% - 9px
                    ) !important;

                width:
                    calc(
                        50% - 9px
                    ) !important;

                max-width: 365px;
            }

        }


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

        @media (max-width: 620px) {

            .iqra-trust-section {
                padding:
                    56px
                    0
                    64px;
            }


            .iqra-trust-header {
                margin-bottom: 28px;

                text-align: left;
            }


            .iqra-trust-kicker {
                justify-content: flex-start;
            }


            .iqra-trust-kicker::after {
                display: none;
            }


            .iqra-trust-heading {
                font-size:
                    clamp(
                        34px,
                        10vw,
                        44px
                    );
            }


            .iqra-trust-description {
                margin:
                    14px
                    0
                    0;

                font-size: 13px;

                line-height: 1.75;
            }


            .iqra-trust-grid {
                flex-direction: column !important;

                align-items: center !important;

                gap: 13px !important;
            }


            .iqra-trust-card {
                flex:
                    0 0 auto !important;

                width:
                    100% !important;

                max-width:
                    420px !important;

                min-height:
                    250px !important;
            }


            .iqra-trust-section
            .iqra-trust-card
            .iqra-trust-value
            .iqra-trust-number {
                font-size:
                    68px !important;
            }


            .iqra-trust-section
            .iqra-trust-card
            .iqra-trust-value
            .iqra-trust-suffix {
                margin-top:
                    5px !important;

                font-size:
                    34px !important;
            }


            .iqra-trust-section
            .iqra-trust-card
            .iqra-trust-title {
                font-size:
                    17px !important;
            }

        }


        /* ============================================================
           REDUCED MOTION
        ============================================================ */

        @media (prefers-reduced-motion: reduce) {

            .iqra-trust-card,
            .iqra-trust-card::before,
            .iqra-trust-value-line {
                transition: none !important;
            }

        }

/* SOURCE: resources/views/frontend/home/sections/youtube-videos.blade.php BLOCK 1 */
/* ============================================================
   হোম ভিডিও
============================================================ */

.iqra-home-youtube,
.iqra-home-youtube * {
    box-sizing: border-box;
}


.iqra-home-youtube {
    position: relative;

    width: 100%;

    padding:
        clamp(
            72px,
            8vw,
            110px
        )
        0;

    overflow: hidden;

    background:
        #ffffff;
}


.iqra-home-youtube::before {
    content: "";

    position: absolute;

    right: -180px;
    top: -190px;

    width: 390px;
    height: 390px;

    border:
        1px solid
        rgba(177,136,50,.10);

    border-radius: 50%;

    pointer-events: none;
}


.iqra-home-youtube-container {
    position: relative;

    z-index: 2;

    width:
        min(
            1320px,
            calc(100% - 40px)
        );

    margin:
        0 auto;
}


.iqra-home-youtube-head {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap:
        30px;

    margin-bottom:
        clamp(
            32px,
            4vw,
            48px
        );
}


.iqra-home-youtube-head > div {
    max-width:
        790px;
}


.iqra-home-youtube-kicker {
    display: inline-flex;

    align-items: center;

    gap:
        10px;

    margin-bottom:
        13px;

    color:
        #b38935;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .08em;
}


.iqra-home-youtube-kicker::before {
    content: "";

    width:
        32px;

    height:
        1px;

    background:
        #b38935;
}


.iqra-home-youtube-head h2 {
    margin:
        0;

    color:
        #073f32;

    font-size:
        clamp(
            35px,
            4.5vw,
            58px
        );

    line-height:
        1.12;

    font-weight:
        800;

    letter-spacing:
        -.025em;
}


.iqra-home-youtube-head p {
    max-width:
        720px;

    margin:
        15px
        0
        0;

    color:
        #6d7d76;

    font-size:
        14px;

    line-height:
        1.8;
}


/* ============================================================
   প্রতি সারিতে ৩টি ভিডিও
============================================================ */

.iqra-home-youtube-grid {
    display: grid;

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

    gap:
        16px;
}


.iqra-home-youtube-card {
    position: relative;

    min-width: 0;

    overflow: hidden;

    border:
        1px solid
        #dfe5e1;

    border-radius:
        18px;

    background:
        #ffffff;

    box-shadow:
        0 18px 48px
        rgba(7,63,50,.055);

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


.iqra-home-youtube-card::before {
    content: "";

    position: absolute;

    z-index: 4;

    top: 0;
    left: 24px;

    width: 62px;
    height: 3px;

    border-radius:
        0 0 999px 999px;

    background:
        #b58b34;
}


@media (hover: hover) {

    .iqra-home-youtube-card:hover {
        transform:
            translateY(-5px);

        border-color:
            rgba(7,80,61,.22);

        box-shadow:
            0 25px 60px
            rgba(7,63,50,.09);
    }

}


/* ============================================================
   ভিডিও ফ্রেম
============================================================ */

.iqra-home-youtube-media {
    position: relative;

    width: 100%;

    aspect-ratio:
        16 / 9;

    min-height:
        235px;

    overflow: hidden;

    background:
        #06140f;
}


.iqra-home-youtube-media iframe {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    border: 0;
}


/* ============================================================
   LIGHTWEIGHT YOUTUBE PLAYER
============================================================ */

.iqra-home-youtube-loader {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    border: 0;

    background:
        #06140f;

    cursor: pointer;
}


.iqra-home-youtube-thumb {
    position: absolute;

    inset: 0;

    display: block;

    width: 100%;
    height: 100%;

    background-position:
        center;

    background-repeat:
        no-repeat;

    background-size:
        cover;

    transform:
        scale(1.01);

    transition:
        transform .3s ease;
}


.iqra-home-youtube-overlay {
    position: absolute;

    inset: 0;

    background:
        rgba(0, 20, 14, .28);

    transition:
        background .25s ease;
}


.iqra-home-youtube-play {
    position: absolute;

    z-index: 3;

    top: 50%;
    left: 50%;

    display: flex;

    flex-direction: column;

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

    gap: 8px;

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


.iqra-home-youtube-play b {
    display: inline-flex;

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

    width: 62px;
    height: 62px;

    padding-left:
        4px;

    border:
        1px solid
        rgba(255,255,255,.65);

    border-radius:
        50%;

    background:
        rgba(7,80,61,.92);

    color:
        #ffffff;

    font-size:
        20px;

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

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


.iqra-home-youtube-play small {
    padding:
        5px 9px;

    border-radius:
        999px;

    background:
        rgba(0,0,0,.55);

    color:
        #ffffff;

    font-size:
        9px;

    font-weight:
        900;
}


.iqra-home-youtube-loader:hover
.iqra-home-youtube-thumb {
    transform:
        scale(1.045);
}


.iqra-home-youtube-loader:hover
.iqra-home-youtube-overlay {
    background:
        rgba(0,20,14,.18);
}


.iqra-home-youtube-loader:hover
.iqra-home-youtube-play b {
    transform:
        scale(1.07);

    background:
        #07503d;
}


.iqra-home-youtube-media.is-playing
.iqra-home-youtube-loader {
    display: none;
}


@media (prefers-reduced-motion: reduce) {

    .iqra-home-youtube-thumb,
    .iqra-home-youtube-play b {
        transition:
            none;
    }

}

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

.iqra-home-youtube-copy {
    padding:
        15px
        18px
        16px;
}


.iqra-home-youtube-meta {
    display: flex;

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

    gap:
        15px;

    margin-bottom:
        9px;
}


.iqra-home-youtube-meta span {
    color:
        #b38935;

    font-size:
        8px;

    font-weight:
        900;

    letter-spacing:
        .13em;
}


.iqra-home-youtube-meta small {
    display: inline-flex;

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

    min-width:
        31px;

    height:
        23px;

    padding:
        0 8px;

    border:
        1px solid
        #dde5e1;

    border-radius:
        999px;

    color:
        #84918b;

    font-size:
        8px;

    font-weight:
        900;
}


.iqra-home-youtube-copy h3 {
    margin: 0;

    color:
        #093f32;

    font-size:
        20px;

    line-height:
        1.32;

    font-weight:
        800;
}


.iqra-home-youtube-copy p {
    margin:
        6px 0 0;

    color:
        #74827c;

    font-size:
        12px;

    line-height:
        1.55;
}


.iqra-home-youtube-copy > a {
    display: flex;

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

    gap:
        16px;

    margin-top:
        13px;

    padding-top:
        11px;

    border-top:
        1px solid
        #edf0ee;

    color:
        #07503d;

    font-size:
        11px;

    font-weight:
        900;

    text-decoration:
        none;
}


.iqra-home-youtube-copy > a b {
    display: inline-flex;

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

    width:
        32px;

    height:
        32px;

    border:
        1px solid
        #d8e3dd;

    border-radius:
        50%;

    color:
        #b38832;

    font-size:
        14px;

    transition:
        background .2s ease,
        color .2s ease,
        transform .2s ease;
}


.iqra-home-youtube-card:hover
.iqra-home-youtube-copy > a b {
    transform:
        translateX(2px);

    background:
        #07503d;

    border-color:
        #07503d;

    color:
        #ffffff;
}


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

@media (max-width: 1000px) {

    .iqra-home-youtube-grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );
    }

}


@media (max-width: 650px) {

    .iqra-home-youtube {
        padding:
            58px 0
            65px;
    }


    .iqra-home-youtube-container {
        width:
            calc(
                100% - 28px
            );
    }


    .iqra-home-youtube-head h2 {
        font-size:
            clamp(
                31px,
                9vw,
                42px
            );
    }


    .iqra-home-youtube-grid {
        grid-template-columns:
            1fr;

        gap:
            14px;
    }


    .iqra-home-youtube-media {
        min-height: 0;
    }


    .iqra-home-youtube-copy {
        padding:
            15px;
    }

}

/* SOURCE: resources/views/frontend/home/sections/testimonials.blade.php BLOCK 1 */
/* ============================================================
   PROFESSIONAL মতামত SECTION
============================================================ */

.iqra-testimonials-pro,
.iqra-testimonials-pro * {
    box-sizing: border-box;
}


.iqra-testimonials-pro {
    position: relative;

    width: 100%;

    padding:
        clamp(70px, 8vw, 110px)
        0;

    overflow: hidden;

    background:
        linear-gradient(
            180deg,
            #f8f6ef 0%,
            #f3f0e7 100%
        );
}


.iqra-testimonials-pro::before {
    content: "";

    position: absolute;

    width: 360px;
    height: 360px;

    top: -210px;
    right: -170px;

    border:
        1px solid
        rgba(181,139,49,.10);

    border-radius: 50%;

    pointer-events: none;
}


.iqra-testimonials-container {
    position: relative;
    z-index: 2;

    width:
        min(
            1240px,
            calc(100% - 40px)
        );

    margin:
        0 auto;
}


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

.iqra-testimonials-header {
    width:
        min(
            800px,
            100%
        );

    margin-bottom:
        clamp(34px, 5vw, 52px);
}


.iqra-testimonials-kicker {
    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 13px;

    color: #b58b31;

    font-size: 11px;

    font-weight: 900;

    letter-spacing: .06em;
}


.iqra-testimonials-kicker::before {
    content: "";

    width: 31px;
    height: 1px;

    background: #b58b31;
}


.iqra-testimonials-title {
    margin: 0;

    color: #073f32;

    font-size:
        clamp(
            36px,
            4.5vw,
            60px
        );

    line-height: 1.14;

    font-weight: 800;

    letter-spacing: -.025em;
}


.iqra-testimonials-description {
    max-width: 690px;

    margin:
        16px
        0
        0;

    color: #6b7973;

    font-size: 14px;

    line-height: 1.8;
}


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

.iqra-testimonials-slider {
    position: relative;

    width: 100%;

    overflow: hidden;

    padding:
        6px
        0
        24px;
}


.iqra-testimonials-track {
    display: flex;

    width: max-content;

    will-change: transform;

    animation:
        iqraTestimonialInfinite
        var(--iqra-testimonial-duration)
        linear
        infinite;
}


.iqra-testimonials-group {
    display: flex;

    flex: 0 0 auto;

    gap: 20px;

    padding-right: 20px;
}


@keyframes iqraTestimonialInfinite {

    from {
        transform:
            translate3d(
                0,
                0,
                0
            );
    }

    to {
        transform:
            translate3d(
                -50%,
                0,
                0
            );
    }
}


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

.iqra-testimonial-card {
    position: relative;

    display: flex;

    flex-direction: column;

    flex: 0 0 370px;

    width: 370px;

    min-height: 330px;

    padding:
        27px
        27px
        25px;

    overflow: hidden;

    border:
        1px solid
        #dedfd7;

    border-radius:
        18px;

    background:
        #ffffff;

    box-shadow:
        0 15px 42px
        rgba(7,63,50,.055);

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


.iqra-testimonial-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 27px;

    width: 60px;
    height: 3px;

    border-radius:
        0
        0
        999px
        999px;

    background: #0a6049;
}


.iqra-testimonial-card::after {
    content: "";

    position: absolute;

    right: -75px;
    bottom: -95px;

    width: 200px;
    height: 200px;

    border:
        28px solid
        rgba(181,139,49,.035);

    border-radius: 50%;

    pointer-events: none;
}


.iqra-testimonial-card:hover {
    transform:
        translateY(-5px);

    border-color:
        rgba(7,80,61,.24);

    box-shadow:
        0 23px 55px
        rgba(7,63,50,.09);
}


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

.iqra-testimonial-card-top {
    position: relative;
    z-index: 2;

    display: flex;

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

    gap: 14px;
}


.iqra-testimonial-label {
    color: #b18732;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: .13em;
}


.iqra-testimonial-number {
    display: inline-flex;

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

    min-width: 35px;
    height: 27px;

    padding:
        0
        8px;

    border:
        1px solid
        #dfe6e2;

    border-radius:
        999px;

    color: #7a8a83;

    font-size: 9px;

    font-weight: 900;
}


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

.iqra-testimonial-quote-mark {
    position: relative;
    z-index: 2;

    height: 48px;

    margin-top: 23px;

    color: #d0a84e;

    font-family:
        Georgia,
        serif;

    font-size: 74px;

    line-height: .85;
}


.iqra-testimonial-quote {
    position: relative;
    z-index: 2;

    display:
        -webkit-box;

    min-height:
        calc(1.8em * 4);

    margin:
        8px
        0
        0;

    overflow: hidden;

    color: #29483e;

    font-size: 16px;

    line-height: 1.8;

    font-weight: 500;

    -webkit-box-orient:
        vertical;

    -webkit-line-clamp:
        5;
}


.iqra-testimonial-divider {
    position: relative;
    z-index: 2;

    width: 100%;

    height: 1px;

    margin:
        auto
        0
        20px;

    padding-top: 23px;

    border-bottom:
        1px solid
        #edf0ee;
}


/* ============================================================
   AUTHOR
============================================================ */

.iqra-testimonial-author {
    position: relative;
    z-index: 2;

    display: grid;

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

    align-items: center;

    gap: 13px;
}


.iqra-testimonial-avatar {
    display: flex;

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

    width: 58px;
    height: 58px;

    overflow: hidden;

    border:
        1px solid
        #d7e3dd;

    border-radius: 50%;

    background:
        #edf5f1;

    color:
        #07503d;
}


.iqra-testimonial-avatar img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position:
        center;
}


.iqra-testimonial-avatar span {
    color: #07503d;

    font-size: 23px;

    line-height: 1;

    font-weight: 900;
}


.iqra-testimonial-author-info {
    min-width: 0;
}


.iqra-testimonial-author-info strong {
    display: block;

    overflow: hidden;

    color: #073f32;

    font-size: 14px;

    line-height: 1.4;

    font-weight: 900;

    text-overflow: ellipsis;

    white-space: nowrap;
}


.iqra-testimonial-author-info > span {
    display: block;

    margin-top: 4px;

    overflow: hidden;

    color: #819087;

    font-size: 11px;

    line-height: 1.4;

    text-overflow: ellipsis;

    white-space: nowrap;
}


.iqra-testimonial-author-mark {
    display: inline-flex;

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

    width: 31px;
    height: 31px;

    border:
        1px solid
        #e1e7e3;

    border-radius: 50%;

    color: #b58b31;

    font-size: 11px;

    background: #ffffff;
}


/* ============================================================
   EDGE FADE
============================================================ */

.iqra-testimonials-edge {
    position: absolute;

    z-index: 5;

    top: 0;
    bottom: 0;

    width: 75px;

    pointer-events: none;
}


.iqra-testimonials-edge-left {
    left: 0;

    background:
        linear-gradient(
            90deg,
            #f5f2e9 0%,
            rgba(245,242,233,0) 100%
        );
}


.iqra-testimonials-edge-right {
    right: 0;

    background:
        linear-gradient(
            270deg,
            #f5f2e9 0%,
            rgba(245,242,233,0) 100%
        );
}


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

@media (max-width: 767px) {

    .iqra-testimonials-pro {
        padding:
            58px
            0
            65px;
    }


    .iqra-testimonials-container {
        width:
            calc(
                100% - 28px
            );
    }


    .iqra-testimonials-title {
        font-size:
            clamp(
                31px,
                9vw,
                43px
            );
    }


    .iqra-testimonial-card {
        flex-basis:
            min(
                340px,
                calc(100vw - 52px)
            );

        width:
            min(
                340px,
                calc(100vw - 52px)
            );

        min-height: 310px;

        padding:
            24px
            21px
            22px;
    }


    .iqra-testimonials-group {
        gap: 14px;

        padding-right: 14px;
    }


    .iqra-testimonials-edge {
        width: 32px;
    }


    .iqra-testimonial-quote {
        font-size: 15px;
    }

}


@media (prefers-reduced-motion: reduce) {

    .iqra-testimonials-track {
        animation-duration:
            calc(
                var(--iqra-testimonial-duration) * 2
            );
    }

}

/* SOURCE: resources/views/frontend/home/sections/contact.blade.php BLOCK 1 */
/* ============================================================
   CONTACT AJAX STATUS POPUP
============================================================ */

.iqra-contact-live-alert,
.iqra-contact-live-alert * {
    box-sizing: border-box;
}


.iqra-contact-live-alert[hidden] {
    display: none !important;
}


.iqra-contact-live-alert {
    position: relative;

    display: grid;

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

    align-items: center;

    gap: 12px;

    width: 100%;

    margin-top: 18px;

    padding:
        13px
        14px;

    border:
        1px solid
        #b9ddce;

    border-radius:
        11px;

    background:
        #eef9f4;

    color:
        #07503d;

    box-shadow:
        0 12px 32px
        rgba(7, 80, 61, .08);

    animation:
        iqraContactAlertIn
        .25s ease
        both;
}


.iqra-contact-live-alert.is-error {
    border-color:
        #efc8c8;

    background:
        #fff5f5;

    color:
        #a13e3e;
}


.iqra-contact-live-alert-icon {
    display: inline-flex;

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

    width: 38px;
    height: 38px;

    border-radius: 50%;

    background:
        #07503d;

    color:
        #ffffff;

    font-size:
        16px;

    font-weight:
        900;
}


.iqra-contact-live-alert.is-error
.iqra-contact-live-alert-icon {
    background:
        #a13e3e;
}


.iqra-contact-live-alert-content {
    min-width: 0;
}


.iqra-contact-live-alert-content strong {
    display: block;

    margin: 0;

    color:
        currentColor;

    font-size:
        12px;

    line-height:
        1.4;

    font-weight:
        900;
}


.iqra-contact-live-alert-content span {
    display: block;

    margin-top: 3px;

    color:
        #65766e;

    font-size:
        11px;

    line-height:
        1.55;
}


.iqra-contact-live-alert.is-error
.iqra-contact-live-alert-content span {
    color:
        #8d5b5b;
}


.iqra-contact-live-alert-close {
    display: inline-flex;

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

    width: 32px;
    height: 32px;

    padding: 0;

    border:
        1px solid
        rgba(7, 80, 61, .14);

    border-radius:
        50%;

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

    color:
        currentColor;

    font:
        inherit;

    font-size:
        18px;

    line-height: 1;

    cursor:
        pointer;
}


[data-iqra-contact-form]
button[type="submit"][disabled] {
    opacity: .62;

    cursor:
        wait;
}


@keyframes iqraContactAlertIn {

    from {
        opacity: 0;

        transform:
            translateY(-7px);
    }

    to {
        opacity: 1;

        transform:
            translateY(0);
    }
}


@media (max-width: 600px) {

    .iqra-contact-live-alert {
        grid-template-columns:
            34px
            minmax(0, 1fr)
            30px;

        padding:
            11px;
    }


    .iqra-contact-live-alert-icon {
        width: 34px;
        height: 34px;
    }

}

/* SOURCE: resources/views/frontend/home/sections/locations.blade.php BLOCK 1 */
/* ============================================================
   আমাদের অবস্থান
============================================================ */

.iqra-locations-section,
.iqra-locations-section * {
    box-sizing: border-box;
}

.iqra-locations-section {
    position: relative;
    width: 100%;
    padding: clamp(72px, 8vw, 110px) 0;
    overflow: hidden;
    background: #f7f5ee;
}

.iqra-locations-section::before {
    content: "";
    position: absolute;
    top: -180px;
    right: -160px;
    width: 380px;
    height: 380px;
    border: 1px solid rgba(177, 136, 50, .11);
    border-radius: 50%;
    pointer-events: none;
}

.iqra-locations-container {
    position: relative;
    z-index: 2;
    width: min(1220px, calc(100% - 40px));
    margin: 0 auto;
}


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

.iqra-locations-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: clamp(32px, 4vw, 48px);
}

.iqra-locations-head > div {
    max-width: 760px;
}

.iqra-locations-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 13px;
    color: #b18934;
    font-size: 11px;
    font-weight: 900;
}

.iqra-locations-kicker::before {
    content: "";
    width: 31px;
    height: 1px;
    background: #b18934;
}

.iqra-locations-head h2 {
    margin: 0;
    color: #073f32;
    font-size: clamp(36px, 4.4vw, 58px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -.025em;
}

.iqra-locations-head p {
    max-width: 700px;
    margin: 15px 0 0;
    color: #65766e;
    font-size: 14px;
    line-height: 1.85;
}

.iqra-locations-head-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 55px;
    height: 36px;
    padding: 0 13px;
    border: 1px solid #d8e2dd;
    border-radius: 999px;
    background: #ffffff;
    color: #7b8b84;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .10em;
}


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

.iqra-locations-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
}

.iqra-locations-grid.is-single {
    grid-template-columns: minmax(0, 1fr);
    max-width: 760px;
}


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

.iqra-location-card {
    position: relative;
    min-width: 0;
    overflow: hidden;
    border: 1px solid #d8e1dd;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 20px 55px rgba(7, 63, 50, .055);
}

.iqra-location-card::before {
    content: "";
    position: absolute;
    z-index: 4;
    top: 0;
    left: 28px;
    width: 72px;
    height: 4px;
    border-radius: 0 0 999px 999px;
    background: #b68b34;
}

.iqra-location-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 25px 26px 14px;
}

.iqra-location-card-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.iqra-location-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 41px;
    width: 41px;
    height: 31px;
    border: 1px solid #d8e2dd;
    border-radius: 999px;
    color: #b18832;
    font-size: 9px;
    font-weight: 900;
}

.iqra-location-card-heading > div {
    min-width: 0;
}

.iqra-location-card-heading small {
    display: block;
    margin-bottom: 3px;
    color: #8a9891;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}

.iqra-location-card-heading h3 {
    margin: 0;
    overflow: hidden;
    color: #073f32;
    font-size: clamp(18px, 2vw, 25px);
    line-height: 1.25;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.iqra-location-pin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 37px;
    width: 37px;
    height: 37px;
    border: 1px solid #d9e4df;
    border-radius: 50%;
    color: #07503d;
    font-size: 12px;
}

.iqra-location-address {
    min-height: 43px;
    margin: 0;
    padding: 0 26px 17px;
    color: #718078;
    font-size: 12px;
    line-height: 1.7;
}


/* ============================================================
   MAP
============================================================ */

.iqra-location-map-frame {
    position: relative;
    width: calc(100% - 34px);
    aspect-ratio: 16 / 9;
    margin: 0 17px;
    overflow: hidden;
    border: 1px solid #d9e2de;
    border-radius: 14px;
    background: #edf3ef;
}

.iqra-location-map-frame iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.iqra-location-map-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: 100%;
    height: 100%;
    padding: 25px;
    text-align: center;
}

.iqra-location-map-placeholder > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border: 1px solid #ccdcd4;
    border-radius: 50%;
    background: #ffffff;
    color: #07503d;
    font-size: 23px;
}

.iqra-location-map-placeholder strong {
    color: #0b4939;
    font-size: 14px;
}

.iqra-location-map-placeholder small {
    max-width: 310px;
    color: #7d8b84;
    font-size: 10px;
    line-height: 1.6;
}


/* ============================================================
   পথনির্দেশ বাটন
============================================================ */

.iqra-location-find-road {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    min-height: 74px;
    margin-top: 18px;
    padding: 13px 25px;
    background: #07503d;
    color: #ffffff !important;
    text-decoration: none !important;
    transition:
        background .2s ease,
        padding .2s ease;
}

.iqra-location-find-road:hover {
    background: #063f31;
    padding-left: 29px;
    padding-right: 29px;
}

.iqra-location-find-road span {
    min-width: 0;
}

.iqra-location-find-road small {
    display: block;
    color: #d9b45c;
    font-size: 7px;
    font-weight: 900;
    letter-spacing: .12em;
}

.iqra-location-find-road strong {
    display: block;
    margin-top: 3px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 900;
}

.iqra-location-find-road b {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 50%;
    color: #e1bb60;
    font-size: 17px;
    font-weight: 500;
}


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

@media (max-width: 900px) {

    .iqra-locations-grid {
        grid-template-columns: 1fr;
    }

    .iqra-locations-grid.is-single {
        max-width: none;
    }

}

@media (max-width: 600px) {

    .iqra-locations-section {
        padding: 58px 0 66px;
    }

    .iqra-locations-container {
        width: calc(100% - 28px);
    }

    .iqra-locations-head {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .iqra-locations-head h2 {
        font-size: clamp(31px, 9vw, 43px);
    }

    .iqra-location-card {
        border-radius: 16px;
    }

    .iqra-location-card-head {
        padding: 22px 18px 13px;
    }

    .iqra-location-address {
        padding:
            0
            18px
            15px;
    }

    .iqra-location-map-frame {
        width: calc(100% - 24px);
        margin: 0 12px;
        aspect-ratio: 4 / 3;
    }

    .iqra-location-find-road {
        min-height: 67px;
        padding:
            11px
            18px;
    }

}



/* ==========================================================
   IQRA YOUTUBE THUMBNAIL VISIBILITY FIX START
   Keep thumbnail visible while preserving click-to-load.
========================================================== */

.iqra-home-youtube-media {
    position: relative;
    overflow: hidden;
}

.iqra-home-youtube-loader {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-height: inherit;
    overflow: hidden;
    isolation: isolate;
    background: #071d17;
}

.iqra-home-youtube-thumb {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    z-index: 1 !important;

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

    opacity: 1 !important;
    visibility: visible !important;

    pointer-events: none !important;
}

.iqra-home-youtube-overlay {
    position: absolute !important;
    inset: 0 !important;

    z-index: 2 !important;

    background:
        linear-gradient(
            180deg,
            rgba(2, 20, 15, .08) 0%,
            rgba(2, 20, 15, .20) 55%,
            rgba(2, 20, 15, .32) 100%
        ) !important;

    opacity: 1 !important;

    pointer-events: none !important;
}

.iqra-home-youtube-play {
    position: absolute !important;

    z-index: 3 !important;

    pointer-events: none !important;
}

.iqra-home-youtube-media.is-playing
.iqra-home-youtube-loader {
    display: none !important;
}

.iqra-home-youtube-media iframe {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    border: 0;
}

/* IQRA YOUTUBE THUMBNAIL VISIBILITY FIX END */



/* IQRA YOUTUBE SERVER THUMB IMAGE START */

.iqra-home-youtube-thumb-image {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;
    object-position: center center !important;

    opacity: 1 !important;
    visibility: visible !important;
}

/* IQRA YOUTUBE SERVER THUMB IMAGE END */



/* ==========================================================
   IQRA YOUTUBE THUMBNAIL HARD STACK FIX START
========================================================== */

.iqra-home-youtube-media {
    position: relative !important;
    overflow: hidden !important;
    background: #06140f !important;
}

.iqra-home-youtube-loader {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    padding: 0 !important;
    margin: 0 !important;

    overflow: hidden !important;

    border: 0 !important;

    background: transparent !important;

    isolation: isolate !important;
}

.iqra-home-youtube-thumb {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    z-index: 10 !important;

    overflow: hidden !important;

    background: transparent !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;
}

.iqra-home-youtube-thumb-image {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-width: 100% !important;
    min-height: 100% !important;

    max-width: none !important;

    z-index: 11 !important;

    object-fit: cover !important;
    object-position: center center !important;

    opacity: 1 !important;
    visibility: visible !important;

    transform: none !important;

    pointer-events: none !important;
}

.iqra-home-youtube-overlay {
    position: absolute !important;
    inset: 0 !important;

    z-index: 20 !important;

    background:
        rgba(0, 20, 14, .18) !important;

    opacity: 1 !important;

    pointer-events: none !important;
}

.iqra-home-youtube-play {
    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    z-index: 30 !important;

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

    pointer-events: none !important;
}

.iqra-home-youtube-media.is-playing
.iqra-home-youtube-loader {
    display: none !important;
}

/* IQRA YOUTUBE THUMBNAIL HARD STACK FIX END */



/* ==========================================================
   IQRA YOUTUBE INLINE THUMBNAIL FINAL START
========================================================== */

.iqra-home-youtube-media {
    position: relative !important;
    overflow: hidden !important;
    background: #06140f !important;
}

.iqra-home-youtube-loader {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: 0 !important;

    background-color: #06140f !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;

    cursor: pointer !important;

    overflow: hidden !important;
}

.iqra-home-youtube-thumb {
    display: none !important;
}

.iqra-home-youtube-thumb-image {
    display: none !important;
}

.iqra-home-youtube-overlay {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    z-index: 2 !important;

    background:
        linear-gradient(
            180deg,
            rgba(0, 20, 14, .05) 0%,
            rgba(0, 20, 14, .12) 55%,
            rgba(0, 20, 14, .24) 100%
        ) !important;

    pointer-events: none !important;
}

.iqra-home-youtube-play {
    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    z-index: 3 !important;

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

    pointer-events: none !important;
}

.iqra-home-youtube-media.is-playing
.iqra-home-youtube-loader {
    display: none !important;
}

.iqra-home-youtube-media iframe {
    position: absolute !important;
    inset: 0 !important;

    display: block !important;

    width: 100% !important;
    height: 100% !important;

    border: 0 !important;
}

/* IQRA YOUTUBE INLINE THUMBNAIL FINAL END */