/* PakHerbal Homepage CSS Bundle */
/* Source order is intentionally identical to frontend/home/home.blade.php. */
/* No minification or source-rule removal is performed here. */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/homepage-promotion.css
   ========================================================= */
.pakherbal-homepage-promotion {
    width: 100%;
}

.pakherbal-homepage-promotion__desktop {
    display: none;
}

.pakherbal-homepage-promotion__mobile {
    display: none;
}


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

@media (max-width: 991px) {

    .pakherbal-homepage-promotion__mobile {
        display: block;
        width: 100%;
        padding: 5px 8px;
        background: #071827;
    }


    /* =====================================================
       COMPLETE CLICKABLE BUTTON
       ===================================================== */

    .pakherbal-homepage-promotion__link {
        position: relative;

        display: flex;
        align-items: center;

        width: 100%;
        height: 50px;

        gap: 7px;

        padding: 3px 6px 3px 4px;

        overflow: hidden;

        color: #ffffff;
        text-decoration: none;

        background:
            linear-gradient(
                180deg,
                rgba(255, 255, 255, .14) 0%,
                rgba(255, 255, 255, .04) 30%,
                transparent 45%
            ),
            linear-gradient(
                110deg,
                #07562f 0%,
                #08783d 48%,
                #07532e 100%
            );

        border: 1px solid #d8ad38;
        border-radius: 5px;

        box-shadow:
            inset 0 2px 0 rgba(255, 255, 255, .20),
            inset 0 -3px 5px rgba(0, 33, 17, .32),
            0 3px 0 #8b6c19,
            0 6px 10px rgba(0, 0, 0, .28);

        transform: translateY(-1px);

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


    .pakherbal-homepage-promotion__link::before {
        position: absolute;

        content: "";

        top: 2px;
        left: 12%;
        right: 12%;

        height: 1px;

        border-radius: 4px;

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

        pointer-events: none;
    }


    .pakherbal-homepage-promotion__link::after {
        position: absolute;

        content: "";

        top: -35px;
        right: 10%;

        width: 125px;
        height: 80px;

        border-radius: 50%;

        background: rgba(137, 228, 81, .10);

        pointer-events: none;
    }


    /* =====================================================
       PRACTITIONER SVG
       ===================================================== */

    .pakherbal-homepage-promotion__practitioner {
        position: relative;
        z-index: 1;

        display: block;

        flex: 0 0 42px;

        width: 42px;
        height: 42px;

        overflow: hidden;

        border-radius: 50%;

        box-shadow:
            0 0 0 1px rgba(255, 235, 145, .40),
            0 2px 4px rgba(0, 0, 0, .28);
    }

    .pakherbal-homepage-promotion__practitioner svg {
        display: block;

        width: 100%;
        height: 100%;
    }


    /* =====================================================
       VERIFIED
       ===================================================== */

    .pakherbal-homepage-promotion__verified {
        position: relative;
        z-index: 1;

        display: inline-flex;
        align-items: center;

        flex: 0 0 auto;

        gap: 3px;

        padding: 3px 6px;

        color: #f1ffdf;

        background:
            linear-gradient(
                180deg,
                rgba(45, 123, 60, .90),
                rgba(5, 58, 28, .88)
            );

        border: 1px solid rgba(199, 230, 116, .70);

        border-radius: 4px;

        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .16),
            0 1px 2px rgba(0, 0, 0, .18);

        font-family: Arial, sans-serif;

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

        line-height: 1;

        white-space: nowrap;
    }

    .pakherbal-homepage-promotion__verified > span {
        color: #b3ef68;

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

        line-height: 1;
    }


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

    .pakherbal-homepage-promotion__title {
        position: relative;
        z-index: 1;

        flex: 0 1 auto;

        min-width: 0;

        color: #ffffff;

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

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

        line-height: 1;

        letter-spacing: -.015em;

        text-shadow:
            0 1px 1px rgba(0, 0, 0, .40),
            0 2px 3px rgba(0, 0, 0, .20);

        white-space: nowrap;
    }


    /* =====================================================
       NEARBY TAG
       ===================================================== */

    .pakherbal-homepage-promotion__nearby {
        position: relative;
        z-index: 1;

        display: inline-flex;
        align-items: center;

        flex: 0 0 auto;

        gap: 4px;

        margin-left: auto;

        padding: 5px 8px;

        color: #fff7d0;

        background:
            linear-gradient(
                180deg,
                rgba(17, 92, 49, .80),
                rgba(5, 53, 28, .88)
            );

        border: 1px solid rgba(226, 191, 67, .58);

        border-radius: 4px;

        box-shadow:
            inset 0 1px 0 rgba(255, 255, 255, .12),
            0 1px 2px rgba(0, 0, 0, .18);

        font-family: Arial, sans-serif;

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

        line-height: 1;

        white-space: nowrap;
    }


    .pakherbal-homepage-promotion__nearby svg {
        display: block;

        width: 14px;
        height: 14px;

        fill: #e7c64c;
    }

    .pakherbal-homepage-promotion__nearby svg circle {
        fill: #0d6234;
    }


    /* =====================================================
       MODERN ARROW
       ===================================================== */

    .pakherbal-homepage-promotion__arrow {
        position: relative;
        z-index: 1;

        display: grid;
        place-items: center;

        flex: 0 0 32px;

        width: 32px;
        height: 32px;

        margin-left: 1px;

        color: #ffffff;

        background:
            linear-gradient(
                145deg,
                #a9ec59 0%,
                #59b73a 42%,
                #087039 100%
            );

        border: 1.5px solid #eed05d;

        border-radius: 4px;

        box-shadow:
            inset 0 1px 1px rgba(255, 255, 255, .58),
            inset 0 -2px 3px rgba(0, 48, 23, .35),
            0 2px 4px rgba(0, 0, 0, .30);

        transition:
            transform .18s ease,
            filter .18s ease;
    }


    .pakherbal-homepage-promotion__arrow svg {
        display: block;

        width: 16px;
        height: 16px;

        fill: none;

        stroke: currentColor;
        stroke-width: 2.2;

        stroke-linecap: round;
        stroke-linejoin: round;
    }


    /* =====================================================
       INTERACTIONS
       ===================================================== */

    .pakherbal-homepage-promotion__link:hover {
        filter: brightness(1.04);

        transform: translateY(-2px);

        box-shadow:
            inset 0 2px 0 rgba(255, 255, 255, .23),
            inset 0 -3px 5px rgba(0, 33, 17, .30),
            0 4px 0 #8b6c19,
            0 8px 13px rgba(0, 0, 0, .30);
    }


    .pakherbal-homepage-promotion__link:hover
    .pakherbal-homepage-promotion__arrow {
        transform: translateX(2px) scale(1.04);
    }


    .pakherbal-homepage-promotion__link:active {
        transform: translateY(1px);

        box-shadow:
            inset 0 2px 4px rgba(0, 30, 15, .26),
            0 1px 0 #8b6c19,
            0 3px 5px rgba(0, 0, 0, .20);
    }


    .pakherbal-homepage-promotion__link:focus-visible {
        outline: 2px solid #79c943;
        outline-offset: 2px;
    }
}


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

@media (max-width: 767px) {

    .pakherbal-homepage-promotion__mobile {
        padding: 5px 6px;
    }

    .pakherbal-homepage-promotion__link {
        height: 50px;

        gap: 6px;

        padding:
            3px
            6px
            3px
            4px;
    }

    .pakherbal-homepage-promotion__practitioner {
        flex-basis: 42px;

        width: 42px;
        height: 42px;
    }

    .pakherbal-homepage-promotion__title {
        font-size: 22px;
    }

    .pakherbal-homepage-promotion__nearby {
        gap: 4px;

        padding: 5px 6px;

        font-size: 12px;
    }

    .pakherbal-homepage-promotion__nearby svg {
        width: 14px;
        height: 14px;
    }

    .pakherbal-homepage-promotion__arrow {
        flex-basis: 32px;

        width: 32px;
        height: 32px;
    }
}


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

@media (max-width: 410px) {

    .pakherbal-homepage-promotion__mobile {
        padding: 4px 6px;
    }


    .pakherbal-homepage-promotion__link {
        height: 48px;

        gap: 4px;

        padding:
            3px
            5px
            3px
            4px;
    }


    .pakherbal-homepage-promotion__practitioner {
        flex-basis: 40px;

        width: 40px;
        height: 40px;
    }


    .pakherbal-homepage-promotion__verified {
        gap: 2px;

        padding: 2px 4px;

        font-size: 8.5px;
    }


    .pakherbal-homepage-promotion__verified > span {
        font-size: 9px;
    }


    .pakherbal-homepage-promotion__title {
        font-size: 19px;
    }


    .pakherbal-homepage-promotion__nearby {
        gap: 3px;

        padding: 4px 6px;

        font-size: 10px;
    }


    .pakherbal-homepage-promotion__nearby svg {
        width: 12px;
        height: 12px;
    }


    .pakherbal-homepage-promotion__arrow {
        flex-basis: 29px;

        width: 29px;
        height: 29px;
    }


    .pakherbal-homepage-promotion__arrow svg {
        width: 14px;
        height: 14px;
    }
}


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

@media (max-width: 360px) {

    .pakherbal-homepage-promotion__link {
        gap: 3px;
    }


    .pakherbal-homepage-promotion__practitioner {
        flex-basis: 38px;

        width: 38px;
        height: 38px;
    }


    .pakherbal-homepage-promotion__verified {
        padding: 2px 3px;

        font-size: 8px;
    }


    .pakherbal-homepage-promotion__title {
        font-size: 17px;
    }


    .pakherbal-homepage-promotion__nearby {
        gap: 2px;

        padding: 3px 5px;

        font-size: 9px;
    }


    .pakherbal-homepage-promotion__nearby svg {
        width: 11px;
        height: 11px;
    }


    .pakherbal-homepage-promotion__arrow {
        flex-basis: 27px;

        width: 27px;
        height: 27px;
    }


    .pakherbal-homepage-promotion__arrow svg {
        width: 13px;
        height: 13px;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/homepage-promotion.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/hero.css
   ========================================================= */
/* =========================================================
   PakHerbal Direct Promotional Hero
   File: public/css/frontend/home/hero.css
   ========================================================= */

.pakherbal-direct-hero,
.pakherbal-direct-hero *,
.pakherbal-direct-hero *::before,
.pakherbal-direct-hero *::after {
    box-sizing: border-box;
}

.pakherbal-direct-hero {
    --direct-hero-green: var(
        --pakherbal-theme-primary,
        #79c943
    );
    --direct-hero-text: #17212b;
    --direct-hero-background: #eef2e9;

    position: relative;
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    background: var(--direct-hero-background);
    outline: none;
}

/* =========================================================
   Slider
   ========================================================= */

.pakherbal-direct-hero__slider {
    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.pakherbal-direct-hero__slides {
    position: relative;
    width: 100%;
}

.pakherbal-direct-hero__slide {
    position: relative;
    isolation: isolate;
    width: 100%;
    min-height: 430px;
    overflow: hidden;
}

.pakherbal-direct-hero__slide::before {
    position: absolute;
    z-index: -2;
    inset: 0;
    content: "";
    pointer-events: none;
}

.pakherbal-direct-hero__slide::after {
    position: absolute;
    z-index: 1;
    right: 0;
    bottom: 0;
    left: 0;
    height: 235px;
    content: "";
    pointer-events: none;
}

/* =========================================================
   Green Slide
   ========================================================= */

.pakherbal-direct-hero__slide--green {
    background:
        radial-gradient(
            circle at 80% 19%,
            rgba(121, 201, 67, 0.27),
            transparent 27%
        ),
        linear-gradient(
            108deg,
            #061826 0%,
            #123f32 56%,
            #32784d 100%
        );
}

.pakherbal-direct-hero__slide--green::before {
    background:
        radial-gradient(
            circle at 89% 57%,
            rgba(255, 255, 255, 0.1),
            transparent 29%
        );
}

.pakherbal-direct-hero__slide--green::after {
    background:
        linear-gradient(
            180deg,
            rgba(50, 120, 77, 0) 0%,
            rgba(74, 139, 90, 0.28) 38%,
            rgba(159, 194, 151, 0.7) 72%,
            #dbe8d6 100%
        );
}

/* =========================================================
   Gold Slide
   ========================================================= */

.pakherbal-direct-hero__slide--gold {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(255, 255, 255, 0.38),
            transparent 27%
        ),
        linear-gradient(
            108deg,
            #f4e6b8 0%,
            #ddb45f 55%,
            #b98538 100%
        );
}

.pakherbal-direct-hero__slide--gold::before {
    background:
        radial-gradient(
            circle at 84% 61%,
            rgba(50, 88, 48, 0.17),
            transparent 28%
        );
}

.pakherbal-direct-hero__slide--gold::after {
    background:
        linear-gradient(
            180deg,
            rgba(221, 180, 95, 0) 0%,
            rgba(225, 190, 111, 0.33) 38%,
            rgba(235, 211, 153, 0.75) 72%,
            #f0e4c2 100%
        );
}

/* =========================================================
   Plum Slide
   ========================================================= */

.pakherbal-direct-hero__slide--plum {
    background:
        radial-gradient(
            circle at 80% 20%,
            rgba(255, 255, 255, 0.14),
            transparent 27%
        ),
        linear-gradient(
            108deg,
            #572370 0%,
            #9137ba 54%,
            #be64e8 100%
        );
}

.pakherbal-direct-hero__slide--plum::before {
    background:
        radial-gradient(
            circle at 87% 62%,
            rgba(121, 201, 67, 0.2),
            transparent 27%
        );
}

.pakherbal-direct-hero__slide--plum::after {
    background:
        linear-gradient(
            180deg,
            rgba(145, 55, 186, 0) 0%,
            rgba(164, 89, 199, 0.34) 38%,
            rgba(205, 164, 222, 0.75) 72%,
            #e3d1eb 100%
        );
}

/* =========================================================
   Slide Layout
   ========================================================= */

.pakherbal-direct-hero__slide-inner {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(300px, 0.86fr);
    align-items: center;
    gap: 38px;
    width: min(100%, 1320px);
    min-height: 430px;
    margin: 0 auto;
    padding: 34px 64px 130px;
}

/* =========================================================
   Desktop Heading
   ========================================================= */

.pakherbal-direct-hero__content {
    position: relative;
    z-index: 3;
    display: grid;
    align-content: center;
    width: min(100%, 590px);
    min-width: 0;
    transform: translateY(-40px);
}

.pakherbal-direct-hero__title {
    display: grid;
    gap: 1px;
    max-width: 590px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(31px, 3.25vw, 45px);
    font-weight: 900;
    line-height: 1.04;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}

.pakherbal-direct-hero__title span {
    display: block;
}

.pakherbal-direct-hero__slide--gold
.pakherbal-direct-hero__title {
    color: #17231c;
}

/* =========================================================
   Product Visual
   ========================================================= */

.pakherbal-direct-hero__visual {
    position: relative;
    align-self: stretch;
    min-width: 0;
    min-height: 260px;
}

.pakherbal-direct-hero__image {
    position: absolute;
    display: block;
    max-width: none;
    object-fit: contain;
    object-position: right bottom;
}

/*
 * Desktop artwork positions.
 * Each uploaded image has different transparent padding, so each slide
 * receives one deliberate size and position without moving the cards.
 */
@media (min-width: 901px) {
    .pakherbal-direct-hero__image {
        top: -88px;
        right: 96px;
        bottom: auto;
        width: 130%;
        height: 300px;
        object-position: right top;
    }

    .pakherbal-direct-hero__slide--herbal-care
    .pakherbal-direct-hero__image {
        top: -108px;
        right: 94px;
        width: 134%;
        height: 310px;
    }

    .pakherbal-direct-hero__slide--herbal-oils
    .pakherbal-direct-hero__image {
        top: -62px;
        right: 98px;
        width: 130%;
        height: 300px;
    }

    .pakherbal-direct-hero__slide--hakeem-online
    .pakherbal-direct-hero__image {
        top: -58px;
        right: 102px;
        width: 128%;
        height: 300px;
    }
}

.pakherbal-direct-hero__packshot {
    position: absolute;
    right: 8px;
    bottom: 12px;
    width: min(100%, 455px);
    height: 245px;
    transform: scale(0.92);
    transform-origin: right bottom;
}

.pakherbal-direct-hero__shadow {
    position: absolute;
    right: 25px;
    bottom: 4px;
    width: 320px;
    height: 42px;
    background: rgba(3, 18, 22, 0.24);
    border-radius: 50%;
    filter: blur(17px);
}

.pakherbal-direct-hero__bottle {
    position: absolute;
    bottom: 25px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.96),
            rgba(218, 232, 209, 0.84)
        );
    border: 1px solid rgba(255, 255, 255, 0.44);
    box-shadow:
        0 25px 38px rgba(8, 25, 28, 0.2);
}

.pakherbal-direct-hero__bottle::before {
    position: absolute;
    top: -31px;
    left: 50%;
    width: 54%;
    height: 36px;
    content: "";
    background: #173f30;
    border-radius: 9px 9px 4px 4px;
    transform: translateX(-50%);
}

.pakherbal-direct-hero__bottle::after {
    position: absolute;
    top: 43%;
    left: 12%;
    width: 76%;
    height: 27%;
    content: "";
    background: rgba(121, 201, 67, 0.3);
    border-radius: 9px;
}

.pakherbal-direct-hero__bottle--large {
    right: 76px;
    width: 154px;
    height: 194px;
    border-radius: 24px 24px 30px 30px;
}

.pakherbal-direct-hero__bottle--small {
    right: 240px;
    width: 106px;
    height: 146px;
    border-radius: 20px 20px 27px 27px;
}

.pakherbal-direct-hero__jar {
    position: absolute;
    right: 0;
    bottom: 25px;
    width: 118px;
    height: 102px;
    background:
        linear-gradient(
            145deg,
            #f6e9bd,
            #d3a952
        );
    border-radius: 18px 18px 26px 26px;
    box-shadow:
        0 23px 36px rgba(8, 25, 28, 0.19);
}

.pakherbal-direct-hero__jar::before {
    position: absolute;
    top: -17px;
    left: -4px;
    width: calc(100% + 8px);
    height: 22px;
    content: "";
    background: #213c2d;
    border-radius: 7px;
}

.pakherbal-direct-hero__leaf {
    position: absolute;
    z-index: -1;
    width: 106px;
    height: 50px;
    background: rgba(121, 201, 67, 0.72);
    border-radius: 100% 0 100% 0;
}

.pakherbal-direct-hero__leaf--one {
    top: 28px;
    right: 48px;
    transform: rotate(-22deg);
}

