*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

        :root {
            --navy:  #0a2a4a;
            --blue:  #1a4fa0;
            --red:   #c0392b;
            --red-h: #a93226;
            --white: #ffffff;
            --gray:  #f5f7fa;
            --text:  #2c3e50;
            --muted: #6b7f96;
            --section-padding: 80px 40px;
            --section-title-size: 36px;
            --section-title-color: #184B89;
            --section-title-weight: 800;
            --section-title-mb: 12px;
            --section-subtitle-size: 22px;
            --section-subtitle-mb: 40px;
        }
html {
    overflow-x: hidden;
    max-width: 100%;
}

body {
    overflow-x: hidden;
    max-width: 100%;
    position: relative;
    font-family: 'Nunito', sans-serif; color: var(--text);
}
/* في أول ملف الـ CSS */
html, body {
    height: 100%;
    overflow-x: hidden;
}

/* إصلاح الـ hero */
.hero-section {
    height: calc(100vh - 64px);  /* بدل 100vh */
    margin-top: 64px;
}
.hero-section {
    /* كل الكود الأصلي + */
    overflow: hidden; /* ← هاد بس الجديد */
}
.main-header {
    overflow: hidden; /* ← أضف هاد */
}

.nav-logo {
    margin-left: 0; /* ← بدل -30px */
}
       

        /* ══════════════════════════════════════
           SCROLL REVEAL
        ══════════════════════════════════════ */
        .reveal {
            opacity: 0;
            transform: translateY(40px);
            transition: opacity 0.75s ease, transform 0.75s ease;
        }
        .reveal.visible {
            opacity: 1;
            transform: translateY(0);
        }
        .reveal-left {
            opacity: 0;
            transform: translateX(-40px);
            transition: opacity 0.75s ease, transform 0.75s ease;
        }
        .reveal-left.visible {
            opacity: 1;
            transform: translateX(0);
        }
        .reveal-right {
            opacity: 0;
            transform: translateX(40px);
            transition: opacity 0.75s ease, transform 0.75s ease;
        }
        .reveal-right.visible {
            opacity: 1;
            transform: translateX(0);
        }
        .reveal-scale {
            opacity: 0;
            transform: scale(0.88);
            transition: opacity 0.65s ease, transform 0.65s ease;
        }
        .reveal-scale.visible {
            opacity: 1;
            transform: scale(1);
        }

        /* ══ HEADER ══ */
        .main-header {
            position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
            background: #ffffff; box-shadow: 0 2px 16px rgba(10,42,74,0.10);
        }
        .navbar {
            max-width: 1200px; margin: 0 auto; padding: 0 24px; height: 64px;
            display: flex; align-items: center; justify-content: space-between; gap: 20px;
        }
        @keyframes logoSlideIn {
            from { opacity: 0; transform: translateX(-18px); }
            to   { opacity: 1; transform: translateX(0); }
        }
        .nav-logo {
        display: flex; align-items: center; gap: 10px; text-decoration: none;
        flex-shrink: 0; margin-left: 0;  /* ← حذفنا الـ -30px */
        animation: logoSlideIn 0.5s cubic-bezier(0.22,1,0.36,1) both;
    }
        @keyframes logoFloat {
            0%, 100% { transform: translateY(0); }
            50%       { transform: translateY(-4px); }
        }
        .nav-logo img {
            height: 100px; width: 100px; object-fit: contain; border-radius: 50%;
            animation: logoFloat 3.5s ease-in-out infinite; transition: transform 0.3s;
        }
        .nav-logo:hover img { animation-play-state: paused; transform: scale(1.07) rotate(-3deg); }
        .nav-links { list-style: none; display: flex; align-items: center; gap: 4px; }
        @keyframes navItemDrop {
            from { opacity: 0; transform: translateY(-10px); }
            to   { opacity: 1; transform: translateY(0); }
        }
        .nav-links li { opacity: 0; animation: navItemDrop 0.4s cubic-bezier(0.22,1,0.36,1) forwards; }
        .nav-links li:nth-child(1) { animation-delay: 0.05s; }
        .nav-links li:nth-child(2) { animation-delay: 0.12s; }
        .nav-links li:nth-child(3) { animation-delay: 0.19s; }
        .nav-links li:nth-child(4) { animation-delay: 0.26s; }
        .nav-links li:nth-child(5) { animation-delay: 0.33s; }
        .nav-links li:nth-child(6) { animation-delay: 0.40s; }
        .nav-links li a {
            display: block; padding: 7px 16px; font-size: 14px; font-weight: 700;
            color: var(--text); text-decoration: none; border-radius: 8px;
            transition: background 0.2s, color 0.2s, transform 0.2s;
        }
        .nav-links li a:hover { background: #eef2ff; color: var(--blue); transform: translateY(-1px); }
        .nav-links li a.active { background: var(--blue); color: #fff; }
        .nav-links li a.donate-btn-nav {
            background: var(--red); color: #fff; padding: 7px 20px;
            transition: background 0.2s, transform 0.2s;
        }
        .nav-links li a.donate-btn-nav:hover { background: var(--red-h); transform: translateY(-1px) scale(1.04); }

        /* ══ HERO ══ */
        .hero-section {
            position: relative; width: 100%; height: 100vh;
            min-height: 560px; margin-top: 64px; overflow: hidden;
        }
        .hero-slides { position: absolute; inset: 0; width: 100%; height: 100%; }
        .hero-slide {
            position: absolute; inset: 0; width: 100%; height: 100%;
            background-size: cover; background-position: center center; background-repeat: no-repeat;
            opacity: 0; transform: scale(1.06);
            transition: opacity 1.1s ease, transform 6s ease; z-index: 0;
        }
        .hero-slide.active  { opacity: 1; transform: scale(1); z-index: 1; }
        .hero-slide.leaving { opacity: 0; transform: scale(1.03); z-index: 0; transition: opacity 1.1s ease, transform 1.1s ease; }
        .hero-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 1;
        }
        .hero-content {
            position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3;
            display: flex; flex-direction: column; justify-content: center; padding: 0 45px;
        }
        .hero-content-inner { max-width: 520px; margin-left: 80px; }
        .hero-title {
            font-family: 'Caprasimo', cursive; font-size: clamp(30px, 4.2vw, 52px);
            font-weight: 400; color: #fff; line-height: 1.18; margin-bottom: 20px;
            animation: heroIn 0.9s cubic-bezier(0.22,1,0.36,1) both;
        }
        .hero-sub {
            font-family: 'Nunito', sans-serif; font-size: clamp(14px, 1.6vw, 17px);
            color: rgba(255,255,255,0.90); line-height: 1.65; margin-bottom: 6px; font-weight: 600;
            animation: heroIn 0.9s cubic-bezier(0.22,1,0.36,1) 0.15s both;
        }
        .hero-sub:last-of-type { margin-bottom: 32px; animation-delay: 0.25s; }

        @keyframes pulseDonate {
            0%, 100% { box-shadow: 0 0 0 0 rgba(192,57,43,0.45); }
            50%       { box-shadow: 0 0 0 14px rgba(192,57,43,0); }
        }

        .hero-btn {
            display: inline-block; background: var(--red); color: #fff;
            font-family: 'Nunito', sans-serif; font-size: 15px; font-weight: 700;
            padding: 13px 34px; border-radius: 6px; text-decoration: none;
            animation: heroIn 0.9s cubic-bezier(0.22,1,0.36,1) 0.38s both, pulseDonate 2.5s 1.5s infinite;
            transition: background 0.2s, transform 0.2s;
        }
        .hero-btn:hover { background: var(--red-h); transform: scale(1.06); }

        @keyframes heroIn { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
        .hero-dots { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); z-index: 4; display: flex; gap: 10px; align-items: center; }
        .hero-dot { width: 10px; height: 10px; border-radius: 50%; border: 2px solid rgba(255,255,255,0.55); background: transparent; cursor: pointer; transition: 0.3s; }
        .hero-dot.active { background: #fff; border-color: #fff; transform: scale(1.3); }

        /* ══ ABOUT ══ */
        .about-refined {
            padding: 60px 40px 20px 40px;
            background-color: #ffffff;
        }
        .about-container { max-width: 1000px; margin: 0; padding-left: 58px; }
        .about-title {
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); margin-bottom: var(--section-title-mb);
            font-family: 'Inter', sans-serif;
        }
        .about-subtitle {
            font-size: var(--section-subtitle-size); font-weight: 800;
            color: #3b3b3b; margin-bottom: var(--section-subtitle-mb);
            font-family: 'Inter', sans-serif;
        }
        .about-body-area p { font-size: 16px; line-height: 1.8; color: #4a4a4a; margin-bottom: 25px; font-family: 'Inter', sans-serif; }
        .lead-para { font-size: 18px !important; color: #333 !important; }
        .crisis-callout {
            background: #fff; border-left: 3px solid #c0392b; padding: 24px 28px;
            border-radius: 0 8px 8px 0; margin-bottom: 25px;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .crisis-callout:hover {
            transform: translateX(6px);
            box-shadow: -4px 0 0 #c0392b, 4px 8px 24px rgba(192,57,43,0.08);
        }
        .crisis-callout p { font-size: 16px; color: #16253f; margin-bottom: 16px; font-family: 'Inter', sans-serif; }
        .action-badge {
            display: inline-flex; align-items: center; gap: 8px; font-weight: 700;
            color: #fff; background: #0a2a4a; padding: 7px 14px; font-size: 11px;
            border-radius: 4px; text-transform: uppercase; letter-spacing: 1.5px;
        }
        .footer-para { font-size: 15px !important; color: #3b4f69 !important; margin-bottom: 0 !important; }

        /* ══ SERVICES ══ */
        .services-section { background: #ffffff; padding: 80px 0; }
        .services-heading {
            font-family: 'Inter', sans-serif;
            font-size: 22px; font-weight: 700; color: #a93226;
            margin-bottom: 20px; padding-left: 100px;
        }
        .services-container { display: flex; align-items: stretch; width: 100%; min-height: 480px; }
        .services-left { flex: 0 0 45%; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; padding-left: 48px; }
        .service-item {
            padding: 32px 24px 32px 28px; display: flex; flex-direction: column; gap: 10px;
            border-radius: 12px;
            transition: background 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
        }
        .service-item:hover {
            background: #f0f4ff;
            transform: translateX(6px);
            box-shadow: inset 3px 0 0 #184B89;
        }
        .service-item:hover .service-num { color: #c0392b; }
        .service-num {
            font-family: 'Inter', sans-serif; font-size: clamp(32px, 4vw, 52px);
            font-weight: 700; color: #184B89; line-height: 1; letter-spacing: -1.5px; display: block;
            transition: color 0.3s ease;
        }
        .service-title { font-family: 'Inter', sans-serif; font-size: clamp(14px, 1.3vw, 17px); font-weight: 800; color: #3b3b3b; line-height: 1.25; margin: 0; }
        .service-desc { font-family: 'Inter', sans-serif; font-size: clamp(12px, 1vw, 14px); font-weight: 500; color: #3d3d3d; line-height: 1.6; margin: 0; }
        .services-right { flex: 1; position: relative; margin-left: -8px; }
        .wire-img-box { position: absolute; top: 30px; left: 30px; right: 0; bottom: 30px; overflow: hidden; background: #ddd; z-index: 5; }
        .slider-track { display: flex; width: 100%; height: 100%; transition: transform 0.7s cubic-bezier(0.77, 0, 0.175, 1); will-change: transform; }
        .slider-track .s-slide { flex: 0 0 100%; width: 100%; height: 100%; object-fit: cover; display: block; }
        .wire-layer { position: absolute; pointer-events: none; z-index: 12; }
        .wire-h { left: 0; right: 0; height: 32px; background-image: url('../img/wire-h.svg'); background-repeat: repeat-x; background-size: auto 100%; }
        .wire-h.top    { top: 0; }
        .wire-h.bottom { bottom: 0; }
        .wire-v-fixed { position: absolute; left: 0; top: 0; bottom: 0; width: 32px; background-image: url('../img/wire-v.png'); background-repeat: repeat-y; background-size: 100% auto; z-index: 11; }
        .wire-c { width: 40px; height: 40px; background-repeat: no-repeat; background-size: contain; z-index: 13; }
        .wire-c.tl { top: -4px; left: -4px; }
        .wire-c.bl { bottom: -4px; left: -4px; transform: rotate(-90deg); }

        /* ══ IMPACT STATS ══ */
        .impact-section { background: #F5F5F5; padding: var(--section-padding); }
        .impact-header { text-align: center; margin-bottom: 44px; }
        .impact-title {
            font-family: 'Inter', sans-serif;
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); margin-bottom: var(--section-title-mb);
        }
        .impact-sub { font-family: 'Inter', sans-serif; font-size: 14px; color: #555555; max-width: 520px; margin: 0 auto; line-height: 1.65; }
        .impact-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1100px; margin: 0 auto; }
        .impact-card {
            background: #e2e2e2; border-radius: 8px; overflow: hidden; border: 1px solid #e0e0e0;
            transition: transform 0.35s ease, box-shadow 0.35s ease;
            cursor: pointer;
        }
        .impact-card:hover {
            transform: translateY(-10px);
            box-shadow: 0 24px 48px rgba(0,0,0,0.13);
        }
        .impact-card-img {
            width: 100%; height: 165px; object-fit: cover; display: block;
            transition: transform 0.5s ease;
        }
        .impact-card:hover .impact-card-img { transform: scale(1.06); }
        .impact-card-body { padding: 18px 18px 20px 18px; }
        .impact-stat {
            font-family: 'Inter', sans-serif; font-size: 34px; font-weight: 800; color: #0d2849;
            line-height: 1; margin-bottom: 20px; font-variant-numeric: tabular-nums;
            -moz-font-feature-settings: "lnum";
            -webkit-font-feature-settings: "lnum";
            font-feature-settings: "lnum";
            direction: ltr;
            display: inline-block;
        }
        .impact-desc { font-family: 'Inter', sans-serif; font-size: 13px; color: #444444; line-height: 1.6; margin-bottom: 14px; }
        .impact-source { font-family: 'Inter', sans-serif; font-size: 12px; font-weight: 700; color: #1A6FBF; letter-spacing: 0.3px; }

        /* ══ PATH OF HEALING ══ */
        .healing-section { background: #ffffff; padding: var(--section-padding); text-align: center; }
        .healing-title {
            font-family: 'Inter', sans-serif;
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); margin-bottom: 60px;
        }
        .healing-wrapper { display: flex; flex-direction: column; align-items: center; gap: 0; width: fit-content; margin: 0 auto; }
        .healing-img { display: block; max-width: 100%; height: auto; }
        .healing-img:last-child { width: 100%; }

        /* ══ GET HELP SECTION ══ */
        .get-help-section { background: #f5f5f5; padding: var(--section-padding); font-family: 'Inter', sans-serif; }
        .get-help-container { max-width: 1000px; margin: 0 auto; }
        .get-help-title {
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); margin-bottom: var(--section-title-mb);
        }
        .get-help-subtitle { font-size: var(--section-subtitle-size); font-weight: 800; color: #424242; margin-bottom: var(--section-subtitle-mb); }
        .steps-wrapper { position: relative; padding-left: 50px; }
        .steps-wrapper::before { content: ''; position: absolute; left: 14px; top: 10px; bottom: -210px; width: 2px; background: #184B89; z-index: 1; }
        .step-item {
            position: relative; margin-bottom: 40px;
            transition: transform 0.3s ease;
        }
        .step-item:hover { transform: translateX(6px); }
        .step-item::before {
            content: ''; position: absolute; left: -44px; top: 5px;
            width: 16px; height: 16px; background: #184B89; border-radius: 50%; z-index: 3;
            transition: transform 0.3s ease, background 0.3s ease;
        }
        .step-item:hover::before { transform: scale(1.4); background: #c0392b; }
        .step-header { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
        .step-header i {
            font-size: 20px; color: #424242;
            transition: color 0.3s ease, transform 0.3s ease;
        }
        .step-item:hover .step-header i { color: #184B89; transform: scale(1.2); }
        .step-header h3 { font-size: 19px; font-weight: 800; color: #424242; margin: 0; }
        .step-desc { font-size: 15.5px; color: #333; line-height: 1.6; max-width: 800px; margin: 0; }
        .policy-container {
            background: #ffffff; border: 1px solid #e0e0e0; border-radius: 12px;
            padding: 20px 25px; margin: 20px 0 35px 65px; display: flex;
            align-items: center; justify-content: space-between; gap: 20px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.03);
            transition: box-shadow 0.3s ease, transform 0.3s ease;
        }
        .policy-container:hover { box-shadow: 0 10px 30px rgba(0,0,0,0.08); transform: translateY(-2px); }
        .policy-info { display: flex; align-items: center; gap: 15px; }
        .policy-info i { font-size: 26px; color: #184B89; }
        .policy-text { font-size: 14.5px; color: #555; line-height: 1.5; margin: 0; }
        .policy-text strong { color: #000; display: block; margin-bottom: 2px; }
        .btn-download {
            display: flex; align-items: center; gap: 8px; background: #f8f9fa;
            color: #184B89; padding: 10px 18px; border-radius: 8px; text-decoration: none;
            font-weight: 700; font-size: 13.5px; border: 1.5px solid #184B89;
            transition: all 0.3s ease; white-space: nowrap;
        }
        .btn-download:hover { background: #184B89; color: #fff; transform: translateY(-2px); }
        .get-help-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 0; padding-top: 15px; position: relative; padding-left: 65px; }
        .get-help-footer::before { content: ""; position: absolute; left: 14px; top: 0; width: 45px; height: 40px; border-left: 2px solid #184B89; border-bottom: 2px solid #184B89; border-bottom-left-radius: 30px; z-index: 2; }
        .footer-text { font-size: 19px; font-weight: 800; color: #184B89; margin: 0; }
        .contact-buttons { display: flex; gap: 12px; }
        .btn-contact {
            display: flex; align-items: center; gap: 8px; padding: 12px 28px;
            border-radius: 50px; text-decoration: none; color: #fff; font-weight: 700; font-size: 15px;
            transition: transform 0.25s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.25s ease;
        }
        .btn-contact:hover { transform: translateY(-4px) scale(1.05); box-shadow: 0 12px 24px rgba(0,0,0,0.18); }
        .btn-whatsapp { background-color: #21b35d; }
        .btn-email { background-color: #c0392b; }

        /* ══ BRIDGE SECTION ══ */
        .bridge-section { background: #ffffff; padding: var(--section-padding); text-align: center; }
        .bridge-container { max-width: 1100px; margin: 0 auto; }
        .bridge-title {
            font-family: 'Inter', sans-serif;
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); margin-bottom: var(--section-subtitle-mb);
        }
        .bridge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin-bottom: 40px; }
        .bridge-card {
            position: relative; height: 400px; border-radius: 15px; overflow: hidden;
            cursor: pointer; box-shadow: 0 10px 30px rgba(0,0,0,0.1);
            transition: transform 0.4s ease, box-shadow 0.4s ease;
        }
        .bridge-card:hover { transform: translateY(-8px); box-shadow: 0 28px 56px rgba(0,0,0,0.18); }
        .bridge-card img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1); }
        .bridge-card-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,0.8) 0%, rgba(0,0,0,0.2) 50%, transparent 100%); display: flex; align-items: flex-end; padding: 25px; text-align: left; }
        .bridge-card-text { color: #ffffff; font-size: 20px; font-weight: 700; line-height: 1.3; font-family: 'Inter', sans-serif; transform: translateY(10px); transition: transform 0.4s ease; }
        .bridge-card:hover img { transform: scale(1.1); }
        .bridge-card:hover .bridge-card-text { transform: translateY(0); }
        .bridge-desc { font-size: 18px; color: #333; font-weight: 600; max-width: 700px; margin: 0 auto 30px auto; line-height: 1.6; }
        .donate-btn-large {
            display: inline-block; background-color: var(--red); color: #fff;
            padding: 18px 60px; border-radius: 12px; font-size: 20px; font-weight: 800;
            text-decoration: none; transition: all 0.3s ease;
            box-shadow: 0 4px 15px rgba(192, 57, 43, 0.3);
            animation: pulseDonate 2.5s infinite;
        }
        .donate-btn-large:hover { background-color: var(--red-h); transform: scale(1.07); box-shadow: 0 8px 30px rgba(192, 57, 43, 0.45); }
        .bridge-footer-text { margin-top: 25px; font-size: 16px; font-weight: 600; color: #555; font-style: italic; }

        /* ══ PARTNERSHIPS SECTION ══ */
        .partners-section { background-color: #f5f5f5; padding: var(--section-padding); padding-left: 80px; padding-right: 80px; position: relative; z-index: 1; }
        .partners-container { max-width: 1100px; width: 100%; margin: 0 auto; }
        .ps-top { margin-bottom: var(--section-subtitle-mb); }
        .ps-title {
            font-size: var(--section-title-size); font-weight: var(--section-title-weight);
            color: var(--section-title-color); line-height: 1.2; margin: 0 0 var(--section-title-mb);
        }
        .ps-sub { font-size: 15px; color: #6b7f96; line-height: 1.7; max-width: 560px; margin: 0; }
        .ps-body { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
        .partners-form-card {
            background: #fff; border-radius: 20px; padding: 36px;
            box-shadow: 0 8px 32px rgba(0,0,0,0.06);
            transition: box-shadow 0.3s ease, transform 0.3s ease;
        }
        .partners-form-card:hover { box-shadow: 0 20px 56px rgba(0,0,0,0.12); transform: translateY(-4px); }
        .form-row { display: flex; gap: 14px; margin-bottom: 14px; }
        .partners-form-card input, .partners-form-card textarea {
            width: 100%; padding: 13px 16px; border: 1.5px solid #e5e9f0; border-radius: 10px;
            font-family: 'Inter', sans-serif; font-size: 14px; background: #f9fafb; color: #374151;
            transition: border-color 0.2s, box-shadow 0.2s; margin-bottom: 14px; display: block;
        }
        .partners-form-card input:focus, .partners-form-card textarea:focus { outline: none; border-color: #184B89; background: #fff; box-shadow: 0 0 0 3px rgba(24,75,137,0.1); }
        .partners-form-card input::placeholder, .partners-form-card textarea::placeholder { color: #aab4c4; }
        .partners-form-card textarea { height: 130px; resize: none; margin-bottom: 20px; background-image: none; }
        .btn-send {
            width: 100%; background: #174283; color: #fff; padding: 15px; border: none;
            border-radius: 50px; font-size: 15px; font-weight: 700; cursor: pointer;
            font-family: 'Inter', sans-serif;
            transition: background 0.2s, transform 0.2s, box-shadow 0.2s;
        }
        .btn-send:hover { background: #123366; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(23,66,131,0.3); }
        .btn-send:active { transform: scale(0.98); }
        .partners-content { padding-top: 8px; }
        .partners-content h2 { font-size: 22px; font-weight: 800; color: #0a2a4a; margin: 0 0 20px; line-height: 1.3; }
        .partners-content p { font-size: 15px; color: #4a5568; line-height: 1.8; margin: 0 0 18px; }
        .ps-features { margin-top: 28px; display: flex; flex-direction: column; gap: 14px; }
        .ps-feature { display: flex; align-items: flex-start; gap: 12px; transition: transform 0.25s ease; }
        .ps-feature:hover { transform: translateX(5px); }
        .ps-feature-dot {
            width: 8px; height: 8px; background: #184B89; border-radius: 50%;
            flex-shrink: 0; margin-top: 6px;
            transition: transform 0.25s ease, background 0.25s ease;
        }
        .ps-feature:hover .ps-feature-dot { transform: scale(1.7); background: #c0392b; }
        .ps-feature span { font-size: 14px; color: #4a5568; line-height: 1.6; }

        /* ══ HAMBURGER ══ */
        .hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; background: none; border: none; padding: 4px; }
        .hamburger span { display: block; width: 24px; height: 2px; background: var(--navy); border-radius: 2px; transition: all 0.3s; }

        /* ══ FOOTER ══ */
        .main-footer {
            position: relative; background-color: #1a3a6b;
            padding: 80px 40px 60px 40px; overflow: visible;
            font-family: 'Inter', sans-serif; min-height: 400px;
        }
        .footer-wire {
            position: absolute; top: -30px; left: 0; right: 0; height: 60px;
            background-image: url('../img/wire-decoration.png');
            background-repeat: repeat-x; background-size: auto 100%; z-index: 2;
        }
        .footer-inner { position: relative; z-index: 3; max-width: 700px; margin: 0 auto; text-align: center; }
        .footer-palestine-badge { position: absolute; top: -80px; left: -300px; margin-bottom: 0; z-index: 5; }
        .footer-palestine-badge img { height: 30px; }
        .footer-flag {
            position: absolute; top: 0px; right: 60px; width: 50px; z-index: 3;
            transform-origin: top left; animation: flagWave 2.5s ease-in-out infinite;
        }
        .footer-heading { font-size: 35px; font-weight: 700; color: #ffffff; line-height: 1.4; margin-bottom: 24px; font-family: 'Inter', sans-serif; }
        .footer-nav-links { list-style: none; display: flex; justify-content: center; gap: 0; margin-bottom: 22px; }
        .footer-nav-links li { font-size: 13px; color: rgba(255,255,255,0.75); }
        .footer-nav-links li a { color: rgba(255,255,255,0.75); text-decoration: none; padding: 0 14px; transition: color 0.2s; }
        .footer-nav-links li a:hover { color: #fff; }
        .footer-nav-links li::after { content: '|'; color: rgba(255,255,255,0.3); }
        .footer-nav-links li:last-child::after { display: none; }
        .footer-socials { display: flex; justify-content: center; gap: 12px; margin-bottom: 0; }
        .footer-social-btn {
            width: 38px; height: 38px; border-radius: 50%; display: flex;
            align-items: center; justify-content: center; font-size: 16px;
            color: #fff; text-decoration: none;
            transition: transform 0.3s cubic-bezier(0.34,1.56,0.64,1), opacity 0.2s;
        }
        /* إصلاح الـ footer badge */
.footer-palestine-badge {
    position: absolute;
    top: -80px;
    left: 0;       /* بدل -300px */
    z-index: 5;
}

/* إصلاح wire image box */
.wire-img-box {
    position: absolute;
    top: 30px;
    left: 30px;
    right: 0;
    bottom: 30px;
    overflow: hidden;   /* ← هاد الأهم */
}

/* منع الـ hero من الامتداد */
.hero-section,
.hero-slides,
.hero-slide {
    max-width: 100%;
    overflow: hidden;
}

/* منع الـ sections من الامتداد */
section, header, footer {
    max-width: 100vw;
    overflow-x: hidden;
}
        .footer-social-btn:hover { transform: scale(1.28) rotate(-6deg); opacity: 0.92; }
        .footer-social-btn.wa  { background: #25D366; }
        .footer-social-btn.ig  { background: #E1306C; }
        .footer-social-btn.fb  { background: #1877F2; }
        .footer-social-btn.em  { background: #c0392b; }
        .footer-kite-kids {
            position: absolute; bottom: 0; left: 20px; width: 450px; z-index: 3;
            pointer-events: none; transform-origin: bottom right;
            animation: kiteSwing 4s ease-in-out infinite;
        }

        /* ══ KEYFRAMES ══ */
        @keyframes kiteSwing {
            0%   { transform: rotate(-4deg) translateX(0px); }
            25%  { transform: rotate(2deg) translateX(8px); }
            50%  { transform: rotate(-3deg) translateX(-5px); }
            75%  { transform: rotate(3deg) translateX(6px); }
            100% { transform: rotate(-4deg) translateX(0px); }
        }
        @keyframes flagWave {
            0%   { transform: rotate(0deg) scaleX(1); }
            25%  { transform: rotate(3deg) scaleX(0.95); }
            50%  { transform: rotate(-2deg) scaleX(1.03); }
            75%  { transform: rotate(4deg) scaleX(0.97); }
            100% { transform: rotate(0deg) scaleX(1); }
        }

        /* ══ RESPONSIVE ══ */
        @media (max-width: 860px) {
            .hamburger { display: flex; }
            .nav-links { position: fixed; top: 64px; left: 0; right: 0; background: #fff; flex-direction: column; transform: translateY(-110%); opacity: 0; transition: 0.3s; pointer-events: none; }
            .nav-links.open { transform: translateY(0); opacity: 1; pointer-events: all; }
        }
        @media (max-width: 768px) {
            .services-heading { padding-left: 20px; }
            .services-container { flex-direction: column; }
            .services-left { flex: none; width: 100%; padding: 0 20px; margin-bottom: 40px; }
            .services-right { min-height: 320px; margin-left: 20px; margin-right: 20px; }
            .impact-section { padding: 50px 20px 60px 20px; }
            .impact-grid { grid-template-columns: 1fr; gap: 16px; }
            .get-help-section { padding: 40px 20px; }
            .policy-container { flex-direction: column; margin-left: 0; text-align: center; }
            .get-help-footer { flex-direction: column; align-items: flex-start; gap: 20px; padding-left: 40px; }
            .get-help-footer::before { width: 25px; }
            .contact-buttons { width: 100%; justify-content: center; }
            .main-footer { padding: 70px 20px 160px 20px; }
            .footer-nav-links { flex-wrap: wrap; gap: 10px; }
            .footer-nav-links li::after { display: none; }
            .footer-kite-kids { width: 220px; left: -10px; }
            .partners-section { padding: 60px 20px; }
            .ps-body { grid-template-columns: 1fr; gap: 32px; }
        }
        @media (min-width: 769px) and (max-width: 1024px) {
            .impact-grid { grid-template-columns: repeat(2, 1fr); }
        }
        @media (max-width: 900px) {
            .bridge-grid { grid-template-columns: 1fr; }
            .bridge-card { height: 350px; }
        }
        /* ══ INNER PAGES (News & Policies) ══ */
.inner-page-section {
    min-height: 60vh;
    padding: 80px 20px;
    background: #f9fafb;
}

.inner-page-container {
    max-width: 1100px;
    margin: 0 auto;
}

.inner-page-title {
    font-size: 36px;
    font-weight: 800;
    color: #0d2849;
    margin-bottom: 12px;
}

.inner-page-subtitle {
    font-size: 16px;
    color: #4b5563;
    margin-bottom: 40px;
}
/* ══ الأساسيات والمتغيرات ══ */
:root {
    --primary-dark: #123366;    /* الأزرق الغامق الرئيسي */
    --accent-blue: #23527c;     /* أزرق الكارد والفورم */
    --orange-accent: #f47b5f;   /* البرتقالي للرؤوس والنقاط */
    --bg-light: #f9fafb;
    --white: #ffffff;
}

body {
    font-family: 'Inter', sans-serif;
    margin: 0;
    line-height: 1.6;
    color: #333;
}

.policy-hero-detailed {
    background: #123366;
    padding: 80px 40px 70px;
    text-align: center;
    position: relative;
    overflow: hidden;
    font-family: 'Inter', sans-serif;
    min-height: 520px;
}

/* مستندات زخرفية */
.ph-doc {
    position: absolute;
    background: rgba(255,255,255,0.055);
    border: 1px solid rgba(255,255,255,0.10);
    border-radius: 6px;
    pointer-events: none;
}
.ph-doc::before {
    content: '';
    position: absolute;
    top: 22px; left: 14px; right: 14px;
    height: 2px;
    background: rgba(255,255,255,0.15);
    border-radius: 2px;
    box-shadow:
        0 8px 0 rgba(255,255,255,0.10),
        0 16px 0 rgba(255,255,255,0.10),
        0 24px 0 rgba(255,255,255,0.07),
        0 32px 0 rgba(255,255,255,0.07),
        0 40px 0 rgba(255,255,255,0.05);
}
.ph-doc::after {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 6px;
    background: rgba(244,123,95,0.45);
    border-radius: 6px 6px 0 0;
}
.ph-doc-1 { width: 110px; height: 140px; top: 40px; left: -25px; transform: rotate(-14deg); opacity: 0.7; }
.ph-doc-2 { width: 90px; height: 115px; top: 140px; left: 30px; transform: rotate(-6deg); opacity: 0.45; }
.ph-doc-3 { width: 120px; height: 155px; bottom: 30px; left: -10px; transform: rotate(10deg); opacity: 0.5; }
.ph-doc-4 { width: 115px; height: 148px; top: 30px; right: -20px; transform: rotate(13deg); opacity: 0.7; }
.ph-doc-5 { width: 88px; height: 112px; top: 160px; right: 25px; transform: rotate(5deg); opacity: 0.4; }
.ph-doc-6 { width: 105px; height: 135px; bottom: 20px; right: -5px; transform: rotate(-9deg); opacity: 0.55; }

.hero-overlay-wavy { display: none; }

.policy-hero-logo {
    position: relative; z-index: 2;
}
.policy-hero-logo img {
    width: 170px; height: 170px;
    border-radius: 50%;
    object-fit: contain;
    margin-bottom: 10px;
    border: 2px solid rgba(244,123,95,0.5);
    background: rgba(255,255,255,0.09);
    padding: 8px;
    box-shadow: 0 0 0 10px rgba(244,123,95,0.06);
}

.policy-main-title {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 20px;
    position: relative;
    z-index: 2;
    color: #ffffff;
     font-family: 'Caprasimo', cursive;
}

.policy-hero-text {
    max-width: 800px;
    margin: 0 auto;
    font-size: 1.05rem;
    position: relative;
    z-index: 2;
}

.policy-hero-text p {
    color: rgb(255, 255, 255);
    line-height: 1.85;
    margin-bottom: 14px;
}

/* موجة سفلية */
.ph-wave-bottom {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    width: 100%;
    pointer-events: none;
    z-index: 1;
}

.policy-main-title {
    font-size: 2.2rem;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 30px;
    position: relative;
}

.orange-text {
    color: var(--orange-accent);
}

.policy-hero-text {
    max-width: 800px;
    margin: 0 auto;
    font-size: 1.05rem;
    position: relative;
}

/* ══ حاوية المحتوى (Body Container) ══ */
.policy-container-narrow {
    max-width: 1140px;
    margin: 0 auto;
    padding: 60px 20px;
}

.policy-item-block {
    margin-bottom: 100px;
}

.policy-item-header {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.policy-item-header img {
    width: 40px;
    height: 40px;
}

.policy-item-header h2 {
    color: #123366;
    font-size: 32px; 
    font-weight: 700;
    margin: 0;
}
.policy-blue-border-content p, 
.policy-bullets li,
.reporting-top-part p {
    font-size: 18px;
    line-height: 1.8; /* زيادة المسافة بين الأسطر لراحة العين */
    color: #444; /* لون رمادي غامق مريح للنظر أكثر من الأسود الصريح */
}
/* ══ الخط الجانبي الموحد (The Blue Line) ══ */
.policy-blue-border-content {
    border-left: 5px solid #123366;
    padding-left: 30px;
    margin-left: 15px;
    color: #444;
}

/* ══ القوائم النقطية ══ */
.policy-bullets {
    list-style: none;
    padding: 0;
    margin: 15px 0;
}

.policy-bullets li {
    position: relative;
    padding-left: 25px;
    margin-bottom: 10px;
}

.policy-bullets li::before {
    content: "•";
    color: var(--orange-accent);
    font-size: 1.8rem;
    position: absolute;
    left: 0;
    top: -8px;
}

/* ══ قسم التبليغ والشكاوى (Reporting Section) ══ */

/* الحاوية الرئيسية بدون فليكس لمنع تمدد الخط مع الفورم */
.reporting-main-container {
    display: block; 
}

/* الفقرة العلوية - الخط الجانبي يبدأ هنا */
.reporting-top-part {
    border-left: 5px solid var(--primary-dark);
    padding-left: 30px;
    margin-left: 15px;
    margin-bottom: 0;
    padding-bottom: 30px;
}

/* الصف السفلي الذي يجمع النص والفورم */
.reporting-bottom-flex {
    display: flex;
    gap: 50px;
    align-items: flex-start; /* يضمن محاذاة الفورم مع بداية العنوان */
}

/* عمود النص - الخط الجانبي يستمر هنا وينتهي بنهايته */
.reporting-text-col {
    flex: 1.3;
    border-left: 5px solid var(--primary-dark);
    padding-left: 30px;
    margin-left: 15px;
    padding-bottom: 10px; /* الخط ينتهي هنا بالضبط */
}

/* عمود الفورم - بدون خط جانبي لئلا يطول الخط */
.reporting-form-col {
    flex: 1;
}

.complaint-text-bottom h2 {
    color: var(--primary-dark);
    font-size: 1.5rem;
    font-weight: 800;
    margin-top: 0; /* ضروري للمحاذاة الأفقية مع الكارد */
    line-height: 1.2;
    margin-bottom: 20px;
}

/* ══ كارد الفورم (Figma Style) ══ */
.form-card-inner.figma-final-box {
    background-color: #123366;
    border-radius: 12px;
    padding: 35px;
    color: var(--white);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.form-card-title {
    display: flex;
    align-items: center;
    gap: 10px;
    text-transform: uppercase;
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 25px;
}

.policy-form-group {
    margin-bottom: 15px;
}

.policy-form-group label {
    display: block;
    font-size: 0.9rem;
    margin-bottom: 8px;
}

.policy-form-group input, 
.policy-form-group textarea {
    width: 100%;
    padding: 12px;
    border-radius: 8px;
    border: none;
    background: var(--white);
    box-sizing: border-box; /* لضمان عدم خروج المدخلات عن الكارد */
}

.btn-submit-policy-final {
    width: 100%;
    padding: 15px;
    background: var(--white);
    color: #123366;
    border: none;
    border-radius: 50px;
    font-weight: 800;
    font-size: 1rem;
    cursor: pointer;
    margin-top: 10px;
    transition: 0.3s;
}

.btn-submit-policy-final:hover {
    background-color: #f0f0f0;
}
.policy-item-block:last-child {
    margin-bottom: 50px;
}
/* ══ شاشات الجوال ══ */
@media (max-width: 992px) {
    .reporting-bottom-flex {
        flex-direction: column;
        gap: 30px;
    }
    .reporting-text-col, .reporting-top-part, .policy-blue-border-content {
        margin-left: 0;
        padding-left: 20px;
    }
    .policy-main-title {
        font-size: 2.2rem;
    }
}
/* ══ POLICY PAGE ANIMATIONS ══ */

/* الحالة الأولية — مخفي */
.ph-doc,
.policy-hero-logo,
.policy-main-title,
.policy-hero-text p,
.ph-wave-bottom,
.policy-item-block,
.policy-item-header,
.policy-blue-border-content,
.reporting-top-part,
.reporting-bottom-flex {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
}

/* لما تظهر */
.anim-visible {
    opacity: 1 !important;
    transform: translateY(0) !important;
}

/* المستندات الجانبية تيجي من الجنب */
.ph-doc-1, .ph-doc-2, .ph-doc-3 {
    transform: translateX(-40px) rotate(-14deg) !important;
}
.ph-doc-1.anim-visible { transform: translateX(0) rotate(-14deg) !important; }
.ph-doc-2.anim-visible { transform: translateX(0) rotate(-6deg) !important; }
.ph-doc-3.anim-visible { transform: translateX(0) rotate(10deg) !important; }

.ph-doc-4, .ph-doc-5, .ph-doc-6 {
    transform: translateX(40px) rotate(13deg) !important;
}
.ph-doc-4.anim-visible { transform: translateX(0) rotate(13deg) !important; }
.ph-doc-5.anim-visible { transform: translateX(0) rotate(5deg) !important; }
.ph-doc-6.anim-visible { transform: translateX(0) rotate(-9deg) !important; }
/* News Page Styling */
.news-page {
    padding: 60px 0;
    background-color: #fff;
    font-family: 'Nunito', sans-serif;
}

.container {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 10px;
}

.page-title {
    text-align: center;
    color: #1a4a7c; /* لون أزرق غامق مشابه للتصميم */
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 50px;
}

.articles-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.article-card {
    display: flex;
    gap: 30px;
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
    align-items: flex-start;
}

.article-image img {
    width: 280px;
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
}

.article-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.article-header {
    font-size: 24px;
    font-weight: 800;
    color: #333;
    margin-bottom: 10px;
}

.article-description {
    font-size: 16px;
    color: #555;
    line-height: 1.6;
    margin-bottom: 20px;
}

.article-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
}

.read-more-btn {
    background-color: #e0e0e0;
    color: #333;
    padding: 8px 20px;
    border-radius: 5px;
    text-decoration: none;
    font-weight: 600;
    font-size: 14px;
    transition: background 0.3s;
}

.read-more-btn:hover {
    background-color: #d0d0d0;
}

.article-date {
    color: #1a4a7c;
    font-size: 14px;
    font-weight: 600;
}

/* Load More Button */
.load-more-wrapper {
    text-align: center;
    margin-top: 40px;
}

.load-more-btn {
    background-color: #1a4a7c;
    color: white;
    padding: 10px 40px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: opacity 0.3s;
}

.load-more-btn:hover {
    opacity: 0.9;
}
.news-page {
    padding-top: 100px; 
    padding-bottom: 80px;
    background-color: #fff;
    font-family: 'Nunito', sans-serif;
}

/* تعديل العنوان الرئيسي */
.page-title {
    text-align: center;
    color: #1a4a7c;
    font-size: 40px; /* تكبير الخط قليلاً ليطابق الصورة */
    font-weight: 700;
    margin-bottom: 60px; /* زيادة المسافة بين العنوان وأول مقال */
    letter-spacing: 0.5px;
}

/* تعديل البطاقة (المقال الواحد) */
.article-card {
    display: flex;
    gap: 40px; /* زيادة المسافة بين الصورة والنص */
    padding-bottom: 40px;
    margin-bottom: 40px; /* زيادة المسافة بين كل مقال والآخر */
    border-bottom: 1px solid #f0f0f0;
    align-items: flex-start;
}

/* تحسين شكل الصورة */
.article-image img {
    width: 320px; /* عرض أكبر قليلاً */
    height: 200px;
    object-fit: cover;
    border-radius: 4px; /* زوايا أقل حدة لتناسب التصميم */
}

/* تنسيق النص الوصفي */
.article-description {
    font-size: 18px; /* تكبير الخط قليلاً */
    color: #444;
    line-height: 1.5;
    margin-top: 10px;
    margin-bottom: 30px;
    max-width: 90%; /* منع النص من التمدد بشكل مبالغ فيه */
}
/* Responsive Design */
@media (max-width: 768px) {
    .article-card {
        flex-direction: column;
    }
    .article-image img {
        width: 100%;
        height: auto;
    }
}
/* تنسيق حاوية الأزرار */
.pagination-wrapper nav {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-top: 50px;
}

/* تنسيق أزرار "التالي" و "السابق" */
.pagination-wrapper a, 
.pagination-wrapper span {
    padding: 10px 25px;
    background-color: #1a4a7c; /* لونك الأزرق الأساسي */
    color: white !important;
    text-decoration: none;
    border-radius: 30px; /* لجعل الأزرار بيضاوية واحترافية */
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
    display: flex;
    align-items: center;
}

/* حل مشكلة الأيقونة العملاقة - نحدد حجم الـ SVG إجبارياً */
.pagination-wrapper svg {
    width: 20px !important;
    height: 20px !important;
    margin: 0 5px;
}

/* تأثير عند تمرير الماوس */
.pagination-wrapper a:hover {
    background-color: #0d2a4a;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* شكل الزر عندما لا يوجد صفحات أخرى (معطل) */
.pagination-wrapper .disabled span,
.pagination-wrapper [aria-disabled="true"] span {
    background-color: #e0e0e0 !important;
    color: #a0a0a0 !important;
    cursor: not-allowed;
}
/* ═══════════════════════════════════════════════════
   POLICIES PAGE — RESPONSIVE ADDITIONS
   أضف هاي الـ CSS في آخر ملف الـ CSS الحالي
   ═══════════════════════════════════════════════════ */

/* ══ HERO SECTION ══ */
@media (max-width: 1024px) {
    .policy-hero-detailed {
        padding: 60px 30px 60px;
        min-height: auto;
    }

    .policy-main-title {
        font-size: 2rem;
    }

    .policy-hero-logo img {
        width: 140px;
        height: 140px;
    }

    /* تصغير المستندات الزخرفية على التابلت */
    .ph-doc-1 { width: 85px; height: 110px; left: -15px; }
    .ph-doc-2 { width: 70px; height: 90px;  left: 18px;  }
    .ph-doc-3 { width: 90px; height: 120px; left: -8px;  }
    .ph-doc-4 { width: 85px; height: 110px; right: -12px;}
    .ph-doc-5 { width: 68px; height: 88px;  right: 16px; }
    .ph-doc-6 { width: 80px; height: 105px; right: -4px; }
}

@media (max-width: 768px) {
    .policy-hero-detailed {
        padding: 50px 20px 50px;
        min-height: auto;
    }

    .policy-main-title {
        font-size: clamp(1.4rem, 5vw, 2rem);
        margin-bottom: 16px;
    }

    .policy-hero-logo img {
        width: 110px;
        height: 110px;
    }

    .policy-hero-text {
        font-size: 0.95rem;
    }

    .policy-hero-text p {
        font-size: 0.95rem;
        margin-bottom: 10px;
    }

    /* إخفاء المستندات الجانبية على الموبايل لأنها بتتداخل */
    .ph-doc-1, .ph-doc-2, .ph-doc-3,
    .ph-doc-4, .ph-doc-5, .ph-doc-6 {
        display: none;
    }
}

@media (max-width: 480px) {
    .policy-hero-detailed {
        padding: 40px 16px 44px;
    }

    .policy-main-title {
        font-size: 1.3rem;
        line-height: 1.3;
    }

    .policy-hero-logo img {
        width: 90px;
        height: 90px;
    }
}

/* ══ POLICY BODY CONTENT ══ */
@media (max-width: 1024px) {
    .policy-container-narrow {
        padding: 40px 24px;
    }

    .policy-item-header h2 {
        font-size: 26px;
    }

    .policy-blue-border-content p,
    .policy-bullets li,
    .reporting-top-part p {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .policy-container-narrow {
        padding: 30px 16px;
    }

    .policy-item-block {
        margin-bottom: 60px;
    }

    .policy-item-header {
        gap: 10px;
        margin-bottom: 14px;
    }

    .policy-item-header img {
        width: 32px;
        height: 32px;
        flex-shrink: 0;
    }

    .policy-item-header h2 {
        font-size: 22px;
    }

    .policy-blue-border-content {
        border-left-width: 4px;
        padding-left: 18px;
        margin-left: 8px;
    }

    .policy-blue-border-content p,
    .policy-bullets li,
    .reporting-top-part p {
        font-size: 15px;
        line-height: 1.7;
    }
}

@media (max-width: 480px) {
    .policy-item-header h2 {
        font-size: 19px;
    }

    .policy-blue-border-content {
        padding-left: 14px;
        margin-left: 4px;
    }

    .policy-blue-border-content p,
    .policy-bullets li,
    .reporting-top-part p {
        font-size: 14px;
    }
}

/* ══ REPORTING SECTION ══ */
@media (max-width: 992px) {
    .reporting-bottom-flex {
        flex-direction: column;
        gap: 24px;
    }

    .reporting-text-col {
        flex: none;
        width: 100%;
        margin-left: 0;
        padding-left: 18px;
        border-left-width: 4px;
    }

    .reporting-top-part {
        margin-left: 0;
        padding-left: 18px;
        border-left-width: 4px;
    }

    .reporting-form-col {
        width: 100%;
    }

    .complaint-text-bottom h2 {
        font-size: 1.3rem;
    }

    .complaint-text-bottom p {
        font-size: 15px;
        /* إلغاء الـ <br> الاصطناعية على الموبايل */
        word-break: break-word;
    }
}

@media (max-width: 768px) {
    .form-card-inner.figma-final-box {
        padding: 24px 20px;
    }

    .form-card-title {
        font-size: 1rem;
        margin-bottom: 18px;
    }

    .policy-form-group input,
    .policy-form-group textarea {
        padding: 10px;
        font-size: 14px;
    }

    .btn-submit-policy-final {
        padding: 13px;
        font-size: 0.95rem;
    }
}

@media (max-width: 480px) {
    .reporting-text-col,
    .reporting-top-part {
        padding-left: 14px;
    }

    .complaint-text-bottom h2 {
        font-size: 1.15rem;
    }

    .complaint-text-bottom p {
        font-size: 13.5px;
    }

    .form-card-inner.figma-final-box {
        padding: 20px 16px;
        border-radius: 10px;
    }
}

/* ══ POLICY ITEM - LAST CHILD ══ */
@media (max-width: 768px) {
    .policy-item-block:last-child {
        margin-bottom: 30px;
    }
}
/* ═══════════════════════════════════════════════════════
   HOMEPAGE — RESPONSIVE ADDITIONS
   أضف هاي الـ CSS في آخر ملف الـ CSS الحالي
   ═══════════════════════════════════════════════════════ */

/* ══════════════════════════════
   NAVBAR
══════════════════════════════ */
@media (max-width: 860px) {
    .nav-links {
        position: fixed;
        top: 64px;
        left: 0; right: 0;
        background: #fff;
        flex-direction: column;
        align-items: stretch;
        padding: 12px 0 20px;
        box-shadow: 0 8px 24px rgba(0,0,0,0.10);
        transform: translateY(-110%);
        opacity: 0;
        transition: transform 0.3s ease, opacity 0.3s ease;
        pointer-events: none;
        z-index: 999;
    }
    .nav-links.open {
        transform: translateY(0);
        opacity: 1;
        pointer-events: all;
    }
    .nav-links li a {
        padding: 12px 24px;
        border-radius: 0;
        font-size: 15px;
    }
    .nav-links li a.donate-btn-nav {
        margin: 8px 24px 0;
        border-radius: 8px;
        text-align: center;
    }
    .hamburger { display: flex; }
}

@media (max-width: 480px) {
    .nav-logo img { height: 70px; width: 70px; }
    .nav-logo { margin-left: -10px; }
    .navbar { padding: 0 16px; }
}

/* ══════════════════════════════
   HERO
══════════════════════════════ */
@media (max-width: 768px) {
    .hero-section { min-height: 480px; }

    .hero-content { padding: 0 20px; }

    .hero-content-inner {
        margin-left: 0;
        max-width: 100%;
    }

    .hero-title { font-size: clamp(22px, 6vw, 36px); margin-bottom: 14px; }

    .hero-sub { font-size: clamp(13px, 3.5vw, 16px); margin-bottom: 4px; }
    .hero-sub:last-of-type { margin-bottom: 24px; }

    .hero-btn { padding: 11px 26px; font-size: 14px; }
}

@media (max-width: 480px) {
    .hero-section { min-height: 380px; }
    .hero-content { padding: 0 16px; }
    .hero-title { font-size: clamp(20px, 7vw, 28px); }
}

/* ══════════════════════════════
   ABOUT
══════════════════════════════ */
@media (max-width: 1024px) {
    .about-refined { padding: 50px 30px 20px; }
    .about-container { padding-left: 20px; }
}

@media (max-width: 768px) {
    .about-refined { padding: 40px 20px 16px; }
    .about-container { padding-left: 0; max-width: 100%; }

    .about-title { font-size: 28px; }
    .about-subtitle { font-size: 18px; margin-bottom: 28px; }
    .about-body-area p { font-size: 15px; }

    .crisis-callout { padding: 18px 20px; }
    .crisis-callout p { font-size: 15px; }
}

@media (max-width: 480px) {
    .about-title { font-size: 24px; }
    .about-subtitle { font-size: 16px; }
    .about-body-area p { font-size: 14px; }

    .action-badge { font-size: 10px; padding: 6px 12px; }
}

/* ══════════════════════════════
   SERVICES
══════════════════════════════ */
@media (max-width: 1024px) {
    .services-left { padding-left: 24px; }
    .services-heading { padding-left: 24px; }
}

@media (max-width: 768px) {
    .services-section { padding: 50px 0; }
    .services-heading { padding-left: 20px; font-size: 18px; }

    .services-container { flex-direction: column; }

    .services-left {
        flex: none;
        width: 100%;
        padding: 0 16px;
        grid-template-columns: 1fr 1fr; /* يبقى شبكتين */
        gap: 0;
        margin-bottom: 30px;
    }

    .service-item { padding: 20px 14px; }
    .service-num { font-size: clamp(28px, 8vw, 40px); }
    .service-title { font-size: 14px; }
    .service-desc { font-size: 12px; }

    .services-right {
        min-height: 280px;
        margin: 0 16px;
    }

    .wire-img-box {
        top: 20px; left: 20px;
        right: 0; bottom: 20px;
    }
}

@media (max-width: 480px) {
    .services-left {
        grid-template-columns: 1fr; /* عمود واحد على الشاشات الصغيرة جداً */
    }

    .services-right { min-height: 220px; margin: 0 12px; }
}

/* ══════════════════════════════
   IMPACT STATS
══════════════════════════════ */
@media (max-width: 1024px) {
    .impact-section { padding: 60px 24px; }
    .impact-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
}

@media (max-width: 768px) {
    .impact-section { padding: 50px 16px 60px; }
    .impact-title { font-size: 26px; }
    .impact-sub { font-size: 13px; }
    .impact-grid { grid-template-columns: 1fr; gap: 14px; max-width: 480px; }

    .impact-card-img { height: 140px; }
    .impact-stat { font-size: 28px; margin-bottom: 12px; }
    .impact-desc { font-size: 12px; }
}

@media (max-width: 480px) {
    .impact-grid { max-width: 100%; }
    .impact-title { font-size: 22px; }
}

/* ══════════════════════════════
   PATH OF HEALING
══════════════════════════════ */
@media (max-width: 768px) {
    .healing-img:last-child {
        transform: scale(1.7) !important;
        transform-origin: center center !important;
        margin: 10px 0 !important;
    }
}
@media (max-width: 768px) {
    .healing-img:first-child {
        transform: scale(1.2) !important;
        transform-origin: center center !important;
        margin: 10px 0 !important;
    }
}
@media (max-width: 768px) {
    .healing-title {
        margin-bottom: 30px !important;
        
    }
}
@media (max-width: 480px) {
    .healing-title { font-size: 2px; }
}

/* ══════════════════════════════
   GET HELP
══════════════════════════════ */
@media (max-width: 1024px) {
    .get-help-section { padding: 60px 24px; }
    .get-help-container { max-width: 100%; }
}

@media (max-width: 768px) {
    .get-help-section { padding: 40px 16px; }

    .get-help-title { font-size: 26px; }
    .get-help-subtitle { font-size: 18px; margin-bottom: 28px; }

    .steps-wrapper { padding-left: 36px; }
    .steps-wrapper::before { left: 10px; bottom: -180px; }

    .step-item::before { left: -32px; width: 13px; height: 13px; }
    .step-header h3 { font-size: 16px; }
    .step-desc { font-size: 14px; }

    /* policy box */
    .policy-container {
        flex-direction: column;
        align-items: flex-start;
        margin-left: 0;
        gap: 14px;
        padding: 16px 18px;
    }
    .btn-download { width: 100%; justify-content: center; }

    /* footer row */
    .get-help-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
        padding-left: 36px;
    }
    .get-help-footer::before { width: 22px; }
    .footer-text { font-size: 16px; }

    .contact-buttons { width: 100%; }
    .btn-contact { flex: 1; justify-content: center; padding: 11px 16px; font-size: 14px; }
}

@media (max-width: 480px) {
    .steps-wrapper { padding-left: 28px; }
    .step-item::before { left: -26px; }
    .step-header h3 { font-size: 15px; }
    .step-desc { font-size: 13px; }

    .get-help-footer { padding-left: 28px; }
    .get-help-footer::before { width: 18px; }
    .contact-buttons { flex-direction: column; gap: 10px; }
    .btn-contact { width: 100%; }
}

/* ══════════════════════════════
   BRIDGE / DONATE
══════════════════════════════ */
@media (max-width: 1024px) {
    .bridge-section { padding: 60px 24px; }
    .bridge-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; }
    .bridge-card { height: 320px; }
}

@media (max-width: 768px) {
    .bridge-section { padding: 50px 16px; }
    .bridge-title { font-size: 22px; margin-bottom: 28px; }

    .bridge-grid { grid-template-columns: 1fr; gap: 14px; }
    .bridge-card { height: 280px; border-radius: 12px; }
    .bridge-card-text { font-size: 17px; }

    .bridge-desc { font-size: 15px; margin-bottom: 22px; }
    .donate-btn-large { padding: 14px 40px; font-size: 17px; }
    .bridge-footer-text { font-size: 14px; }
}

@media (max-width: 480px) {
    .bridge-card { height: 230px; }
    .bridge-title { font-size: 19px; }
    .donate-btn-large { padding: 13px 30px; font-size: 15px; width: 100%; text-align: center; }
}

/* ══════════════════════════════
   PARTNERSHIPS
══════════════════════════════ */
@media (max-width: 1024px) {
    .partners-section { padding: 60px 24px; }
}

@media (max-width: 768px) {
    .partners-section { padding: 50px 16px; }

    .ps-title { font-size: 26px; }
    .ps-sub { font-size: 14px; }
    .ps-top { margin-bottom: 28px; }

    .ps-body { grid-template-columns: 1fr; gap: 28px; }

    .partners-form-card { padding: 24px 20px; }
    .form-row { flex-direction: column; gap: 0; }
    .form-row input { margin-bottom: 14px; }

    .partners-content h2 { font-size: 20px; }
    .partners-content p { font-size: 14px; }
    .ps-feature span { font-size: 13px; }
}

@media (max-width: 480px) {
    .ps-title { font-size: 22px; }
    .btn-send { font-size: 14px; padding: 13px; }
}

/* ══════════════════════════════
   FOOTER
══════════════════════════════ */
@media (max-width: 1024px) {
    .main-footer { padding: 70px 30px 60px; }
    .footer-kite-kids { width: 320px; }
    .footer-palestine-badge { left: -180px; }
}

@media (max-width: 768px) {
    .main-footer { padding: 70px 20px 180px; }

    .footer-heading { font-size: 26px; margin-bottom: 18px; }

    .footer-nav-links {
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }
    .footer-nav-links li::after { display: none; }
    .footer-nav-links li a { padding: 4px 10px; font-size: 13px; }

    .footer-socials { gap: 10px; }
    .footer-social-btn { width: 34px; height: 34px; font-size: 14px; }

    .footer-kite-kids { width: 200px; left: -8px; }
    .footer-flag { right: 16px; width: 38px; }
    .footer-palestine-badge { display: none; }
}

@media (max-width: 480px) {
    .main-footer { padding: 60px 16px 160px; }
    .footer-heading { font-size: 22px; }
    .footer-kite-kids { width: 160px; }
}
/* ══════════════════════════════════════════════
   MOBILE NAV DRAWER — COMPLETE & FINAL
══════════════════════════════════════════════ */
@media (max-width: 860px) {

  /* Overlay */
  .nav-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(10, 42, 74, 0.45);
    backdrop-filter: blur(3px);
    z-index: 998;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .nav-overlay.active {
    display: block;
    opacity: 1;
  }

  /* Drawer */
  .nav-links {
    position: fixed !important;
    top: 0 !important;
    right: -100% !important;
    left: auto !important;
    width: 78vw !important;
    max-width: 300px !important;
    height: 100dvh !important;
    background: #ffffff !important;
    flex-direction: column !important;
    align-items: stretch !important;
    padding: 90px 0 40px !important;
    transform: none !important;
    opacity: 1 !important;
    transition: right 0.35s cubic-bezier(0.22, 1, 0.36, 1) !important;
    pointer-events: none;
    z-index: 999;
    box-shadow: -8px 0 40px rgba(10, 42, 74, 0.18);
    overflow-y: auto;
  }

  .nav-links.open {
    right: 0 !important;
    pointer-events: all;
  }

  /* Links */
  .nav-links li {
    opacity: 1 !important;
    animation: none !important;
    border-bottom: 1px solid rgba(10, 42, 74, 0.08) !important;
  }

  .nav-links li a {
    color: #0a2a4a !important;
    font-size: 15px !important;
    padding: 16px 28px !important;
    border-radius: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    transition: background 0.2s, color 0.2s, padding-left 0.2s !important;
  }

  .nav-links li a:hover {
    background: #eef2ff !important;
    color: #1a4fa0 !important;
    padding-left: 36px !important;
  }

  .nav-links li a.active {
    background: #eef2ff !important;
    color: #1a4fa0 !important;
    border-left: 3px solid #1a4fa0;
  }

  /* أيقونات اللينكات */
  .nav-links li a::before {
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 14px;
    opacity: 0.5;
    color: #0a2a4a;
    width: 18px;
    text-align: center;
    flex-shrink: 0;
  }


  /* زر Donate */
  .nav-links li a.donate-btn-nav {
    margin: 20px 24px 0 !important;
    border-radius: 50px !important;
    background: #c0392b !important;
    color: #fff !important;
    justify-content: center !important;
    padding: 14px 28px !important;
    font-size: 15px !important;
    border-left: none !important;
  }
  .nav-links li a.donate-btn-nav:hover {
    background: #a93226 !important;
    padding-left: 28px !important;
  }
  .nav-links li a.donate-btn-nav::before {
    color: #fff !important;
    opacity: 0.9 !important;
  }

  /* شعار داخل الـ Drawer — يسار */
  .nav-drawer-logo {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 72px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid rgba(10, 42, 74, 0.10);
    background: #fff;
  }
  .nav-drawer-logo img {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: contain;
    border: 2px solid rgba(10, 42, 74, 0.15);
    flex-shrink: 0;
  }
  .nav-drawer-logo span {
    font-size: 13px;
    font-weight: 700;
    color: #0a2a4a;
    line-height: 1.3;
    margin-left: 10px;
  }
/* الشعار مخفي على الشاشات الكبيرة */
.nav-drawer-logo { display: none !important; }

  /* Hamburger → X */
  .hamburger {
    display: flex;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    background: none;
    border: none;
    padding: 6px;
    z-index: 1001;
    position: relative;
    transition: transform 0.3s ease;
  }
  .hamburger span {
    display: block;
    width: 24px;
    height: 2px;
    background: var(--navy);
    border-radius: 2px;
    transition: transform 0.35s ease, opacity 0.25s ease, background 0.25s ease;
    transform-origin: center;
  }
  .hamburger.open {
    transform: scale(1.15);
  }
  .hamburger.open span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
    background: #c0392b;
  }
  .hamburger.open span:nth-child(2) {
    opacity: 0;
    transform: scaleX(0);
  }
  .hamburger.open span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
    background: #c0392b;
  }

  /* منع scroll الخلفية */
  body.nav-open {
    overflow: hidden;
  }
}
.hide-on-desktop { display: none; }

@media (max-width: 860px) {
  .hide-on-desktop { display: flex !important; }
}
@media (max-width: 768px) {
    .hero-section {
        height: 55vh !important;
        min-height: 300px !important;
    }
}
/* ══ FIX: Get Help Section - Mobile ══ */
@media (max-width: 768px) {

    /* إصلاح الخط الجانبي - يوقف عند الـ policy-container */
    .steps-wrapper::before {
        bottom: 0 !important;
    }

    /* إصلاح الـ policy-container على الموبايل */
    .policy-container {
        flex-direction: column !important;
        align-items: flex-start !important;
        margin-left: 0 !important;
        gap: 16px !important;
        padding: 20px !important;
    }

    /* الأيقونة والنص جنب بعض */
    .policy-info {
        flex-direction: row !important;
        align-items: flex-start !important;
        gap: 12px !important;
    }

    .policy-info i {
        font-size: 22px !important;
        margin-top: 2px !important;
        flex-shrink: 0 !important;
    }

    .policy-text {
        font-size: 13.5px !important;
        text-align: left !important;
    }

    /* زر التحميل - عرض كامل */
    .btn-download {
        width: 100% !important;
        justify-content: center !important;
        padding: 11px 16px !important;
    }

    /* إصلاح الـ footer section */
    .get-help-footer {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
        padding-left: 36px !important;
    }

    .footer-text {
        font-size: 16px !important;
        line-height: 1.4 !important;
    }

    /* أزرار الواتساب والإيميل - عمود */
    .contact-buttons {
        flex-direction: column !important;
        width: 100% !important;
        gap: 10px !important;
    }

    .btn-contact {
        width: 100% !important;
        justify-content: center !important;
        padding: 13px 20px !important;
        font-size: 15px !important;
    }
}
@media (max-width: 768px) {
    .main-footer {
        padding: 70px 20px 140px 20px !important; 
        min-height: unset !important;
    }
    .footer-inner {
        position: relative !important;
        z-index: 4 !important;
        padding-bottom: 0 !important;
    }
    .footer-heading { 
        font-size: 22px !important; 
        margin-bottom: 16px !important;
    }
    .footer-socials {
        margin-bottom: 0 !important;
    }
    .footer-social-btn { 
        width: 44px !important; 
        height: 44px !important; 
        font-size: 18px !important; 
    }
    .footer-kite-kids { 
        width: 260px !important; 
        left: -5px !important; 
        bottom: 0 !important;
        z-index: 3 !important;
    }
    .footer-flag {
        top: 15px !important; 
        right: 16px !important;
        width: 45px !important;
    }
}

@media (max-width: 480px) {
    .main-footer { 
        padding: 65px 16px 130px 16px !important; 
    }
    .footer-kite-kids { width: 220px !important; }
}

/* ══ POLICIES HERO - MOBILE FIX ══ */
@media (max-width: 768px) {
    .policy-hero-detailed {
        padding: 30px 20px 40px !important;
        min-height: unset !important;
    }

    .policy-hero-logo img {
        width: 100px !important;
        height: 100px !important;
        margin-bottom: 16px !important;
    }

    .policy-main-title {
        font-size: 1.6rem !important;
        margin-bottom: 20px !important;
    }

    .policy-hero-text p {
        font-size: 14px !important;
        line-height: 1.7 !important;
        margin-bottom: 10px !important;
    }
}
.policy-hero-detailed {
    margin-top: 64px !important;
}
@media (max-width: 768px) {
    .policy-hero-detailed {
        padding: 40px 24px 50px !important;
        /* تم التعديل هنا لتوسيط كل المحتويات النصية واللوقو إذا كان img أو inline element */
        text-align: center !important; 
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important; /* يضمن توسيط اللوقو تماماً حتى لو كان عنصر block */
    }

    .policy-main-title {
        font-size: clamp(1.5rem, 5vw, 2rem) !important;
        /* تم التعديل هنا لتوسيط العنوان الرئيسي */
        text-align: center !important; 
        margin-bottom: 20px !important;
        width: 100% !important;
    }

    .policy-hero-text {
        /* تم التعديل هنا لتوسيط حاوية النصوص */
        text-align: center !important; 
    }

    .policy-hero-text p {
        font-size: 15px !important;
        line-height: 1.7 !important;
        /* تم التعديل هنا لتوسيط الفقرة الوصفية */
        text-align: center !important; 
    }

    /* في حال كان للوقو الدائري كلاس مستقل (مثلاً لو كان اسمه .policy-logo) */
    /* يمكنك إضافة هذا الجزء لتأكيد توسيطه بالهوامش */
    .policy-hero-detailed img:not([class^="ph-doc"]) { 
        display: block !important;
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 15px !important; /* مسافة بين اللوقو والعنوان */
    }

    /* إظهار المستندات الزخرفية (تظل كما هي في كودك الأصلي) */
    .ph-doc-1, .ph-doc-2, .ph-doc-3,
    .ph-doc-4, .ph-doc-5, .ph-doc-6 {
        display: block !important;
    }

    .ph-doc-1 { width: 60px !important; height: 80px !important; left: -10px !important; }
    .ph-doc-2 { width: 50px !important; height: 65px !important; left: 10px !important; }
    .ph-doc-3 { width: 65px !important; height: 85px !important; left: -5px !important; }
    .ph-doc-4 { width: 60px !important; height: 80px !important; right: -10px !important; }
    .ph-doc-5 { width: 50px !important; height: 65px !important; right: 10px !important; }
    .ph-doc-6 { width: 65px !important; height: 85px !important; right: -5px !important; }
}
.complaint-success-msg {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
    border-radius: 10px;
    padding: 14px 20px;
    margin-bottom: 16px;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}
.policy-form-error {
    color: #e53935;
    font-size: 13px;
    margin-top: 4px;
    display: block;
}
.cc-label {
    font-weight: 700;
    color: #1565c0;
    font-size: 13px;
    min-width: 55px;
    flex-shrink: 0;
}
.pagination-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin: 40px 0;
}

.pagination-wrapper .nav-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #1a446c; /* كحلي متناسق */
    color: #ffffff;
    font-size: 18px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.pagination-wrapper .nav-icon:hover {
    background-color: #b32d2e; /* أحمر ناعم عند التمرير */
}

.pagination-wrapper .nav-icon.disabled {
    background-color: #f1f5f9;
    color: #cbd5e1;
    cursor: not-allowed;
}
.footer-social-btn.tw { background: #000000; }
/* إخفاء أيقونات الـ nav على الديسكتوب */
.nav-links li a i {
    display: none;
}

@media (max-width: 860px) {
    .nav-links li a i {
        display: inline-block;
    }
}