.hero-cover {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate;
}

@media (min-width: 782px) {
    .hero-reverse {
        display: flex !important;
        flex-direction: row-reverse !important;
    }
}

@media (min-width: 782px) {
    .hero-reverse .wp-block-column:last-child {
        padding-left: 45px !important;
    }

@media (min-width: 782px) {
    /* هيرو سيڪشن کي پوزيشن ڏيڻ */
    .hero-cover {
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* لکت ۽ تصوير کي دائرن کان مٿي رکڻ */
    .hero-reverse {
        position: relative !important;
        z-index: 2 !important;
    }
}

@media (min-width: 782px) {
    /* 1. هيڊنگ کي معمولي مٿي ڪرڻ */
    .hero-reverse h1.wp-block-heading {
        margin-top: -30px !important;
        margin-bottom: 20px !important;
    }
    /* 2. پيراگراف جي هيٺان پريميم پيلي (Yellow) پٽي */
    .hero-reverse p {
        border-bottom: 4px solid #FFDE4D !important;
        padding-bottom: 15px !important;
        margin-bottom: 30px !important;
    }
    /* 3. بٽڻ تي مڪمل وائٽ (White) ڊبل بٽڻ وارو پاڇو */
    .hero-reverse .wp-block-button__link {
        position: relative !important;
        box-shadow: 6px 6px 0px 0px #ffffff, 10px 10px 20px rgba(0,0,0,0.15) !important;
    }
}

@media (max-width: 781px) {
    /* موبائل تي هيرو سيڪشن کي پوزيشن ڏيڻ */
    .hero-cover {
        position: relative !important;
        overflow: hidden !important;
    }
    /* موبائل تي لکت ۽ تصوير کي دائرن کان مٿي رکڻ */
    .hero-reverse {
        position: relative !important;
        z-index: 2 !important;
    }
}
@media (max-width: 781px) {
    .hero-cover {
        position: relative !important;
        overflow: hidden !important;
    }
    
    /* 1. پهريون دائرو: تصوير جي پٺيان (بلڪل چٽو سرڪل) */
    .hero-cover::before {
        content: "" !important;
        position: absolute !important;
        pointer-events: none !important;
        z-index: 1 !important;
        width: 300px !important;
        height: 300px !important;
        /* transparent هٽائي بلڪل پڪو گول دائرو ڪيو ويو آهي */
        background: radial-gradient(circle, rgba(255, 165, 0, 0.50) 69%, transparent 70%) !important;
        
        /* جڳهه ساڳي آهي */
        top: 40px !important;
        left: 100px !important;
    }

    /* 2. ٻيو دائرو: هيٺين ڪنڊ تي (بلڪل چٽو سرڪل) */
    .hero-cover::after {
        content: "" !important;
        position: absolute !important;
        pointer-events: none !important;
        z-index: 1 !important;
        width: 250px !important;
        height: 250px !important;
        /* transparent هٽائي بلڪل پڪو گول دائرو ڪيو ويو آهي */
        background: radial-gradient(circle, rgba(255, 165, 0, 0.70) 69%, transparent 70%) !important;
        
        /* جڳهه ساڳي آهي */
        bottom: 10px !important;
        left: -50px !important;
    }

    .hero-reverse {
        position: relative !important;
        z-index: 2 !important;
    }
}