/* ============================================================
   ebabu4 — About Section
   Namespace  : ebabu4
============================================================ */

/* 1. Variables & Colors */
.ebabu4 {
    --ebabu4-bg: #ffffff;
    --ebabu4-text: #1f2937;
    --ebabu4-title: #0b3a78;
    --ebabu4-border: rgba(0, 0, 0, 0.12);

    --ebabu4-card-bg: #ffffff;
    --ebabu4-card-title: #0b3a78;
    --ebabu4-card-text: #374151;
    --ebabu4-card-btn: #0b3a78;

    --ebabu4-btn-bg: #0b3a78;
    --ebabu4-btn-text: #ffffff;

    --ebabu4-input-bg: #ffffff;
    --ebabu4-input-text: #111827;

    --ebabu4-padding-top: clamp(2rem, 6vw, 4rem);
    --ebabu4-padding-bottom: clamp(2rem, 6vw, 4rem);

    background: var(--ebabu4-bg);
    color: var(--ebabu4-text);
    font-family: "El Messiri", sans-serif;
}

/* 2. Reset داخل الـ namespace */
*,
.ebabu4 *,
.ebabu4 *::before,
.ebabu4 *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* 3. Base Styles — Mobile */
.ebabu4 {
    padding-top: var(--ebabu4-padding-top);
    padding-bottom: var(--ebabu4-padding-bottom);
    text-align: center;
     margin: 0 auto;

}

.ebabu4__container {
    width:92%;
    margin: 0 auto;
}



.ebabu4__content {
    display: flex;
    flex-direction: column;
    gap: clamp(0.9rem, 2.5vw, 1.2rem);
}

.ebabu4__title {
    font-size: clamp(1.4rem, 5vw, 2.2rem);
    font-weight: 800;
    color: var(--ebabu4-title);
    line-height: 1.2;
}

.ebabu4__text {
    font-size: clamp(0.95rem, 3.5vw, 1.05rem);
    line-height: 1.9;
    color: var(--ebabu4-card-text);

}


@media (min-width: 481px) {
    

}

@media (min-width: 601px) {
    .ebabu4__grid {
        gap: 2.2rem;
    }

  
}

@media (min-width: 769px) {


    .ebabu4__content {
        gap: 1.2rem;
    }
}

@media (min-width: 1025px) {
 
    .ebabu4__title {
        font-size: clamp(2rem, 2.8vw, 2.8rem);
    }

    .ebabu4__text {
        font-size: clamp(1rem, 1.1vw, 1.08rem);
    }
}

@media (min-width: 1281px) {
    .ebabu4__grid {
        gap: 3rem;
    }
}

@media (min-width: 1441px) {

}

@media (min-width: 1921px) {
   
}