<?php $__env->startPush('styles'); ?>
    <style>
        /* Page-scoped styles (ported from website_uae/services_rtl.html) */
        .services-page {
            --primary: #20b8dd;
            --secondary: #3469d6;
            --accent: #71dfff;
            --dark: #121b2d;
            --navy: #1b2b53;
            --text: #1c2536;
            --muted: #66758b;
            --white: #ffffff;
            --bg: #eef4f8;
            --line: rgba(18, 27, 45, .08);
            --gradient: linear-gradient(135deg, #1fb6dc 0%, #3e73da 42%, #8156ff 100%);
            --gradient-soft: linear-gradient(135deg, rgba(31, 182, 220, .12) 0%, rgba(62, 115, 218, .10) 45%, rgba(129, 86, 255, .08) 100%);
            --gradient-reverse: linear-gradient(135deg, #436ed0 0%, #5caed9 55%, #7ed6f3 100%);
            --wa: linear-gradient(135deg, #25d366 0%, #1eb85a 55%, #139d49 100%);
            --card: linear-gradient(180deg, #ffffff 0%, #f7fbfd 100%);
            --shadow-xs: 0 10px 22px rgba(18, 27, 45, .05);
            --shadow-sm: 0 16px 34px rgba(18, 27, 45, .08);
            --shadow-md: 0 24px 56px rgba(18, 27, 45, .10);
            --transition: .3s cubic-bezier(.22, .61, .36, 1);
            --maxw: 1740px;

            font-family: 'Cairo', 'Inter', sans-serif;
            background:
                radial-gradient(circle at top right, rgba(31, 182, 220, .08), transparent 22%),
                radial-gradient(circle at bottom left, rgba(62, 115, 218, .06), transparent 24%),
                var(--bg);
            color: var(--text);
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
            text-rendering: optimizeLegibility;
            direction: rtl;
            text-align: right;
            padding: 25px 0;
        }

        .services-page * { box-sizing: border-box; }
        .services-page a { text-decoration: none; }
        .services-page img { max-width: 100%; display: block; }
        .services-page button, .services-page input, .services-page select, .services-page textarea { font: inherit; }

        .services-page .main-container {
            width: 100%;
            max-width: var(--maxw);
            margin: 0 auto;
            padding: 0 18px;
        }

        .services-page .section-space { padding: 25px 0; }
        .services-page .section-space.pt-0 { padding-top: 0; }

        .services-page .section-head {
            max-width: 940px;
            margin: 0 auto 24px;
            text-align: center;
        }

        .services-page .section-kicker {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 9px 16px;
            border-radius: 999px;
            background: var(--gradient-soft);
            border: 1px solid rgba(62, 115, 218, .10);
            color: var(--secondary);
            font-size: 12px;
            font-weight: 900;
            letter-spacing: .02em;
            margin-bottom: 14px;
            box-shadow: 0 12px 28px rgba(62, 115, 218, .07);
        }

        .services-page .section-head h2 {
            margin: 0 0 10px;
            font-size: 32px;
            line-height: 1.14;
            font-weight: 900;
            letter-spacing: -.8px;
            color: var(--dark);
        }

        .services-page .section-head p {
            margin: 0 auto;
            max-width: 780px;
            font-size: 14px;
            line-height: 1.82;
            color: var(--muted);
        }

        .services-page .interactive {
            position: relative;
            overflow: hidden;
            transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition), background var(--transition), color var(--transition), opacity var(--transition), filter var(--transition);
            will-change: transform;
        }

        .services-page .interactive::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(120deg, transparent 18%, rgba(255, 255, 255, .22) 50%, transparent 82%);
            transform: translateX(-120%);
            transition: transform .7s ease;
            pointer-events: none;
        }

        .services-page .interactive:hover {
            transform: translateY(-4px);
            box-shadow: 0 18px 34px rgba(18, 27, 45, .12);
        }

        .services-page .interactive:hover::after { transform: translateX(120%); }
        .services-page .interactive.pressed { transform: scale(.985); box-shadow: 0 10px 18px rgba(18, 27, 45, .08); }

        .services-page .ripple {
            position: absolute;
            border-radius: 50%;
            transform: scale(0);
            animation: servicesRipple .55s linear;
            background: rgba(255, 255, 255, .35);
            pointer-events: none;
        }

        @keyframes servicesRipple {
            to { transform: scale(4); opacity: 0; }
        }

        /* .services-page .scroll-load {
            opacity: 0;
            transform: translateY(34px) scale(.98);
            filter: blur(10px);
            transition: opacity 1s cubic-bezier(.22, .61, .36, 1), transform 1s cubic-bezier(.22, .61, .36, 1), filter 1s cubic-bezier(.22, .61, .36, 1);
        }

        .services-page .scroll-load.active {
            opacity: 1;
            transform: translateY(0) scale(1);
            filter: blur(0);
        } */

        .services-page .btn-main,
        .services-page .btn-outline-soft {
            min-width: max-content;
            height: 52px;
            padding: 0 22px;
            border-radius: 17px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            font-size: 14px;
            font-weight: 900;
            white-space: nowrap;
        }

        .services-page .btn-main {
            border: none;
            color: #fff;
            background: var(--gradient);
            box-shadow: 0 22px 44px rgba(62, 115, 218, .18);
        }

        .services-page .btn-main:hover { color: #fff; }

        .services-page .btn-light {
            background: #fff;
            color: var(--secondary);
            border: 1px solid rgba(62, 115, 218, .12);
            box-shadow: 0 16px 32px rgba(18, 27, 45, .08);
        }

        .services-page .btn-light:hover { color: var(--secondary); }

        .services-page .btn-whatsapp {
            background: var(--wa);
            box-shadow: 0 22px 44px rgba(20, 157, 73, .22);
        }

        .services-page .btn-outline-soft {
            border: 1px solid rgba(62, 115, 218, .14);
            background: #fff;
            color: var(--secondary);
            box-shadow: 0 14px 30px rgba(18, 27, 45, .08);
        }

        .services-page .btn-outline-soft:hover { color: var(--secondary); }

        .services-page .services-hero-shell {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 34px;
            overflow: hidden;
            box-shadow: var(--shadow-md);
        }

        .services-page .services-hero-image {
            height: 100%;
            min-height: 560px;
            position: relative;
            overflow: hidden;
            background: #dfe7ef;
        }

        .services-page .services-hero-image img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .services-page .services-hero-content {
            height: 100%;
            padding: 38px 38px 34px;
            display: flex;
            flex-direction: column;
            justify-content: center;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            text-align: right;
            align-items: flex-start;
        }

        .services-page .services-mini-bar {
            width: 100%;
            min-height: 42px;
            border-radius: 999px;
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 0 16px;
            background: var(--gradient-soft);
            border: 1px solid rgba(62, 115, 218, .08);
            color: var(--secondary);
            font-size: 12px;
            font-weight: 900;
            margin-bottom: 16px;
            justify-content: flex-start;
        }

        .services-page .services-hero-content h1 {
            margin: 0 0 14px;
            color: var(--dark);
            font-size: 34px;
            line-height: 1.08;
            font-weight: 900;
            letter-spacing: -1px;
            max-width: 860px;
        }

        .services-page .services-hero-content .lead-copy {
            margin: 0 0 24px;
            color: var(--muted);
            font-size: 15px;
            line-height: 1.88;
            max-width: 900px;
        }

        .services-page .services-feature-list {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 18px;
            width: 100%;
        }

        .services-page .services-feature-list li {
            display: flex;
            align-items: flex-start;
            gap: 14px;
            color: #536175;
            font-size: 15px;
            line-height: 1.8;
            text-align: right;
        }

        .services-page .services-feature-list i {
            width: 26px;
            height: 26px;
            flex: 0 0 26px;
            margin-top: 2px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(62, 115, 218, .10);
            color: #4b6fd6;
            font-size: 12px;
            order: 2;
        }

        .services-page .services-feature-list span { order: 1; }
        .services-page .services-feature-list strong { color: var(--dark); font-weight: 900; }
        .services-page .services-hero-actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 28px; }

        .services-page .services-panel {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 34px;
            box-shadow: var(--shadow-md);
            padding: 28px;
        }

        .services-page .services-copy-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 22px;
            margin-bottom: 24px;
        }

        .services-page .services-copy-card {
            border: 1px solid rgba(18, 27, 45, .07);
            border-radius: 26px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            padding: 24px 22px;
            box-shadow: var(--shadow-xs);
            height: 100%;
            text-align: right;
        }

        .services-page .services-copy-card h3 {
            margin: 0 0 12px;
            color: var(--dark);
            font-size: 22px;
            line-height: 1.2;
            font-weight: 900;
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .services-page .services-copy-card h3 i {
            width: 38px;
            height: 38px;
            border-radius: 14px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: var(--gradient-soft);
            color: var(--secondary);
            font-size: 16px;
            flex: 0 0 38px;
        }

        .services-page .services-copy-card p {
            margin: 0 0 14px;
            color: var(--muted);
            font-size: 14px;
            line-height: 1.85;
        }

        .services-page .services-copy-card p:last-child { margin-bottom: 0; }

        .services-page .services-points {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .services-page .services-points li {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            color: #465465;
            font-size: 14px;
            line-height: 1.8;
            text-align: right;
        }

        .services-page .services-points i {
            width: 22px;
            height: 22px;
            flex: 0 0 22px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(31, 182, 220, .10);
            color: var(--secondary);
            font-size: 11px;
            margin-top: 2px;
            order: 2;
        }

        .services-page .services-points span { order: 1; }
        .services-page .services-points strong { color: var(--dark); font-weight: 900; }

        .services-page .service-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 22px;
        }

        .services-page .service-card {
            position: relative;
            overflow: hidden;
            border-radius: 28px;
            border: 1px solid rgba(18, 27, 45, .08);
            background: var(--card);
            box-shadow: var(--shadow-sm);
            min-height: 420px;
            display: flex;
            flex-direction: column;
            isolation: isolate;
            transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
        }

        .services-page .service-card::before {
            content: "";
            position: absolute;
            inset: 0;
            background:
                radial-gradient(circle at right top, rgba(31, 182, 220, .14), transparent 34%),
                radial-gradient(circle at left bottom, rgba(62, 115, 218, .12), transparent 36%);
            z-index: 0;
            pointer-events: none;
        }

        .services-page .service-card:hover {
            transform: translateY(-8px);
            box-shadow: 0 28px 62px rgba(18, 27, 45, .14);
            border-color: rgba(31, 182, 220, .20);
        }

        .services-page .service-media {
            position: relative;
            height: 248px;
            overflow: hidden;
            background: #dde8f2;
        }

        .services-page .service-media img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transform: scale(1.02);
            transition: transform 1.2s ease, filter 1.2s ease;
        }

        .services-page .service-card:hover .service-media img {
            transform: scale(1.08);
            filter: saturate(1.08) contrast(1.03);
        }

        .services-page .service-media::after {
            content: "";
            position: absolute;
            inset: 0;
            background: linear-gradient(180deg, rgba(12, 20, 35, .08) 0%, rgba(12, 20, 35, .16) 46%, rgba(12, 20, 35, .86) 100%);
        }

        .services-page .service-top {
            position: absolute;
            right: 18px;
            left: 18px;
            bottom: 16px;
            z-index: 2;
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
        }

        .services-page .service-title {
            margin: 0;
            color: #fff;
            font-size: 22px;
            font-weight: 900;
            letter-spacing: -.5px;
            line-height: 1.2;
            text-shadow: 0 10px 30px rgba(0, 0, 0, .22);
            text-align: right;
        }

        .services-page .service-pill {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 9px 14px;
            border-radius: 999px;
            background: rgba(255, 255, 255, .14);
            border: 1px solid rgba(255, 255, 255, .18);
            color: #fff;
            font-size: 12px;
            font-weight: 900;
            backdrop-filter: blur(12px);
            box-shadow: 0 14px 28px rgba(0, 0, 0, .12);
        }

        .services-page .service-body {
            position: relative;
            z-index: 1;
            padding: 22px 20px 20px;
            display: flex;
            flex-direction: column;
            flex: 1;
            text-align: right;
        }

        .services-page .service-sub {
            margin: 0 0 12px;
            color: #445264;
            font-size: 14px;
            line-height: 1.78;
        }

        .services-page .service-points {
            list-style: none;
            margin: 0 0 16px;
            padding: 0;
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .services-page .service-points li {
            display: flex;
            gap: 10px;
            align-items: flex-start;
            color: #334053;
            font-size: 14px;
            line-height: 1.75;
            text-align: right;
        }

        .services-page .service-points i {
            width: 24px;
            height: 24px;
            flex: 0 0 24px;
            margin-top: 1px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(31, 182, 220, .10);
            color: var(--secondary);
            font-size: 12px;
            order: 2;
        }

        .services-page .service-points span { order: 1; }

        .services-page .service-actions {
            margin-top: auto;
            display: grid;
            gap: 10px;
            grid-template-columns: 1fr 1fr;
        }

        .services-page .service-actions .btn-main,
        .services-page .service-actions .btn-outline-soft { width: 100%; }

        .services-page .cta-band {
            background: var(--gradient-reverse);
            border-radius: 30px;
            box-shadow: var(--shadow-md);
            text-align: center;
            color: #fff;
            padding: 42px 24px;
            position: relative;
            overflow: hidden;
        }

        .services-page .cta-band::before {
            content: "";
            position: absolute;
            width: 230px;
            height: 230px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 255, 255, .18) 0%, rgba(255, 255, 255, 0) 72%);
            left: -70px;
            top: -80px;
        }

        .services-page .cta-band h2 {
            margin: 0 0 10px;
            font-size: 32px;
            line-height: 1.1;
            font-weight: 900;
        }

        .services-page .cta-band p {
            margin: 0 auto;
            max-width: 720px;
            color: rgba(255, 255, 255, .92);
            font-size: 14px;
            line-height: 1.8;
        }

        .services-page .cta-band-actions {
            display: flex;
            justify-content: center;
            gap: 12px;
            flex-wrap: wrap;
            margin-top: 22px;
        }

        .services-page .contact-wrap {
            background: #fff;
            border: 1px solid rgba(18, 27, 45, .08);
            border-radius: 34px;
            box-shadow: 0 24px 56px rgba(18, 27, 45, .10);
            overflow: hidden;
        }

        .services-page .map-panel, .services-page .form-panel {
            height: 100%;
            min-height: 100%;
            display: flex;
            flex-direction: column;
        }

        .services-page .map-panel {
            position: relative;
            overflow: hidden;
            padding: 18px 18px 16px;
            color: #fff;
            background: linear-gradient(145deg, #4c72ca 0%, #63a2dd 58%, #7ecbed 100%);
            text-align: right;
        }

        .services-page .map-panel::before {
            content: "";
            position: absolute;
            width: 220px;
            height: 220px;
            top: -70px;
            left: -70px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, 0) 72%);
        }

        .services-page .map-panel::after {
            content: "";
            position: absolute;
            width: 160px;
            height: 160px;
            bottom: -60px;
            right: -30px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(255, 255, 255, .10) 0%, rgba(255, 255, 255, 0) 72%);
        }

        .services-page .map-panel h3, .services-page .form-panel h3 {
            margin: 0 0 10px;
            font-size: 22px;
            line-height: 1.28;
            font-weight: 900;
            letter-spacing: -.4px;
            position: relative;
            z-index: 1;
        }

        .services-page .map-panel p, .services-page .form-panel p {
            margin: 0 0 16px;
            font-size: 14px;
            line-height: 1.76;
            position: relative;
            z-index: 1;
        }

        .services-page .map-panel p { color: rgba(255, 255, 255, .90); }
        .services-page .form-panel p { color: var(--muted); }

        .services-page .contact-points {
            position: relative;
            z-index: 1;
            width: 100%;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px;
            margin: 6px 0 14px;
        }

        .services-page .contact-point {
            min-height: 86px;
            padding: 10px 8px;
            border-radius: 16px;
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            text-align: center;
            border: 1px solid rgba(255, 255, 255, .10);
            background: rgba(255, 255, 255, .08);
            backdrop-filter: blur(10px);
        }

        .services-page .contact-point .icon {
            width: 34px;
            height: 34px;
            margin: 0 auto 7px;
            border-radius: 11px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: rgba(255, 255, 255, .14);
            color: #fff;
            font-size: 13px;
        }

        .services-page .contact-point h4 {
            margin: 0;
            color: #fff;
            font-size: 12px;
            line-height: 1.3;
            font-weight: 900;
        }

        .services-page .contact-point p,
        .services-page .contact-point a {
            margin: 0;
            color: rgba(255, 255, 255, .92);
            font-size: 10px;
            line-height: 1.5;
            font-weight: 800;
            word-break: break-word;
        }

        .services-page .map-embed {
            position: relative;
            z-index: 1;
            margin-top: auto;
            border-radius: 22px;
            overflow: hidden;
            background: #fff;
            box-shadow: 0 18px 34px rgba(0, 0, 0, .14);
        }

        .services-page .map-embed iframe {
            display: block;
            width: 100%;
            min-height: 300px;
            height: 100%;
            border: 0;
        }

        .services-page .form-panel {
            padding: 28px;
            background: #fff;
            text-align: right;
        }

        .services-page .form-control,
        .services-page .form-select {
            height: 56px;
            padding: 0 18px;
            border-radius: 18px;
            border: 1px solid rgba(18, 27, 45, .08);
            background: #f5f7fb;
            color: var(--text);
            font-size: 14px;
            box-shadow: none !important;
            transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition), background var(--transition);
            text-align: right;
        }

        .services-page .form-control:hover,
        .services-page .form-select:hover {
            transform: translateY(-1px);
            border-color: rgba(62, 115, 218, .18);
        }

        .services-page .form-control:focus,
        .services-page .form-select:focus {
            background: #fff;
            border-color: rgba(31, 182, 220, .35);
            box-shadow: 0 0 0 4px rgba(31, 182, 220, .08) !important;
        }

        .services-page textarea.form-control {
            min-height: 182px;
            resize: none;
            padding: 18px;
        }

        .services-page .submit-btn {
            width: 100%;
            height: 56px;
            border: none;
            border-radius: 18px;
            color: #fff;
            font-size: 14px;
            font-weight: 900;
            background: linear-gradient(90deg, #76cbed 0%, #4f6fce 100%);
            box-shadow: none;
        }

        @media (max-width: 1199.98px) {
            .services-page .services-copy-grid { grid-template-columns: 1fr; }
            .services-page .service-grid { grid-template-columns: 1fr; }
            .services-page .services-hero-image { min-height: 430px; }
        }

        @media (max-width: 991.98px) {
            .services-page { padding: 0; }
            .services-page .contact-points { grid-template-columns: repeat(2, 1fr); }
            .services-page .services-hero-image { min-height: 360px; }
            .services-page .services-hero-content { padding: 26px 24px; }
        }

        @media (max-width: 767.98px) {
            .services-page .main-container { padding: 0 12px; }
            .services-page .section-head h2 { font-size: 26px; }
            .services-page .section-head p { font-size: 13px; }
            .services-page .services-hero-content h1 { font-size: 24px; line-height: 1.14; }
            .services-page .services-hero-content .lead-copy { font-size: 14px; line-height: 1.8; }
            .services-page .services-panel, .services-page .map-panel, .services-page .form-panel { padding: 18px; }
            .services-page .services-hero-shell { border-radius: 28px; }
            .services-page .services-hero-image { min-height: 250px; }
            .services-page .services-hero-actions, .services-page .cta-band-actions, .services-page .service-actions {
                display: grid;
                grid-template-columns: 1fr;
            }
            .services-page .contact-points { grid-template-columns: 1fr; }
            .services-page .map-embed iframe { min-height: 260px; }
            .services-page .service-title { font-size: 20px; }
            .services-page .service-media { height: 220px; }
        }

        @media (max-width: 575.98px) {
            .services-page .services-hero-content h1 { font-size: 22px; }
            .services-page .services-copy-card h3 { font-size: 20px; }
            .services-page .btn-main, .services-page .btn-outline-soft { width: 100%; }
        }

        @media (prefers-reduced-motion: reduce) {
            .services-page *, .services-page *::before, .services-page *::after {
                animation: none !important;
                transition: none !important;
                scroll-behavior: auto !important;
            }
            /* .services-page .scroll-load { opacity: 1 !important; transform: none !important; filter: none !important; } */
        }
    </style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>
    <div class="services-page" id="services-page">
        <section class="section-space">
            <div class="main-container">
                <div class="services-hero-shell scroll-load">
                    <div class="row g-0 align-items-stretch">
                        <div class="col-lg-5">
                            <div class="services-hero-image">
                                <img src="https://images.unsplash.com/photo-1516321497487-e288fb19713f?auto=format&fit=crop&w=1600&q=80" alt="خدمات العاملات المنزليات والعمالة المساعدة في دبي">
                            </div>
                        </div>
                        <div class="col-lg-7">
                            <div class="services-hero-content">
                                <div class="services-mini-bar">
                                    <i class="fa-solid fa-briefcase"></i>
                                    <span>خدماتنا</span>
                                </div>

                                <h1>خدمات احترافية للعمالة المنزلية مع دعم واضح وحلول منظمة لكل أسرة</h1>

                                <p class="lead-copy">في أليبداء تدبير لخدمات العاملات المنزليات في دبي، نقدم مجموعة متكاملة من خدمات الخادمات والمربيات والتأشيرات والتدريب والاستقدام داخل دولة الإمارات. جميع خطواتنا مصممة لتكون قانونية ومنظمة وسهلة المتابعة للعائلات.</p>

                                <ul class="services-feature-list">
                                    <li><i class="fa-solid fa-passport"></i><span><strong>خدمات التأشيرة</strong> — معالجة كاملة لتأشيرة العاملة المنزلية مع دعم قانوني وواضح للمستندات والإجراءات.</span></li>
                                    <li><i class="fa-solid fa-house-user"></i><span><strong>حلول الخادمات المقيمات</strong> — دعم موثوق بدوام كامل للتنظيف ورعاية الأطفال وروتين المنزل اليومي.</span></li>
                                    <li><i class="fa-solid fa-user-group"></i><span><strong>الاستقدام والتوظيف</strong> — مطابقة أفضل للمرشحات، مقابلات، تدقيق، وتنسيق احترافي لبدء الخدمة.</span></li>
                                    <li><i class="fa-solid fa-graduation-cap"></i><span><strong>التدريب والخدمة الشهرية</strong> — تجهيز عملي للعاملات مع خيارات مرنة تناسب احتياجات الأسر الحديثة.</span></li>
                                </ul>

                                <div class="services-hero-actions">
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-main interactive"><i class="fa-solid fa-paper-plane"></i>اتصل بنا</a>
                                    <a href="<?php echo e(route('ar.packages')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-layer-group"></i>مقارنة الباقات</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>

        <section class="section-space pt-0">
            <div class="main-container">
                <div class="services-panel scroll-load">
                    <div class="section-head">
                        <span class="section-kicker"><i class="fa-solid fa-building-shield"></i> نظرة عامة على الخدمات</span>
                        <h2>ماذا نقدم</h2>
                        <p>خدماتنا مصممة لدعم العائلات من خلال الاستقدام الأخلاقي، المعالجة القانونية، التدريب العملي، وحلول التوظيف المنزلي الموثوقة في دبي وجميع إمارات الدولة.</p>
                    </div>

                    <div class="services-copy-grid">
                        <div class="services-copy-card interactive">
                            <h3><i class="fa-solid fa-circle-check"></i><span>لماذا تنجح خدماتنا</span></h3>
                            <p>نحن نجمع بين الامتثال القانوني، اختيار المرشحات المناسبة، دعم الأسر، والوضوح التشغيلي لجعل رحلة التوظيف أكثر سهولة وثقة. تم تصميم عمليتنا لتقليل التعقيد وتحسين التجربة في كل مرحلة.</p>
                            <p>من أول استفسار وحتى بدء العمل والمتابعة المستمرة، نحافظ على تواصل واضح وسريع ومنظم.</p>
                        </div>

                        <div class="services-copy-card interactive">
                            <h3><i class="fa-solid fa-star"></i><span>لماذا تختارنا العائلات</span></h3>
                            <ul class="services-points">
                                <li><i class="fa-solid fa-check"></i><span><strong>دعم مرخّص من وزارة الموارد البشرية والتوطين</strong> ضمن هيكل قانوني وشفاف.</span></li>
                                <li><i class="fa-solid fa-check"></i><span><strong>مرشحات موثقات</strong> واختيار أنسب لاحتياجات كل منزل.</span></li>
                                <li><i class="fa-solid fa-check"></i><span><strong>أسعار واضحة وإرشاد مباشر</strong> بدون خطوات مربكة أو غامضة.</span></li>
                                <li><i class="fa-solid fa-check"></i><span><strong>خدمة تغطي جميع الإمارات</strong> مع دعم سريع ومتجاوب.</span></li>
                            </ul>
                        </div>
                    </div>

                    <div class="service-grid">
                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1450101499163-c8848c66ca85?auto=format&fit=crop&w=1200&q=80" alt="خدمات تأشيرة العمالة المنزلية">
                                <div class="service-top">
                                    <h3 class="service-title">خدمات تأشيرة العمالة المنزلية</h3>
                                    <span class="service-pill"><i class="fa-solid fa-passport"></i> دعم التأشيرة</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">نقوم بإدارة كامل معاملة تأشيرة العمالة المنزلية، بما يشمل التقديم، الفحوصات الطبية، تنسيق الهوية الإماراتية، دعم الإقامة، والامتثال القانوني ضمن متطلبات تدبير.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>إرشاد واضح لطلب التأشيرة والمستندات المطلوبة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تنسيق الفحص الطبي والهوية والإقامة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تحديثات سريعة وخطوات واضحة من البداية حتى الإنجاز</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>إجراءات قانونية منظمة تمنحك راحة بال كاملة</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="domestic-worker-visa-services.html" class="btn-main interactive"><i class="fa-solid fa-arrow-left"></i>عرض الخدمة</a>
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-envelope"></i>استفسار</a>
                                </div>
                            </div>
                        </article>

                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1521737604893-d14cc237f11d?auto=format&fit=crop&w=1200&q=80" alt="الاستقدام والتوظيف">
                                <div class="service-top">
                                    <h3 class="service-title">الاستقدام والتوظيف</h3>
                                    <span class="service-pill"><i class="fa-solid fa-user-group"></i> التوظيف</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">نساعد العائلات في اختيار العاملة المنزلية المناسبة من خلال عملية توظيف منظمة تشمل المطابقة، التحقق، المقابلات، والتنسيق الاحترافي لبدء العمل بسلاسة.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>اختيار أفضل للمرشحات حسب احتياجات الأسرة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>مراجعة الخلفية والمهارات بشكل منظم</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>دعم واضح للمقابلات واتخاذ القرار</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تنسيق دقيق لمرحلة البدء مع متابعة موثوقة</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="recruitment-deployment.html" class="btn-main interactive"><i class="fa-solid fa-arrow-left"></i>عرض الخدمة</a>
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-envelope"></i>استفسار</a>
                                </div>
                            </div>
                        </article>

                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1581578731548-c64695cc6952?auto=format&fit=crop&w=1200&q=80" alt="خادمات مقيمات بدوام كامل">
                                <div class="service-top">
                                    <h3 class="service-title">خادمات مقيمات بدوام كامل</h3>
                                    <span class="service-pill"><i class="fa-solid fa-house-user"></i> إقامة كاملة</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">للعائلات التي تحتاج إلى دعم طويل الأمد، نوفر خادمات مقيمات بخبرة وتم التحقق منهن، جاهزات للتنظيف، المساعدة في رعاية الأطفال، ومهام المنزل اليومية باستقرار أكبر.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>ملفات موثقة لخادمات بدوام كامل لدعم المنزل على المدى الطويل</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>مساعدة في التنظيف ورعاية الأطفال والروتين اليومي</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>استمرارية أفضل داخل المنزل وراحة أكبر للأسرة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تنسيق عملي من مرحلة الاختيار حتى الوصول</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="full-time-live-in-maids.html" class="btn-main interactive"><i class="fa-solid fa-arrow-left"></i>عرض الخدمة</a>
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-envelope"></i>استفسار</a>
                                </div>
                            </div>
                        </article>

                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1527515637462-cff94eecc1ac?auto=format&fit=crop&w=1200&q=80" alt="تدريب العاملات المنزليات">
                                <div class="service-top">
                                    <h3 class="service-title">تدريب العاملات المنزليات</h3>
                                    <span class="service-pill"><i class="fa-solid fa-graduation-cap"></i> التدريب</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">تركز برامجنا التدريبية على الجاهزية العملية للعمل داخل المنزل، بما يشمل معايير التنظيف، أساسيات رعاية الأطفال، الوعي الصحي، المساعدة في الطبخ، والتأهيل قبل التوظيف.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>تدريب على التنظيف والنظافة والروتين المنزلي اليومي</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>رفع الوعي برعاية الأطفال وسلامة المنزل</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تهيئة أفضل للثقة والاحترافية قبل بدء العمل</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>جاهزية أقوى قبل الانتقال إلى المنزل المستفيد</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="maids-training.html" class="btn-main interactive"><i class="fa-solid fa-arrow-left"></i>عرض الخدمة</a>
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-envelope"></i>استفسار</a>
                                </div>
                            </div>
                        </article>

                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1563453392212-326f5e854473?auto=format&fit=crop&w=1200&q=80" alt="خدمة الخادمة الشهرية">
                                <div class="service-top">
                                    <h3 class="service-title">خدمة الخادمة الشهرية</h3>
                                    <span class="service-pill"><i class="fa-solid fa-calendar-check"></i> خدمة شهرية</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">توفر خدمتنا الشهرية حلاً مرنًا للعائلات التي ترغب في دعم منظم ومستمر مع إدارة أسهل وتنسيق أوضح ومساندة منزلية موثوقة.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>نموذج دعم مرن يناسب مختلف احتياجات الأسر</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تنسيق شهري أوضح وخدمة أكثر انتظامًا</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>حل عملي للمساعدة المنزلية المنتظمة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>رؤية أفضل للاستمرارية والدعم المنزلي</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="monthly-maid-service.html" class="btn-main interactive"><i class="fa-solid fa-arrow-left"></i>عرض الخدمة</a>
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-envelope"></i>استفسار</a>
                                </div>
                            </div>
                        </article>

                        <article class="service-card interactive scroll-load">
                            <div class="service-media">
                                <img src="https://images.unsplash.com/photo-1517048676732-d65bc937f952?auto=format&fit=crop&w=1200&q=80" alt="دعم في جميع إمارات الدولة">
                                <div class="service-top">
                                    <h3 class="service-title">دعم في جميع إمارات الدولة</h3>
                                    <span class="service-pill"><i class="fa-solid fa-earth-asia"></i> تغطية الإمارات</span>
                                </div>
                            </div>
                            <div class="service-body">
                                <p class="service-sub">نخدم العائلات في دبي وأبوظبي والشارقة وعجمان ورأس الخيمة والفجيرة وأم القيوين من خلال حلول توظيف موثوقة وإرشاد منظم للخدمات المنزلية.</p>
                                <ul class="service-points">
                                    <li><i class="fa-solid fa-check"></i><span>تنسيق خدمة للعائلات في جميع أنحاء الإمارات</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>إرشاد احترافي حسب احتياجات كل منزل</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>تواصل أفضل ومتابعة أسرع في كل مرحلة</span></li>
                                    <li><i class="fa-solid fa-check"></i><span>شريك موثوق لحلول التوظيف المنزلي القانونية والمنظمة</span></li>
                                </ul>
                                <div class="service-actions">
                                    <a href="<?php echo e(route('ar.contact.us')); ?>" class="btn-main interactive"><i class="fa-solid fa-headset"></i>احصل على الدعم</a>
                                    <a href="<?php echo e(route('ar.packages')); ?>" class="btn-outline-soft interactive"><i class="fa-solid fa-layer-group"></i>عرض الباقات</a>
                                </div>
                            </div>
                        </article>
                    </div>
                </div>
            </div>
        </section>

        <section class="section-space pt-0">
            <div class="main-container">
                <div class="cta-band scroll-load">
                    <h2>هل تحتاج مساعدة في اختيار الخدمة المناسبة؟</h2>
                    <p>فريقنا جاهز لإرشادك في خدمات التأشيرة والاستقدام والتوظيف والخادمات المقيمات والتدريب والخدمة الشهرية بخطوات أوضح ودعم أسرع.</p>
                    <div class="cta-band-actions">
                        <a href="tel:+97180032332" class="btn-main interactive"><i class="fa-solid fa-phone-volume"></i>اطلب اتصالًا</a>
                        <a href="https://wa.me/97180032332?text=Hello%2C%20I%20need%20help%20choosing%20the%20right%20service." class="btn-main btn-whatsapp interactive"><i class="fa-brands fa-whatsapp"></i>راسلنا على واتساب</a>
                        <a href="#contact-section" class="btn-light btn-main interactive"><i class="fa-solid fa-envelope-open-text"></i>أرسل استفسارًا</a>
                    </div>
                </div>
            </div>
        </section>

        <section class="section-space pt-0" id="contact-section">
            <div class="main-container">
                <div class="contact-wrap scroll-load">
                    <div class="row g-0">
                        <div class="col-lg-5">
                            <div class="map-panel">
                                <h3>زرنا أو تواصل معنا</h3>
                                <p>تحدث مع فريقنا بخصوص خدمات التأشيرة والاستقدام والخادمات المقيمات والتدريب والخدمة الشهرية.</p>

                                <div class="contact-points">
                                    <div class="contact-point interactive">
                                        <div class="icon"><i class="fa-solid fa-phone-volume"></i></div>
                                        <h4>اتصال</h4>
                                        <a href="tel:+97180032332">+971 50 123 4567</a>
                                    </div>
                                    <div class="contact-point interactive">
                                        <div class="icon"><i class="fa-brands fa-whatsapp"></i></div>
                                        <h4>واتساب</h4>
                                        <a href="https://wa.me/97180032332?text=Hello%2C%20I%20need%20help%20with%20your%20services.">ابدأ المحادثة</a>
                                    </div>
                                    <div class="contact-point interactive">
                                        <div class="icon"><i class="fa-solid fa-envelope"></i></div>
                                        <h4>البريد الإلكتروني</h4>
                                        <a href="mailto:info@the-maids.ae">info@the-maids.ae</a>
                                    </div>
                                    <div class="contact-point interactive">
                                        <div class="icon"><i class="fa-solid fa-location-dot"></i></div>
                                        <h4>العنوان</h4>
                                        <p>دبي، الإمارات</p>
                                    </div>
                                </div>

                                <div class="map-embed interactive">
                                    <iframe src="https://www.openstreetmap.org/export/embed.html?bbox=55.1785%2C25.1423%2C55.3959%2C25.3119&amp;layer=mapnik&amp;marker=25.2048%2C55.2708" loading="lazy" allowfullscreen referrerpolicy="no-referrer-when-downgrade"></iframe>
                                </div>
                            </div>
                        </div>

                        <div class="col-lg-7">
                            <div class="form-panel">
                                <h3>أرسل استفسارك عن الخدمة</h3>
                                <p>اسأل عن خدمات تأشيرة العمالة المنزلية أو الاستقدام والتوظيف أو الخادمات المقيمات أو التدريب أو الخدمة الشهرية من خلال هذا النموذج السريع.</p>

                                <form class="inquiry-form" method="POST" action="<?php echo e(route(($locale ?? 'en') === 'ar' ? 'ar.contact.inquiry' : 'contact.inquiry')); ?>">
                                    <?php echo csrf_field(); ?>
                                    <input type="hidden" name="source_page" value="<?php echo e(request()->path()); ?>">
                                    <div class="row g-3">
                                        <div class="col-md-6">
                                            <input type="text" name="first_name" class="form-control interactive" placeholder="الاسم الأول" required>
                                        </div>
                                        <div class="col-md-6">
                                            <input type="text" name="last_name" class="form-control interactive" placeholder="اسم العائلة">
                                        </div>
                                        <div class="col-md-6">
                                            <input type="tel" name="mobile" class="form-control interactive" placeholder="رقم الهاتف" required>
                                        </div>
                                        <div class="col-md-6">
                                            <input type="email" name="email" class="form-control interactive" placeholder="البريد الإلكتروني">
                                        </div>
                                        <div class="col-12">
                                            <textarea name="message" class="form-control interactive" placeholder="أخبرنا بالخدمة التي تحتاجها ونوع الدعم المطلوب"></textarea>
                                        </div>
                                        <div class="col-12">
                                            <button type="submit" class="submit-btn btn-main interactive"><i class="fa-solid fa-paper-plane"></i><span>إرسال الاستفسار</span></button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>
    <script>
        (function () {
            const root = document.getElementById('services-page');
            if (!root) return;

            // Scroll-load IntersectionObserver disabled
            // const scrollLoadItems = root.querySelectorAll('.scroll-load');
            // const observer = new IntersectionObserver((entries, obs) => {
            //     entries.forEach((entry) => {
            //         if (entry.isIntersecting) {
            //             entry.target.classList.add('active');
            //             obs.unobserve(entry.target);
            //         }
            //     });
            // }, { threshold: 0.14 });
            // scrollLoadItems.forEach((item) => observer.observe(item));

            root.querySelectorAll('.interactive').forEach((el) => {
                el.addEventListener('click', function (e) {
                    this.classList.add('pressed');
                    setTimeout(() => this.classList.remove('pressed'), 180);

                    const rect = this.getBoundingClientRect();
                    const ripple = document.createElement('span');
                    ripple.className = 'ripple';
                    const size = Math.max(rect.width, rect.height);
                    ripple.style.width = ripple.style.height = size + 'px';
                    ripple.style.left = (e.clientX - rect.left - size / 2) + 'px';
                    ripple.style.top = (e.clientY - rect.top - size / 2) + 'px';
                    this.appendChild(ripple);
                    setTimeout(() => ripple.remove(), 550);
                });
            });
        })();
    </script>
<?php $__env->stopPush(); ?>


<?php echo $__env->make('layouts.app_rtl', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /home/onesourceerp/public_html/project/resources/views/services_rtl.blade.php ENDPATH**/ ?>