.pakherbal-direct-hero__leaf--two {
    top: 64px;
    right: 234px;
    width: 92px;
    height: 44px;
    background: rgba(41, 101, 65, 0.74);
    transform: rotate(28deg);
}

/* =========================================================
   Slider Arrows
   ========================================================= */

.pakherbal-direct-hero__arrow {
    position: absolute;
    top: 31%;
    z-index: 20;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 47px;
    height: 47px;
    padding: 0;
    color: #ffffff;
    background: transparent;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    transform: translateY(-50%);
    backdrop-filter: none;
    transition:
        background-color 160ms ease,
        transform 160ms ease;
}

.pakherbal-direct-hero__arrow:hover {
    background: transparent;
    transform: translateY(-50%) scale(1.04);
}

.pakherbal-direct-hero__arrow:focus-visible {
    outline: 3px solid #ffffff;
    outline-offset: 3px;
}

.pakherbal-direct-hero__arrow--previous {
    left: 20px;
}

.pakherbal-direct-hero__arrow--next {
    right: 20px;
}

/* =========================================================
   Cards — Desktop Position Locked
   ========================================================= */

.pakherbal-direct-hero__cards-layer {
    position: relative;
    z-index: 10;
    margin-top: -225px;
    padding: 0 20px 30px;
}

.pakherbal-direct-hero__cards {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    gap: 20px;
    width: min(100%, 1320px);
    margin: 0 auto;
}

.pakherbal-direct-hero__card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 19px;
    background: #ffffff;
    border: 1px solid rgba(15, 34, 45, 0.08);
    border-radius: 0;
    box-shadow:
        0 18px 38px rgba(8, 27, 38, 0.13);
}

.pakherbal-direct-hero__card-title {
    min-height: 44px;
    margin: 0 0 13px;
    color: var(--direct-hero-text);
    font-size: 18px;
    font-weight: 900;
    line-height: 1.28;
    overflow-wrap: anywhere;
}

.pakherbal-direct-hero__card-grid {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.pakherbal-direct-hero__card-grid--stacked {
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.pakherbal-direct-hero__card-grid--stacked .pakherbal-direct-hero__card-item {
    gap: 5px;
}

.pakherbal-direct-hero__card-grid--stacked .pakherbal-direct-hero__card-image {
    min-height: 104px;
}

.pakherbal-direct-hero__card-grid--stacked .pakherbal-direct-hero__card-image img {
    object-fit: contain;
    background: #eef6e9;
}

.pakherbal-direct-hero__card-grid--stacked
.pakherbal-direct-hero__card-image--full-bleed img {
    object-fit: cover;
    background: transparent;
}

.pakherbal-direct-hero__card-item {
    display: grid;
    align-content: start;
    gap: 7px;
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.pakherbal-direct-hero__card-image {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 104px;
    padding: 8px;
    border-radius: 0;
    overflow: hidden;
    transition: transform 160ms ease;
}

.pakherbal-direct-hero__card-item:hover
.pakherbal-direct-hero__card-image {
    transform: translateY(-2px);
}

.pakherbal-direct-hero__card-image span {
    color: #173024;
    font-size: 14px;
    font-weight: 900;
    line-height: 1.2;
    text-align: center;
}

.pakherbal-direct-hero__card-image img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.pakherbal-direct-hero__card-image--green {
    background:
        linear-gradient(
            145deg,
            #d7ebca,
            #8fbd70
        );
}

.pakherbal-direct-hero__card-image--mint {
    background:
        linear-gradient(
            145deg,
            #d5f0e6,
            #82c6ad
        );
}

.pakherbal-direct-hero__card-image--gold {
    background:
        linear-gradient(
            145deg,
            #f6e9b9,
            #d7ac54
        );
}

.pakherbal-direct-hero__card-image--peach {
    background:
        linear-gradient(
            145deg,
            #f7ddc8,
            #eaa47c
        );
}

.pakherbal-direct-hero__card-label {
    color: #2c3944;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.pakherbal-direct-hero__card-link {
    display: inline-flex;
    width: fit-content;
    margin-top: auto;
    padding-top: 17px;
    color: #08708f;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.35;
    text-decoration: none;
}

.pakherbal-direct-hero__card-link:hover {
    color: #07576f;
    text-decoration: underline;
}

/* =========================================================
   Medium Desktop
   ========================================================= */

@media (max-width: 1199px) {
    .pakherbal-direct-hero__slide-inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(270px, 0.8fr);
        padding-right: 42px;
        padding-left: 42px;
    }

    .pakherbal-direct-hero__cards {
        gap: 14px;
    }

    .pakherbal-direct-hero__card {
        padding: 16px;
    }

    .pakherbal-direct-hero__card-image {
        min-height: 91px;
    }
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 900px) {
    .pakherbal-direct-hero__slide {
        min-height: 500px;
    }

    .pakherbal-direct-hero__slide-inner {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(210px, 0.68fr);
        min-height: 500px;
        padding: 30px 28px 160px;
    }

    .pakherbal-direct-hero__content {
        transform: translateY(-30px);
    }

    .pakherbal-direct-hero__title {
        font-size: clamp(29px, 4.7vw, 40px);
    }

    .pakherbal-direct-hero__image {
        right: -30px;
        bottom: 62px;
        width: 120%;
        height: 308px;
    }

    .pakherbal-direct-hero__slide--herbal-care
    .pakherbal-direct-hero__image {
        right: -46px;
        width: 128%;
        height: 310px;
    }

    .pakherbal-direct-hero__slide--herbal-oils
    .pakherbal-direct-hero__image {
        right: -30px;
        bottom: 56px;
        width: 121%;
        height: 320px;
    }

    .pakherbal-direct-hero__slide--hakeem-online
    .pakherbal-direct-hero__image {
        right: -40px;
        bottom: 58px;
        width: 126%;
        height: 320px;
    }

    .pakherbal-direct-hero__packshot {
        right: -12px;
        bottom: 24px;
        transform: scale(0.75);
        transform-origin: right bottom;
    }

    .pakherbal-direct-hero__arrow {
        top: 30%;
    }

    .pakherbal-direct-hero__cards-layer {
        margin-top: -245px;
        padding-right: 14px;
        padding-left: 14px;
    }

    .pakherbal-direct-hero__cards {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 14px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-direct-hero__slide {
        min-height: 550px;
    }

    .pakherbal-direct-hero__slide::after {
        height: 245px;
    }

    .pakherbal-direct-hero__slide-inner {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows:
            auto
            minmax(205px, 1fr);
        align-content: start;
        gap: 0;
        min-height: 550px;
        padding: 22px 46px 210px;
    }

    /*
     * Mobile heading centered.
     */

    .pakherbal-direct-hero__content {
        justify-items: center;
        width: 100%;
        text-align: center;
        transform: none;
    }

    .pakherbal-direct-hero__title {
        max-width: 100%;
        font-size: clamp(25px, 6.9vw, 32px);
        line-height: 1.06;
        letter-spacing: -0.023em;
        text-align: center;
    }

    /*
     * Mobile product visual placed between the arrows.
     */

    .pakherbal-direct-hero__visual {
        display: none;
    }

    .pakherbal-direct-hero__packshot {
        right: 50%;
        bottom: 54px;
        width: 420px;
        height: 225px;
        transform:
            translateX(50%)
            scale(0.54);
        transform-origin: center bottom;
    }

    /*
     * Mobile arrows aligned with the heading.
     */

    .pakherbal-direct-hero__arrow {
        top: 10.5%;
        width: 40px;
        height: 40px;
        background: transparent;
        border: 0;
        border-radius: 0;
        backdrop-filter: none;
    }

    .pakherbal-direct-hero__arrow:hover {
        background: transparent;
        transform: translateY(-50%);
    }

    .pakherbal-direct-hero__arrow--previous {
        left: 8px;
    }

    .pakherbal-direct-hero__arrow--next {
        right: 8px;
    }

    /*
     * Cards moved upward after removing the mobile artwork.
     */

    .pakherbal-direct-hero__cards-layer {
        margin-top: -400px;
        padding: 0 10px 24px;
    }

    .pakherbal-direct-hero__cards {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .pakherbal-direct-hero__card {
        padding: 12px;
        border-radius: 0;
    }

    .pakherbal-direct-hero__card-title {
        min-height: 34px;
        margin-bottom: 9px;
        font-size: 14px;
        line-height: 1.22;
    }

    .pakherbal-direct-hero__card-grid {
        gap: 8px;
    }

    .pakherbal-direct-hero__card-image {
        min-height: 76px;
        padding: 5px;
        border-radius: 0;
    }

    .pakherbal-direct-hero__card-image span {
        font-size: 11px;
    }

    .pakherbal-direct-hero__card-label {
        font-size: 10px;
        line-height: 1.25;
    }

    .pakherbal-direct-hero__card-link {
        padding-top: 11px;
        font-size: 11px;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-direct-hero__slide-inner {
        padding-right: 12px;
        padding-left: 12px;
    }

    .pakherbal-direct-hero__title {
        font-size: 24px;
    }

    .pakherbal-direct-hero__packshot {
        bottom: 58px;
        transform:
            translateX(50%)
            scale(0.51);
    }

    .pakherbal-direct-hero__cards-layer {
        margin-top: -400px;
        padding-right: 7px;
        padding-left: 7px;
    }

    .pakherbal-direct-hero__cards {
        gap: 7px;
    }

    .pakherbal-direct-hero__card {
        padding: 9px;
    }

    .pakherbal-direct-hero__card-image {
        min-height: 66px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-direct-hero__arrow,
    .pakherbal-direct-hero__card-image {
        transition: none;
    }

    .pakherbal-direct-hero__arrow:hover,
    .pakherbal-direct-hero__card-item:hover
    .pakherbal-direct-hero__card-image {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/hero.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/natural-trusted.css
   ========================================================= */
/* =========================================================
   PakHerbal Natural & Trusted Section
   File: public/css/frontend/home/natural-trusted.css
   ========================================================= */

.pakherbal-natural-trusted,
.pakherbal-natural-trusted *,
.pakherbal-natural-trusted *::before,
.pakherbal-natural-trusted *::after {
    box-sizing: border-box;
}

.pakherbal-natural-trusted {
    --natural-primary: var(
        --pakherbal-theme-primary,
        #79c943
    );
    --natural-primary-dark: #4f9229;
    --natural-navy: #071827;
    --natural-text: #142630;
    --natural-muted: #4d6269;
    --natural-background: #f4f8ed;
    --natural-card-background: #edf5eb;

    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 7% 16%,
            rgba(121, 201, 67, 0.1),
            transparent 25%
        ),
        radial-gradient(
            circle at 94% 84%,
            rgba(79, 146, 41, 0.08),
            transparent 28%
        ),
        var(--natural-background);
}

.pakherbal-natural-trusted__container {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(430px, 0.9fr);
    align-items: center;
    gap: clamp(52px, 6vw, 88px);
    width: min(100%, 1320px);
    margin: 0 auto;
    padding: 56px 44px 62px;
}

/* =========================================================
   Content
   ========================================================= */

.pakherbal-natural-trusted__content {
    display: grid;
    justify-items: start;
    gap: 17px;
    min-width: 0;
}

.pakherbal-natural-trusted__eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    margin: 0;
    padding: 7px 12px;
    color: #438021;
    background: rgba(121, 201, 67, 0.1);
    border: 1px solid rgba(79, 146, 41, 0.16);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.3;
}

.pakherbal-natural-trusted__eyebrow-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    color: var(--natural-primary-dark);
}

.pakherbal-natural-trusted__title {
    max-width: 570px;
    margin: 0;
    color: #10252d;
    font-family: inherit;
    font-size: clamp(38px, 3.25vw, 46px);
    font-weight: 700;
    line-height: 1.04;
    letter-spacing: -0.022em;
    text-wrap: balance;
    overflow-wrap: anywhere;
}

.pakherbal-natural-trusted__description {
    max-width: 570px;
    margin: 0;
    color: #445b61;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.62;
    overflow-wrap: anywhere;
}

/* =========================================================
   Trust Highlights
   ========================================================= */

.pakherbal-natural-trusted__trust-list {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    width: 100%;
    max-width: 640px;
    margin: 4px 0 0;
    padding: 0;
    list-style: none;
}

.pakherbal-natural-trusted__trust-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 7px 11px;
    color: #294634;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(46, 99, 53, 0.12);
    border-radius: 999px;
    box-shadow: 0 7px 18px rgba(35, 72, 48, 0.07);
    font-size: 12px;
    font-weight: 750;
    line-height: 1.25;
    white-space: nowrap;
}

.pakherbal-natural-trusted__trust-icon {
    display: inline-flex;
    flex: 0 0 22px;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    color: #ffffff;
    background: var(--natural-primary-dark);
    border-radius: 50%;
}

/* =========================================================
   Action
   ========================================================= */

.pakherbal-natural-trusted__actions {
    display: flex;
    align-items: stretch;
    margin-top: 8px;
}

.pakherbal-natural-trusted__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: auto;
    min-width: 176px;
    min-height: 51px;
    padding: 12px 22px;
    color: #ffffff;
    background: var(--natural-navy);
    border: 1px solid var(--natural-navy);
    border-radius: 8px;
    box-shadow: 0 12px 24px rgba(7, 24, 39, 0.15);
    font-family: inherit;
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-natural-trusted__button svg {
    flex: 0 0 auto;
    color: currentColor;
    transition: transform 160ms ease;
}

.pakherbal-natural-trusted__button:hover {
    color: #ffffff;
    background: #3f7f22;
    border-color: #3f7f22;
    box-shadow: 0 15px 27px rgba(63, 127, 34, 0.24);
    transform: translateY(-2px);
}

.pakherbal-natural-trusted__button:hover svg {
    transform: translateX(3px);
}

.pakherbal-natural-trusted__button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Image Card
   ========================================================= */

.pakherbal-natural-trusted__media-card {
    position: relative;
    justify-self: end;
    width: min(100%, 565px);
    min-width: 0;
    aspect-ratio: 1.48 / 1;
    overflow: hidden;
    background: transparent;
    border: 0;
    border-radius: 13px;
    box-shadow:
        0 22px 36px rgba(18, 39, 33, 0.24),
        0 7px 16px rgba(18, 39, 33, 0.12),
        0 0 54px 16px rgba(105, 174, 77, 0.2);
    isolation: isolate;
}

.pakherbal-natural-trusted__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border: 0;
    border-radius: inherit;
    transition: transform 420ms ease;
}

.pakherbal-natural-trusted__media-card:hover
.pakherbal-natural-trusted__image {
    transform: scale(1.018);
}

/* =========================================================
   Temporary Image Placeholder
   ========================================================= */

.pakherbal-natural-trusted__image-placeholder {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 78% 20%,
            rgba(121, 201, 67, 0.2),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #f3f8ef 0%,
            #e2efdd 58%,
            #d3e7ca 100%
        );
}

.pakherbal-natural-trusted__placeholder-glow {
    position: absolute;
    top: -20%;
    left: -8%;
    width: 68%;
    height: 110%;
    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, 0.95),
            rgba(255, 255, 255, 0)
        );
}

.pakherbal-natural-trusted__placeholder-products {
    position: absolute;
    right: 8%;
    bottom: 10%;
    width: 72%;
    height: 72%;
}

.pakherbal-natural-trusted__placeholder-bottle {
    position: absolute;
    bottom: 6%;
    background:
        linear-gradient(
            145deg,
            rgba(247, 241, 206, 0.98),
            rgba(218, 178, 62, 0.94)
        );
    border: 1px solid rgba(106, 83, 24, 0.13);
    border-radius: 28px 28px 20px 20px;
    box-shadow:
        0 22px 34px rgba(67, 78, 43, 0.16);
}

.pakherbal-natural-trusted__placeholder-bottle::before {
    position: absolute;
    top: -12%;
    left: 50%;
    width: 42%;
    height: 16%;
    content: "";
    background: #b68845;
    border-radius: 5px 5px 2px 2px;
    transform: translateX(-50%);
}

.pakherbal-natural-trusted__placeholder-bottle--large {
    right: 23%;
    width: 25%;
    height: 68%;
}

.pakherbal-natural-trusted__placeholder-bottle--small {
    right: 4%;
    width: 18%;
    height: 48%;
    background:
        linear-gradient(
            145deg,
            rgba(143, 91, 36, 0.95),
            rgba(83, 47, 20, 0.96)
        );
}

.pakherbal-natural-trusted__placeholder-bowl {
    position: absolute;
    right: 46%;
    bottom: 4%;
    width: 29%;
    height: 25%;
    background:
        linear-gradient(
            180deg,
            #b78042,
            #70431f
        );
    border-radius: 8px 8px 52% 52%;
    box-shadow:
        0 17px 26px rgba(65, 45, 27, 0.18);
}

.pakherbal-natural-trusted__placeholder-herb {
    position: absolute;
    z-index: 2;
    width: 27%;
    height: 13%;
    background:
        linear-gradient(
            145deg,
            #86bb55,
            #3e762c
        );
    border-radius: 100% 0 100% 0;
}

.pakherbal-natural-trusted__placeholder-herb--one {
    right: 36%;
    bottom: 24%;
    transform: rotate(-24deg);
}

