/* =====================================================================
   Altayseer decorative world-map backgrounds
   - Uses a mask so the same asset adapts to light and dark themes.
   - Decorative only: no impact on reading order or accessibility.
   - The image can be replaced from Dashboard > الهوية وصور الموقع.
   ===================================================================== */

.public-site {
    --world-map-color: #1c427b;
    --world-map-opacity: .12;
    --world-map-size: min(1700px, 96vw);
}

html[data-theme="dark"] .public-site {
    --world-map-color: #ffffff;
    --world-map-opacity: .07;
}

.map-watermark {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}

.map-watermark > :not(.world-map-watermark) {
    position: relative;
    z-index: 1;
}

.world-map-watermark {
    position: absolute;
    z-index: 0;
    inset: 0;
    pointer-events: none;
    user-select: none;
    background-color: var(--world-map-color);
    opacity: var(--world-map-opacity);
    -webkit-mask-image: var(--site-world-map-image);
    mask-image: var(--site-world-map-image);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: var(--world-map-size) auto;
    mask-size: var(--world-map-size) auto;
    transform: translateZ(0);
}

.world-map-watermark--wide {
    --world-map-size: min(1760px, 98vw);
}

.world-map-watermark--soft {
    opacity: calc(var--world-map-opacity);
}
html[data-theme="dark"] .world-map-watermark--soft {
    opacity: calc(var(--world-map-opacity) * .72);
}

.world-map-watermark--strong {
    opacity: calc(var(--world-map-opacity) * 1.22);
}

.world-map-watermark--top {
    -webkit-mask-position: center 12%;
    mask-position: center 12%;
}

.world-map-watermark--bottom {
    -webkit-mask-position: center 88%;
    mask-position: center 88%;
}

.world-map-watermark--dark {
    --world-map-color: #ffffff;
    --world-map-opacity: .09;
}

/* Home page placement */
/* Home page placement */
.home-services-showcase-section .world-map-watermark {
    inset: 0 0 auto;
    height: clamp(330px, 38vw, 540px);
    -webkit-mask-position: center top;
    mask-position: center top;
}

/* توحيد إعدادات الخلفية النهارية مثل قسم آخر الأخبار */
.home-about-section .world-map-watermark,
.home-news-section .world-map-watermark,
.home-presence-section .world-map-watermark,
.home-companies-section .world-map-watermark,
.home-cta-section .world-map-watermark {
    inset-inline-start: -5%;
    inset-inline-end: -5%;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: min(1700px, 96vw) auto;
    mask-size: min(1700px, 96vw) auto;
    opacity: .11;
}

/* Keep cards/forms crisp over the watermark. */
.map-watermark .service-card,
.map-watermark .news-card,
.map-watermark .two-cards article,
.map-watermark .contact-form,
.map-watermark .contact-aside,
.map-watermark .article-header-grid,
.map-watermark .content-narrow {
    position: relative;
}

/* Footer has a permanent dark background in both themes. */
.footer.map-watermark .world-map-watermark {
    --world-map-color: #ffffff;
    --world-map-opacity: .075;
    -webkit-mask-position: center 35%;
    mask-position: center 35%;
    -webkit-mask-size: min(1450px, 92vw) auto;
    mask-size: min(1450px, 92vw) auto;
}

/* News article header needs a little more contrast around the title. */
.article-header.map-watermark .world-map-watermark {
    --world-map-opacity: .055;
    -webkit-mask-position: center 43%;
    mask-position: center 43%;
}

/* Privacy and terms page hero is dark and has no media image. */
.page-hero.map-watermark .world-map-watermark--dark {
    -webkit-mask-size: min(1250px, 88vw) auto;
    mask-size: min(1250px, 88vw) auto;
    -webkit-mask-position: center 44%;
    mask-position: center 44%;
}

@media (max-width: 900px) {
    .public-site {
        --world-map-opacity: .09;
        --world-map-size: 1120px;
    }

    .world-map-watermark--wide {
        --world-map-size: 1280px;
    }

    .home-services-showcase-section .world-map-watermark {
        height: 360px;
    }
}

@media (max-width: 620px) {
    .public-site {
        --world-map-opacity: .07;
        --world-map-size: 920px;
    }

    .world-map-watermark,
    .world-map-watermark--top,
    .world-map-watermark--bottom {
        -webkit-mask-position: center top;
        mask-position: center top;
    }

    .home-services-showcase-section .world-map-watermark {
        height: 290px;
        -webkit-mask-size: 900px auto;
        mask-size: 900px auto;
    }

    .footer.map-watermark .world-map-watermark {
        -webkit-mask-size: 980px auto;
        mask-size: 980px auto;
        -webkit-mask-position: center 22%;
        mask-position: center 22%;
    }
}

@media (prefers-reduced-transparency: reduce) {
    .world-map-watermark {
        opacity: .035;
    }
}