/*
|--------------------------------------------------------------------------
| Salehly Home Page — Refined Layout
|--------------------------------------------------------------------------
| Scoped to .salehly-home only.
| No JavaScript, routes, controllers, forms, or security logic are changed.
*/

.salehly-home {
    --home-primary: #326bc9;
    --home-primary-dark: #2457a8;
    --home-primary-soft: #eef4fd;
    --home-heading: #172033;
    --home-text: #667085;
    --home-muted: #8a94a6;
    --home-surface: #ffffff;
    --home-surface-alt: #f7f9fc;
    --home-border: #dce6f4;
    --home-radius: 16px;
    --home-shadow: 0 8px 24px rgba(20, 33, 61, 0.07);

    overflow: hidden;
    color: var(--home-text);
    background: var(--home-surface);
}

/* Keep the page width controlled and consistent. */
.salehly-home .container,
.salehly-home .container-fluid {
    width: 100%;
    max-width: 1240px;
    margin-inline: auto;
    padding-inline: 24px;
}

/* Remove animation states that can leave text hidden. */
.salehly-home [data-aos],
.salehly-home .wow,
.salehly-home .animated {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
}

.salehly-home .highlighted-text-swipe {
    display: none !important;
}

.salehly-home .highlighted-image,
.salehly-home .highlighted-image svg {
    opacity: 1 !important;
    visibility: visible !important;
    animation: none !important;
    transform: none !important;
}

.salehly-home .highlighted-image {
    color: var(--home-primary);
}

/* Do not clip Arabic headings or descriptions. */
.salehly-home h1[class*="line-count-"],
.salehly-home h2[class*="line-count-"],
.salehly-home h3[class*="line-count-"],
.salehly-home .iq-title-desc[class*="line-count-"],
.salehly-home .section-padding.pt-0 p[class*="line-count-"] {
    display: block !important;
    overflow: visible !important;
    text-overflow: initial !important;
    -webkit-box-orient: initial !important;
    -webkit-line-clamp: unset !important;
}

/* Common section rhythm. */
.salehly-home .section-padding {
    padding-top: 52px;
    padding-bottom: 52px;
}

.salehly-home .section-padding.bg-light {
    background: var(--home-surface-alt) !important;
}

.salehly-home .iq-title-box {
    margin-bottom: 22px;
}

.salehly-home .iq-title-box.center {
    margin-bottom: 32px;
}

.salehly-home .iq-title-box h2,
.salehly-home .iq-title-box h3 {
    margin: 0;
    color: var(--home-heading);
    font-weight: 700;
    line-height: 1.38;
    letter-spacing: 0;
}

.salehly-home .iq-title-box h2 {
    font-size: clamp(2rem, 3vw, 2.8rem);
}

.salehly-home .iq-title-box h3 {
    font-size: clamp(1.65rem, 2.4vw, 2.15rem);
}

.salehly-home .iq-title-desc {
    max-width: 760px;
    color: var(--home-text) !important;
    font-size: 0.98rem;
    line-height: 1.9;
}

.salehly-home .btn-link {
    color: var(--home-primary) !important;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: none;
}

.salehly-home .btn-link:hover,
.salehly-home .btn-link:focus {
    color: var(--home-primary-dark) !important;
}

/* -------------------------------------------------------------------------
   HERO
   ------------------------------------------------------------------------- */