.pakherbal-natural-trusted__placeholder-herb--two {
    right: 60%;
    bottom: 16%;
    width: 22%;
    transform: rotate(18deg);
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-natural-trusted__container {
        grid-template-columns:
            minmax(0, 1fr)
            minmax(340px, 0.92fr);
        gap: 38px;
        padding: 52px 24px 58px;
    }

    .pakherbal-natural-trusted__title {
        font-size: clamp(33px, 4.3vw, 43px);
    }

    .pakherbal-natural-trusted__description {
        font-size: 15.5px;
    }

    .pakherbal-natural-trusted__trust-list {
        gap: 8px;
    }

    .pakherbal-natural-trusted__trust-item {
        padding: 6px 10px;
        font-size: 11.5px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-natural-trusted__container {
        grid-template-columns: minmax(0, 1fr);
        gap: 28px;
        padding: 38px 16px 44px;
    }

    .pakherbal-natural-trusted__content {
        gap: 13px;
    }

    .pakherbal-natural-trusted__eyebrow {
        padding: 6px 10px;
        font-size: 12px;
    }

    .pakherbal-natural-trusted__title {
        max-width: 560px;
        font-size: clamp(29px, 7.6vw, 38px);
        font-weight: 700;
        line-height: 1.08;
        letter-spacing: -0.02em;
    }

    .pakherbal-natural-trusted__description {
        max-width: 560px;
        font-size: 15px;
        line-height: 1.55;
    }

    .pakherbal-natural-trusted__trust-list {
        gap: 8px;
        margin-top: 2px;
    }

    .pakherbal-natural-trusted__trust-item {
        min-height: 32px;
        padding: 6px 9px;
        font-size: 11.5px;
    }

    .pakherbal-natural-trusted__trust-icon {
        flex-basis: 20px;
        width: 20px;
        height: 20px;
    }

    .pakherbal-natural-trusted__actions {
        width: 100%;
        margin-top: 7px;
    }

    .pakherbal-natural-trusted__button {
        width: 100%;
        min-width: 0;
        min-height: 48px;
        padding: 10px 14px;
        border-radius: 8px;
        font-size: 14px;
    }

    .pakherbal-natural-trusted__media-card {
        justify-self: stretch;
        width: 100%;
        aspect-ratio: 1.46 / 1;
        border-radius: 12px;
        box-shadow:
            0 18px 30px rgba(18, 39, 33, 0.2),
            0 5px 13px rgba(18, 39, 33, 0.1),
            0 0 36px 10px rgba(105, 174, 77, 0.16);
    }
}

@media (max-width: 520px) {
    .pakherbal-natural-trusted__trust-list {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .pakherbal-natural-trusted__trust-item {
        width: 100%;
        white-space: normal;
    }

    .pakherbal-natural-trusted__button {
        min-height: 47px;
        font-size: 13px;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-natural-trusted__container {
        padding-right: 12px;
        padding-left: 12px;
    }

    .pakherbal-natural-trusted__title {
        font-size: 27px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-natural-trusted__button,
    .pakherbal-natural-trusted__button svg,
    .pakherbal-natural-trusted__image {
        transition: none;
    }

    .pakherbal-natural-trusted__button:hover,
    .pakherbal-natural-trusted__button:hover svg,
    .pakherbal-natural-trusted__media-card:hover
    .pakherbal-natural-trusted__image {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/natural-trusted.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/featured-products.css
   ========================================================= */
/* =========================================================
   PakHerbal Featured Products
   File: public/css/frontend/home/featured-products.css
   ========================================================= */

.pakherbal-featured-products,
.pakherbal-featured-products *,
.pakherbal-featured-products *::before,
.pakherbal-featured-products *::after {
    box-sizing: border-box;
}

.pakherbal-featured-products {
    --featured-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --featured-green-dark: #4e9c27;
    --featured-navy: #071827;
    --featured-text: #263039;
    --featured-muted: #67727c;
    --featured-background: #f4f7f1;
    --featured-card-background: #ffffff;

    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--featured-background);
}

/* =========================================================
   Section Header
   ========================================================= */

.pakherbal-featured-products__header {
    display: grid;
    grid-template-columns:
        minmax(270px, 0.8fr)
        minmax(350px, 1fr)
        auto;
    align-items: center;
    gap: clamp(26px, 4vw, 64px);
    width: min(100%, 1320px);
    min-width: 0;
    margin: 0 auto;
    padding: 30px 28px;
    background: #ffffff;
    border: 0;
    border-radius: 0;
}

.pakherbal-featured-products__title {
    min-width: 0;
    margin: 0;
    color: var(--featured-text);
    font-size: clamp(32px, 2.8vw, 42px);
    font-weight: 750;
    line-height: 1.08;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}

.pakherbal-featured-products__title-line {
    display: inline;
}

.pakherbal-featured-products__title-line
+ .pakherbal-featured-products__title-line::before {
    content: " ";
}

.pakherbal-featured-products__description {
    justify-self: end;
    max-width: 470px;
    margin: 0;
    color: #3f4a5a;
    font-size: 16px;
    line-height: 1.42;
    text-align: right;
}

.pakherbal-featured-products__view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 205px;
    min-height: 51px;
    padding: 12px 22px;
    color: #ffffff;
    background: var(--featured-navy);
    border: 1px solid var(--featured-navy);
    border-radius: 8px;
    box-shadow:
        0 12px 24px rgba(7, 24, 39, 0.15);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-featured-products__view-all svg {
    flex: 0 0 auto;
    color: #ffffff;
    transition: transform 160ms ease;
}

.pakherbal-featured-products__view-all:hover {
    color: #ffffff;
    background: #3f7f22;
    border-color: #3f7f22;
    box-shadow:
        0 13px 25px rgba(63, 127, 34, 0.24);
    transform: translateY(-2px);
}

.pakherbal-featured-products__view-all:hover svg {
    color: #ffffff;
    transform: translateX(3px);
}

.pakherbal-featured-products__view-all:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.4);
    outline-offset: 3px;
}

/* =========================================================
   Products Body
   ========================================================= */

.pakherbal-featured-products__body {
    width: 100%;
    padding: 34px 28px 68px;
    border-top: 0;
}

.pakherbal-featured-products__grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 22px;
    width: min(100%, 1320px);
    margin: 0 auto;
}

/* =========================================================
   Product Card
   ========================================================= */

.pakherbal-featured-product-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    background: var(--featured-card-background);
    border: 1px solid rgba(18, 37, 48, 0.11);
    border-radius: 0;
    box-shadow:
        0 8px 20px rgba(18, 39, 48, 0.06);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-featured-product-card:hover {
    border-color: rgba(78, 135, 51, 0.28);
    box-shadow:
        0 14px 28px rgba(18, 39, 48, 0.10);
    transform: translateY(-3px);
}

/* =========================================================
   Product Media
   ========================================================= */

.pakherbal-featured-product-card__media {
    position: relative;
    display: block;
    width: calc(100% - 32px);
    margin: 16px 16px 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(70, 111, 58, 0.22);
    border-radius: 0;
    text-decoration: none;
}

.pakherbal-featured-product-card__discount {
    position: absolute;
    z-index: 4;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 5px 9px;
    color: #ffffff;
    background: #d84b3e;
    border: 0;
    border-radius: 0;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
}

.pakherbal-featured-product-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
    transition: transform 300ms ease;
}

.pakherbal-featured-product-card:hover
.pakherbal-featured-product-card__image {
    transform: scale(1.04);
}

/* =========================================================
   Temporary Product Placeholder
   ========================================================= */

.pakherbal-featured-product-card__placeholder {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
}

.pakherbal-featured-product-card__placeholder--forest {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(121, 201, 67, 0.26),
            transparent 29%
        ),
        linear-gradient(
            145deg,
            #d9ebd0,
            #9bc57e
        );
}

.pakherbal-featured-product-card__placeholder--mint {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.4),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #d8f0e8,
            #8bcbb3
        );
}

.pakherbal-featured-product-card__placeholder--gold {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.36),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #f6e8b8,
            #d7ad56
        );
}

.pakherbal-featured-product-card__placeholder--peach {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.35),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #f8dfcc,
            #eca883
        );
}

.pakherbal-featured-product-card__placeholder-bottle {
    position: absolute;
    right: 50%;
    bottom: 17%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34%;
    height: 58%;
    padding: 8px;
    color: #254332;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.96),
            rgba(229, 239, 221, 0.92)
        );
    border: 1px solid rgba(44, 78, 57, 0.12);
    border-radius: 19px 19px 25px 25px;
    box-shadow:
        0 20px 30px rgba(35, 65, 47, 0.18);
    transform: translateX(50%);
}

.pakherbal-featured-product-card__placeholder-bottle::before {
    position: absolute;
    top: -13%;
    left: 50%;
    width: 50%;
    height: 15%;
    content: "";
    background: #173f30;
    border-radius: 6px 6px 3px 3px;
    transform: translateX(-50%);
}

.pakherbal-featured-product-card__placeholder-bottle span {
    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
}

.pakherbal-featured-product-card__placeholder-leaf {
    position: absolute;
    top: 23%;
    right: 18%;
    width: 29%;
    height: 15%;
    background: rgba(45, 117, 66, 0.72);
    border-radius: 100% 0 100% 0;
    transform: rotate(-24deg);
}

.pakherbal-featured-product-card__placeholder-shadow {
    position: absolute;
    right: 50%;
    bottom: 11%;
    width: 50%;
    height: 8%;
    background: rgba(28, 50, 38, 0.2);
    border-radius: 50%;
    filter: blur(9px);
    transform: translateX(50%);
}

/* =========================================================
   Product Content
   ========================================================= */

.pakherbal-featured-product-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
}

.pakherbal-featured-product-card__category {
    margin: 0 0 7px;
    color: var(--featured-green-dark);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.3;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.pakherbal-featured-product-card__title {
    min-height: 44px;
    margin: 0;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.38;
}

.pakherbal-featured-product-card__title a {
    display: -webkit-box;
    overflow: hidden;
    color: var(--featured-text);
    text-decoration: none;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pakherbal-featured-product-card__title a:hover {
    color: var(--featured-green-dark);
}

.pakherbal-featured-product-card__price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
    margin-top: 14px;
}

.pakherbal-featured-product-card__price {
    color: var(--featured-navy);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
}

.pakherbal-featured-product-card__old-price {
    color: #8a949d;
    font-size: 12px;
    line-height: 1.2;
}

/* =========================================================
   Shop Button
   ========================================================= */

.pakherbal-featured-product-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin-top: auto;
    padding: 10px 14px;
    color: #ffffff;
    background: var(--featured-navy);
    border: 1px solid var(--featured-navy);
    border-radius: 0;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-featured-product-card__price-row
+ .pakherbal-featured-product-card__button {
    margin-top: auto;
}

.pakherbal-featured-product-card__button svg {
    flex: 0 0 auto;
    transition: transform 160ms ease;
}

.pakherbal-featured-product-card__button:hover {
    color: #071827;
    background: var(--featured-green);
    border-color: var(--featured-green);
    box-shadow:
        0 10px 20px rgba(73, 145, 37, 0.24);
    transform: translateY(-1px);
}

.pakherbal-featured-product-card__button:hover svg {
    transform: translateX(3px);
}

.pakherbal-featured-product-card__button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Empty State
   ========================================================= */

.pakherbal-featured-products__empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 34px 24px;
    color: var(--featured-muted);
    background: #ffffff;
    border: 1px dashed rgba(18, 37, 48, 0.15);
    border-radius: 0;
    font-size: 15px;
    line-height: 1.6;
    text-align: center;
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-featured-products__header {
        grid-template-columns:
            minmax(220px, 0.8fr)
            minmax(280px, 1fr)
            auto;
        gap: 24px;
        padding-right: 22px;
        padding-left: 22px;
    }

    .pakherbal-featured-products__description {
        font-size: 14px;
    }

    .pakherbal-featured-products__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-featured-products__header {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
        gap: 14px;
        padding: 22px 14px;
    }

    .pakherbal-featured-products__description {
        display: none;
    }

    .pakherbal-featured-products__title {
        font-size: clamp(27px, 7.8vw, 36px);
        line-height: 0.99;
    }

    .pakherbal-featured-products__title-line {
        display: block;
    }

    .pakherbal-featured-products__title-line
    + .pakherbal-featured-products__title-line::before {
        content: none;
    }

    .pakherbal-featured-products__view-all {
        min-width: 0;
        min-height: 41px;
        padding: 9px 13px;
        border-radius: 8px;
        font-size: 12px;
    }

    .pakherbal-featured-products__view-all svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-featured-products__body {
        padding: 22px 10px 42px;
    }

    .pakherbal-featured-products__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .pakherbal-featured-product-card {
        border-radius: 0;
    }

    .pakherbal-featured-product-card__media {
        width: calc(100% - 16px);
        margin: 8px 8px 0;
        aspect-ratio: 1 / 1;
        border-radius: 0;
    }

    .pakherbal-featured-product-card__discount {
        top: 7px;
        left: 7px;
        min-height: 23px;
        padding: 4px 6px;
        border-radius: 0;
        font-size: 9px;
    }

    .pakherbal-featured-product-card__content {
        padding: 11px;
    }

    .pakherbal-featured-product-card__category {
        margin-bottom: 5px;
        font-size: 9px;
    }

    .pakherbal-featured-product-card__title {
        min-height: 38px;
        font-size: 13px;
        line-height: 1.38;
    }

    .pakherbal-featured-product-card__price-row {
        gap: 5px;
        margin-top: 10px;
    }

    .pakherbal-featured-product-card__price {
        font-size: 15px;
    }

    .pakherbal-featured-product-card__old-price {
        font-size: 9px;
    }

    .pakherbal-featured-product-card__button {
        min-height: 39px;
        padding: 8px 8px;
        border-radius: 0;
        font-size: 11px;
    }

    .pakherbal-featured-product-card__price-row
    + .pakherbal-featured-product-card__button {
        margin-top: auto;
    }

    .pakherbal-featured-product-card__button svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-featured-product-card__placeholder-bottle span {
        font-size: 9px;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-featured-products__header {
        gap: 9px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .pakherbal-featured-products__title {
        font-size: 25px;
    }

    .pakherbal-featured-products__view-all {
        padding-right: 9px;
        padding-left: 9px;
        font-size: 10px;
    }

    .pakherbal-featured-products__body {
        padding-right: 7px;
        padding-left: 7px;
    }

    .pakherbal-featured-products__grid {
        gap: 7px;
    }

    .pakherbal-featured-product-card__content {
        padding: 9px;
    }

    .pakherbal-featured-product-card__button {
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-featured-products__view-all,
    .pakherbal-featured-products__view-all svg,
    .pakherbal-featured-product-card,
    .pakherbal-featured-product-card__image,
    .pakherbal-featured-product-card__button,
    .pakherbal-featured-product-card__button svg {
        transition: none;
    }

    .pakherbal-featured-products__view-all:hover,
    .pakherbal-featured-products__view-all:hover svg,
    .pakherbal-featured-product-card:hover,
    .pakherbal-featured-product-card:hover
    .pakherbal-featured-product-card__image,
    .pakherbal-featured-product-card__button:hover,
    .pakherbal-featured-product-card__button:hover svg {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/featured-products.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/new-arrivals.css
   ========================================================= */
/* =========================================================
   PakHerbal New Arrivals
   File: public/css/frontend/home/new-arrivals.css
   ========================================================= */

.pakherbal-new-arrivals,
.pakherbal-new-arrivals *,
.pakherbal-new-arrivals *::before,
.pakherbal-new-arrivals *::after {
    box-sizing: border-box;
}

.pakherbal-new-arrivals {
    --new-arrivals-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --new-arrivals-green-dark: #4e9c27;
    --new-arrivals-navy: #071827;
    --new-arrivals-text: #263039;
    --new-arrivals-muted: #67727c;
    --new-arrivals-background: #f4f7f1;
    --new-arrivals-card-background: #ffffff;

    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--new-arrivals-background);
}

/* =========================================================
   Section Header
   ========================================================= */

.pakherbal-new-arrivals__header {
    display: grid;
    grid-template-columns:
        minmax(270px, 0.8fr)
        minmax(350px, 1fr)
        auto;
    align-items: center;
    gap: clamp(26px, 4vw, 64px);
    width: min(100%, 1320px);
    min-width: 0;
    margin: 0 auto;
    padding: 30px 28px;
    background: #ffffff;
    border: 0;
    border-radius: 0;
}

.pakherbal-new-arrivals__title {
    min-width: 0;
    margin: 0;
    color: var(--new-arrivals-text);
    font-size: clamp(32px, 2.8vw, 42px);
    font-weight: 750;
    line-height: 1.08;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}


.pakherbal-new-arrivals__description {
    justify-self: end;
    max-width: 470px;
    margin: 0;
    color: #3f4a5a;
    font-size: 16px;
    line-height: 1.42;
    text-align: right;
}

.pakherbal-new-arrivals__view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 205px;
    min-height: 51px;
    padding: 12px 22px;
    color: #ffffff;
    background: var(--new-arrivals-navy);
    border: 1px solid var(--new-arrivals-navy);
    border-radius: 8px;
    box-shadow:
        0 12px 24px rgba(7, 24, 39, 0.15);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-new-arrivals__view-all svg {
    flex: 0 0 auto;
    color: #ffffff;
    transition: transform 160ms ease;
}

.pakherbal-new-arrivals__view-all:hover {
    color: #ffffff;
    background: #3f7f22;
    border-color: #3f7f22;
    box-shadow:
        0 13px 25px rgba(63, 127, 34, 0.24);
    transform: translateY(-2px);
}

.pakherbal-new-arrivals__view-all:hover svg {
    color: #ffffff;
    transform: translateX(3px);
}

.pakherbal-new-arrivals__view-all:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.4);
    outline-offset: 3px;
}

/* =========================================================
   Products Body
   ========================================================= */

.pakherbal-new-arrivals__body {
    width: 100%;
    padding: 34px 28px 68px;
    border-top: 0;
}

.pakherbal-new-arrivals__grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 22px;
    width: min(100%, 1320px);
    margin: 0 auto;
}

/* =========================================================
   Product Card
   ========================================================= */

.pakherbal-new-arrival-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    background: var(--new-arrivals-card-background);
    border: 1px solid rgba(18, 37, 48, 0.11);
    border-radius: 0;
    box-shadow:
        0 8px 20px rgba(18, 39, 48, 0.06);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-new-arrival-card:hover {
    border-color: rgba(78, 135, 51, 0.28);
    box-shadow:
        0 14px 28px rgba(18, 39, 48, 0.10);
    transform: translateY(-3px);
}

/* =========================================================
   Product Media
   ========================================================= */

.pakherbal-new-arrival-card__media {
    position: relative;
    display: block;
    width: calc(100% - 32px);
    margin: 16px 16px 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(70, 111, 58, 0.22);
    border-radius: 0;
    text-decoration: none;
}

.pakherbal-new-arrival-card__badge {
    position: absolute;
    z-index: 4;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 5px 9px;
    color: #ffffff;
    background: var(--new-arrivals-green-dark);
    border: 0;
    border-radius: 0;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    line-height: 1;
}

.pakherbal-new-arrival-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
    transition: transform 300ms ease;
}

.pakherbal-new-arrival-card:hover
.pakherbal-new-arrival-card__image {
    transform: scale(1.04);
}

/* =========================================================
   Product Image Fallback
   ========================================================= */

.pakherbal-new-arrival-card__placeholder {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
}

.pakherbal-new-arrival-card__placeholder--forest {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(121, 201, 67, 0.26),
            transparent 29%
        ),
        linear-gradient(
            145deg,
            #d9ebd0,
            #9bc57e
        );
}

.pakherbal-new-arrival-card__placeholder--mint {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.4),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #d8f0e8,
            #8bcbb3
        );
}

.pakherbal-new-arrival-card__placeholder--gold {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.36),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #f6e8b8,
            #d7ad56
        );
}

.pakherbal-new-arrival-card__placeholder--peach {
    background:
        radial-gradient(
            circle at 70% 24%,
            rgba(255, 255, 255, 0.35),
            transparent 28%
        ),
        linear-gradient(
            145deg,
            #f8dfcc,
            #eca883
        );
}

.pakherbal-new-arrival-card__placeholder-bottle {
    position: absolute;
    right: 50%;
    bottom: 17%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34%;
    height: 58%;
    padding: 8px;
    color: #254332;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.96),
            rgba(229, 239, 221, 0.92)
        );
    border: 1px solid rgba(44, 78, 57, 0.12);
    border-radius: 19px 19px 25px 25px;
    box-shadow:
        0 20px 30px rgba(35, 65, 47, 0.18);
    transform: translateX(50%);
}

.pakherbal-new-arrival-card__placeholder-bottle::before {
    position: absolute;
    top: -13%;
    left: 50%;
    width: 50%;
    height: 15%;
    content: "";
    background: #173f30;
    border-radius: 6px 6px 3px 3px;
    transform: translateX(-50%);
}

.pakherbal-new-arrival-card__placeholder-bottle span {
    font-size: 12px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
}

.pakherbal-new-arrival-card__placeholder-leaf {
    position: absolute;
    top: 23%;
    right: 18%;
    width: 29%;
    height: 15%;
    background: rgba(45, 117, 66, 0.72);
    border-radius: 100% 0 100% 0;
    transform: rotate(-24deg);
}

.pakherbal-new-arrival-card__placeholder-shadow {
    position: absolute;
    right: 50%;
    bottom: 11%;
    width: 50%;
    height: 8%;
    background: rgba(28, 50, 38, 0.2);
    border-radius: 50%;
    filter: blur(9px);
    transform: translateX(50%);
}

/* =========================================================
   Product Content
   ========================================================= */

.pakherbal-new-arrival-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
}

.pakherbal-new-arrival-card__category {
    margin: 0 0 7px;
    color: var(--new-arrivals-green-dark);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.3;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.pakherbal-new-arrival-card__title {
    min-height: 44px;
    margin: 0;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.38;
}

.pakherbal-new-arrival-card__title a {
    display: -webkit-box;
    overflow: hidden;
    color: var(--new-arrivals-text);
    text-decoration: none;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pakherbal-new-arrival-card__title a:hover {
    color: var(--new-arrivals-green-dark);
}


.pakherbal-new-arrival-card__size {
    margin: 9px 0 0;
    color: var(--new-arrivals-muted);
    font-size: 11px;
    font-weight: 650;
    line-height: 1.4;
}

.pakherbal-new-arrival-card__price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
    margin-top: 14px;
}

.pakherbal-new-arrival-card__price {
    color: var(--new-arrivals-navy);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
}

.pakherbal-new-arrival-card__old-price {
    color: #8a949d;
    font-size: 12px;
    line-height: 1.2;
}

/* =========================================================
   Shop Button
   ========================================================= */

.pakherbal-new-arrival-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin-top: auto;
    padding: 10px 14px;
    color: #ffffff;
    background: var(--new-arrivals-navy);
    border: 1px solid var(--new-arrivals-navy);
    border-radius: 0;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-new-arrival-card__price-row
+ .pakherbal-new-arrival-card__button {
    margin-top: auto;
}

.pakherbal-new-arrival-card__button svg {
    flex: 0 0 auto;
    transition: transform 160ms ease;
}

.pakherbal-new-arrival-card__button:hover {
    color: #071827;
    background: var(--new-arrivals-green);
    border-color: var(--new-arrivals-green);
    box-shadow:
        0 10px 20px rgba(73, 145, 37, 0.24);
    transform: translateY(-1px);
}

.pakherbal-new-arrival-card__button:hover svg {
    transform: translateX(3px);
}

.pakherbal-new-arrival-card__button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Empty State
   ========================================================= */

.pakherbal-new-arrivals__empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 34px 24px;
    color: var(--new-arrivals-muted);
    background: #ffffff;
    border: 1px dashed rgba(18, 37, 48, 0.15);
    border-radius: 0;
    font-size: 15px;
    line-height: 1.6;
    text-align: center;
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-new-arrivals__header {
        grid-template-columns:
            minmax(220px, 0.8fr)
            minmax(280px, 1fr)
            auto;
        gap: 24px;
        padding-right: 22px;
        padding-left: 22px;
    }

    .pakherbal-new-arrivals__description {
        font-size: 14px;
    }

    .pakherbal-new-arrivals__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-new-arrivals__header {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
        gap: 14px;
        padding: 22px 14px;
    }

    .pakherbal-new-arrivals__description {
        display: none;
    }

    .pakherbal-new-arrivals__title {
        font-size: clamp(27px, 7.8vw, 36px);
        line-height: 0.99;
    }


    .pakherbal-new-arrivals__view-all {
        min-width: 0;
        min-height: 41px;
        padding: 9px 13px;
        border-radius: 8px;
        font-size: 12px;
    }

    .pakherbal-new-arrivals__view-all svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-new-arrivals__body {
        padding: 22px 10px 42px;
    }

    .pakherbal-new-arrivals__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .pakherbal-new-arrival-card {
        border-radius: 0;
    }

    .pakherbal-new-arrival-card__media {
        width: calc(100% - 16px);
        margin: 8px 8px 0;
        aspect-ratio: 1 / 1;
        border-radius: 0;
    }

    .pakherbal-new-arrival-card__badge {
        top: 7px;
        left: 7px;
        min-height: 23px;
        padding: 4px 6px;
        border-radius: 0;
        font-size: 9px;
    }

    .pakherbal-new-arrival-card__content {
        padding: 11px;
    }

    .pakherbal-new-arrival-card__category {
        margin-bottom: 5px;
        font-size: 9px;
    }

    .pakherbal-new-arrival-card__title {
        min-height: 38px;
        font-size: 13px;
        line-height: 1.38;
    }

    .pakherbal-new-arrival-card__size {
        margin-top: 6px;
        font-size: 9px;
    }

    .pakherbal-new-arrival-card__price-row {
        gap: 5px;
        margin-top: 10px;
    }

    .pakherbal-new-arrival-card__price {
        font-size: 15px;
    }

    .pakherbal-new-arrival-card__old-price {
        font-size: 9px;
    }

    .pakherbal-new-arrival-card__button {
        min-height: 39px;
        padding: 8px 8px;
        border-radius: 0;
        font-size: 11px;
    }

    .pakherbal-new-arrival-card__price-row
    + .pakherbal-new-arrival-card__button {
        margin-top: auto;
    }

    .pakherbal-new-arrival-card__button svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-new-arrival-card__placeholder-bottle span {
        font-size: 9px;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-new-arrivals__header {
        gap: 9px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .pakherbal-new-arrivals__title {
        font-size: 25px;
    }

    .pakherbal-new-arrivals__view-all {
        padding-right: 9px;
        padding-left: 9px;
        font-size: 10px;
    }

    .pakherbal-new-arrivals__body {
        padding-right: 7px;
        padding-left: 7px;
    }

    .pakherbal-new-arrivals__grid {
        gap: 7px;
    }

    .pakherbal-new-arrival-card__content {
        padding: 9px;
    }

    .pakherbal-new-arrival-card__button {
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-new-arrivals__view-all,
    .pakherbal-new-arrivals__view-all svg,
    .pakherbal-new-arrival-card,
    .pakherbal-new-arrival-card__image,
    .pakherbal-new-arrival-card__button,
    .pakherbal-new-arrival-card__button svg {
        transition: none;
    }

    .pakherbal-new-arrivals__view-all:hover,
    .pakherbal-new-arrivals__view-all:hover svg,
    .pakherbal-new-arrival-card:hover,
    .pakherbal-new-arrival-card:hover
    .pakherbal-new-arrival-card__image,
    .pakherbal-new-arrival-card__button:hover,
    .pakherbal-new-arrival-card__button:hover svg {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/new-arrivals.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/pansar-store.css
   ========================================================= */
/* =========================================================
   PakHerbal Pansar Store
   File: public/css/frontend/home/pansar-store.css
   ========================================================= */

.pakherbal-pansar-store,
.pakherbal-pansar-store *,
.pakherbal-pansar-store *::before,
.pakherbal-pansar-store *::after {
    box-sizing: border-box;
}

.pakherbal-pansar-store {
    --pansar-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --pansar-green-dark: #4e9c27;
    --pansar-navy: #071827;
    --pansar-text: #263039;
    --pansar-muted: #69736d;
    --pansar-background: #f4f7f1;
    --pansar-card-background: #ffffff;
    --pansar-gold: #c99537;

    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--pansar-background);
}

/* =========================================================
   Section Header
   ========================================================= */

.pakherbal-pansar-store__header {
    display: grid;
    grid-template-columns:
        minmax(270px, 0.8fr)
        minmax(350px, 1fr)
        auto;
    align-items: center;
    gap: clamp(26px, 4vw, 64px);
    width: min(100%, 1320px);
    min-width: 0;
    margin: 0 auto;
    padding: 30px 28px;
    background: #ffffff;
    border: 0;
    border-radius: 0;
}

.pakherbal-pansar-store__title {
    min-width: 0;
    margin: 0;
    color: var(--pansar-text);
    font-size: clamp(32px, 2.8vw, 42px);
    font-weight: 750;
    line-height: 1.08;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}

.pakherbal-pansar-store__title-line {
    display: inline;
}

.pakherbal-pansar-store__title-line
+ .pakherbal-pansar-store__title-line::before {
    content: " ";
}

.pakherbal-pansar-store__description {
    justify-self: end;
    max-width: 470px;
    margin: 0;
    color: #3f4a5a;
    font-size: 16px;
    line-height: 1.42;
    text-align: right;
    overflow-wrap: anywhere;
}

.pakherbal-pansar-store__view-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 205px;
    min-height: 51px;
    padding: 12px 22px;
    color: #ffffff;
    background: var(--pansar-navy);
    border: 1px solid var(--pansar-navy);
    border-radius: 8px;
    box-shadow:
        0 12px 24px rgba(7, 24, 39, 0.15);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-pansar-store__view-all svg {
    flex: 0 0 auto;
    color: #ffffff;
    transition: transform 160ms ease;
}

.pakherbal-pansar-store__view-all:hover {
    color: #ffffff;
    background: #3f7f22;
    border-color: #3f7f22;
    box-shadow:
        0 13px 25px rgba(63, 127, 34, 0.24);
    transform: translateY(-2px);
}

.pakherbal-pansar-store__view-all:hover svg {
    color: #ffffff;
    transform: translateX(3px);
}

.pakherbal-pansar-store__view-all:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.4);
    outline-offset: 3px;
}

/* =========================================================
   Products Area
   ========================================================= */

.pakherbal-pansar-store__body {
    width: 100%;
    padding: 34px 28px 68px;
    border-top: 0;
}

.pakherbal-pansar-store__grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 22px;
    width: min(100%, 1320px);
    margin: 0 auto;
}

/* =========================================================
   Pansar Product Card
   ========================================================= */

.pakherbal-pansar-product-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    background: var(--pansar-card-background);
    border: 1px solid rgba(18, 37, 48, 0.11);
    border-radius: 0;
    box-shadow:
        0 8px 20px rgba(18, 39, 48, 0.06);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-pansar-product-card:hover {
    border-color: rgba(78, 135, 51, 0.28);
    box-shadow:
        0 14px 28px rgba(18, 39, 48, 0.10);
    transform: translateY(-3px);
}

/* =========================================================
   Product Media
   ========================================================= */

.pakherbal-pansar-product-card__media {
    position: relative;
    display: block;
    width: calc(100% - 32px);
    margin: 16px 16px 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(70, 111, 58, 0.22);
    border-radius: 0;
    text-decoration: none;
}

.pakherbal-pansar-product-card__discount {
    position: absolute;
    z-index: 5;
    top: 12px;
    left: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 27px;
    padding: 5px 9px;
    color: #ffffff;
    background: #d84b3e;
    border: 0;
    border-radius: 0;
    font-size: 11px;
    font-weight: 850;
    line-height: 1;
}

.pakherbal-pansar-product-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    border-radius: 0;
    transition: transform 300ms ease;
}

.pakherbal-pansar-product-card:hover
.pakherbal-pansar-product-card__image {
    transform: scale(1.04);
}

/* =========================================================
   Temporary Placeholder
   ========================================================= */

.pakherbal-pansar-product-card__placeholder {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
}

.pakherbal-pansar-product-card__placeholder--seed {
    background:
        radial-gradient(
            circle at 74% 22%,
            rgba(255, 255, 255, 0.36),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #e1ebce,
            #9fbc72
        );
}

.pakherbal-pansar-product-card__placeholder--herb {
    background:
        radial-gradient(
            circle at 74% 22%,
            rgba(255, 255, 255, 0.36),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #d5ead4,
            #80b283
        );
}

.pakherbal-pansar-product-card__placeholder--spice {
    background:
        radial-gradient(
            circle at 74% 22%,
            rgba(255, 255, 255, 0.38),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #f0d9aa,
            #c68b47
        );
}

.pakherbal-pansar-product-card__placeholder--rose {
    background:
        radial-gradient(
            circle at 74% 22%,
            rgba(255, 255, 255, 0.42),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #f2d8d6,
            #c98582
        );
}

.pakherbal-pansar-product-card__placeholder-product {
    position: absolute;
    z-index: 2;
    right: 50%;
    bottom: 17%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #26372c;
    transform: translateX(50%);
}

.pakherbal-pansar-product-card__placeholder-product--pouch {
    width: 40%;
    height: 56%;
    padding: 14px 8px 8px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.95),
            rgba(229, 222, 194, 0.94)
        );
    border: 1px solid rgba(66, 59, 40, 0.12);
    clip-path:
        polygon(
            10% 0,
            90% 0,
            100% 13%,
            94% 100%,
            6% 100%,
            0 13%
        );
    box-shadow:
        0 20px 29px rgba(57, 50, 35, 0.17);
}

.pakherbal-pansar-product-card__placeholder-product--jar {
    width: 36%;
    height: 55%;
    padding: 12px 8px 8px;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.95),
            rgba(215, 229, 202, 0.94)
        );
    border: 1px solid rgba(48, 73, 47, 0.12);
    box-shadow:
        0 20px 29px rgba(49, 70, 46, 0.17);
}

.pakherbal-pansar-product-card__placeholder-product--jar::before {
    position: absolute;
    top: -10%;
    left: -4%;
    width: 108%;
    height: 14%;
    content: "";
    background: #59472e;
}

.pakherbal-pansar-product-card__placeholder-product--bowl {
    bottom: 20%;
    width: 46%;
    height: 29%;
    padding: 5px 8px;
    background:
        linear-gradient(
            180deg,
            #a96832,
            #654020
        );
    clip-path:
        polygon(
            0 0,
            100% 0,
            82% 100%,
            18% 100%
        );
    box-shadow:
        0 20px 29px rgba(60, 40, 26, 0.2);
}

.pakherbal-pansar-product-card__placeholder-name {
    max-width: 100%;
    padding: 6px;
    font-size: 11px;
    font-weight: 850;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: anywhere;
}

.pakherbal-pansar-product-card__placeholder-product--bowl
.pakherbal-pansar-product-card__placeholder-name {
    color: #ffffff;
}

.pakherbal-pansar-product-card__placeholder-herb {
    position: absolute;
    z-index: 1;
    width: 28%;
    height: 13%;
    background: rgba(48, 117, 62, 0.73);
    border-radius: 100% 0 100% 0;
}

.pakherbal-pansar-product-card__placeholder-herb--one {
    top: 24%;
    right: 17%;
    transform: rotate(-24deg);
}

.pakherbal-pansar-product-card__placeholder-herb--two {
    top: 39%;
    left: 17%;
    width: 23%;
    background: rgba(92, 139, 65, 0.66);
    transform: rotate(28deg);
}

.pakherbal-pansar-product-card__placeholder-shadow {
    position: absolute;
    right: 50%;
    bottom: 10%;
    width: 53%;
    height: 8%;
    background: rgba(50, 43, 30, 0.2);
    border-radius: 50%;
    filter: blur(9px);
    transform: translateX(50%);
}

/* =========================================================
   Product Content
   ========================================================= */

.pakherbal-pansar-product-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    padding: 18px;
}