.salehly-home > .padding-top-bottom-90.bg-light:first-child {
    position: relative;
    padding: 54px 0;
    border-bottom: 1px solid var(--home-border);
    background:
        radial-gradient(circle at 92% 15%, rgba(50, 107, 201, 0.13), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #f3f7fd 100%) !important;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child::before {
    content: "";
    position: absolute;
    inset-inline-end: -90px;
    bottom: -130px;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: rgba(50, 107, 201, 0.055);
    pointer-events: none;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .row {
    min-height: 390px;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .col-xl-6:first-child {
    position: relative;
    z-index: 2;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-box {
    max-width: 720px;
    margin-bottom: 26px !important;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-box h2 {
    max-width: 720px;
    font-size: clamp(2.25rem, 3.6vw, 3.35rem);
    line-height: 1.32;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-desc {
    max-width: 680px;
    font-size: 1rem;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .me-xl-5,
.salehly-home > .padding-top-bottom-90.bg-light:first-child .pe-xl-5 {
    margin-inline-end: 0 !important;
    padding-inline-end: 0 !important;
}

/* Expand the hero text when the provider slider is disabled. */
.salehly-home > .padding-top-bottom-90.bg-light:first-child .row:not(:has(.iq-team-slider)) > .col-xl-6 {
    flex: 0 0 100%;
    max-width: 100%;
}

.salehly-home > .padding-top-bottom-90.bg-light:first-child .row:not(:has(.iq-team-slider)) > .col-xl-6 > div {
    max-width: 880px;
    margin-inline: auto !important;
}

/* Provider slider in hero. */
.salehly-home .iq-team-slider {
    max-height: 430px;
}

.salehly-home .iq-team-slider .iq-banner-img img {
    width: 100%;
    height: 410px;
    border-radius: var(--home-radius);
    object-fit: cover;
}

.salehly-home .iq-team-slider .service-slide-items-4,
.salehly-home .iq-team-slider .swiper-slide > div {
    margin-top: 0 !important;
}

.salehly-home .iq-team-slider .card-box {
    margin-top: -60px;
}

.salehly-home .iq-team-slider .card-description {
    padding: 16px 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px !important;
    box-shadow: 0 10px 25px rgba(20, 33, 61, 0.14);
}

/* -------------------------------------------------------------------------
   CATEGORIES
   ------------------------------------------------------------------------- */
.salehly-home .category-box-list,
.salehly-home .category-card {
    min-height: 220px;
    padding: 22px !important;
    border: 1px solid var(--home-border);
    border-radius: var(--home-radius) !important;
    background: var(--home-surface);
    box-shadow: var(--home-shadow);
    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.salehly-home .category-box-list:hover,
.salehly-home .category-card:hover {
    border-color: rgba(50, 107, 201, 0.35);
    box-shadow: 0 12px 30px rgba(20, 33, 61, 0.10);
    transform: translateY(-3px);
}

.salehly-home .category-box-list .img-bg,
.salehly-home .category-card .img-bg {
    width: 74px;
    height: 74px;
    padding: 14px;
    border-radius: 14px;
    background: var(--home-primary-soft) !important;
}

.salehly-home .category-box-list .img-bg img,
.salehly-home .category-card .img-bg img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.salehly-home .category-box-list .categories-name,
.salehly-home .category-card .categories-name {
    margin-top: 18px;
}

.salehly-home .category-box-list .categories-name a,
.salehly-home .category-card .categories-name a,
.salehly-home .category-box-list .category-item,
.salehly-home .category-card .categories-desc {
    color: var(--home-heading) !important;
}

.salehly-home .category-box-list .categories-desc,
.salehly-home .category-card .categories-desc {
    color: var(--home-text) !important;
    font-size: 0.9rem;
    line-height: 1.75;
}

/* Disable the original circle animation that hides text on hover. */
.salehly-home .circle-clip-effect::after {
    display: none !important;
}

.salehly-home .circle-clip-effect:hover .img-bg,
.salehly-home .circle-clip-effect:hover .category-link,
.salehly-home .swiper-slide-active .img-bg,
.salehly-home .swiper-slide-active .category-link {
    color: var(--home-heading) !important;
    background: var(--home-primary-soft) !important;
}

.salehly-home .circle-clip-effect:hover .categories-name a,
.salehly-home .circle-clip-effect:hover .category-item,
.salehly-home .swiper-slide-active .categories-name a,
.salehly-home .swiper-slide-active .category-item,
.salehly-home .circle-clip-effect:hover .categories-desc,
.salehly-home .circle-clip-effect:hover .categories-name {
    color: var(--home-heading) !important;
}

/* -------------------------------------------------------------------------
   SERVICES
   ------------------------------------------------------------------------- */
.salehly-home .our-service {
    border-top: 1px solid rgba(220, 230, 244, 0.7);
    border-bottom: 1px solid rgba(220, 230, 244, 0.7);
}

.salehly-home .our-service > .container > div + div {
    margin-top: 38px !important;
    padding-top: 34px;
    border-top: 1px solid var(--home-border);
}

.salehly-home .our-service service-slider-section {
    display: block;
    margin-top: 22px;
}

.salehly-home .service-box-card {
    height: 100%;
    padding: 12px 12px 18px !important;
    border: 1px solid var(--home-border);
    border-radius: var(--home-radius) !important;
    background: var(--home-surface) !important;
    box-shadow: var(--home-shadow);
    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.salehly-home .service-box-card:hover {
    border-color: rgba(50, 107, 201, 0.35);
    box-shadow: 0 12px 30px rgba(20, 33, 61, 0.10);
    transform: translateY(-3px);
}

.salehly-home .service-box-card .service-img,
.salehly-home .service-slide-items-3 .service-img,
.salehly-home .service-slide-items-4 .service-img,
.salehly-home .col-lg-3 .service-img,
.salehly-home .col-lg-4 .service-img {
    width: 100%;
    height: 190px;
    border-radius: 13px;
    object-fit: cover;
}

.salehly-home .service-box-card a.service-heading {
    padding-top: 12px;
    padding-bottom: 10px;
}

.salehly-home .service-box-card .service-title {
    color: var(--home-heading);
    font-size: 1rem;
    line-height: 1.6;
}

.salehly-home .our-service .swiper,
.salehly-home .our-service .swiper-wrapper {
    min-height: 0 !important;
}

/* Reduce empty-state whitespace without hiding messages. */
.salehly-home .our-service .dataTables_empty,
.salehly-home .our-service .text-center:has(> .text-body:only-child) {
    padding-block: 18px !important;
}

/* -------------------------------------------------------------------------
   JOIN US
   ------------------------------------------------------------------------- */
.salehly-home > .bg-primary-subtle {
    margin: 0;
    border-top: 1px solid var(--home-border);
    border-bottom: 1px solid var(--home-border);
    background: linear-gradient(135deg, #eef4fd 0%, #f8fbff 100%) !important;
}

.salehly-home .provider-section {
    padding-top: 54px;
    padding-bottom: 54px;
}

.salehly-home .provider-section .iq-title-box {
    max-width: 760px;
    margin-inline: auto;
    margin-bottom: 22px !important;
}

.salehly-home .provider-section .iq-title-box h2 {
    font-size: clamp(2rem, 3vw, 2.7rem);
}

.salehly-home .provider-section .provider {
    max-width: 125px;
}

.salehly-home .provider-section a.bg-primary {
    padding: 13px 24px !important;
    border-radius: 10px !important;
    background: var(--home-primary) !important;
    box-shadow: 0 8px 20px rgba(50, 107, 201, 0.22);
    font-size: 0.92rem;
}

/* -------------------------------------------------------------------------
   TESTIMONIALS
   ------------------------------------------------------------------------- */
.salehly-home .section-padding.bg-light.px-0 {
    padding-top: 48px;
    padding-bottom: 48px;
}

.salehly-home .section-padding.bg-light.px-0 .text-center.mb-5 {
    margin-bottom: 30px !important;
}

.salehly-home .section-padding.bg-light.px-0 .bg-body.rounded-5 {
    padding: 10px 22px !important;
    border: 1px solid var(--home-border);
    box-shadow: 0 5px 18px rgba(20, 33, 61, 0.05);
}

.salehly-home .iq-testimonial {
    height: 100%;
    margin-top: 18px;
    padding: 28px;
    border: 1px solid var(--home-border);
    border-radius: var(--home-radius);
    background: var(--home-surface);
    box-shadow: var(--home-shadow);
}

.salehly-home .iq-testimonial .testimonial-content {
    font-size: 1rem;
    line-height: 1.9;
}

.salehly-home .iq-testimonial .quote {
    top: -18px;
    right: 28px;
    width: 40px;
    height: 40px;
    line-height: 40px;
}

/* -------------------------------------------------------------------------
   APP DOWNLOAD
   ------------------------------------------------------------------------- */
.salehly-home .section-padding .bg-primary.rounded-3 {
    max-width: 1120px;
    margin-inline: auto;
    padding-inline: 34px !important;
    border-radius: 20px !important;
    background: linear-gradient(135deg, #326bc9 0%, #2457a8 100%) !important;
    box-shadow: 0 18px 40px rgba(36, 87, 168, 0.18);
}

.salehly-home .section-padding .bg-primary.rounded-3 .my-5 {
    margin-top: 38px !important;
    margin-bottom: 38px !important;
}

.salehly-home .section-padding .bg-primary.rounded-3 h2 {
    font-size: clamp(2rem, 3vw, 2.65rem);
}

.salehly-home .section-padding .bg-primary.rounded-3 .col-lg-6:last-child > img {
    max-height: 390px;
    object-fit: contain;
}

.salehly-home .app-link img {
    width: 155px;
    height: 50px;
    object-fit: contain;
}

.salehly-home .app-link {
    display: inline-flex;
    border-radius: 9px;
    transition: transform 0.2s ease;
}

.salehly-home .app-link:hover {
    transform: translateY(-2px);
}

/* -------------------------------------------------------------------------
   BUSINESS MANAGEMENT / VIDEO
   ------------------------------------------------------------------------- */
.salehly-home .section-padding.pt-0 {
    padding-top: 18px !important;
    padding-bottom: 54px;
}

.salehly-home .section-padding.pt-0 > .container > .row:first-child {
    padding-top: 22px;
}

.salehly-home .section-padding.pt-0 .row.align-items-center.mt-5.pt-lg-5 {
    margin-top: 26px !important;
    padding-top: 0 !important;
}

.salehly-home .section-padding.pt-0 .col-lg-6.pe-xl-5 {
    padding-inline-end: 22px !important;
}

.salehly-home .section-padding.pt-0 .col-lg-6.ps-xl-5 {
    padding-inline-start: 22px !important;
}

.salehly-home .section-padding.pt-0 img.rounded {
    width: 100%;
    max-height: 430px;
    border-radius: 18px !important;
    object-fit: contain;
    box-shadow: var(--home-shadow);
}

.salehly-home .section-padding.pt-0 .mb-4.pb-4.border-bottom {
    margin-bottom: 18px !important;
    padding-bottom: 18px !important;
}

.salehly-home .iq-icon-box.with-numbers .number {
    width: 38px;
    height: 38px;
    line-height: 38px;
    border-radius: 10px;
    color: #ffffff;
    background: var(--home-primary);
}

/* -------------------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------------------- */
@media (max-width: 1199.98px) {
    .salehly-home .container,
    .salehly-home .container-fluid {
        padding-inline: 20px;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child .row {
        min-height: auto;
    }

    .salehly-home .iq-team-slider {
        max-height: none;
    }

    .salehly-home .iq-team-slider .iq-banner-img img {
        height: 360px;
    }
}

@media (max-width: 991.98px) {
    .salehly-home .section-padding {
        padding-top: 44px;
        padding-bottom: 44px;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child {
        padding: 44px 0;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-box h2 {
        font-size: 2.45rem;
    }

    .salehly-home .provider-section {
        padding-top: 46px;
        padding-bottom: 46px;
    }

    .salehly-home .section-padding .bg-primary.rounded-3 {
        padding-inline: 26px !important;
    }

    .salehly-home .section-padding .bg-primary.rounded-3 .col-lg-6:last-child > img {
        max-height: 340px;
    }
}

@media (max-width: 767.98px) {
    .salehly-home .container,
    .salehly-home .container-fluid {
        padding-inline: 16px;
    }

    .salehly-home .section-padding {
        padding-top: 36px;
        padding-bottom: 36px;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child {
        padding: 36px 0;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-box {
        margin-bottom: 20px !important;
    }

    .salehly-home > .padding-top-bottom-90.bg-light:first-child .iq-title-box h2 {
        font-size: 2rem;
        line-height: 1.42;
    }

    .salehly-home .iq-title-box h3 {
        font-size: 1.55rem;
    }

    .salehly-home .iq-title-desc {
        font-size: 0.92rem;
        line-height: 1.8;
    }

    .salehly-home .iq-team-slider .iq-banner-img img {
        height: 300px;
    }

    .salehly-home .category-box-list,
    .salehly-home .category-card {
        min-height: 190px;
        padding: 18px !important;
    }

    .salehly-home .category-box-list .img-bg,
    .salehly-home .category-card .img-bg {
        width: 64px;
        height: 64px;
    }

    .salehly-home .service-box-card .service-img,
    .salehly-home .service-slide-items-3 .service-img,
    .salehly-home .service-slide-items-4 .service-img,
    .salehly-home .col-lg-3 .service-img,
    .salehly-home .col-lg-4 .service-img {
        height: 175px;
    }

    .salehly-home .provider-section {
        padding-top: 38px;
        padding-bottom: 38px;
    }

    .salehly-home .provider-section a.bg-primary {
        width: 100%;
        padding: 12px 16px !important;
        overflow-wrap: anywhere;
    }

    .salehly-home .section-padding.bg-light.px-0 {
        padding-top: 38px;
        padding-bottom: 38px;
    }

    .salehly-home .iq-testimonial {
        padding: 24px 20px;
    }

    .salehly-home .section-padding .bg-primary.rounded-3 {
        padding-inline: 18px !important;
        border-radius: 16px !important;
    }

    .salehly-home .section-padding .bg-primary.rounded-3 .my-5 {
        margin-top: 28px !important;
        margin-bottom: 28px !important;
    }

    .salehly-home .section-padding .bg-primary.rounded-3 .col-lg-6:last-child > img {
        max-height: 300px;
    }

    .salehly-home .app-link img {
        width: 140px;
        height: 46px;
    }

    .salehly-home .section-padding.pt-0 {
        padding-top: 8px !important;
        padding-bottom: 38px;
    }

    .salehly-home .section-padding.pt-0 .row.align-items-center.mt-5.pt-lg-5 {
        margin-top: 20px !important;
    }

    .salehly-home .section-padding.pt-0 img.rounded {
        max-height: 320px;
    }

    .salehly-home .section-padding.pt-0 .col-lg-6.pe-xl-5,
    .salehly-home .section-padding.pt-0 .col-lg-6.ps-xl-5 {
        padding-inline: 12px !important;
    }
}

/* Keep accessibility while avoiding disappearing-content animations. */
@media (prefers-reduced-motion: reduce) {
    .salehly-home *,
    .salehly-home *::before,
    .salehly-home *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}


/*
|--------------------------------------------------------------------------
| Salehly Home Hero — Professional Restore
|--------------------------------------------------------------------------
| أضف هذا الجزء في نهاية salehly-home.css
| يحافظ على العنوان والوصف والبحث والسلايدر الأصليين.
*/

.salehly-home .salehly-home-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 52px 0 !important;
    border-bottom: 1px solid #dce6f4;
    background:
        radial-gradient(circle at 88% 12%, rgba(50, 107, 201, 0.14), transparent 30%),
        linear-gradient(135deg, #ffffff 0%, #f4f8fe 100%) !important;
}

.salehly-home .salehly-home-hero::before,
.salehly-home .salehly-home-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    border-radius: 50%;
    pointer-events: none;
}

.salehly-home .salehly-home-hero::before {
    inset-inline-start: -120px;
    bottom: -165px;
    width: 310px;
    height: 310px;
    background: rgba(50, 107, 201, 0.055);
}

.salehly-home .salehly-home-hero::after {
    inset-inline-end: -100px;
    top: -150px;
    width: 290px;
    height: 290px;
    border: 1px solid rgba(50, 107, 201, 0.10);
}

.salehly-home .salehly-home-hero .container-fluid {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1240px;
    margin-inline: auto;
    padding-inline: 24px;
}

.salehly-home .salehly-home-hero > .container-fluid > .row {
    min-height: 390px;
}

.salehly-home .salehly-home-hero .iq-title-box,
.salehly-home .salehly-home-hero .iq-title-box h2,
.salehly-home .salehly-home-hero .iq-title-desc,
.salehly-home .salehly-home-hero .highlighted-text,
.salehly-home .salehly-home-hero .highlighted-text-swipe,
.salehly-home .salehly-home-hero .highlighted-image,
.salehly-home .salehly-home-hero .highlighted-image svg {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    animation: none !important;
}

.salehly-home .salehly-home-hero .iq-title-box {
    display: block !important;
    max-width: 690px;
    margin-bottom: 26px !important;
}

.salehly-home .salehly-home-hero .iq-title-box > .iq-title-box {
    margin-bottom: 0 !important;
}

.salehly-home .salehly-home-hero .iq-title-box h2 {
    display: block !important;
    overflow: visible !important;
    max-width: 690px;
    margin: 0;
    color: #172033 !important;
    font-size: clamp(2.35rem, 3.5vw, 3.45rem);
    font-weight: 800;
    line-height: 1.28;
    letter-spacing: 0;
    text-overflow: initial !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
}

.salehly-home .salehly-home-hero .iq-title-desc {
    display: block !important;
    overflow: visible !important;
    max-width: 660px;
    margin-top: 18px !important;
    color: #667085 !important;
    font-size: 1rem;
    line-height: 1.95;
    text-overflow: initial !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
}

.salehly-home .salehly-home-hero .highlighted-image {
    color: #326bc9 !important;
}

.salehly-home .salehly-home-hero .highlighted-text-swipe {
    display: none !important;
}

.salehly-home .salehly-home-hero location-search {
    display: block;
    width: 100%;
    max-width: 720px;
}

.salehly-home .salehly-home-hero--centered .salehly-home-hero__content {
    width: 100%;
    max-width: 900px;
}

.salehly-home .salehly-home-hero--centered .iq-title-box,
.salehly-home .salehly-home-hero--centered .iq-title-box h2,
.salehly-home .salehly-home-hero--centered .iq-title-desc,
.salehly-home .salehly-home-hero--centered location-search {
    margin-inline: auto;
}

.salehly-home .salehly-home-hero .iq-team-slider .iq-banner-img img {
    width: 100%;
    height: 390px;
    border-radius: 18px;
    object-fit: cover;
}

.salehly-home .salehly-home-hero .iq-team-slider .service-slide-items-4,
.salehly-home .salehly-home-hero .iq-team-slider .swiper-slide > div {
    margin-top: 0 !important;
}

@media (max-width: 1199.98px) {
    .salehly-home .salehly-home-hero {
        padding: 44px 0 !important;
    }

    .salehly-home .salehly-home-hero > .container-fluid > .row {
        min-height: auto;
    }

    .salehly-home .salehly-home-hero .iq-title-box,
    .salehly-home .salehly-home-hero .iq-title-box h2,
    .salehly-home .salehly-home-hero .iq-title-desc,
    .salehly-home .salehly-home-hero location-search {
        margin-inline: auto;
        text-align: center;
    }
}

@media (max-width: 767.98px) {
    .salehly-home .salehly-home-hero {
        padding: 34px 0 !important;
    }

    .salehly-home .salehly-home-hero .container-fluid {
        padding-inline: 16px;
    }

    .salehly-home .salehly-home-hero .iq-title-box h2 {
        font-size: 2rem;
        line-height: 1.42;
    }

    .salehly-home .salehly-home-hero .iq-title-desc {
        font-size: 0.92rem;
        line-height: 1.8;
    }

    .salehly-home .salehly-home-hero .iq-team-slider .iq-banner-img img {
        height: 300px;
    }
}


/* =========================================================
   SALEHLY HERO — ALL SERVICES BUTTON (NO NPM REQUIRED)
   أضف هذا الجزء في نهاية public/css/salehly-home.css
   ========================================================= */

/* إخفاء قائمة الخدمتين القديمة داخل البانر فقط */
.salehly-home .salehly-home-hero .categories-list {
    display: none !important;
}

/* زر تصفح جميع الخدمات */
.salehly-home .salehly-home-hero__all-services {
    display: flex;
    justify-content: center;
    margin-top: 18px;
}

.salehly-home .salehly-home-hero__all-services .btn {
    min-width: 220px;
    padding: 13px 30px;
    border-radius: 12px;
    font-size: 0.95rem;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(50, 107, 201, 0.20);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.salehly-home .salehly-home-hero__all-services .btn:hover,
.salehly-home .salehly-home-hero__all-services .btn:focus {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(50, 107, 201, 0.24);
}

@media (max-width: 575.98px) {
    .salehly-home .salehly-home-hero__all-services .btn {
        width: 100%;
        min-width: 0;
    }
}


/* =========================================================
   SALEHLY — GOOEY SEARCH FINAL
   بحث مصغّر يتمدد عند المرور أو التركيز
   ========================================================= */

@media (min-width: 768px) {
    .salehly-home .salehly-home-hero location-search {
        display: block !important;
        width: 100% !important;
        max-width: none !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper {
        display: block !important;
        width: max-content !important;
        max-width: calc(100vw - 40px) !important;
        margin: 28px auto 0 !important;
        padding: 7px !important;
        border: 1px solid rgba(50, 107, 201, 0.14) !important;
        border-radius: 999px !important;
        background: rgba(255, 255, 255, 0.96) !important;
        box-shadow:
            0 16px 38px rgba(20, 33, 61, 0.10),
            inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper > .d-flex,
    .salehly-home .salehly-home-hero .search-box-wrapper > .d-flex > .d-flex {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        gap: 8px !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .d-flex.align-items-center.flex-wrap > .p-3 {
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    [data-bs-target="#modal-location"] {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 8px !important;
        width: auto !important;
        height: 54px !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 0 17px !important;
        border: 0 !important;
        border-radius: 999px !important;
        color: #626b79 !important;
        background: #f4f7fc !important;
        white-space: nowrap !important;
        cursor: pointer !important;
        transition:
            color 0.25s ease,
            background-color 0.25s ease,
            transform 0.25s ease !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    [data-bs-target="#modal-location"]:hover {
        color: #326bc9 !important;
        background: #eaf1fb !important;
        transform: translateY(-1px);
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group {
        position: relative !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        width: 58px !important;
        min-width: 58px !important;
        max-width: 58px !important;
        height: 54px !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 0 18px !important;
        overflow: visible !important;
        border: 1px solid rgba(50, 107, 201, 0.13) !important;
        border-radius: 999px !important;
        background: linear-gradient(135deg, #f8faff 0%, #edf3fb 100%) !important;
        cursor: text !important;
        transition:
            width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            min-width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            max-width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            border-color 0.3s ease,
            background-color 0.3s ease,
            box-shadow 0.3s ease,
            transform 0.3s ease !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group.border-start {
        border-inline-start: 1px solid rgba(50, 107, 201, 0.13) !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group::before {
        content: "";
        position: absolute;
        inset: 5px;
        border-radius: 999px;
        background: radial-gradient(circle at center, rgba(50, 107, 201, 0.13), transparent 68%);
        opacity: 0.7;
        pointer-events: none;
        transition:
            opacity 0.3s ease,
            transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:hover,
    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:focus-within {
        width: 290px !important;
        min-width: 290px !important;
        max-width: 290px !important;
        border-color: rgba(50, 107, 201, 0.32) !important;
        background: #ffffff !important;
        box-shadow:
            0 13px 30px rgba(50, 107, 201, 0.15),
            0 0 0 4px rgba(50, 107, 201, 0.06) !important;
        transform: translateY(-2px);
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:hover::before,
    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:focus-within::before {
        opacity: 0;
        transform: scale(1.5);
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group .input-group-text {
        position: relative !important;
        z-index: 2 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 20px !important;
        width: 20px !important;
        height: 20px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        color: #667085 !important;
        background: transparent !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group input[type="text"] {
        position: relative !important;
        z-index: 2 !important;
        flex: 0 0 auto !important;
        width: 0 !important;
        min-width: 0 !important;
        max-width: 0 !important;
        height: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
        outline: 0 !important;
        color: #344054 !important;
        background: transparent !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition:
            width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            min-width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            max-width 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            margin 0.45s cubic-bezier(0.16, 1, 0.3, 1),
            opacity 0.22s ease !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:hover input[type="text"],
    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group:focus-within input[type="text"] {
        width: 202px !important;
        min-width: 202px !important;
        max-width: 202px !important;
        margin-inline-start: 11px !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group .dropdown-menu {
        position: absolute !important;
        top: calc(100% + 10px) !important;
        inset-inline-start: 0 !important;
        inset-inline-end: auto !important;
        width: 290px !important;
        min-width: 290px !important;
        margin: 0 !important;
        border: 1px solid rgba(50, 107, 201, 0.13) !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 18px 45px rgba(20, 33, 61, 0.16) !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    > .d-flex > .py-2.px-3 {
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper .btn-primary {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        height: 54px !important;
        min-height: 54px !important;
        margin: 0 !important;
        padding: 0 23px !important;
        border-radius: 999px !important;
        font-weight: 700 !important;
        white-space: nowrap !important;
        box-shadow: 0 9px 22px rgba(50, 107, 201, 0.20) !important;
        transition:
            transform 0.25s ease,
            box-shadow 0.25s ease,
            background-color 0.25s ease !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 13px 28px rgba(50, 107, 201, 0.26) !important;
    }
}

@media (max-width: 767.98px) {
    .salehly-home .salehly-home-hero .search-box-wrapper {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 22px !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper > .d-flex,
    .salehly-home .salehly-home-hero .search-box-wrapper > .d-flex > .d-flex {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        gap: 8px !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    [data-bs-target="#modal-location"] {
        width: 100% !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 0 14px !important;
        border-radius: 13px !important;
        background: #f5f8fc !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .d-flex.align-items-center.flex-wrap > .p-3 {
        width: 100% !important;
        padding: 0 !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 0 15px !important;
        border: 1px solid rgba(50, 107, 201, 0.16) !important;
        border-radius: 13px !important;
        background: #ffffff !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group::before {
        display: none !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    .form-group.input-group input[type="text"] {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-inline-start: 9px !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper
    > .d-flex > .py-2.px-3 {
        width: 100% !important;
        padding: 0 !important;
    }

    .salehly-home .salehly-home-hero .search-box-wrapper .btn-primary {
        width: 100% !important;
        height: 50px !important;
        border-radius: 13px !important;
    }
    
}

/* =========================================================
   SALEHLY — POPULAR CATEGORIES BEAM V2
   حد متحرك على البطاقة الأصلية دون Wrapper أو تغيير القياسات
   ========================================================= */

.salehly-home .salehly-categories-section {
    position: relative;
    overflow: hidden;
    padding-top: 60px !important;
    padding-bottom: 60px !important;
    background:
        radial-gradient(
            circle at 85% 10%,
            rgba(50, 107, 201, 0.07),
            transparent 28%
        ),
        #ffffff;
}

.salehly-home
.salehly-categories-section
> .container {
    position: relative;
    z-index: 1;
    max-width: 1240px;
}

.salehly-home
.salehly-categories-section
> .container
> .d-flex {
    margin-bottom: 28px;
}

.salehly-home
.salehly-categories-section
.iq-title-box h3 {
    margin: 0;
    color: #172033;
    font-size: clamp(1.8rem, 2.8vw, 2.65rem);
    font-weight: 800;
    line-height: 1.35;
}

/*
 * يضاف الكلاس مباشرة إلى البطاقة الأصلية.
 * لا يتم إنشاء Wrapper ولا تغيير أعمدة Bootstrap أو أحجام الصور.
 */
.salehly-home
.salehly-categories-section
.salehly-category-beam {
    position: relative !important;
    isolation: isolate !important;
    overflow: hidden !important;

    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;

    box-shadow:
        0 12px 30px
        rgba(24, 41, 75, 0.08) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

/* الشعاع الدائري المتحرك */
.salehly-home
.salehly-categories-section
.salehly-category-beam::before {
    content: "";

    position: absolute;
    inset: -85%;
    z-index: 0;

    background:
        conic-gradient(
            from 0deg,
            transparent 0deg 250deg,
            rgba(50, 107, 201, 0.08) 266deg,
            #326bc9 292deg,
            #6ea8fe 314deg,
            #eaf1fb 332deg,
            transparent 352deg 360deg
        );

    animation:
        salehly-category-beam-spin
        3s
        linear
        infinite;

    transform-origin: center;
    will-change: transform;
    pointer-events: none;
}

/* السطح الداخلي، ويترك 2px فقط للحد المتحرك */
.salehly-home
.salehly-categories-section
.salehly-category-beam::after {
    content: "";

    position: absolute;
    inset: 2px;
    z-index: 1;

    border-radius: 16px;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdff 100%
        );

    pointer-events: none;
}

/* إبقاء المحتوى أعلى طبقات الحد */
.salehly-home
.salehly-categories-section
.salehly-category-beam
> * {
    position: relative;
    z-index: 2;
}

/*
 * إلغاء تأثير القالب القديم فقط عندما تكون البطاقة نفسها
 * هي circle-clip-effect، مع إبقاء سطح Beam الداخلي ظاهرًا.
 */
.salehly-home
.salehly-categories-section
.salehly-category-beam.circle-clip-effect::after {
    display: block !important;
    inset: 2px !important;
    border-radius: 16px !important;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdff 100%
        ) !important;
    clip-path: none !important;
    transform: none !important;
}

/*
 * لا نغير عرض البطاقة أو padding أو حجم الأيقونة.
 * الأحجام تبقى من تنسيق الصفحة الأساسي أعلاه.
 */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.img-bg,
.salehly-home
.salehly-categories-section
.salehly-category-beam
img {
    position: relative;
    z-index: 3;
}

/* العنوان والوصف */
.salehly-home
.salehly-categories-section
.salehly-category-beam
h1,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h2,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h3,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h4,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h5,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h6 {
    position: relative;
    z-index: 3;
    color: #172033 !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam
p {
    position: relative;
    z-index: 3;
    color: #667085 !important;
    line-height: 1.75 !important;
}

/* حركة المرور */
.salehly-home
.salehly-categories-section
.salehly-category-beam:hover {
    transform: translateY(-5px);

    box-shadow:
        0 20px 42px
        rgba(50, 107, 201, 0.15) !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam:hover::before {
    animation-duration: 1.8s;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam:hover
.img-bg,
.salehly-home
.salehly-categories-section
.salehly-category-beam:hover
img {
    transform: translateY(-2px) scale(1.03);
}

@keyframes salehly-category-beam-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 767.98px) {
    .salehly-home .salehly-categories-section {
        padding-top: 42px !important;
        padding-bottom: 42px !important;
    }
}

/* احترام إعداد تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
    .salehly-home
    .salehly-categories-section
    .salehly-category-beam::before {
        animation: none !important;
    }
}


/* =========================================================
   VIEW ALL — CONFETTI BUTTON
   ========================================================= */

.salehly-home .salehly-view-all-confetti {
    position: relative;
    isolation: isolate;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    min-height: 44px;
    padding: 10px 18px !important;

    overflow: visible;

    border:
        1px solid
        rgba(50, 107, 201, 0.18) !important;

    border-radius: 999px !important;

    color: #326bc9 !important;
    background: #eaf1fb !important;

    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1;

    text-decoration: none !important;

    box-shadow:
        0 8px 20px rgba(50, 107, 201, 0.08);

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

.salehly-home
.salehly-view-all-confetti:hover,
.salehly-home
.salehly-view-all-confetti:focus {
    color: #ffffff !important;
    border-color: #326bc9 !important;
    background: #326bc9 !important;

    transform: translateY(-2px);

    box-shadow:
        0 12px 26px rgba(50, 107, 201, 0.22);
}

.salehly-home
.salehly-view-all-confetti svg {
    transition:
        transform 0.25s ease;
}

.salehly-home
.salehly-view-all-confetti:hover svg {
    transform: translateX(-3px);
}

html[dir="ltr"]
.salehly-home
.salehly-view-all-confetti:hover svg {
    transform: translateX(3px);
}

/* جسيم القصاصات */
.salehly-confetti-particle {
    position: absolute;
    z-index: 10;

    left: 50%;
    top: 50%;

    width: var(--salehly-confetti-size, 6px);
    height: var(--salehly-confetti-size, 6px);

    border-radius: var(--salehly-confetti-radius, 2px);

    background:
        var(
            --salehly-confetti-color,
            #326bc9
        );

    pointer-events: none;

    transform:
        translate(-50%, -50%)
        rotate(0deg);

    animation:
        salehly-confetti-fly
        0.9s
        cubic-bezier(0.16, 1, 0.3, 1)
        forwards;

    will-change:
        transform,
        opacity;
}

@keyframes salehly-confetti-fly {
    to {
        transform:
            translate(
                calc(-50% + var(--salehly-tx)),
                calc(-50% + var(--salehly-ty))
            )
            rotate(var(--salehly-rotation));

        opacity: 0;
    }
}

/* الجوال */
@media (max-width: 767.98px) {
    .salehly-home .salehly-categories-section {
        padding-top: 42px !important;
        padding-bottom: 42px !important;
    }

    .salehly-home
    .salehly-category-beam
    .salehly-category-beam-inner {
        min-height: 210px;
        padding: 18px !important;
    }

    .salehly-home .salehly-view-all-confetti {
        min-height: 40px;
        padding: 9px 15px !important;
    }
}

/* احترام إعداد تقليل الحركة */
@media (prefers-reduced-motion: reduce) {
    .salehly-confetti-particle {
        display: none !important;
    }
}
/* =========================================================
   SALEHLY CATEGORY BEAM — ALIGNED CARDS V10
   ========================================================= */

.salehly-home
.salehly-categories-section
.salehly-category-beam {
    position: relative !important;
    isolation: isolate !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    min-height: 220px !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 22px !important;

    overflow: hidden !important;

    border: 0 !important;
    border-radius: 18px !important;

    background: transparent !important;

    text-align: center !important;

    box-shadow:
        0 12px 30px
        rgba(24, 41, 75, 0.08) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam::before {
    content: "" !important;

    position: absolute !important;
    inset: -90% !important;
    z-index: 0 !important;

    display: block !important;

    background:
        conic-gradient(
            from 0deg,
            transparent 0deg 248deg,
            rgba(50, 107, 201, 0.12) 266deg,
            #326bc9 292deg,
            #6ea8fe 315deg,
            #eaf1fb 334deg,
            transparent 353deg 360deg
        ) !important;

    animation:
        salehly-beam-v10-spin
        3s
        linear
        infinite !important;

    transform-origin: center !important;

    pointer-events: none !important;
    will-change: transform;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam::after {
    content: "" !important;

    position: absolute !important;
    inset: 2px !important;
    z-index: 1 !important;

    display: block !important;

    border-radius: 16px !important;

    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #fbfdff 100%
        ) !important;

    clip-path: none !important;
    transform: none !important;

    pointer-events: none !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam
> * {
    position: relative !important;
    z-index: 2 !important;
}

/* حاوية موحدة لجميع الأيقونات */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.img-bg {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 72px !important;

    width: 72px !important;
    height: 72px !important;

    margin: 0 auto 18px !important;
    padding: 11px !important;

    border-radius: 14px !important;

    background: #eaf1fb !important;

    transform: none !important;
}

/* توحيد حجم الصور داخل الأيقونات */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.img-bg
img {
    display: block !important;

    width: 50px !important;
    height: 50px !important;
    max-width: 50px !important;
    max-height: 50px !important;

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

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    object-fit: contain !important;
    transform: none !important;
}

/* عند عدم وجود img-bg */
.salehly-home
.salehly-categories-section
.salehly-category-beam
> img {
    display: block !important;

    width: 72px !important;
    height: 72px !important;

    margin: 0 auto 18px !important;
    padding: 11px !important;

    border-radius: 14px !important;

    background: #eaf1fb !important;

    object-fit: contain !important;
}

/* توحيد موضع العنوان */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.categories-name {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 32px !important;

    margin: 0 0 8px !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam
h1,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h2,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h3,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h4,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h5,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h6 {
    width: 100% !important;
    min-height: 32px !important;

    margin: 0 0 8px !important;

    color: #172033 !important;

    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;

    text-align: center !important;
}

/* توحيد ارتفاع الوصف */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.categories-desc,
.salehly-home
.salehly-categories-section
.salehly-category-beam
p {
    display: -webkit-box !important;

    width: 100% !important;
    min-height: 68px !important;
    max-height: 68px !important;

    margin: 0 !important;

    overflow: hidden !important;

    color: #667085 !important;

    font-size: 0.88rem !important;
    line-height: 1.75 !important;

    text-align: center !important;

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

.salehly-home
.salehly-categories-section
.salehly-category-beam:hover {
    transform: translateY(-5px);

    box-shadow:
        0 20px 42px
        rgba(50, 107, 201, 0.15) !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam:hover::before {
    animation-duration: 1.7s !important;
}

@keyframes salehly-beam-v10-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 767.98px) {
    .salehly-home
    .salehly-categories-section
    .salehly-category-beam {
        min-height: 205px !important;
        padding: 18px !important;
    }

    .salehly-home
    .salehly-categories-section
    .salehly-category-beam
    .img-bg {
        width: 66px !important;
        height: 66px !important;
        flex-basis: 66px !important;
    }

    .salehly-home
    .salehly-categories-section
    .salehly-category-beam
    .img-bg
    img {
        width: 44px !important;
        height: 44px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .salehly-home
    .salehly-categories-section
    .salehly-category-beam::before {
        animation: none !important;
    }
}

/* =========================================================
   SALEHLY CATEGORY CARDS — CLEAN ALIGNMENT V12
   إزالة شكل البطاقة المزدوج وتوحيد الأيقونات والمحتوى
   ========================================================= */

.salehly-home
.salehly-categories-section
.salehly-category-beam {
    position: relative !important;
    isolation: isolate !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;
    min-height: 238px !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 24px 20px 20px !important;

    overflow: hidden !important;

    border: 0 !important;
    border-radius: 18px !important;

    background: transparent !important;

    text-align: center !important;

    box-shadow:
        0 12px 30px
        rgba(24, 41, 75, 0.08) !important;
}

/*
 * إزالة تصميم البطاقة الداخلية حتى لا تظهر
 * بطاقة بيضاء ثانية داخل إطار Beam.
 */
.salehly-home
.salehly-categories-section
.salehly-category-beam
:is(
    .category-box-list,
    .category-card,
    .circle-clip-effect,
    .card
) {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;

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

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

    overflow: visible !important;

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

    box-shadow: none !important;
    transform: none !important;
}

/* جعل أول عنصر داخلي يملأ البطاقة */
.salehly-home
.salehly-categories-section
.salehly-category-beam
> * {
    position: relative !important;
    z-index: 2 !important;

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

    margin-inline: auto !important;
}

/* إلغاء المؤثر القديم داخل البطاقة */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.circle-clip-effect::after,
.salehly-home
.salehly-categories-section
.salehly-category-beam
.circle-clip-effect::before {
    display: none !important;
}

/* حاوية موحدة للأيقونات */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.img-bg {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex: 0 0 72px !important;

    width: 72px !important;
    height: 72px !important;

    margin: 0 auto 16px !important;
    padding: 10px !important;

    border: 0 !important;
    border-radius: 14px !important;

    background: #eaf1fb !important;

    box-shadow: none !important;
    transform: none !important;
}

/* توحيد قياس جميع صور التصنيفات */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.img-bg
img {
    display: block !important;

    width: 50px !important;
    height: 50px !important;

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

    min-height: 50px !important;
    max-height: 50px !important;

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

    border: 0 !important;
    border-radius: 0 !important;

    background: transparent !important;

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

    box-shadow: none !important;
    transform: none !important;
}

/* صورة مباشرة دون img-bg */
.salehly-home
.salehly-categories-section
.salehly-category-beam
> img {
    display: block !important;

    width: 72px !important;
    height: 72px !important;

    margin: 0 auto 16px !important;
    padding: 10px !important;

    border-radius: 14px !important;

    background: #eaf1fb !important;

    object-fit: contain !important;
}

/* توحيد العناوين */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.categories-name {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 34px !important;

    margin: 0 0 7px !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam
.categories-name
a,
.salehly-home
.salehly-categories-section
.salehly-category-beam
.category-link,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h1,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h2,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h3,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h4,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h5,
.salehly-home
.salehly-categories-section
.salehly-category-beam
h6 {
    width: 100% !important;

    margin: 0 !important;

    color: #172033 !important;

    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.6 !important;

    text-align: center !important;
    text-decoration: none !important;
}

/* توحيد الوصف ومنع اختلاف أطوال البطاقات */
.salehly-home
.salehly-categories-section
.salehly-category-beam
.categories-desc,
.salehly-home
.salehly-categories-section
.salehly-category-beam
p {
    display: -webkit-box !important;

    width: 100% !important;
    min-height: 68px !important;
    max-height: 68px !important;

    margin: 0 !important;

    overflow: hidden !important;

    color: #667085 !important;

    font-size: 0.88rem !important;
    font-weight: 400 !important;
    line-height: 1.75 !important;

    text-align: center !important;

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

/* إظهار الحد فوق الخلفية وتحت المحتوى */
.salehly-home
.salehly-categories-section
.salehly-category-beam::before {
    z-index: 0 !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam::after {
    z-index: 1 !important;
}

.salehly-home
.salehly-categories-section
.salehly-category-beam
> * {
    z-index: 2 !important;
}

/* حركة بسيطة عند المرور */
.salehly-home
.salehly-categories-section
.salehly-category-beam:hover {
    transform: translateY(-5px) !important;

    box-shadow:
        0 20px 42px
        rgba(50, 107, 201, 0.15) !important;
}

@media (max-width: 767.98px) {
    .salehly-home
    .salehly-categories-section
    .salehly-category-beam {
        min-height: 220px !important;
        padding: 20px 16px 16px !important;
    }

    .salehly-home
    .salehly-categories-section
    .salehly-category-beam
    .img-bg {
        width: 66px !important;
        height: 66px !important;
        flex-basis: 66px !important;
    }

    .salehly-home
    .salehly-categories-section
    .salehly-category-beam
    .img-bg
    img {
        width: 46px !important;
        height: 46px !important;

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

        min-height: 46px !important;
        max-height: 46px !important;
    }
}
/* ========================================================================
   SALEHLY HOME — STRUCTURAL REFRESH V3 (2026-07-25)
   - ترتيب الأقسام ومنع التداخل
   - دمج روابط المتاجر داخل قسم الانضمام
   - تحسين التباين في الوضع الداكن
   ======================================================================== */

.salehly-home {
    overflow-x: hidden !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
    min-height: 100vh;
}

.salehly-home > .section-padding,
.salehly-home > .salehly-join-section,
.salehly-home > .bg-primary-subtle,
.salehly-home > .padding-top-bottom-90 {
    position: relative;
    isolation: isolate;
    width: 100%;
    margin: 0 !important;
}

.salehly-home .section-padding {
    padding-block: clamp(48px, 6vw, 78px) !important;
}

.salehly-home .section-padding > .container,
.salehly-home .section-padding > .container-fluid,
.salehly-home .salehly-join-section > .container {
    position: relative;
    z-index: 1;
}

.salehly-home .salehly-categories-section {
    border-block: 1px solid rgba(50, 107, 201, 0.10);
    background:
        radial-gradient(circle at 8% 10%, rgba(50, 107, 201, 0.07), transparent 26%),
        linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
}

.salehly-home .salehly-categories-section > .container > .d-flex,
.salehly-home .our-service > .container > div > .d-flex {
    min-height: 52px;
    margin-bottom: 28px !important;
    padding-bottom: 18px;
    border-bottom: 1px solid rgba(50, 107, 201, 0.12);
}

.salehly-home .salehly-categories-section .iq-title-box h3,
.salehly-home .our-service .iq-title-box h3 {
    position: relative;
    z-index: 2;
    opacity: 1 !important;
    visibility: visible !important;
    color: #152642 !important;
    text-shadow: none !important;
}

.salehly-home .salehly-categories-section .highlighted-image,
.salehly-home .our-service .highlighted-image {
    color: #326bc9 !important;
}

.salehly-home .our-service {
    overflow: visible !important;
    border-block: 1px solid rgba(50, 107, 201, 0.10) !important;
    background: #f3f7fd !important;
}

.salehly-home .our-service > .container > div {
    position: relative;
    overflow: visible;
}

.salehly-home .our-service > .container > div + div {
    margin-top: clamp(38px, 5vw, 62px) !important;
    padding-top: clamp(34px, 4vw, 52px) !important;
}

.salehly-home service-slider-section,
.salehly-home category-section,
.salehly-home promotion-banner-section {
    display: block;
    width: 100%;
    min-width: 0;
}

/* ------------------------------------------------------------------------
   JOIN SALEHLY — consolidated CTA
   ------------------------------------------------------------------------ */
.salehly-home .salehly-join-section {
    padding-block: clamp(54px, 7vw, 88px);
    border-top: 1px solid rgba(50, 107, 201, 0.10);
    background:
        radial-gradient(circle at 12% 16%, rgba(50, 107, 201, 0.09), transparent 28%),
        linear-gradient(180deg, #ffffff 0%, #f6f9fe 100%);
}

.salehly-home .salehly-join-card {
    min-height: 360px;
    padding: clamp(52px, 7vw, 82px) clamp(24px, 8vw, 110px);
    border: 1px solid rgba(117, 169, 240, 0.32);
    border-radius: 30px;
    background:
        linear-gradient(135deg, rgba(16, 50, 99, 0.98) 0%, rgba(38, 94, 177, 0.97) 56%, rgba(55, 119, 218, 0.96) 100%);
    box-shadow:
        0 28px 70px rgba(25, 65, 126, 0.20),
        inset 0 1px 0 rgba(255, 255, 255, 0.18);
}

.salehly-home .salehly-join-card::before {
    content: "";
    position: absolute;
    inset: 1px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 29px;
    pointer-events: none;
}

.salehly-home .salehly-join-content {
    z-index: 3;
    width: min(760px, 100%);
    margin-inline: auto;
}

.salehly-home .salehly-join-content .iq-title-box h2 {
    color: #ffffff !important;
    font-size: clamp(2rem, 4vw, 3.35rem);
    font-weight: 800;
    line-height: 1.35;
    text-wrap: balance;
}

.salehly-home .salehly-join-content .iq-title-desc {
    max-width: 700px;
    color: rgba(255, 255, 255, 0.83) !important;
    font-size: clamp(0.98rem, 1.5vw, 1.1rem);
    line-height: 2;
}

.salehly-home .salehly-join-store-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 30px;
}

.salehly-home .salehly-store-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 164px;
    min-height: 54px;
    padding: 3px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-radius: 12px;
    background: rgba(7, 20, 42, 0.82);
    box-shadow: 0 12px 26px rgba(8, 24, 51, 0.20);
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        box-shadow 0.24s ease;
}

.salehly-home .salehly-store-link:hover,
.salehly-home .salehly-store-link:focus-visible {
    border-color: rgba(255, 255, 255, 0.72);
    transform: translateY(-3px);
    box-shadow: 0 18px 34px rgba(8, 24, 51, 0.28);
}

.salehly-home .salehly-store-link:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.38);
    outline-offset: 3px;
}

.salehly-home .salehly-store-link img {
    display: block;
    width: 158px;
    height: 48px;
    object-fit: contain;
}

.salehly-home .salehly-join-decoration {
    position: absolute;
    z-index: 1;
    border-radius: 999px;
    pointer-events: none;
}

.salehly-home .salehly-join-decoration--one {
    inset-inline-start: -80px;
    top: -110px;
    width: 310px;
    height: 310px;
    border: 48px solid rgba(255, 255, 255, 0.06);
}

.salehly-home .salehly-join-decoration--two {
    inset-inline-end: -70px;
    bottom: -125px;
    width: 280px;
    height: 280px;
    background: rgba(255, 255, 255, 0.06);
}

.salehly-home .salehly-join-provider {
    position: absolute;
    z-index: 2;
    width: 118px;
    height: 118px;
    padding: 10px;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 24px;
    background: rgba(255, 255, 255, 0.10);
    object-fit: contain;
    opacity: 0.78;
    filter: drop-shadow(0 12px 18px rgba(7, 26, 59, 0.20));
}

.salehly-home .salehly-join-provider--one {
    inset-inline-start: 34px;
    top: 34px;
    transform: rotate(-6deg);
}

.salehly-home .salehly-join-provider--two {
    inset-inline-end: 36px;
    bottom: 34px;
    transform: rotate(6deg);
}

/* ------------------------------------------------------------------------
   DARK MODE — keep headings and category cards readable
   ------------------------------------------------------------------------ */
html[data-bs-theme="dark"] .salehly-home,
body.dark .salehly-home,
body.dark-mode .salehly-home,
.dark .salehly-home {
    --home-heading: #f7f9fd;
    --home-text: #c4cee0;
    --home-muted: #9aa7bc;
    --home-surface: #111c30;
    --home-surface-alt: #0d1728;
    --home-border: #263754;
    --home-primary-soft: #182b49;
    color: var(--home-text);
    background: #0b1424 !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section,
body.dark .salehly-home .salehly-categories-section,
body.dark-mode .salehly-home .salehly-categories-section,
.dark .salehly-home .salehly-categories-section {
    border-color: #253754 !important;
    background:
        radial-gradient(circle at 8% 10%, rgba(75, 143, 238, 0.13), transparent 28%),
        linear-gradient(180deg, #0d1728 0%, #101d32 100%) !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .iq-title-box h3,
body.dark .salehly-home .salehly-categories-section .iq-title-box h3,
body.dark-mode .salehly-home .salehly-categories-section .iq-title-box h3,
.dark .salehly-home .salehly-categories-section .iq-title-box h3 {
    color: #ffffff !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .category-card,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam,
body.dark .salehly-home .salehly-categories-section .card,
body.dark .salehly-home .salehly-categories-section .category-card,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam,
body.dark-mode .salehly-home .salehly-categories-section .card,
body.dark-mode .salehly-home .salehly-categories-section .category-card,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam,
.dark .salehly-home .salehly-categories-section .card,
.dark .salehly-home .salehly-categories-section .category-card,
.dark .salehly-home .salehly-categories-section .salehly-category-beam {
    border-color: #2a3f60 !important;
    background: #142239 !important;
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22) !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .categories-name,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .categories-name a,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .category-link,
body.dark .salehly-home .salehly-categories-section .categories-name,
body.dark .salehly-home .salehly-categories-section .categories-name a,
body.dark .salehly-home .salehly-categories-section .category-link,
body.dark-mode .salehly-home .salehly-categories-section .categories-name,
body.dark-mode .salehly-home .salehly-categories-section .categories-name a,
body.dark-mode .salehly-home .salehly-categories-section .category-link,
.dark .salehly-home .salehly-categories-section .categories-name,
.dark .salehly-home .salehly-categories-section .categories-name a,
.dark .salehly-home .salehly-categories-section .category-link {
    color: #ffffff !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .categories-desc,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section p,
body.dark .salehly-home .salehly-categories-section .categories-desc,
body.dark .salehly-home .salehly-categories-section p,
body.dark-mode .salehly-home .salehly-categories-section .categories-desc,
body.dark-mode .salehly-home .salehly-categories-section p,
.dark .salehly-home .salehly-categories-section .categories-desc,
.dark .salehly-home .salehly-categories-section p {
    color: #bdc9dc !important;
}

html[data-bs-theme="dark"] .salehly-home .our-service,
body.dark .salehly-home .our-service,
body.dark-mode .salehly-home .our-service,
.dark .salehly-home .our-service {
    border-color: #253754 !important;
    background: #0d1728 !important;
}

html[data-bs-theme="dark"] .salehly-home .our-service .iq-title-box h3,
body.dark .salehly-home .our-service .iq-title-box h3,
body.dark-mode .salehly-home .our-service .iq-title-box h3,
.dark .salehly-home .our-service .iq-title-box h3 {
    color: #ffffff !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-join-section,
body.dark .salehly-home .salehly-join-section,
body.dark-mode .salehly-home .salehly-join-section,
.dark .salehly-home .salehly-join-section {
    border-color: #253754;
    background: #0b1424;
}

/* ------------------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------------------ */
@media (max-width: 991.98px) {
    .salehly-home .salehly-categories-section > .container > .d-flex,
    .salehly-home .our-service > .container > div > .d-flex {
        align-items: flex-start !important;
    }

    .salehly-home .salehly-join-card {
        min-height: 330px;
        padding-inline: 40px;
    }

    .salehly-home .salehly-join-provider {
        width: 90px;
        height: 90px;
        opacity: 0.48;
    }
}

@media (max-width: 767.98px) {
    .salehly-home .section-padding {
        padding-block: 44px !important;
    }

    .salehly-home .salehly-categories-section > .container > .d-flex,
    .salehly-home .our-service > .container > div > .d-flex {
        gap: 14px !important;
        margin-bottom: 22px !important;
        padding-bottom: 16px;
    }

    .salehly-home .salehly-categories-section .iq-title-box,
    .salehly-home .our-service .iq-title-box {
        flex: 1 1 100%;
    }

    .salehly-home .salehly-join-section {
        padding-block: 44px;
    }

    .salehly-home .salehly-join-card {
        min-height: 0;
        padding: 54px 20px 46px;
        border-radius: 22px;
    }

    .salehly-home .salehly-join-card::before {
        border-radius: 21px;
    }

    .salehly-home .salehly-join-content .iq-title-box h2 {
        font-size: 2rem;
    }

    .salehly-home .salehly-join-store-links {
        flex-direction: column;
        gap: 12px;
        margin-top: 24px;
    }

    .salehly-home .salehly-store-link {
        width: min(100%, 230px);
    }

    .salehly-home .salehly-join-provider {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .salehly-home .salehly-store-link {
        transition: none !important;
    }
}

/* Strong dark-mode overrides for the final Beam card layer. */
html[data-bs-theme="dark"] .salehly-home .salehly-home-hero,
body.dark .salehly-home .salehly-home-hero,
body.dark-mode .salehly-home .salehly-home-hero,
.dark .salehly-home .salehly-home-hero {
    border-color: #263754 !important;
    background:
        radial-gradient(circle at 88% 12%, rgba(80, 151, 247, 0.16), transparent 32%),
        linear-gradient(135deg, #101c30 0%, #0b1424 100%) !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-home-hero .iq-title-box h2,
html[data-bs-theme="dark"] .salehly-home .salehly-home-hero .iq-title-desc,
body.dark .salehly-home .salehly-home-hero .iq-title-box h2,
body.dark .salehly-home .salehly-home-hero .iq-title-desc,
body.dark-mode .salehly-home .salehly-home-hero .iq-title-box h2,
body.dark-mode .salehly-home .salehly-home-hero .iq-title-desc,
.dark .salehly-home .salehly-home-hero .iq-title-box h2,
.dark .salehly-home .salehly-home-hero .iq-title-desc {
    color: #f7f9fd !important;
    opacity: 1 !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam::after,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam::after,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam::after,
.dark .salehly-home .salehly-categories-section .salehly-category-beam::after {
    background: linear-gradient(145deg, #162640 0%, #111e33 100%) !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam .img-bg,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam .img-bg,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam .img-bg,
.dark .salehly-home .salehly-categories-section .salehly-category-beam .img-bg {
    background: #203654 !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam .categories-name,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam .categories-name a,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam .category-link,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h1,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h2,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h3,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h4,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h5,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam h6,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-name,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-name a,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam .category-link,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h1,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h2,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h3,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h4,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h5,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam h6,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam .categories-name,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam .categories-name a,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam .category-link,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h1,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h2,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h3,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h4,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h5,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam h6,
.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-name,
.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-name a,
.dark .salehly-home .salehly-categories-section .salehly-category-beam .category-link,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h1,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h2,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h3,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h4,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h5,
.dark .salehly-home .salehly-categories-section .salehly-category-beam h6 {
    color: #ffffff !important;
    opacity: 1 !important;
}

html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam .categories-desc,
html[data-bs-theme="dark"] .salehly-home .salehly-categories-section .salehly-category-beam p,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-desc,
body.dark .salehly-home .salehly-categories-section .salehly-category-beam p,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam .categories-desc,
body.dark-mode .salehly-home .salehly-categories-section .salehly-category-beam p,
.dark .salehly-home .salehly-categories-section .salehly-category-beam .categories-desc,
.dark .salehly-home .salehly-categories-section .salehly-category-beam p {
    color: #bdc9dc !important;
    opacity: 1 !important;
}

html[data-bs-theme="dark"] .salehly-home > .padding-top-bottom-90.bg-light:first-child.salehly-home-hero,
body.dark .salehly-home > .padding-top-bottom-90.bg-light:first-child.salehly-home-hero,
body.dark-mode .salehly-home > .padding-top-bottom-90.bg-light:first-child.salehly-home-hero,
.dark .salehly-home > .padding-top-bottom-90.bg-light:first-child.salehly-home-hero {
    border-color: #263754 !important;
    background:
        radial-gradient(circle at 88% 12%, rgba(80, 151, 247, 0.16), transparent 32%),
        linear-gradient(135deg, #101c30 0%, #0b1424 100%) !important;
}

/* ========================================================================
   SALEHLY HOME V4 — CTA EXPANSION & REMOVED SERVICE SECTIONS (2026-07-25)
   ======================================================================== */
.salehly-home .salehly-join-section {
    padding-block: clamp(72px, 8vw, 112px) !important;
}

.salehly-home .salehly-join-section > .container {
    width: min(96%, 1560px) !important;
    max-width: 1560px !important;
    padding-inline: clamp(12px, 2vw, 28px) !important;
}

.salehly-home .salehly-join-card {
    min-height: clamp(460px, 38vw, 620px) !important;
    padding: clamp(76px, 9vw, 128px) clamp(28px, 10vw, 150px) !important;
    border-radius: 38px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.salehly-home .salehly-join-card::before {
    border-radius: 37px !important;
}

.salehly-home .salehly-join-content {
    width: min(980px, 100%) !important;
}

.salehly-home .salehly-join-content .iq-title-box h2 {
    font-size: clamp(2.5rem, 5vw, 4.6rem) !important;
    line-height: 1.28 !important;
    max-width: 900px;
    margin-inline: auto;
}

.salehly-home .salehly-join-content .iq-title-desc {
    max-width: 860px !important;
    margin-top: 24px !important;
    font-size: clamp(1.05rem, 1.7vw, 1.35rem) !important;
    line-height: 2.05 !important;
}

.salehly-home .salehly-join-store-links {
    gap: 18px !important;
    margin-top: 38px !important;
}

.salehly-home .salehly-store-link {
    min-width: 198px !important;
    min-height: 64px !important;
    border-radius: 15px !important;
}

.salehly-home .salehly-store-link img {
    width: 190px !important;
    height: 58px !important;
}

.salehly-home .salehly-join-decoration--one {
    width: 400px !important;
    height: 400px !important;
}

.salehly-home .salehly-join-decoration--two {
    width: 360px !important;
    height: 360px !important;
}

.salehly-home .salehly-join-provider {
    width: 148px !important;
    height: 148px !important;
    border-radius: 30px !important;
}

@media (max-width: 991.98px) {
    .salehly-home .salehly-join-section > .container {
        width: min(100%, 960px) !important;
    }

    .salehly-home .salehly-join-card {
        min-height: 430px !important;
        padding: 72px 42px !important;
        border-radius: 30px !important;
    }

    .salehly-home .salehly-join-card::before {
        border-radius: 29px !important;
    }

    .salehly-home .salehly-join-provider {
        width: 106px !important;
        height: 106px !important;
    }
}

@media (max-width: 767.98px) {
    .salehly-home .salehly-join-section {
        padding-block: 48px !important;
    }

    .salehly-home .salehly-join-section > .container {
        width: 100% !important;
        padding-inline: 16px !important;
    }

    .salehly-home .salehly-join-card {
        min-height: 420px !important;
        padding: 66px 22px 58px !important;
        border-radius: 24px !important;
    }

    .salehly-home .salehly-join-card::before {
        border-radius: 23px !important;
    }

    .salehly-home .salehly-join-content .iq-title-box h2 {
        font-size: clamp(2rem, 9vw, 2.65rem) !important;
    }

    .salehly-home .salehly-join-content .iq-title-desc {
        font-size: 1rem !important;
        line-height: 1.9 !important;
    }

    .salehly-home .salehly-store-link {
        width: min(100%, 250px) !important;
        min-width: 0 !important;
    }
}

/* ==========================================================================
   V5 — Home categories unified with /category-list
   ========================================================================== */
.salehly-home .salehly-categories-section {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 4%, rgba(103, 183, 255, 0.12), transparent 28rem),
        linear-gradient(180deg, #f8fbff 0%, #ffffff 100%) !important;
}

.salehly-home .salehly-home-category-panel {
    overflow: hidden;
    border: 1px solid #dbe7f5;
    border-radius: clamp(24px, 2.7vw, 36px);
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 28px 65px rgba(28, 68, 116, 0.10);
}

.salehly-home .salehly-home-category-banner {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(150px, 0.28fr);
    align-items: center;
    min-height: clamp(240px, 25vw, 325px);
    overflow: hidden;
    padding: clamp(2rem, 5vw, 4.25rem);
    color: #ffffff;
    background:
        radial-gradient(circle at 12% 18%, rgba(110, 190, 255, 0.34), transparent 24rem),
        linear-gradient(125deg, #102f59 0%, #1f579f 48%, #326bc9 100%);
}

[dir="rtl"] .salehly-home .salehly-home-category-banner {
    background:
        radial-gradient(circle at 88% 18%, rgba(110, 190, 255, 0.34), transparent 24rem),
        linear-gradient(235deg, #102f59 0%, #1f579f 48%, #326bc9 100%);
}

.salehly-home .salehly-home-category-banner::before,
.salehly-home .salehly-home-category-banner::after {
    content: "";
    position: absolute;
    z-index: -1;
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 50%;
    pointer-events: none;
}

.salehly-home .salehly-home-category-banner::before {
    width: 330px;
    height: 330px;
    inset-block-start: -190px;
    inset-inline-end: -80px;
}

.salehly-home .salehly-home-category-banner::after {
    width: 210px;
    height: 210px;
    inset-block-end: -145px;
    inset-inline-start: 36%;
}

.salehly-home .salehly-home-category-banner__content {
    position: relative;
    z-index: 2;
    max-width: 760px;
}

.salehly-home .salehly-home-category-banner h2 {
    margin: 0;
    color: #ffffff !important;
    font-size: clamp(2rem, 4.1vw, 4rem);
    font-weight: 800;
    line-height: 1.18;
    letter-spacing: -0.035em;
    text-wrap: balance;
}

.salehly-home .salehly-home-category-banner p {
    max-width: 680px;
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, 0.82) !important;
    font-size: clamp(0.98rem, 1.35vw, 1.18rem);
    line-height: 1.9;
}

.salehly-home .salehly-home-category-banner__link {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-height: 46px;
    margin-top: 1.5rem;
    padding: 0.7rem 1.15rem;
    border: 1px solid rgba(255, 255, 255, 0.42);
    border-radius: 14px;
    color: #123d7a !important;
    background: #ffffff;
    font-size: 0.92rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 14px 30px rgba(4, 28, 61, 0.22);
    transition: transform 180ms ease, box-shadow 180ms ease, background-color 180ms ease;
}

.salehly-home .salehly-home-category-banner__link:hover,
.salehly-home .salehly-home-category-banner__link:focus-visible {
    color: #0e356d !important;
    background: #f2f8ff;
    box-shadow: 0 18px 36px rgba(4, 28, 61, 0.28);
    transform: translateY(-2px);
}

.salehly-home .salehly-home-category-banner__link svg {
    flex: 0 0 auto;
}

[dir="rtl"] .salehly-home .salehly-home-category-banner__link svg {
    transform: scaleX(-1);
}

.salehly-home .salehly-home-category-banner__visual {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    min-height: 180px;
}

.salehly-home .salehly-home-category-mark {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: clamp(112px, 12vw, 154px);
    aspect-ratio: 1;
    border: 1px solid rgba(255, 255, 255, 0.38);
    border-radius: 36%;
    color: #ffffff;
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.24), rgba(255, 255, 255, 0.09));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.36),
        0 24px 52px rgba(5, 31, 66, 0.28);
    backdrop-filter: blur(12px);
    transform: rotate(-7deg);
}

[dir="rtl"] .salehly-home .salehly-home-category-mark {
    transform: rotate(7deg);
}

.salehly-home .salehly-home-category-mark svg {
    width: 54%;
    fill: none;
    stroke: currentColor;
    stroke-width: 3.2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.salehly-home .salehly-home-category-orbit {
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    animation: salehly-home-category-orbit 16s linear infinite;
}

.salehly-home .salehly-home-category-orbit--one {
    width: 190px;
    height: 190px;
}

.salehly-home .salehly-home-category-orbit--two {
    width: 240px;
    height: 240px;
    animation-direction: reverse;
    animation-duration: 22s;
}

.salehly-home .salehly-home-category-orbit::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    inset-block-start: 18px;
    inset-inline-start: 26px;
    border-radius: 50%;
    background: #bfe1ff;
    box-shadow: 0 0 20px rgba(191, 225, 255, 0.9);
}

@keyframes salehly-home-category-orbit {
    to { transform: rotate(1turn); }
}

.salehly-home .salehly-home-category-grid-shell {
    padding: clamp(1.25rem, 3vw, 2.35rem);
    background: rgba(255, 255, 255, 0.96);
}

/* The Vue component replaces <category-section>, so scope from the stable wrapper. */
.salehly-home .salehly-categories-section .card.circle-clip-effect {
    position: relative;
    isolation: isolate;
    display: flex;
    width: 100%;
    min-height: 282px;
    height: 100% !important;
    margin: 0 !important;
    padding: 1.5px !important;
    overflow: hidden;
    border: 0 !important;
    border-radius: 24px !important;
    background: #dbe7f5 !important;
    box-shadow: 0 16px 38px rgba(23, 69, 121, 0.10);
    transform: translateZ(0);
    transition: transform 220ms cubic-bezier(0.2, 0.75, 0.25, 1), box-shadow 220ms ease;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect::before {
    content: "" !important;
    position: absolute;
    z-index: 0;
    inset: -55%;
    display: block !important;
    pointer-events: none;
    opacity: 0;
    background: conic-gradient(
        from 0deg,
        transparent 0 70%,
        #123d7a 80%,
        #5faeff 87%,
        #cfe8ff 92%,
        transparent 98%
    );
    animation: salehly-home-category-beam 3.2s linear infinite paused;
    transition: opacity 180ms ease;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect::after,
[dir="rtl"] .salehly-home .salehly-categories-section .card.circle-clip-effect::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    clip-path: none !important;
    background: transparent !important;
    transition: none !important;
}

@keyframes salehly-home-category-beam {
    to { transform: rotate(1turn); }
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within {
    box-shadow: 0 24px 48px rgba(23, 69, 121, 0.18);
    transform: translateY(-5px);
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover::before,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within::before {
    opacity: 1;
    animation-play-state: running;
}

.salehly-home .salehly-categories-section .category-card {
    position: relative;
    z-index: 1;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    min-height: 279px;
    padding: clamp(1.4rem, 2.5vw, 2rem) !important;
    border: 0 !important;
    border-radius: 22.5px !important;
    background: #ffffff !important;
    box-shadow: none !important;
    transition: background-color 200ms ease, box-shadow 200ms ease;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover .category-card,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .category-card {
    background: linear-gradient(145deg, #fbfdff 0%, #edf6ff 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(95, 174, 255, 0.12) !important;
}

.salehly-home .salehly-categories-section .img-bg {
    display: grid !important;
    place-items: center;
    width: 86px !important;
    height: 86px !important;
    flex: 0 0 86px;
    padding: 10px !important;
    border: 1px solid #dce8f6 !important;
    border-radius: 22px !important;
    color: inherit !important;
    background: #f7faff !important;
    box-shadow: 0 12px 26px rgba(31, 84, 145, 0.09) !important;
    transition: border-color 200ms ease, background-color 200ms ease, box-shadow 200ms ease;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover .img-bg,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .img-bg {
    border-color: rgba(95, 174, 255, 0.68) !important;
    background: #ffffff !important;
    box-shadow: 0 15px 30px rgba(50, 107, 201, 0.14) !important;
}

.salehly-home .salehly-categories-section .img-bg img,
.salehly-home .salehly-categories-section .avatar-70 {
    width: 64px !important;
    height: 64px !important;
    max-width: 100%;
    object-fit: contain;
    transform: none !important;
    filter: none !important;
}

.salehly-home .salehly-categories-section .categories-name {
    width: 100%;
    min-height: 2.9rem;
    margin: 1.25rem 0 0.55rem !important;
    color: #0f2748 !important;
    font-size: 1.12rem !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
    text-align: center;
    white-space: normal !important;
    overflow: visible !important;
    -webkit-line-clamp: 2 !important;
}

.salehly-home .salehly-categories-section .categories-desc {
    display: -webkit-box !important;
    width: 100%;
    min-height: 4.65rem;
    margin: 0 !important;
    overflow: hidden !important;
    color: #647892 !important;
    font-size: 0.9rem !important;
    line-height: 1.75 !important;
    text-align: center;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover .categories-name,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .categories-name {
    color: #123d7a !important;
}

.salehly-home .salehly-categories-section .card.circle-clip-effect:hover .categories-desc,
.salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .categories-desc {
    color: #486783 !important;
}

/* Override legacy active-slide colors that made dark-mode text disappear. */
.salehly-home .salehly-categories-section .swiper-slide-active .category-card,
.salehly-home .salehly-categories-section .swiper-slide-active .img-bg,
.salehly-home .salehly-categories-section .swiper-slide-active .categories-name,
.salehly-home .salehly-categories-section .swiper-slide-active .categories-desc {
    color: inherit !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section {
    background:
        radial-gradient(circle at 12% 4%, rgba(73, 139, 222, 0.13), transparent 28rem),
        linear-gradient(180deg, #0d192a 0%, #0b1726 100%) !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-home-category-panel {
    border-color: #2a4565;
    background: #101f32;
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.28);
}

[data-bs-theme="dark"] .salehly-home .salehly-home-category-grid-shell {
    background: #101f32;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect {
    background: #304b6c !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.25);
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .category-card {
    background: #15253a !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:hover .category-card,
[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .category-card {
    background: linear-gradient(145deg, #16283e 0%, #1a3553 100%) !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .img-bg {
    border-color: #2d4867 !important;
    background: #1b3049 !important;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2) !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .categories-name,
[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:hover .categories-name,
[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .categories-name {
    color: #f2f7ff !important;
}

[data-bs-theme="dark"] .salehly-home .salehly-categories-section .categories-desc,
[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:hover .categories-desc,
[data-bs-theme="dark"] .salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within .categories-desc {
    color: #a9bbd0 !important;
}

@media (max-width: 991.98px) {
    .salehly-home .salehly-home-category-banner {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .salehly-home .salehly-home-category-banner__content,
    .salehly-home .salehly-home-category-banner p {
        margin-inline: auto;
    }

    .salehly-home .salehly-home-category-banner__visual {
        min-height: 150px;
        margin-top: 1.4rem;
    }
}

@media (max-width: 575.98px) {
    .salehly-home .salehly-home-category-panel {
        border-radius: 22px;
    }

    .salehly-home .salehly-home-category-banner {
        min-height: auto;
        padding: 2rem 1.25rem 1.6rem;
    }

    .salehly-home .salehly-home-category-banner h2 {
        font-size: clamp(1.8rem, 10vw, 2.45rem);
    }

    .salehly-home .salehly-home-category-banner__visual {
        min-height: 125px;
    }

    .salehly-home .salehly-home-category-mark {
        width: 102px;
    }

    .salehly-home .salehly-home-category-orbit--one {
        width: 145px;
        height: 145px;
    }

    .salehly-home .salehly-home-category-orbit--two {
        width: 184px;
        height: 184px;
    }

    .salehly-home .salehly-home-category-grid-shell {
        padding: 1rem;
    }

    .salehly-home .salehly-categories-section .card.circle-clip-effect,
    .salehly-home .salehly-categories-section .category-card {
        min-height: 260px;
    }
}

@media (hover: none) {
    .salehly-home .salehly-categories-section .card.circle-clip-effect::before {
        opacity: 0;
        animation-play-state: paused;
    }

    .salehly-home .salehly-categories-section .card.circle-clip-effect:active::before,
    .salehly-home .salehly-categories-section .card.circle-clip-effect:focus-within::before {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    .salehly-home .salehly-home-category-orbit,
    .salehly-home .salehly-categories-section .card.circle-clip-effect::before {
        animation: none !important;
    }

    .salehly-home .salehly-categories-section .card.circle-clip-effect,
    .salehly-home .salehly-home-category-banner__link {
        transition: none !important;
    }
}