.pakherbal-pansar-product-card__category {
    margin: 0 0 7px;
    color: var(--pansar-green-dark);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.3;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.pakherbal-pansar-product-card__title {
    min-height: 44px;
    margin: 0;
    font-size: 16px;
    font-weight: 750;
    line-height: 1.38;
}

.pakherbal-pansar-product-card__title a {
    display: -webkit-box;
    overflow: hidden;
    color: var(--pansar-text);
    text-decoration: none;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pakherbal-pansar-product-card__title a:hover {
    color: var(--pansar-green-dark);
}

.pakherbal-pansar-product-card__size {
    margin: 7px 0 0;
    color: var(--pansar-muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.3;
}

.pakherbal-pansar-product-card__price-row {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 8px;
    margin-top: 12px;
}

.pakherbal-pansar-product-card__price {
    color: var(--pansar-navy);
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;
}

.pakherbal-pansar-product-card__old-price {
    color: #8a949d;
    font-size: 12px;
    line-height: 1.2;
}

/* =========================================================
   Shop Button
   ========================================================= */

.pakherbal-pansar-product-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin-top: auto;
    padding: 10px 14px;
    color: #ffffff;
    background: var(--pansar-navy);
    border: 1px solid var(--pansar-navy);
    border-radius: 0;
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-pansar-product-card__price-row
+ .pakherbal-pansar-product-card__button {
    margin-top: auto;
}

.pakherbal-pansar-product-card__button svg {
    flex: 0 0 auto;
    transition: transform 160ms ease;
}

.pakherbal-pansar-product-card__button:hover {
    color: #071827;
    background: var(--pansar-green);
    border-color: var(--pansar-green);
    box-shadow:
        0 10px 20px rgba(73, 145, 37, 0.24);
    transform: translateY(-1px);
}

.pakherbal-pansar-product-card__button:hover svg {
    transform: translateX(3px);
}

.pakherbal-pansar-product-card__button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.4);
    outline-offset: 3px;
}


/* =========================================================
   Empty State
   ========================================================= */

.pakherbal-pansar-store__empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 34px 24px;
    color: var(--pansar-muted);
    background: #ffffff;
    border: 1px dashed rgba(18, 37, 48, 0.15);
    border-radius: 0;
    font-size: 15px;
    line-height: 1.6;
    text-align: center;
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-pansar-store__header {
        grid-template-columns:
            minmax(220px, 0.8fr)
            minmax(280px, 1fr)
            auto;
        gap: 24px;
        padding-right: 22px;
        padding-left: 22px;
    }

    .pakherbal-pansar-store__description {
        font-size: 14px;
    }

    .pakherbal-pansar-store__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-pansar-store__header {
        grid-template-columns:
            minmax(0, 1fr)
            auto;
        gap: 14px;
        padding: 22px 14px;
    }

    .pakherbal-pansar-store__description {
        display: none;
    }

    .pakherbal-pansar-store__title {
        font-size: clamp(27px, 7.8vw, 36px);
        line-height: 0.99;
    }

    .pakherbal-pansar-store__title-line {
        display: block;
    }

    .pakherbal-pansar-store__title-line
    + .pakherbal-pansar-store__title-line::before {
        content: none;
    }

    .pakherbal-pansar-store__view-all {
        min-height: 41px;
        padding: 9px 13px;
        border-radius: 8px;
        font-size: 12px;
    }

    .pakherbal-pansar-store__view-all svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-pansar-store__body {
        padding: 22px 10px 42px;
    }

    .pakherbal-pansar-store__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .pakherbal-pansar-product-card {
        border-radius: 0;
    }

    .pakherbal-pansar-product-card__media {
        width: calc(100% - 16px);
        margin: 8px 8px 0;
        aspect-ratio: 1 / 1;
        border-radius: 0;
    }

    .pakherbal-pansar-product-card__discount {
        top: 7px;
        left: 7px;
        min-height: 23px;
        padding: 4px 6px;
        font-size: 9px;
    }

    .pakherbal-pansar-product-card__content {
        padding: 11px;
    }

    .pakherbal-pansar-product-card__category {
        margin-bottom: 5px;
        font-size: 9px;
    }

    .pakherbal-pansar-product-card__title {
        min-height: 38px;
        font-size: 13px;
        line-height: 1.38;
    }

    .pakherbal-pansar-product-card__size {
        margin-top: 5px;
        font-size: 10px;
    }

    .pakherbal-pansar-product-card__price-row {
        gap: 5px;
        margin-top: 9px;
    }

    .pakherbal-pansar-product-card__price {
        font-size: 15px;
    }

    .pakherbal-pansar-product-card__old-price {
        font-size: 9px;
    }

    .pakherbal-pansar-product-card__button {
        min-height: 39px;
        padding: 8px;
        font-size: 11px;
    }

    .pakherbal-pansar-product-card__price-row
    + .pakherbal-pansar-product-card__button {
        margin-top: auto;
    }

    .pakherbal-pansar-product-card__button svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-pansar-product-card__placeholder-name {
        font-size: 9px;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-pansar-store__header {
        gap: 9px;
        padding-right: 10px;
        padding-left: 10px;
    }

    .pakherbal-pansar-store__title {
        font-size: 25px;
    }

    .pakherbal-pansar-store__view-all {
        padding-right: 9px;
        padding-left: 9px;
        font-size: 10px;
    }

    .pakherbal-pansar-store__body {
        padding-right: 7px;
        padding-left: 7px;
    }

    .pakherbal-pansar-store__grid {
        gap: 7px;
    }

    .pakherbal-pansar-product-card__content {
        padding: 9px;
    }

    .pakherbal-pansar-product-card__button {
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-pansar-store__view-all,
    .pakherbal-pansar-store__view-all svg,
    .pakherbal-pansar-product-card,
    .pakherbal-pansar-product-card__image,
    .pakherbal-pansar-product-card__button,
    .pakherbal-pansar-product-card__button svg {
        transition: none;
    }

    .pakherbal-pansar-store__view-all:hover,
    .pakherbal-pansar-store__view-all:hover svg,
    .pakherbal-pansar-product-card:hover,
    .pakherbal-pansar-product-card:hover
    .pakherbal-pansar-product-card__image,
    .pakherbal-pansar-product-card__button:hover,
    .pakherbal-pansar-product-card__button:hover svg {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/pansar-store.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/hakeem-online.css
   ========================================================= */
/* =========================================================
   PakHerbal Online Hakeem Consultation
   File: public/css/frontend/home/hakeem-online.css
   ========================================================= */

.pakherbal-hakeem-online,
.pakherbal-hakeem-online *,
.pakherbal-hakeem-online *::before,
.pakherbal-hakeem-online *::after {
    box-sizing: border-box;
}

.pakherbal-hakeem-online {
    --hakeem-primary: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --hakeem-primary-dark: #4e9728;
    --hakeem-hover-green: #3f7f22;
    --hakeem-navy: #071827;
    --hakeem-text: #26342d;
    --hakeem-muted: #53645a;
    --hakeem-page-background: #eef4e9;
    --hakeem-section-background: #d6e5cf;
    --hakeem-card-background: #ffffff;
    --hakeem-border: rgba(45, 84, 52, 0.15);

    position: relative;
    width: 100%;
    min-width: 0;
    padding: 38px 0 48px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 7% 16%,
            rgba(121, 201, 67, 0.1),
            transparent 25%
        ),
        radial-gradient(
            circle at 94% 84%,
            rgba(41, 100, 50, 0.07),
            transparent 27%
        ),
        var(--hakeem-page-background);
}

/* =========================================================
   Raised Main Section
   ========================================================= */

.pakherbal-hakeem-online__container {
    position: relative;
    display: grid;
    grid-template-columns:
        minmax(280px, 0.92fr)
        minmax(0, 2.25fr);
    align-items: stretch;
    gap: clamp(34px, 4vw, 60px);

    width: min(calc(100% - 56px), 1320px);
    min-width: 0;
    margin: 0 auto;
    padding: 48px 28px;

    background:
        radial-gradient(
            circle at 5% 12%,
            rgba(255, 255, 255, 0.34),
            transparent 28%
        ),
        radial-gradient(
            circle at 96% 88%,
            rgba(121, 201, 67, 0.17),
            transparent 28%
        ),
        linear-gradient(
            120deg,
            #e2eddc 0%,
            #d2e3cb 48%,
            #c4dbbd 100%
        );

    border: 1px solid rgba(255, 255, 255, 0.88);
    border-radius: 0;

    box-shadow:
        0 24px 48px rgba(46, 86, 51, 0.17),
        0 0 38px rgba(121, 201, 67, 0.15);

    isolation: isolate;
}

.pakherbal-hakeem-online__container::before {
    position: absolute;
    z-index: -1;
    right: 4%;
    bottom: -18px;

    width: 92%;
    height: 38px;

    content: "";

    background: rgba(66, 123, 64, 0.18);
    border-radius: 50%;
    filter: blur(22px);
}

.pakherbal-hakeem-online__container::after {
    position: absolute;
    z-index: -1;
    top: -13px;
    left: 5%;

    width: 60%;
    height: 30px;

    content: "";

    background: rgba(121, 201, 67, 0.12);
    border-radius: 50%;
    filter: blur(20px);
}

/* =========================================================
   Introduction
   ========================================================= */

.pakherbal-hakeem-online__intro {
    display: flex;
    flex-direction: column;
    align-items: flex-start;

    min-width: 0;
    padding: 7px 0;
}

.pakherbal-hakeem-online__title {
    display: grid;
    gap: 2px;

    max-width: 390px;
    margin: 0;

    color: var(--hakeem-navy);

    font-size: clamp(32px, 3vw, 43px);
    font-weight: 900;
    line-height: 1.04;
    letter-spacing: -0.038em;

    overflow-wrap: anywhere;
}

.pakherbal-hakeem-online__title span {
    display: block;
}

.pakherbal-hakeem-online__urdu-text {
    width: 100%;
    max-width: 415px;
    margin: 40px 0 0;

    color: var(--hakeem-hover-green);

    font-family: var(--pakherbal-font-urdu, serif);

    font-size: 16px;
    font-weight: 700;
    line-height: 2.2;
    text-align: right;

    overflow-wrap: anywhere;
}

.pakherbal-hakeem-online__description {
    max-width: 410px;
    margin: 32px 0 0;

    color: #43574c;

    font-size: 15px;
    line-height: 1.72;

    overflow-wrap: anywhere;
}

/* =========================================================
   Main Consultation Button
   ========================================================= */

.pakherbal-hakeem-online__main-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-width: 240px;
    min-height: 50px;
    margin-top: auto;
    padding: 12px 22px;

    color: #ffffff;
    background: var(--hakeem-navy);

    border: 1px solid var(--hakeem-navy);
    border-radius: 0;

    box-shadow:
        0 11px 23px rgba(7, 24, 39, 0.17);

    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;

    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-hakeem-online__main-button svg {
    flex: 0 0 auto;
    color: #ffffff;
    transition: transform 160ms ease;
}

.pakherbal-hakeem-online__main-button:hover {
    color: #ffffff;
    background: var(--hakeem-hover-green);
    border-color: var(--hakeem-hover-green);

    box-shadow:
        0 14px 27px rgba(63, 127, 34, 0.26);

    transform: translateY(-2px);
}

.pakherbal-hakeem-online__main-button:hover svg {
    color: #ffffff;
    transform: translateX(3px);
}

.pakherbal-hakeem-online__main-button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.45);
    outline-offset: 4px;
}

/* =========================================================
   Services Grid
   ========================================================= */

.pakherbal-hakeem-online__services {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 18px;

    min-width: 0;
}

/* =========================================================
   Service Card
   ========================================================= */

.pakherbal-hakeem-service-card {
    display: flex;
    flex-direction: column;

    min-width: 0;
    height: 100%;
    overflow: hidden;

    background: var(--hakeem-card-background);

    border: 1px solid var(--hakeem-border);
    border-top: 3px solid var(--hakeem-primary-dark);
    border-radius: 0;

    box-shadow:
        0 14px 28px rgba(31, 68, 42, 0.11);

    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-hakeem-service-card:hover {
    border-right-color: rgba(63, 127, 34, 0.3);
    border-bottom-color: rgba(63, 127, 34, 0.3);
    border-left-color: rgba(63, 127, 34, 0.3);

    box-shadow:
        0 21px 39px rgba(31, 68, 42, 0.18);

    transform: translateY(-5px);
}

/* =========================================================
   Service Image
   ========================================================= */

.pakherbal-hakeem-service-card__media {
    position: relative;
    display: block;

    width: 100%;
    aspect-ratio: 1.4 / 0.82;

    overflow: hidden;

    background: #e5efdf;
    border-radius: 0;

    text-decoration: none;
}

.pakherbal-hakeem-service-card__image {
    display: block;

    width: 100%;
    height: 100%;

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

    border-radius: 0;

    transition: transform 320ms ease;
}

.pakherbal-hakeem-service-card:hover
.pakherbal-hakeem-service-card__image {
    transform: scale(1.035);
}

/* =========================================================
   Placeholder Foundation
   ========================================================= */

.pakherbal-hakeem-service-card__placeholder {
    position: relative;
    display: block;

    width: 100%;
    height: 100%;

    overflow: hidden;
    border-radius: 0;
}

.pakherbal-hakeem-service-card__placeholder--consultation {
    background:
        radial-gradient(
            circle at 78% 19%,
            rgba(255, 255, 255, 0.62),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            #dcecdc,
            #9fc999
        );
}

.pakherbal-hakeem-service-card__placeholder--pansar {
    background:
        radial-gradient(
            circle at 76% 18%,
            rgba(255, 255, 255, 0.5),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #eee5c9,
            #c8a85d
        );
}

.pakherbal-hakeem-service-card__placeholder--diet {
    background:
        radial-gradient(
            circle at 78% 19%,
            rgba(255, 255, 255, 0.5),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            #dcebd4,
            #9fca87
        );
}

.pakherbal-hakeem-service-card__placeholder-glow {
    position: absolute;
    top: -28%;
    left: -18%;

    width: 78%;
    height: 130%;

    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, 0.75),
            rgba(255, 255, 255, 0)
        );
}

.pakherbal-hakeem-service-card__placeholder-shadow {
    position: absolute;
    right: 50%;
    bottom: 10%;

    width: 55%;
    height: 8%;

    background: rgba(28, 56, 39, 0.19);
    border-radius: 50%;

    filter: blur(9px);

    transform: translateX(50%);
}

/* =========================================================
   Consultation Placeholder
   ========================================================= */

.pakherbal-hakeem-service-card__doctor {
    position: absolute;
    z-index: 2;
    right: 50%;
    bottom: 10%;

    width: 45%;
    height: 72%;

    transform: translateX(50%);
}

.pakherbal-hakeem-service-card__doctor-head {
    position: absolute;
    top: 7%;
    left: 50%;

    width: 34%;
    height: 28%;

    background: #d4a475;
    border-radius: 50%;

    transform: translateX(-50%);
}

.pakherbal-hakeem-service-card__doctor-head::before {
    position: absolute;
    top: -12%;
    left: -6%;

    width: 112%;
    height: 47%;

    content: "";

    background: #ffffff;
    border-radius: 50% 50% 20% 20%;
}

.pakherbal-hakeem-service-card__doctor-body {
    position: absolute;
    right: 50%;
    bottom: 0;

    width: 88%;
    height: 66%;

    background: #ffffff;
    border: 1px solid rgba(28, 64, 44, 0.1);

    transform: translateX(50%);
}

.pakherbal-hakeem-service-card__doctor-body::before {
    position: absolute;
    top: 13%;
    left: 50%;

    width: 37%;
    height: 52%;

    content: "";

    border: 3px solid #174532;
    border-top: 0;
    border-radius: 0 0 50% 50%;

    transform: translateX(-50%);
}

.pakherbal-hakeem-service-card__doctor-cross {
    position: absolute;
    right: 8%;
    bottom: 13%;

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

    width: 24px;
    height: 24px;

    color: var(--hakeem-navy);
    background: var(--hakeem-primary);

    font-size: 20px;
    font-weight: 900;
    line-height: 1;
}

.pakherbal-hakeem-service-card__chat-bubble {
    position: absolute;
    z-index: 3;
    top: 21%;
    right: 12%;

    display: grid;
    gap: 4px;

    width: 29%;
    padding: 10px;

    background: var(--hakeem-navy);
}

.pakherbal-hakeem-service-card__chat-bubble::after {
    position: absolute;
    bottom: -8px;
    left: 12px;

    width: 0;
    height: 0;

    content: "";

    border-top: 9px solid var(--hakeem-navy);
    border-right: 9px solid transparent;
}

.pakherbal-hakeem-service-card__chat-bubble span {
    display: block;
    height: 3px;
    background: rgba(255, 255, 255, 0.72);
}

/* =========================================================
   Pansar Placeholder
   ========================================================= */

.pakherbal-hakeem-service-card__pansar-bowl {
    position: absolute;
    z-index: 3;
    right: 50%;
    bottom: 14%;

    width: 43%;
    height: 28%;

    background:
        linear-gradient(
            180deg,
            #a66831,
            #63401f
        );

    clip-path:
        polygon(
            0 0,
            100% 0,
            81% 100%,
            19% 100%
        );

    box-shadow:
        0 16px 25px rgba(72, 48, 26, 0.2);

    transform: translateX(50%);
}

.pakherbal-hakeem-service-card__pansar-jar {
    position: absolute;
    bottom: 18%;

    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.96),
            rgba(229, 221, 192, 0.94)
        );

    border: 1px solid rgba(69, 57, 33, 0.12);

    box-shadow:
        0 15px 24px rgba(68, 53, 31, 0.16);
}

.pakherbal-hakeem-service-card__pansar-jar::before {
    position: absolute;
    top: -12%;
    left: -4%;

    width: 108%;
    height: 14%;

    content: "";

    background: #5e472a;
}

.pakherbal-hakeem-service-card__pansar-jar--one {
    right: 16%;
    width: 24%;
    height: 48%;
}

.pakherbal-hakeem-service-card__pansar-jar--two {
    left: 14%;
    width: 20%;
    height: 39%;
}

.pakherbal-hakeem-service-card__leaf {
    position: absolute;
    z-index: 2;

    width: 28%;
    height: 14%;

    background: rgba(48, 121, 65, 0.73);
    border-radius: 100% 0 100% 0;
}

.pakherbal-hakeem-service-card__leaf--one {
    top: 19%;
    right: 13%;
    transform: rotate(-25deg);
}

.pakherbal-hakeem-service-card__leaf--two {
    top: 31%;
    left: 15%;
    width: 23%;
    background: rgba(104, 146, 66, 0.68);
    transform: rotate(25deg);
}

/* =========================================================
   Diet Placeholder
   ========================================================= */

.pakherbal-hakeem-service-card__diet-plate {
    position: absolute;
    z-index: 2;
    right: 50%;
    bottom: 14%;

    width: 48%;
    aspect-ratio: 1;

    background:
        radial-gradient(
            circle,
            #f5f7ec 0%,
            #f5f7ec 56%,
            #d9e4d2 57%,
            #ffffff 72%
        );

    border: 1px solid rgba(48, 74, 50, 0.12);
    border-radius: 50%;

    box-shadow:
        0 16px 27px rgba(41, 69, 47, 0.16);

    transform: translateX(50%);
}

.pakherbal-hakeem-service-card__diet-leaf {
    position: absolute;
    z-index: 3;

    width: 29%;
    height: 15%;

    background: #5fa34d;
    border-radius: 100% 0 100% 0;
}

.pakherbal-hakeem-service-card__diet-leaf--one {
    top: 36%;
    right: 31%;
    transform: rotate(-23deg);
}

.pakherbal-hakeem-service-card__diet-leaf--two {
    top: 48%;
    left: 29%;
    width: 24%;
    background: #87bd59;
    transform: rotate(30deg);
}

.pakherbal-hakeem-service-card__diet-glass {
    position: absolute;
    z-index: 4;
    right: 15%;
    bottom: 18%;

    width: 16%;
    height: 40%;

    background:
        linear-gradient(
            180deg,
            rgba(214, 239, 197, 0.88),
            rgba(112, 176, 72, 0.92)
        );

    border: 1px solid rgba(50, 96, 50, 0.13);

    clip-path:
        polygon(
            8% 0,
            92% 0,
            80% 100%,
            20% 100%
        );
}

/* =========================================================
   Card Content
   ========================================================= */

.pakherbal-hakeem-service-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;

    min-width: 0;
    padding: 21px 17px 17px;

    text-align: center;
}

.pakherbal-hakeem-service-card__title {
    min-height: 48px;
    margin: 0;

    font-size: 16px;
    font-weight: 850;
    line-height: 1.42;
}

.pakherbal-hakeem-service-card__title a {
    display: -webkit-box;

    overflow: hidden;

    color: var(--hakeem-text);
    text-decoration: none;

    line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pakherbal-hakeem-service-card__title a:hover {
    color: var(--hakeem-hover-green);
}

.pakherbal-hakeem-service-card__description {
    display: -webkit-box;

    min-height: 69px;
    margin: 14px 0 0;

    overflow: hidden;

    color: var(--hakeem-muted);

    font-size: 13px;
    line-height: 1.72;

    line-clamp: 3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

/* =========================================================
   Service Card Buttons
   Theme Style
   ========================================================= */

.pakherbal-hakeem-service-card__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-width: 165px;
    min-height: 42px;
    margin-top: auto;
    padding: 9px 15px;

    color: #ffffff;
    background: var(--hakeem-navy);

    border: 1px solid var(--hakeem-navy);
    border-radius: 0;

    box-shadow:
        0 9px 18px rgba(7, 24, 39, 0.14);

    font-size: 12px;
    font-weight: 850;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;

    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-hakeem-service-card__description
+ .pakherbal-hakeem-service-card__button {
    margin-top: 18px;
}

.pakherbal-hakeem-service-card__button svg {
    flex: 0 0 auto;
    color: #ffffff;
    transition: transform 160ms ease;
}

.pakherbal-hakeem-service-card__button:hover {
    color: #ffffff;
    background: var(--hakeem-hover-green);
    border-color: var(--hakeem-hover-green);

    box-shadow:
        0 12px 22px rgba(63, 127, 34, 0.25);

    transform: translateY(-2px);
}

.pakherbal-hakeem-service-card__button:hover svg {
    color: #ffffff;
    transform: translateX(3px);
}

.pakherbal-hakeem-service-card__button:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Medium Desktop
   ========================================================= */

@media (max-width: 1100px) {
    .pakherbal-hakeem-online__container {
        grid-template-columns:
            minmax(240px, 0.8fr)
            minmax(0, 2.2fr);

        gap: 28px;
        padding-right: 22px;
        padding-left: 22px;
    }

    .pakherbal-hakeem-online__services {
        gap: 13px;
    }

    .pakherbal-hakeem-service-card__content {
        padding-right: 13px;
        padding-left: 13px;
    }

    .pakherbal-hakeem-service-card__title {
        font-size: 14px;
    }

    .pakherbal-hakeem-service-card__description {
        font-size: 12px;
    }

    .pakherbal-hakeem-service-card__button {
        min-width: 145px;
    }
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 900px) {
    .pakherbal-hakeem-online {
        padding-top: 30px;
        padding-bottom: 40px;
    }

    .pakherbal-hakeem-online__container {
        grid-template-columns: minmax(0, 1fr);

        gap: 34px;

        width: min(calc(100% - 40px), 1320px);
        padding: 42px 24px;
    }

    .pakherbal-hakeem-online__intro {
        align-items: center;
        text-align: center;
    }

    .pakherbal-hakeem-online__title {
        max-width: 620px;
        text-align: center;
    }

    .pakherbal-hakeem-online__urdu-text {
        max-width: 620px;
        margin-top: 23px;
        text-align: center;
    }

    .pakherbal-hakeem-online__description {
        max-width: 650px;
        margin-top: 20px;
        text-align: center;
    }

    .pakherbal-hakeem-online__main-button {
        margin-top: 25px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-hakeem-online {
        padding: 22px 0 32px;
    }

    .pakherbal-hakeem-online__container {
        gap: 30px;

        width: calc(100% - 20px);
        padding: 34px 12px;
    }

    .pakherbal-hakeem-online__title {
        font-size: clamp(28px, 8vw, 38px);
        line-height: 1.06;
    }

    .pakherbal-hakeem-online__urdu-text {
        margin-top: 19px;

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

    .pakherbal-hakeem-online__description {
        margin-top: 16px;

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

    .pakherbal-hakeem-online__main-button {
        min-width: 0;
        min-height: 46px;
        margin-top: 22px;
        padding: 10px 18px;

        font-size: 12px;
    }

    .pakherbal-hakeem-online__services {
        grid-template-columns: minmax(0, 1fr);
        gap: 14px;

        width: min(100%, 520px);
        margin: 0 auto;
    }

    .pakherbal-hakeem-service-card {
        display: grid;
        grid-template-columns:
            minmax(145px, 0.82fr)
            minmax(0, 1.18fr);
    }

    .pakherbal-hakeem-service-card__media {
        height: 100%;
        min-height: 220px;
        aspect-ratio: auto;
    }

    .pakherbal-hakeem-service-card__content {
        align-items: flex-start;
        justify-content: center;

        padding: 16px 14px;

        text-align: left;
    }

    .pakherbal-hakeem-service-card__title {
        min-height: auto;

        font-size: 14px;
    }

    .pakherbal-hakeem-service-card__description {
        min-height: auto;
        margin-top: 9px;

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

        line-clamp: 4;
        -webkit-line-clamp: 4;
    }

    .pakherbal-hakeem-service-card__description
    + .pakherbal-hakeem-service-card__button {
        margin-top: 13px;
    }

    .pakherbal-hakeem-service-card__button {
        min-width: 0;
        min-height: 37px;
        padding: 8px 11px;

        font-size: 10px;
    }
}

/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 430px) {
    .pakherbal-hakeem-online {
        padding-top: 18px;
        padding-bottom: 26px;
    }

    .pakherbal-hakeem-online__container {
        width: calc(100% - 16px);
        padding: 29px 9px;
    }

    .pakherbal-hakeem-online__title {
        font-size: 29px;
    }

    .pakherbal-hakeem-online__main-button {
        width: 100%;
    }

    .pakherbal-hakeem-service-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .pakherbal-hakeem-service-card__media {
        min-height: 205px;
        aspect-ratio: 1.55 / 1;
    }

    .pakherbal-hakeem-service-card__content {
        align-items: center;

        padding: 16px 13px;

        text-align: center;
    }

    .pakherbal-hakeem-service-card__description {
        max-width: 360px;
    }

    .pakherbal-hakeem-service-card__button {
        min-width: 155px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-hakeem-online__main-button,
    .pakherbal-hakeem-online__main-button svg,
    .pakherbal-hakeem-service-card,
    .pakherbal-hakeem-service-card__image,
    .pakherbal-hakeem-service-card__button,
    .pakherbal-hakeem-service-card__button svg {
        transition: none;
    }

    .pakherbal-hakeem-online__main-button:hover,
    .pakherbal-hakeem-online__main-button:hover svg,
    .pakherbal-hakeem-service-card:hover,
    .pakherbal-hakeem-service-card:hover
    .pakherbal-hakeem-service-card__image,
    .pakherbal-hakeem-service-card__button:hover,
    .pakherbal-hakeem-service-card__button:hover svg {
        transform: none;
    }
}

@media (min-width: 901px) {
    .pakherbal-hakeem-service-card__media {
        aspect-ratio: 1 / 1;
    }

    .pakherbal-hakeem-service-card__image {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/hakeem-online.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/shop-by-category.css
   ========================================================= */
/* =========================================================
   PakHerbal Shop by Category
   File: public/css/frontend/home/shop-by-category.css
   ========================================================= */

.pakherbal-shop-by-category,
.pakherbal-shop-by-category *,
.pakherbal-shop-by-category *::before,
.pakherbal-shop-by-category *::after {
    box-sizing: border-box;
}

.pakherbal-shop-by-category {
    --category-primary: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --category-primary-dark: #4e9c27;
    --category-navy: #071827;
    --category-text: #24313b;
    --category-muted: #5c6770;
    --category-background: #f6f8f2;
    --category-card-background: #ffffff;
    --category-border: rgba(35, 54, 41, 0.1);

    position: relative;
    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--category-background);
}

/* =========================================================
   Compact Container
   ========================================================= */

.pakherbal-shop-by-category__container {
    width: min(100%, 1320px);
    margin: 0 auto;
    padding: 34px 28px 38px;
}

/* =========================================================
   Compact Header
   ========================================================= */

.pakherbal-shop-by-category__header {
    display: grid;
    grid-template-columns:
        minmax(280px, 0.8fr)
        minmax(420px, 1.2fr);
    align-items: end;
    gap: clamp(30px, 5vw, 80px);
    margin-bottom: 20px;
}

.pakherbal-shop-by-category__title {
    min-width: 0;
    margin: 0;
    color: var(--category-navy);
    font-size: clamp(29px, 2.5vw, 37px);
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: -0.03em;
    overflow-wrap: anywhere;
}

.pakherbal-shop-by-category__description {
    justify-self: end;
    max-width: 690px;
    margin: 0;
    color: var(--category-muted);
    font-size: 14px;
    line-height: 1.55;
    text-align: right;
    overflow-wrap: anywhere;
}

/* =========================================================
   Category Grid
   ========================================================= */

.pakherbal-shop-by-category__grid {
    display: grid;
    grid-template-columns:
        repeat(6, minmax(0, 1fr));
    align-items: stretch;
    gap: 16px;
}

/* =========================================================
   Category Card
   ========================================================= */

.pakherbal-category-card {
    min-width: 0;
    overflow: hidden;
    background: var(--category-card-background);
    border: 1px solid var(--category-border);
    border-radius: 0;
    box-shadow:
        0 10px 21px rgba(24, 43, 33, 0.06);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-category-card:hover {
    border-color: rgba(121, 201, 67, 0.3);
    box-shadow:
        0 16px 28px rgba(24, 43, 33, 0.11);
    transform: translateY(-3px);
}

.pakherbal-category-card__link {
    display: block;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

/* =========================================================
   Reduced Image Height
   ========================================================= */

.pakherbal-category-card__media {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 0.78;
    overflow: hidden;
    background: #edf2e7;
    border-radius: 0;
}

.pakherbal-category-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
    transition: transform 260ms ease;
}

.pakherbal-category-card:hover
.pakherbal-category-card__image {
    transform: scale(1.04);
}

/* =========================================================
   Compact Category Name
   ========================================================= */

.pakherbal-category-card__content {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 9px 7px;
    text-align: center;
}

.pakherbal-category-card__name {
    margin: 0;
    color: var(--category-navy);
    font-size: 14px;
    font-weight: 850;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

/* =========================================================
   Temporary Placeholder Foundation
   ========================================================= */

.pakherbal-category-card__placeholder {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 0;
}

.pakherbal-category-card__placeholder--beige {
    background:
        linear-gradient(
            145deg,
            #e7dcc3,
            #bfa47a
        );
}

.pakherbal-category-card__placeholder--green {
    background:
        radial-gradient(
            circle at 70% 20%,
            rgba(255, 255, 255, 0.45),
            transparent 30%
        ),
        linear-gradient(
            145deg,
            #d8efcf,
            #86bb64
        );
}

.pakherbal-category-card__placeholder--light {
    background:
        linear-gradient(
            145deg,
            #f5f7ef,
            #dde8d0
        );
}

.pakherbal-category-card__placeholder--herbal {
    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(255, 255, 255, 0.45),
            transparent 26%
        ),
        linear-gradient(
            145deg,
            #edf5d8,
            #b3cf67
        );
}

.pakherbal-category-card__placeholder--spice {
    background:
        linear-gradient(
            145deg,
            #efe0cf,
            #bc8d68
        );
}

.pakherbal-category-card__placeholder--dark {
    background:
        radial-gradient(
            circle at 75% 20%,
            rgba(121, 201, 67, 0.18),
            transparent 24%
        ),
        linear-gradient(
            145deg,
            #09111c,
            #1b2c1f
        );
}

/* =========================================================
   Herbal Products Placeholder
   ========================================================= */

.pakherbal-category-card__drawer {
    position: absolute;
    right: 8%;
    bottom: 12%;
    left: 8%;
    height: 28%;
    background:
        linear-gradient(
            180deg,
            #9a6f3d,
            #6f4b29
        );
}

.pakherbal-category-card__drawer::before,
.pakherbal-category-card__drawer::after {
    position: absolute;
    top: 14%;
    width: 22%;
    height: 72%;
    content: "";
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.18);
}

.pakherbal-category-card__drawer::before {
    left: 8%;
}

.pakherbal-category-card__drawer::after {
    right: 8%;
}

.pakherbal-category-card__jar-grid {
    position: absolute;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 42%;
    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, 0.85) 0 22%,
            transparent 24%
        )
        0 0 / 25% 33%;
    opacity: 0.85;
}

/* =========================================================
   Pansar Store Placeholder
   ========================================================= */

.pakherbal-category-card__bag {
    position: absolute;
    background:
        linear-gradient(
            145deg,
            #f9f4e5,
            #dbc491
        );
    box-shadow:
        0 10px 18px rgba(52, 71, 41, 0.14);
}

.pakherbal-category-card__bag--one {
    top: 28%;
    left: 16%;
    width: 26%;
    height: 34%;
}

.pakherbal-category-card__bag--two {
    top: 22%;
    right: 18%;
    width: 23%;
    height: 28%;
}

.pakherbal-category-card__bowl {
    position: absolute;
    bottom: 16%;
    left: 50%;
    width: 38%;
    height: 18%;
    background:
        linear-gradient(
            180deg,
            #9c6633,
            #6a4421
        );
    clip-path:
        polygon(
            0 0,
            100% 0,
            82% 100%,
            18% 100%
        );
    transform: translateX(-50%);
}

/* =========================================================
   Herbal Oils Placeholder
   ========================================================= */

.pakherbal-category-card__mortar {
    position: absolute;
    top: 28%;
    left: 50%;
    width: 42%;
    height: 36%;
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #dfe5d9
        );
    border: 1px solid rgba(30, 58, 41, 0.08);
    border-radius: 50%;
    transform: translateX(-50%);
}

.pakherbal-category-card__mortar::before {
    position: absolute;
    top: -16%;
    right: 8%;
    width: 12%;
    height: 42%;
    content: "";
    background: #8cb93d;
    border-radius: 20px;
    transform: rotate(35deg);
}

/* =========================================================
   Shared Leaves
   ========================================================= */

.pakherbal-category-card__leaf {
    position: absolute;
    background: rgba(81, 156, 52, 0.85);
    border-radius: 100% 0 100% 0;
}

.pakherbal-category-card__leaf--one {
    top: 20%;
    left: 20%;
    width: 20%;
    height: 11%;
    transform: rotate(-22deg);
}

.pakherbal-category-card__leaf--two {
    right: 22%;
    bottom: 22%;
    width: 18%;
    height: 10%;
    transform: rotate(28deg);
}

.pakherbal-category-card__leaf--three {
    top: 24%;
    left: 18%;
    width: 22%;
    height: 12%;
    transform: rotate(-24deg);
}

.pakherbal-category-card__leaf--four {
    right: 16%;
    bottom: 26%;
    width: 18%;
    height: 10%;
    transform: rotate(32deg);
}

.pakherbal-category-card__leaf--five {
    top: 30%;
    left: 18%;
    width: 25%;
    height: 12%;
    background: rgba(121, 201, 67, 0.8);
    transform: rotate(-26deg);
}

/* =========================================================
   Wellness Care Placeholder
   ========================================================= */

.pakherbal-category-card__oil-bottle {
    position: absolute;
    bottom: 16%;
    left: 50%;
    width: 28%;
    height: 48%;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.95),
            rgba(234, 239, 223, 0.92)
        );
    border: 1px solid rgba(44, 78, 57, 0.12);
    box-shadow:
        0 14px 22px rgba(44, 78, 57, 0.16);
    transform: translateX(-50%);
}

.pakherbal-category-card__oil-bottle::before {
    position: absolute;
    top: -11%;
    left: 50%;
    width: 46%;
    height: 14%;
    content: "";
    background: #173f30;
    transform: translateX(-50%);
}

/* =========================================================
   Natural Remedies Placeholder
   ========================================================= */

.pakherbal-category-card__spice-round {
    position: absolute;
    background: rgba(90, 58, 34, 0.68);
    border-radius: 50%;
}

.pakherbal-category-card__spice-round--one {
    top: 30%;
    left: 20%;
    width: 26%;
    height: 26%;
}

.pakherbal-category-card__spice-round--two {
    top: 26%;
    right: 20%;
    width: 24%;
    height: 24%;
    background: rgba(141, 89, 60, 0.72);
}

.pakherbal-category-card__spice-stick {
    position: absolute;
    bottom: 18%;
    left: 50%;
    width: 40%;
    height: 8%;
    background: #7a502f;
    transform: translateX(-50%) rotate(-18deg);
}

/* =========================================================
   Hakeem Online Placeholder
   ========================================================= */

.pakherbal-category-card__dark-bottle {
    position: absolute;
    bottom: 16%;
    left: 50%;
    width: 26%;
    height: 42%;
    background:
        linear-gradient(
            145deg,
            #1d1007,
            #4d2c12
        );
    box-shadow:
        0 14px 22px rgba(0, 0, 0, 0.34);
    transform: translateX(-50%);
}

.pakherbal-category-card__dark-bottle::before {
    position: absolute;
    top: -10%;
    left: 50%;
    width: 44%;
    height: 14%;
    content: "";
    background: #0f0f0f;
    transform: translateX(-50%);
}

.pakherbal-category-card__dropper {
    position: absolute;
    top: 20%;
    right: 18%;
    width: 9%;
    height: 32%;
    background:
        linear-gradient(
            180deg,
            #d8aa3a,
            #704c0f
        );
    transform: rotate(20deg);
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 1100px) {
    .pakherbal-shop-by-category__container {
        padding-right: 22px;
        padding-left: 22px;
    }

    .pakherbal-shop-by-category__header {
        grid-template-columns:
            minmax(240px, 0.75fr)
            minmax(350px, 1.25fr);
        gap: 30px;
    }

    .pakherbal-shop-by-category__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
        gap: 12px;
    }

    .pakherbal-category-card__media {
        aspect-ratio: 1 / 0.7;
    }
}

/* =========================================================
   Mobile — 3 Columns × 2 Rows
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-shop-by-category__container {
        padding: 27px 10px 31px;
    }

    .pakherbal-shop-by-category__header {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        margin-bottom: 14px;
        text-align: left;
    }

    .pakherbal-shop-by-category__title {
        font-size: clamp(26px, 7vw, 32px);
        line-height: 1.05;
    }

    .pakherbal-shop-by-category__description {
        display: none;
    }

    .pakherbal-shop-by-category__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
        gap: 7px;
    }

    .pakherbal-category-card__media {
        aspect-ratio: 1 / 0.82;
    }

    .pakherbal-category-card__content {
        min-height: 40px;
        padding: 7px 4px;
    }

    .pakherbal-category-card__name {
        font-size: 10px;
        line-height: 1.25;
    }
}

/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 390px) {
    .pakherbal-shop-by-category__container {
        padding-right: 8px;
        padding-left: 8px;
    }

    .pakherbal-shop-by-category__grid {
        gap: 5px;
    }

    .pakherbal-category-card__content {
        min-height: 38px;
        padding: 6px 3px;
    }

    .pakherbal-category-card__name {
        font-size: 9px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-category-card,
    .pakherbal-category-card__image {
        transition: none;
    }

    .pakherbal-category-card:hover,
    .pakherbal-category-card:hover
    .pakherbal-category-card__image {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/shop-by-category.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/why-choose.css
   ========================================================= */
/* =========================================================
   PakHerbal Compact Trust Cards
   File: public/css/frontend/home/why-choose.css
   ========================================================= */

.pakherbal-why-choose,
.pakherbal-why-choose *,
.pakherbal-why-choose *::before,
.pakherbal-why-choose *::after {
    box-sizing: border-box;
}

.pakherbal-why-choose {
    --trust-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --trust-green-dark: #4e9728;
    --trust-navy: #071827;
    --trust-text: #24322b;
    --trust-background: #eef4e8;
    --trust-card-background: #ffffff;
    --trust-border: rgba(35, 70, 47, 0.11);

    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--trust-background);
    border-top: 1px solid rgba(35, 70, 47, 0.06);
    border-bottom: 1px solid rgba(35, 70, 47, 0.06);
}

.pakherbal-why-choose__container {
    width: min(100%, 1320px);
    margin: 0 auto;
    padding: 30px 28px 34px;
}

/* =========================================================
   Compact Header
   ========================================================= */

.pakherbal-why-choose__header {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 17px;
}

.pakherbal-why-choose__title {
    flex: 0 0 auto;
    margin: 0;
    color: var(--trust-navy);
    font-size: clamp(24px, 2.1vw, 31px);
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.028em;
}

.pakherbal-why-choose__header-line {
    display: block;
    flex: 1;
    height: 1px;
    background:
        linear-gradient(
            90deg,
            rgba(78, 151, 40, 0.38),
            rgba(78, 151, 40, 0)
        );
}

/* =========================================================
   Trust Grid
   ========================================================= */

.pakherbal-why-choose__grid {
    display: grid;
    grid-template-columns:
        repeat(6, minmax(0, 1fr));
    gap: 10px;
}

/* =========================================================
   Compact Trust Card
   ========================================================= */

.pakherbal-trust-card {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 76px;
    padding: 12px;
    background: var(--trust-card-background);
    border: 1px solid var(--trust-border);
    border-radius: 0;
    box-shadow:
        0 8px 17px rgba(26, 55, 38, 0.055);
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-trust-card:hover {
    border-color: rgba(78, 151, 40, 0.3);
    box-shadow:
        0 12px 22px rgba(26, 55, 38, 0.1);
    transform: translateY(-2px);
}

.pakherbal-trust-card__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    color: var(--trust-green-dark);
    background: rgba(121, 201, 67, 0.13);
    border: 1px solid rgba(121, 201, 67, 0.18);
    border-radius: 0;
}

.pakherbal-trust-card__icon svg {
    display: block;
    width: 22px;
    height: 22px;
}

.pakherbal-trust-card__title {
    min-width: 0;
    margin: 0;
    color: var(--trust-text);
    font-size: 13px;
    font-weight: 800;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-why-choose__container {
        padding-right: 20px;
        padding-left: 20px;
    }

    .pakherbal-why-choose__grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }
}

/* =========================================================
   Mobile — 2 Columns × 3 Rows
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-why-choose__container {
        padding: 25px 10px 28px;
    }

    .pakherbal-why-choose__header {
        gap: 12px;
        margin-bottom: 14px;
    }

    .pakherbal-why-choose__title {
        font-size: clamp(22px, 6.3vw, 28px);
    }

    .pakherbal-why-choose__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .pakherbal-trust-card {
        gap: 8px;
        min-height: 66px;
        padding: 9px;
    }

    .pakherbal-trust-card__icon {
        width: 32px;
        height: 32px;
    }

    .pakherbal-trust-card__icon svg {
        width: 19px;
        height: 19px;
    }

    .pakherbal-trust-card__title {
        font-size: 11px;
        line-height: 1.28;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-why-choose__container {
        padding-right: 7px;
        padding-left: 7px;
    }

    .pakherbal-why-choose__grid {
        gap: 5px;
    }

    .pakherbal-trust-card {
        padding: 7px;
    }

    .pakherbal-trust-card__icon {
        width: 29px;
        height: 29px;
    }

    .pakherbal-trust-card__title {
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-trust-card {
        transition: none;
    }

    .pakherbal-trust-card:hover {
        transform: none;
    }
}
/* =========================================================
   END SOURCE: css/frontend/home/why-choose.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/blog-posts.css
   ========================================================= */
/* =========================================================
   PakHerbal Blog Posts
   File: public/css/frontend/home/blog-posts.css
   ========================================================= */

.pakherbal-blog-posts,
.pakherbal-blog-posts *,
.pakherbal-blog-posts *::before,
.pakherbal-blog-posts *::after {
    box-sizing: border-box;
}

.pakherbal-blog-posts {
    --blog-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --blog-green-dark: #4e9728;
    --blog-navy: #071827;
    --blog-navy-light: #12334b;
    --blog-text: #25322c;
    --blog-muted: #5e6963;
    --blog-background: #f6f8f2;
    --blog-card-background: #ffffff;
    --blog-border: rgba(36, 65, 46, 0.11);

    width: 100%;
    min-width: 0;
    overflow: hidden;
    background: var(--blog-background);
}

/* =========================================================
   Container and Header
   ========================================================= */

.pakherbal-blog-posts__container {
    width: min(100%, 1320px);
    margin: 0 auto;
    padding: 62px 28px 68px;
}

.pakherbal-blog-posts__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 28px;
}

.pakherbal-blog-posts__heading-group {
    min-width: 0;
}

.pakherbal-blog-posts__title {
    margin: 0;
    color: var(--blog-navy);
    font-size: clamp(31px, 3vw, 43px);
    font-weight: 900;
    line-height: 1.07;
    letter-spacing: -0.035em;
    overflow-wrap: anywhere;
}

.pakherbal-blog-posts__description {
    max-width: 760px;
    margin: 12px 0 0;
    color: var(--blog-muted);
    font-size: 15px;
    line-height: 1.68;
    overflow-wrap: anywhere;
}

.pakherbal-blog-posts__view-all {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 47px;
    padding: 11px 21px;
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            var(--blog-green),
            var(--blog-green-dark)
        );
    border: 1px solid var(--blog-green-dark);
    border-radius: 0;
    box-shadow:
        0 11px 22px rgba(73, 145, 37, 0.2);
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
    transition:
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-blog-posts__view-all svg {
    flex: 0 0 auto;
    transition: transform 160ms ease;
}

.pakherbal-blog-posts__view-all:hover {
    color: #ffffff;
    box-shadow:
        0 15px 27px rgba(73, 145, 37, 0.28);
    transform: translateY(-2px);
}

.pakherbal-blog-posts__view-all:hover svg {
    transform: translateX(3px);
}

.pakherbal-blog-posts__view-all:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Blog Grid
   ========================================================= */

.pakherbal-blog-posts__grid {
    display: grid;
    grid-template-columns:
        repeat(3, minmax(0, 1fr));
    align-items: stretch;
    gap: 20px;
}

/* =========================================================
   Blog Card
   ========================================================= */

.pakherbal-blog-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    overflow: hidden;
    background: var(--blog-card-background);
    border: 1px solid var(--blog-border);
    border-radius: 0;
    box-shadow:
        0 13px 28px rgba(26, 53, 37, 0.075);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-blog-card:hover {
    border-color: rgba(78, 151, 40, 0.3);
    box-shadow:
        0 19px 35px rgba(26, 53, 37, 0.13);
    transform: translateY(-4px);
}

/* =========================================================
   Blog Media
   ========================================================= */

.pakherbal-blog-card__media {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1.55 / 1;
    overflow: hidden;
    background: #e8efe2;
    border-radius: 0;
    text-decoration: none;
}

.pakherbal-blog-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
    transition: transform 320ms ease;
}

.pakherbal-blog-card:hover
.pakherbal-blog-card__image {
    transform: scale(1.035);
}

/* =========================================================
   Temporary Placeholder
   ========================================================= */

.pakherbal-blog-card__placeholder {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.pakherbal-blog-card__placeholder--green {
    background:
        radial-gradient(
            circle at 77% 18%,
            rgba(255, 255, 255, 0.52),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #dcebd3,
            #93bc79
        );
}

.pakherbal-blog-card__placeholder--gold {
    background:
        radial-gradient(
            circle at 77% 18%,
            rgba(255, 255, 255, 0.48),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #f3e5b5,
            #cfa551
        );
}

.pakherbal-blog-card__placeholder--earth {
    background:
        radial-gradient(
            circle at 77% 18%,
            rgba(255, 255, 255, 0.4),
            transparent 27%
        ),
        linear-gradient(
            145deg,
            #eadcc4,
            #b78e62
        );
}

.pakherbal-blog-card__placeholder-glow {
    position: absolute;
    top: -35%;
    left: -18%;
    width: 80%;
    height: 145%;
    background:
        radial-gradient(
            circle,
            rgba(255, 255, 255, 0.72),
            rgba(255, 255, 255, 0)
        );
}

.pakherbal-blog-card__placeholder-shadow {
    position: absolute;
    right: 50%;
    bottom: 9%;
    width: 55%;
    height: 8%;
    background: rgba(30, 55, 39, 0.18);
    border-radius: 50%;
    filter: blur(10px);
    transform: translateX(50%);
}

/* Herbal products placeholder */

.pakherbal-blog-card__herbal-bowl {
    position: absolute;
    z-index: 3;
    right: 50%;
    bottom: 17%;
    width: 36%;
    height: 26%;
    background:
        linear-gradient(
            180deg,
            #a66e36,
            #644221
        );
    clip-path:
        polygon(
            0 0,
            100% 0,
            82% 100%,
            18% 100%
        );
    transform: translateX(50%);
}

.pakherbal-blog-card__herbal-jar {
    position: absolute;
    z-index: 2;
    right: 18%;
    bottom: 18%;
    width: 21%;
    height: 46%;
    background:
        linear-gradient(
            145deg,
            #ffffff,
            #dfead8
        );
    border: 1px solid rgba(44, 78, 57, 0.12);
    box-shadow:
        0 16px 25px rgba(37, 69, 46, 0.15);
}

.pakherbal-blog-card__herbal-jar::before {
    position: absolute;
    top: -10%;
    left: -4%;
    width: 108%;
    height: 13%;
    content: "";
    background: #173f30;
}

/* Oils placeholder */

.pakherbal-blog-card__oil-bottle {
    position: absolute;
    bottom: 16%;
    background:
        linear-gradient(
            145deg,
            rgba(255, 255, 255, 0.97),
            rgba(234, 225, 186, 0.94)
        );
    border: 1px solid rgba(85, 66, 27, 0.12);
    box-shadow:
        0 18px 28px rgba(68, 54, 29, 0.17);
}

.pakherbal-blog-card__oil-bottle::before {
    position: absolute;
    top: -12%;
    left: 50%;
    width: 45%;
    height: 15%;
    content: "";
    background: #263a28;
    transform: translateX(-50%);
}

.pakherbal-blog-card__oil-bottle--large {
    right: 38%;
    width: 24%;
    height: 57%;
}

.pakherbal-blog-card__oil-bottle--small {
    right: 18%;
    width: 18%;
    height: 42%;
}

/* Pansar placeholder */

.pakherbal-blog-card__pansar-bowl {
    position: absolute;
    z-index: 3;
    right: 50%;
    bottom: 16%;
    width: 38%;
    height: 25%;
    background:
        linear-gradient(
            180deg,
            #9b6130,
            #603c1f
        );
    clip-path:
        polygon(
            0 0,
            100% 0,
            81% 100%,
            19% 100%
        );
    transform: translateX(50%);
}

.pakherbal-blog-card__pansar-pouch {
    position: absolute;
    bottom: 20%;
    background:
        linear-gradient(
            145deg,
            #f7f0da,
            #d3bc8c
        );
    clip-path:
        polygon(
            9% 0,
            91% 0,
            100% 13%,
            94% 100%,
            6% 100%,
            0 13%
        );
    box-shadow:
        0 16px 25px rgba(70, 52, 32, 0.15);
}

.pakherbal-blog-card__pansar-pouch--one {
    left: 16%;
    width: 21%;
    height: 46%;
}

.pakherbal-blog-card__pansar-pouch--two {
    right: 15%;
    width: 23%;
    height: 53%;
}

/* Shared leaves */

.pakherbal-blog-card__leaf {
    position: absolute;
    z-index: 2;
    background: rgba(62, 132, 61, 0.78);
    border-radius: 100% 0 100% 0;
}

.pakherbal-blog-card__leaf--one {
    top: 20%;
    left: 18%;
    width: 25%;
    height: 13%;
    transform: rotate(-25deg);
}

.pakherbal-blog-card__leaf--two {
    right: 29%;
    bottom: 29%;
    width: 20%;
    height: 11%;
    background: rgba(121, 201, 67, 0.78);
    transform: rotate(30deg);
}

.pakherbal-blog-card__leaf--three {
    top: 21%;
    left: 20%;
    width: 26%;
    height: 13%;
    transform: rotate(-23deg);
}

.pakherbal-blog-card__leaf--four {
    top: 18%;
    right: 31%;
    width: 24%;
    height: 12%;
    transform: rotate(-27deg);
}

/* =========================================================
   Card Content
   ========================================================= */

.pakherbal-blog-card__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    padding: 21px;
}

.pakherbal-blog-card__category {
    margin: 0 0 8px;
    color: var(--blog-green-dark);
    font-size: 11px;
    font-weight: 850;
    line-height: 1.3;
    letter-spacing: 0.055em;
    text-transform: uppercase;
}

.pakherbal-blog-card__title {
    min-height: 55px;
    margin: 0;
    font-size: 18px;
    font-weight: 850;
    line-height: 1.42;
}

.pakherbal-blog-card__title a {
    display: -webkit-box;
    overflow: hidden;
    color: var(--blog-text);
    text-decoration: none;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.pakherbal-blog-card__title a:hover {
    color: var(--blog-green-dark);
}

.pakherbal-blog-card__excerpt {
    display: -webkit-box;
    min-height: 69px;
    margin: 13px 0 0;
    overflow: hidden;
    color: var(--blog-muted);
    font-size: 13px;
    line-height: 1.72;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

.pakherbal-blog-card__link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    width: fit-content;
    margin-top: auto;
    padding-top: 18px;
    color: var(--blog-navy);
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-decoration: none;
}

.pakherbal-blog-card__link svg {
    flex: 0 0 auto;
    color: var(--blog-green-dark);
    transition: transform 160ms ease;
}

.pakherbal-blog-card__link:hover {
    color: var(--blog-green-dark);
}

.pakherbal-blog-card__link:hover svg {
    transform: translateX(3px);
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-blog-posts__container {
        padding-right: 20px;
        padding-left: 20px;
    }

    .pakherbal-blog-posts__grid {
        gap: 14px;
    }

    .pakherbal-blog-card__content {
        padding: 17px;
    }

    .pakherbal-blog-card__title {
        font-size: 16px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-blog-posts__container {
        padding: 44px 12px 48px;
    }

    .pakherbal-blog-posts__header {
        align-items: center;
        gap: 16px;
        margin-bottom: 21px;
    }

    .pakherbal-blog-posts__title {
        font-size: clamp(27px, 7.3vw, 36px);
    }

    .pakherbal-blog-posts__description {
        display: none;
    }

    .pakherbal-blog-posts__view-all {
        min-height: 41px;
        padding: 9px 12px;
        font-size: 11px;
    }

    .pakherbal-blog-posts__view-all svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-blog-posts__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 13px;
        width: min(100%, 540px);
        margin: 0 auto;
    }

    .pakherbal-blog-card {
        display: grid;
        grid-template-columns:
            minmax(145px, 0.8fr)
            minmax(0, 1.2fr);
    }

    .pakherbal-blog-card__media {
        height: 100%;
        min-height: 220px;
        aspect-ratio: auto;
    }

    .pakherbal-blog-card__content {
        justify-content: center;
        padding: 15px 13px;
    }

    .pakherbal-blog-card__category {
        margin-bottom: 6px;
        font-size: 9px;
    }

    .pakherbal-blog-card__title {
        min-height: auto;
        font-size: 14px;
        line-height: 1.38;
    }

    .pakherbal-blog-card__excerpt {
        min-height: auto;
        margin-top: 9px;
        font-size: 11px;
        line-height: 1.55;
        line-clamp: 4;
        -webkit-line-clamp: 4;
    }

    .pakherbal-blog-card__link {
        padding-top: 12px;
        font-size: 11px;
    }
}

/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 430px) {
    .pakherbal-blog-posts__header {
        align-items: flex-end;
    }

    .pakherbal-blog-posts__title {
        max-width: 215px;
        font-size: 28px;
    }

    .pakherbal-blog-posts__view-all span {
        max-width: 75px;
        white-space: normal;
    }

    .pakherbal-blog-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .pakherbal-blog-card__media {
        min-height: 205px;
        aspect-ratio: 1.55 / 1;
    }

    .pakherbal-blog-card__content {
        padding: 17px 14px;
    }

    .pakherbal-blog-card__title {
        font-size: 16px;
    }

    .pakherbal-blog-card__excerpt {
        font-size: 12px;
        line-clamp: 3;
        -webkit-line-clamp: 3;
    }
}

/* =========================================================
   Very Small Mobile
   ========================================================= */

@media (max-width: 359px) {
    .pakherbal-blog-posts__container {
        padding-right: 8px;
        padding-left: 8px;
    }

    .pakherbal-blog-posts__header {
        gap: 9px;
    }

    .pakherbal-blog-posts__title {
        font-size: 25px;
    }

    .pakherbal-blog-posts__view-all {
        padding-right: 8px;
        padding-left: 8px;
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-blog-posts__view-all,
    .pakherbal-blog-posts__view-all svg,
    .pakherbal-blog-card,
    .pakherbal-blog-card__image,
    .pakherbal-blog-card__link svg {
        transition: none;
    }

    .pakherbal-blog-posts__view-all:hover,
    .pakherbal-blog-posts__view-all:hover svg,
    .pakherbal-blog-card:hover,
    .pakherbal-blog-card:hover
    .pakherbal-blog-card__image,
    .pakherbal-blog-card__link:hover svg {
        transform: none;
    }
}

/* =========================================================
   END SOURCE: css/frontend/home/blog-posts.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/customer-reviews.css
   ========================================================= */
/* =========================================================
   PakHerbal Customer Reviews
   File: public/css/frontend/home/customer-reviews.css
   ========================================================= */

.pakherbal-customer-reviews,
.pakherbal-customer-reviews *,
.pakherbal-customer-reviews *::before,
.pakherbal-customer-reviews *::after {
    box-sizing: border-box;
}

.pakherbal-customer-reviews {
    --reviews-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --reviews-green-dark: #4e9728;
    --reviews-navy: #071827;
    --reviews-text: #27342d;
    --reviews-muted: #647069;
    --reviews-background: #eef4e8;
    --reviews-card-background: #ffffff;
    --reviews-border: rgba(36, 69, 47, 0.12);
    --reviews-star: #e2aa2d;

    width: 100%;
    min-width: 0;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 5% 8%,
            rgba(121, 201, 67, 0.09),
            transparent 24%
        ),
        radial-gradient(
            circle at 94% 88%,
            rgba(7, 24, 39, 0.045),
            transparent 27%
        ),
        var(--reviews-background);
}

/* =========================================================
   Container
   ========================================================= */

.pakherbal-customer-reviews__container {
    width: min(100%, 1320px);
    margin: 0 auto;
    padding: 58px 28px 64px;
}

/* =========================================================
   Header
   ========================================================= */

.pakherbal-customer-reviews__header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 32px;
    margin-bottom: 27px;
}

.pakherbal-customer-reviews__heading-group {
    min-width: 0;
}

.pakherbal-customer-reviews__title {
    margin: 0;
    color: var(--reviews-navy);
    font-size: clamp(31px, 3vw, 43px);
    font-weight: 900;
    line-height: 1.07;
    letter-spacing: -0.035em;
    overflow-wrap: anywhere;
}

.pakherbal-customer-reviews__description {
    max-width: 770px;
    margin: 12px 0 0;
    color: var(--reviews-muted);
    font-size: 15px;
    line-height: 1.68;
    overflow-wrap: anywhere;
}

/* =========================================================
   View All Button
   ========================================================= */

.pakherbal-customer-reviews__view-all {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-height: 47px;
    padding: 11px 20px;
    color: #ffffff;
    background: var(--reviews-navy);
    border: 1px solid var(--reviews-navy);
    border-radius: 0;
    box-shadow:
        0 11px 22px rgba(7, 24, 39, 0.16);
    font-size: 13px;
    font-weight: 850;
    line-height: 1.3;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 160ms ease,
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.pakherbal-customer-reviews__view-all svg {
    flex: 0 0 auto;
    color: var(--reviews-green);
    transition: transform 160ms ease;
}

.pakherbal-customer-reviews__view-all:hover {
    color: var(--reviews-navy);
    background: var(--reviews-green);
    border-color: var(--reviews-green);
    box-shadow:
        0 15px 27px rgba(73, 145, 37, 0.24);
    transform: translateY(-2px);
}

.pakherbal-customer-reviews__view-all:hover svg {
    color: var(--reviews-navy);
    transform: translateX(3px);
}

.pakherbal-customer-reviews__view-all:focus-visible {
    outline: 3px solid rgba(121, 201, 67, 0.42);
    outline-offset: 3px;
}

/* =========================================================
   Reviews Grid
   ========================================================= */

.pakherbal-customer-reviews__grid {
    display: grid;
    grid-template-columns:
        repeat(4, minmax(0, 1fr));
    align-items: stretch;
    gap: 15px;
}

/* =========================================================
   Review Card
   ========================================================= */

.pakherbal-review-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: 100%;
    padding: 20px;
    background: var(--reviews-card-background);
    border: 1px solid var(--reviews-border);
    border-top: 3px solid var(--reviews-green);
    border-radius: 0;
    box-shadow:
        0 12px 26px rgba(25, 53, 36, 0.07);
    transition:
        border-color 180ms ease,
        box-shadow 180ms ease,
        transform 180ms ease;
}

.pakherbal-review-card:hover {
    border-right-color: rgba(78, 151, 40, 0.28);
    border-bottom-color: rgba(78, 151, 40, 0.28);
    border-left-color: rgba(78, 151, 40, 0.28);
    box-shadow:
        0 18px 34px rgba(25, 53, 36, 0.12);
    transform: translateY(-3px);
}

/* =========================================================
   Quote and Rating
   ========================================================= */

.pakherbal-review-card__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pakherbal-review-card__quote {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    color: var(--reviews-green-dark);
    background: rgba(121, 201, 67, 0.13);
    border: 1px solid rgba(121, 201, 67, 0.17);
}

.pakherbal-review-card__quote svg {
    display: block;
    width: 20px;
    height: 20px;
}

.pakherbal-review-card__rating {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.pakherbal-review-card__rating svg {
    display: block;
    width: 15px;
    height: 15px;
    color: #d8ddd7;
}

.pakherbal-review-card__rating svg.is-active {
    color: var(--reviews-star);
}

/* =========================================================
   Review Content
   ========================================================= */

.pakherbal-review-card__text {
    display: -webkit-box;
    min-height: 112px;
    margin: 18px 0 0;
    overflow: hidden;
    color: var(--reviews-text);
    font-size: 13px;
    font-style: normal;
    line-height: 1.72;
    line-clamp: 5;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 5;
}

.pakherbal-review-card__subject {
    margin: 14px 0 0;
    padding-top: 12px;
    color: var(--reviews-muted);
    border-top: 1px solid rgba(36, 69, 47, 0.09);
    font-size: 11px;
    line-height: 1.5;
}

.pakherbal-review-card__subject strong {
    color: var(--reviews-green-dark);
    font-weight: 800;
}

/* =========================================================
   Customer Footer
   ========================================================= */

.pakherbal-review-card__footer {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding-top: 17px;
}

.pakherbal-review-card__avatar {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 41px;
    height: 41px;
    color: #ffffff;
    background:
        linear-gradient(
            145deg,
            var(--reviews-navy),
            #174733
        );
    border: 2px solid rgba(121, 201, 67, 0.45);
    border-radius: 0;
    font-size: 12px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.02em;
}

.pakherbal-review-card__customer {
    min-width: 0;
}

.pakherbal-review-card__name-row {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.pakherbal-review-card__name {
    display: block;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    color: var(--reviews-navy);
    font-size: 13px;
    font-style: normal;
    font-weight: 850;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pakherbal-review-card__verified {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 17px;
    height: 17px;
    color: var(--reviews-green-dark);
}

.pakherbal-review-card__verified svg {
    display: block;
    width: 17px;
    height: 17px;
}

.pakherbal-review-card__location {
    margin: 3px 0 0;
    color: var(--reviews-muted);
    font-size: 10px;
    line-height: 1.4;
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 1050px) {
    .pakherbal-customer-reviews__grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .pakherbal-review-card__text {
        min-height: 90px;
        line-clamp: 4;
        -webkit-line-clamp: 4;
    }
}

@media (max-width: 900px) {
    .pakherbal-customer-reviews__container {
        padding-right: 20px;
        padding-left: 20px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-customer-reviews__container {
        padding: 44px 12px 48px;
    }

    .pakherbal-customer-reviews__header {
        align-items: center;
        gap: 14px;
        margin-bottom: 21px;
    }

    .pakherbal-customer-reviews__title {
        font-size: clamp(27px, 7vw, 35px);
    }

    .pakherbal-customer-reviews__description {
        display: none;
    }

    .pakherbal-customer-reviews__view-all {
        min-height: 41px;
        padding: 9px 12px;
        font-size: 11px;
    }

    .pakherbal-customer-reviews__view-all svg {
        width: 15px;
        height: 15px;
    }

    .pakherbal-customer-reviews__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        width: min(100%, 540px);
        margin: 0 auto;
    }

    .pakherbal-review-card {
        padding: 16px;
    }

    .pakherbal-review-card__text {
        min-height: auto;
        margin-top: 14px;
        font-size: 12px;
        line-height: 1.65;
        line-clamp: 4;
        -webkit-line-clamp: 4;
    }

    .pakherbal-review-card__subject {
        margin-top: 11px;
        padding-top: 10px;
    }

    .pakherbal-review-card__footer {
        padding-top: 13px;
    }
}

/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 430px) {
    .pakherbal-customer-reviews__header {
        align-items: flex-end;
    }

    .pakherbal-customer-reviews__title {
        max-width: 205px;
        font-size: 28px;
    }

    .pakherbal-customer-reviews__view-all span {
        max-width: 70px;
        white-space: normal;
    }
}

@media (max-width: 359px) {
    .pakherbal-customer-reviews__container {
        padding-right: 8px;
        padding-left: 8px;
    }

    .pakherbal-customer-reviews__header {
        gap: 8px;
    }

    .pakherbal-customer-reviews__title {
        font-size: 25px;
    }

    .pakherbal-customer-reviews__view-all {
        padding-right: 8px;
        padding-left: 8px;
        font-size: 10px;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-customer-reviews__view-all,
    .pakherbal-customer-reviews__view-all svg,
    .pakherbal-review-card {
        transition: none;
    }

    .pakherbal-customer-reviews__view-all:hover,
    .pakherbal-customer-reviews__view-all:hover svg,
    .pakherbal-review-card:hover {
        transform: none;
    }
}
/* =========================================================
   END SOURCE: css/frontend/home/customer-reviews.css
   ========================================================= */

/* =========================================================
   BEGIN SOURCE: css/frontend/home/home-newsletter.css
   ========================================================= */
/* =========================================================
   PakHerbal Compact Homepage Newsletter
   File: public/css/frontend/home/home-newsletter.css
   ========================================================= */

.pakherbal-home-newsletter,
.pakherbal-home-newsletter *,
.pakherbal-home-newsletter *::before,
.pakherbal-home-newsletter *::after {
    box-sizing: border-box;
}

/* =========================================================
   Outer Section
   Light background separates newsletter from footer
   ========================================================= */

.pakherbal-home-newsletter {
    --home-newsletter-green: var(
        --pakherbal-theme-primary,
        #79c943
    );

    --home-newsletter-green-dark: #4e9728;
    --home-newsletter-navy: #071827;
    --home-newsletter-white: #ffffff;
    --home-newsletter-muted: rgba(255, 255, 255, 0.74);
    --home-newsletter-page-bg: #f4f7ef;

    width: 100%;
    min-width: 0;
    padding: 34px 0 42px;
    overflow: hidden;
    background: var(--home-newsletter-page-bg);
}

/* =========================================================
   Long Newsletter Card
   ========================================================= */

.pakherbal-home-newsletter__container {
    display: grid;
    grid-template-columns:
        auto
        minmax(280px, 0.9fr)
        minmax(400px, 1.1fr);
    align-items: center;
    gap: 22px;

    width: min(calc(100% - 56px), 1320px);
    margin: 0 auto;
    padding: 28px 30px;

    color: var(--home-newsletter-white);

    background:
        radial-gradient(
            circle at 5% 20%,
            rgba(121, 201, 67, 0.17),
            transparent 24%
        ),
        radial-gradient(
            circle at 95% 82%,
            rgba(121, 201, 67, 0.11),
            transparent 26%
        ),
        linear-gradient(
            115deg,
            #071827 0%,
            #0d3029 58%,
            #154733 100%
        );

    border: 1px solid rgba(7, 24, 39, 0.12);
    border-radius: 0;

    box-shadow:
        0 18px 38px rgba(18, 47, 34, 0.13);
}

/* =========================================================
   Main Icon
   ========================================================= */

.pakherbal-home-newsletter__icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;

    width: 56px;
    height: 56px;

    color: var(--home-newsletter-navy);
    background: var(--home-newsletter-green);

    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 0;

    box-shadow:
        0 11px 22px rgba(0, 0, 0, 0.18);
}

.pakherbal-home-newsletter__icon svg {
    display: block;
    width: 29px;
    height: 29px;
}

/* =========================================================
   Text Content
   ========================================================= */

.pakherbal-home-newsletter__content {
    min-width: 0;
}

.pakherbal-home-newsletter__title {
    margin: 0;

    color: #ffffff;

    font-size: clamp(23px, 2.05vw, 31px);
    font-weight: 900;
    line-height: 1.12;
    letter-spacing: -0.025em;

    overflow-wrap: anywhere;
}

.pakherbal-home-newsletter__description {
    max-width: 530px;
    margin: 7px 0 0;

    color: var(--home-newsletter-muted);

    font-size: 13px;
    line-height: 1.56;

    overflow-wrap: anywhere;
}

/* =========================================================
   Form Area
   ========================================================= */

.pakherbal-home-newsletter__form-area {
    min-width: 0;
}

.pakherbal-home-newsletter__form {
    width: 100%;
    margin: 0;
}

.pakherbal-home-newsletter__label {
    position: absolute;

    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;

    overflow: hidden;
    clip: rect(0, 0, 0, 0);

    white-space: nowrap;
    border: 0;
}

/* =========================================================
   Email Field
   ========================================================= */

.pakherbal-home-newsletter__field {
    display: grid;
    grid-template-columns:
        auto
        minmax(0, 1fr)
        auto;
    align-items: center;

    width: 100%;
    min-height: 50px;
    padding-left: 14px;

    overflow: hidden;

    background: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 0;

    box-shadow:
        0 12px 24px rgba(0, 0, 0, 0.17);
}

.pakherbal-home-newsletter__field:focus-within {
    border-color: var(--home-newsletter-green);

    box-shadow:
        0 0 0 3px rgba(121, 201, 67, 0.18),
        0 12px 24px rgba(0, 0, 0, 0.17);
}

.pakherbal-home-newsletter__field-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 21px;
    height: 21px;

    color: var(--home-newsletter-green-dark);
}

.pakherbal-home-newsletter__field-icon svg {
    display: block;
    width: 19px;
    height: 19px;
}

.pakherbal-home-newsletter__input {
    display: block;

    width: 100%;
    min-width: 0;
    height: 48px;
    padding: 0 11px;

    color: var(--home-newsletter-navy);
    background: transparent;

    border: 0;
    border-radius: 0;
    outline: 0;

    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}

.pakherbal-home-newsletter__input::placeholder {
    color: #77817c;
    opacity: 1;
}

/* =========================================================
   Subscribe Button
   ========================================================= */

.pakherbal-home-newsletter__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 50px;
    padding: 10px 20px;

    color: var(--home-newsletter-navy);
    background: var(--home-newsletter-green);

    border: 0;
    border-left: 1px solid rgba(7, 24, 39, 0.1);
    border-radius: 0;

    cursor: pointer;

    font-family: inherit;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.3;

    transition:
        color 160ms ease,
        background-color 160ms ease;
}

.pakherbal-home-newsletter__button svg {
    display: block;
    flex: 0 0 auto;

    width: 17px;
    height: 17px;

    transition: transform 160ms ease;
}

.pakherbal-home-newsletter__button:hover {
    color: #ffffff;
    background: var(--home-newsletter-green-dark);
}

.pakherbal-home-newsletter__button:hover svg {
    transform: translateX(3px);
}

.pakherbal-home-newsletter__button:focus-visible {
    outline: 3px solid rgba(7, 24, 39, 0.35);
    outline-offset: -4px;
}

/* =========================================================
   Privacy Text
   ========================================================= */

.pakherbal-home-newsletter__privacy {
    display: flex;
    align-items: center;
    gap: 6px;

    margin: 7px 0 0;

    color: rgba(255, 255, 255, 0.64);

    font-size: 10px;
    font-weight: 600;
    line-height: 1.4;
}

.pakherbal-home-newsletter__privacy svg {
    display: block;
    flex: 0 0 auto;

    width: 14px;
    height: 14px;

    color: var(--home-newsletter-green);
}

/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 991px) {
    .pakherbal-home-newsletter {
        padding-top: 30px;
        padding-bottom: 36px;
    }

    .pakherbal-home-newsletter__container {
        grid-template-columns:
            auto
            minmax(0, 1fr);
        gap: 16px 19px;

        width: min(calc(100% - 40px), 1320px);
        padding: 25px 24px;
    }

    .pakherbal-home-newsletter__form-area {
        grid-column: 1 / -1;
    }

    .pakherbal-home-newsletter__description {
        max-width: 680px;
    }
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {
    .pakherbal-home-newsletter {
        padding: 24px 0 30px;
    }

    .pakherbal-home-newsletter__container {
        grid-template-columns:
            auto
            minmax(0, 1fr);
        gap: 12px;

        width: calc(100% - 20px);
        padding: 20px 14px;
    }

    .pakherbal-home-newsletter__icon {
        width: 45px;
        height: 45px;
    }

    .pakherbal-home-newsletter__icon svg {
        width: 23px;
        height: 23px;
    }

    .pakherbal-home-newsletter__title {
        font-size: clamp(20px, 5.8vw, 27px);
    }

    .pakherbal-home-newsletter__description {
        display: none;
    }

    .pakherbal-home-newsletter__form-area {
        grid-column: 1 / -1;
    }

    .pakherbal-home-newsletter__field {
        min-height: 47px;
        padding-left: 10px;
    }

    .pakherbal-home-newsletter__input {
        height: 45px;
        padding-right: 7px;
        padding-left: 8px;

        font-size: 12px;
    }

    .pakherbal-home-newsletter__button {
        min-height: 47px;
        padding-right: 13px;
        padding-left: 13px;

        font-size: 11px;
    }

    .pakherbal-home-newsletter__privacy {
        margin-top: 6px;
        font-size: 9px;
    }
}

/* =========================================================
   Small Mobile
   ========================================================= */

@media (max-width: 390px) {
    .pakherbal-home-newsletter {
        padding-top: 20px;
        padding-bottom: 26px;
    }

    .pakherbal-home-newsletter__container {
        width: calc(100% - 16px);
        padding: 17px 10px;
    }

    .pakherbal-home-newsletter__title {
        font-size: 21px;
    }

    .pakherbal-home-newsletter__field {
        grid-template-columns:
            auto
            minmax(0, 1fr);

        padding: 7px 7px 0;
    }

    .pakherbal-home-newsletter__field-icon {
        align-self: start;
        margin-top: 12px;
    }

    .pakherbal-home-newsletter__input {
        height: 43px;
    }

    .pakherbal-home-newsletter__button {
        grid-column: 1 / -1;

        width: calc(100% + 14px);
        min-height: 42px;
        margin-left: -7px;

        border-top: 1px solid rgba(7, 24, 39, 0.1);
        border-left: 0;
    }
}

/* =========================================================
   Reduced Motion
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
    .pakherbal-home-newsletter__button,
    .pakherbal-home-newsletter__button svg {
        transition: none;
    }

    .pakherbal-home-newsletter__button:hover svg {
        transform: none;
    }
}
/* =========================================================
   END SOURCE: css/frontend/home/home-newsletter.css
   ========================================================= */