:root{
    --green:#7BCB3D;
    --blue:#0A4A7F;
    --bg:#efefef;
}

html, body {
    overflow-x: hidden;
}

body{
    font-family: 'Cairo', sans-serif;
    direction: rtl;
    text-align: right;
}

/* ================= HEADER ================= */

/* القائمة */
.navbar-nav{
    margin-right: auto;
    margin-left: 0 !important;
}

.navbar-nav .nav-link{
    margin-right: 25px;
    margin-left: 0;
    font-weight: 700;
}

nav #logo {
    width: 300px;
}

@media (max-width: 991px) {
    nav #logo {
    width: 150px;
}
}

.navbar{
    background:#fff;
    padding:20px 0;
    box-shadow:0 2px 10px rgba(0,0,0,.05);
}

header #header-logo {
    width: 250px;
}

@media (max-width: 979px) {
    header #header-logo {
    width: 125px;
}
}

.logo{
    font-size:42px;
    font-weight:900;
    font-style:italic;
}

.logo span:first-child{
    color:var(--green);
}

.logo span:last-child{
    color:var(--blue);
}

.navbar-nav .nav-link{
    color:var(--blue);
    font-weight:900;
    font-size: 22px;
    margin-left:25px;
    text-transform:uppercase;
}

/* ================= NEWS BAR ================= */

.news-bar{
    background:var(--green);
    color:#fff;
    overflow:hidden;
    white-space:nowrap;
    height:45px;
    display:flex;
    align-items:center;
}

.news-track{
    display:inline-block;
    padding-left:100%;
    animation:scrollNews 25s linear infinite;
    font-weight:700;
    font-size:18px;
}

@keyframes scrollNews{
    from{
        transform:translateX(0);
    }
    to{
        transform:translateX(-100%);
    }
}

/* ================= HERO ================= */

.hero{
    min-height:85vh;
    position:relative;
    overflow:hidden;
}

.hero-bg{
    position:absolute;
    inset:0;
    background:url('img/2148847778.jpg')
    center center/cover;
}

.hero-bg::after{
    content:'';
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.15);
}

.hero-left{
    position:absolute;
    top:0;
    right:0;
    width:45%;
    height:100%;
    background: var(--blue);
    filter: opacity(.85);

    clip-path:polygon(
        0 0,
        100% 0,
        100% 100%,
        22% 100%
    );

    z-index:2;
    display:flex;
    align-items:center;
}

.hero-content{
    max-width:600px;
    padding-right:60px;
    color:white;
}

.hero-small{
    font-size:20px;
    font-weight:700;
    text-transform:uppercase;
    margin-bottom:20px;
}

.hero-line{
    width:120px;
    height:3px;
    background:var(--green);
    margin-bottom:30px;
}

.hero-title{
    font-size:72px;
    font-weight:900;
    line-height:1;
    margin-bottom:15px;
}

.hero-title span{
    color:var(--green);
}

.hero-subtitle{
    font-size:48px;
    line-height:1.1;
    color:var(--green);
    font-weight:300;
}

.hero-btn{
    margin-top:40px;
    display:inline-flex;
    align-items:center;
    gap:15px;
    color:#fff;
    text-decoration:none;
    font-weight:700;
    font-size:22px;
}

.hero-btn:hover{
    color:white;
}

/* ================= RIGHT BOX ================= */

.request-box{
    position:absolute;
    right:40px;
    top:50%;
    transform:translateY(-50%);
    background:var(--green);
    color:#fff;
    width:260px;
    padding:35px 20px;
    text-align:center;
    font-weight:800;
    font-size:20px;
    z-index:3;

    clip-path:polygon(
        12% 0,
        100% 0,
        88% 100%,
        0% 100%
    );
}

.request-box .arrow{
    display:block;
    font-size:40px;
    margin-top:15px;
}

/* ================= MOBILE ================= */

@media(max-width:991px){

.hero{
    min-height:auto;
}

.hero-left{
    width:100%;
    clip-path:none;
    position:relative;
    padding:80px 0;
}

.hero-content{
    padding:30px;
}

.hero-title{
    font-size:42px;
}

.hero-subtitle{
    font-size:30px;
}

.request-box{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    margin:30px auto;
    width:90%;
}

.hero-bg{
    filter:brightness(.8);
}

}

.services-section{
    background:var(--bg);
    padding:100px 5%;
    position:relative;
}

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

.services-title{
    position:absolute;
    left:15px;
    top:50%;
    transform:translateY(-50%);
}

.services-title span{
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    font-size:4rem;
    font-weight:900;
    color:var(--blue);
    letter-spacing:3px;
}

.services-content #know-more {
    color: var(--green);
}

.service-card{
    background:#fff;
    min-height:350px;
    display:flex;
    overflow:hidden;
    position:relative;
    transition:.4s;
    animation:fadeUp .8s ease forwards;
}

.service-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 40px rgba(0,0,0,.12);
}

.service-content{
    width:65%;
    padding:40px;
    z-index:2;
}

.service-content h3{
    color:var(--blue);
    font-size:2rem;
    font-weight:800;
    margin-bottom:20px;
    line-height:1.3;
}

.service-content p{
    color:#555;
    font-size:1.05rem;
    line-height:1.9;
}

.service-image{
    width:35%;
    position:relative;
}

.service-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.service-image::before{
    content:"";
    position:absolute;
    inset:0;
    background:white;
    clip-path:polygon(
        0 0,
        45% 0,
        0 100%
    );
    z-index:2;
}

.service-card::after{
    content:'';
    position:absolute;
    bottom:0;
    right:0;
    width:0;
    height:4px;
    background:var(--green);
    transition:.4s;
}

.service-card:hover::after{
    width:100%;
}

@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(40px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* Tablet */

@media(max-width:992px){

    .services-grid{
        grid-template-columns:1fr;
    }

    .services-title{
        position:relative;
        left:auto;
        top:auto;
        transform:none;
        margin-bottom:40px;
        text-align:center;
    }

    .services-title span{
        writing-mode:horizontal-tb;
        transform:none;
        font-size:3rem;
    }
}

/* Mobile */

@media(max-width:768px){

    .service-card{
        flex-direction:column-reverse;
    }

    .service-content{
        width:100%;
        padding:30px;
    }

    .service-image{
        width:100%;
        height:220px;
    }

    .service-image::before{
        display:none;
    }

    .service-content h3{
        font-size:1.6rem;
    }
}

.service-image::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(
        to bottom,
        #0A4A7F,
        transparent
    );
    z-index:1;
}

.about-intro{
    background:#f5f5f5;
    padding:120px 0;
}

.intro-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    align-items:center;
}

.intro-title h2{
    color:var(--blue);
    font-size:3rem;
    font-weight:800;
    line-height:1.4;
    margin:0;
}

.intro-content p{
    color:#777;
    font-size:1.4rem;
    line-height:1.8;
    margin-bottom:40px;
}

.gallery-section{
    width:90%;
    margin:60px auto;
}

.gallery-title{
    text-align:center;
    margin-bottom:30px;
    font-size:32px;
    color:#222;
}

.carousel{
    position:relative;
    overflow:hidden;
}

.carousel-track{
    display:flex;
    gap:20px;
    overflow-x:auto;
    scroll-behavior:smooth;
    scrollbar-width:none;
}

.carousel-track::-webkit-scrollbar{
    display:none;
}

.item{
    flex:0 0 calc(25% - 15px);
    aspect-ratio:1/1;
    border-radius:18px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,.12);
    transition:.4s;
}

.item:hover{
    transform:translateY(-8px);
}

.item img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

.gallery-section .nav{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:50px;
    height:50px;
    border:none;
    border-radius:50%;
    background:#ffffffdd;
    cursor:pointer;
    font-size:24px;
    box-shadow:0 5px 15px rgba(0,0,0,.2);
    z-index:10;
    transition:.3s;
}

.gallery-section .nav:hover{
    background:#111;
    color:#fff;
}

.prev{
    left:10px;
}

.next{
    right:10px;
}

/* تابلت */
@media(max-width:992px){
    .item{
        flex:0 0 calc(33.333% - 14px);
    }
}

/* موبايل */
@media(max-width:768px){
    .item{
        flex:0 0 calc(50% - 10px);
    }
}

/* موبايل صغير */
@media(max-width:500px){
    .item{
        flex:0 0 100%;
    }
}

.company-profile{
    padding:80px 0;
    background:var(--blue);
}

.company-profile .container{
    width:min(1200px,90%);
    margin:auto;
}

.profile-content{
    display:flex;
    align-items:center;
    gap:60px;
    flex-wrap:wrap;
}

.profile-image{
    flex:1 1 380px;
    display:block;
    overflow:hidden;
    border-radius:20px;
    transition:.4s;
}

.profile-image img{
    width:100%;
    display:block;
    border-radius:20px;
    transition:.4s;
}

.profile-image:hover img{
    transform:scale(1.05);
}

.profile-text{
    flex:1 1 450px;
    color:#fff;
}

.profile-label{
    display:inline-block;
    padding:8px 18px;
    background:var(--green);
    color:#fff;
    border-radius:30px;
    font-size:.9rem;
    margin-bottom:18px;
}

.profile-text h2{
    font-size:2.2rem;
    margin-bottom:20px;
    line-height:1.3;
}

.profile-text p{
    font-size:1.05rem;
    line-height:2;
    opacity:.9;
    margin-bottom:35px;
}

.profile-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:15px 35px;
    background:var(--green);
    color:#fff;
    text-decoration:none;
    border-radius:50px;
    font-weight:600;
    transition:.3s;
}

.profile-btn:hover{
    background:#fff;
    color:var(--green);
}

/* Responsive */

@media (max-width:991px){

    .profile-content{
        flex-direction:column;
        text-align:center;
        gap:40px;
    }

    .profile-text h2{
        font-size:1.9rem;
    }

    .profile-text p{
        font-size:1rem;
    }

    .profile-btn{
        width:220px;
    }
}

@media (max-width:576px){

    .company-profile{
        padding:60px 0;
    }

    .profile-text h2{
        font-size:1.6rem;
    }

    .profile-text p{
        font-size:.95rem;
    }

    .profile-btn{
        width:100%;
    }
}

.learn-more{
    text-decoration:none;
    color:var(--green);
    font-weight:700;
    font-size:1.2rem;
    display:inline-flex;
    align-items:center;
    gap:20px;
    transition:.3s;
}

.learn-more span{
    font-size:2rem;
    transition:.3s;
}

.learn-more:hover{
    color:var(--green);
}

.learn-more:hover span{
    transform:translateX(-10px);
}

/* Tablet */

@media(max-width:992px){

    .intro-grid{
        grid-template-columns:1fr;
        gap:40px;
    }

    .intro-title h2{
        font-size:2.3rem;
    }

    .intro-content p{
        font-size:1.2rem;
    }
}

/* Mobile */

@media(max-width:768px){

    .about-intro{
        padding:80px 0;
    }

    .intro-title h2{
        font-size:1.8rem;
        line-height:1.6;
    }

    .intro-content p{
        font-size:1rem;
        line-height:1.9;
    }

    .learn-more{
        font-size:1rem;
    }

    .learn-more span{
        font-size:1.5rem;
    }
}

/* خلفية القسم */
.why-us-section{
    background:var(--blue);
    padding:120px 0 60px;
    position:relative;
}

/* البطاقة البيضاء */
.why-card{
    width:90%;
    margin:auto;
    background:#fff;
    position:relative;
    z-index:2;
}

/* العنوان */
.why-header{
    text-align:center;
    padding:70px 30px 40px;
    border-bottom:2px solid var(--green);
}

.why-header h2{
    margin:0;
    font-size:4rem;
    font-weight:900;
    color:var(--blue);
}

.why-header h2 span{
    color:var(--green);
    font-weight:300;
}

/* المحتوى */
.why-content{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:60px;
    padding:50px 80px 70px;
}

/* النص */
.why-text p{
    color:#666;
    font-size:1.5rem;
    line-height:1.9;
    margin-bottom:40px;
}

/* الزر */
.why-btn{
    background:var(--green);
    color:#fff;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:space-between;
    gap:40px;
    min-width:280px;
    padding:18px 30px;
    font-weight:700;
    transition:.3s;
}

.why-btn span{
    font-size:2rem;
    transition:.3s;
}

.why-btn:hover{
    transform:translateY(-4px);
}

.why-btn:hover span{
    transform:translateX(-8px);
}

/* الصورة */
.why-image{
    text-align:center;
}

.why-image img{
    max-width:100%;
    height:auto;
    animation:float 4s ease-in-out infinite;
}

/* حركة خفيفة للصورة */
@keyframes float{
    0%,100%{
        transform:translateY(0);
    }
    50%{
        transform:translateY(-12px);
    }
}

/* Tablet */

@media(max-width:992px){

    .why-header h2{
        font-size:3rem;
    }

    .why-content{
        grid-template-columns:1fr;
        text-align:center;
        padding:50px;
    }

    .why-image{
        order:-1;
    }

    .why-text p{
        font-size:1.2rem;
    }
}

/* Mobile */

@media(max-width:768px){

    .why-us-section{
        padding:70px 0 40px;
    }

    .why-card{
        width:95%;
    }

    .why-header{
        padding:50px 20px 30px;
    }

    .why-header h2{
        font-size:2rem;
        line-height:1.4;
    }

    .why-content{
        padding:35px 25px;
        gap:30px;
    }

    .why-text p{
        font-size:1rem;
        line-height:2;
    }

    .why-btn{
        width:100%;
        min-width:auto;
    }
}

.team-section{
    position:relative;
    min-height:900px;
    padding:120px 0;
    overflow:hidden;

    background:url('img/5.jpeg')
    center center/cover no-repeat;
}

/* Overlay الرئيسي */

.team-overlay{
    position:absolute;
    inset:0;

    background:
    linear-gradient(
        to bottom,
        #0A4A7F 0%,
        #0a4a7f7d 50%,
        #0a4a7f25 100%
    );

    z-index:1;
}

/* التدرج السفلي */

.team-section::after{
    content:'';
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:250px;

    background:linear-gradient(
        to bottom,
        rgba(37,44,115,0),
        #0a4a7f83
    );

    z-index:2;
}

/* الإطار */

.team-box{
    position:relative;
    z-index:5;

    width:80%;
    margin:auto;

    border:1px solid var(--green);

    display:grid;
    grid-template-columns:1.2fr .8fr;

    align-items:center;
}

.team-content{
    padding:80px;
}

.team-content h2{
    color:white;
    font-size:4rem;
    font-weight:900;
    line-height:1.2;
    margin-bottom:25px;
}

.green-line{
    width:65%;
    height:2px;
    background:var(--green);
    margin-bottom:30px;
}

.team-content p{
    color:#e6e6e6;
    font-size:1.35rem;
    line-height:1.8;
    max-width:700px;
}

/* الزر */

.team-btn{
    display:inline-flex;
    align-items:center;
    justify-content:space-between;

    min-width:280px;

    padding:18px 30px;
    margin-top:35px;

    background:var(--green);
    color:#fff;
    text-decoration:none;
    font-weight:700;

    transition:.3s;
}

.team-btn span{
    font-size:2rem;
    transition:.3s;
}

.team-btn:hover{
    transform:translateY(-5px);
}

.team-btn:hover span{
    transform:translateX(-10px);
}

/* الصورة المائلة */

.team-image{
    position:relative;
    height:100%;
}

.team-image img{
    width:100%;
    height:100%;
    object-fit:cover;

    clip-path:polygon(
        18% 0,
        100% 0,
        100% 100%,
        0 100%
    );
}

/* موبايل */

@media(max-width:992px){

    .team-box{
        width:92%;
        grid-template-columns:1fr;
    }

    .team-image{
        order:-1;
        height:350px;
    }

    .team-content{
        padding:40px 30px;
        text-align:center;
    }

    .team-content h2{
        font-size:2.3rem;
    }

    .team-content p{
        font-size:1rem;
    }

    .green-line{
        width:120px;
        margin:auto auto 25px;
    }

    .team-btn{
        min-width:100%;
    }
}

footer .services-section{
    background:#fff;
    padding:100px 0;
    overflow:hidden;
}

.services-container{
    width:90%;
    max-width:1400px;
    margin:auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:80px;
}

/* Images */

.services-images{
    position:relative;
    width:55%;
    min-height:650px;
}

.bg-image{
    position:absolute;
    left:0;
    top:0;

    width:65%;
    height:650px;
    overflow:hidden;
}

.bg-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.main-image{
    position:absolute;
    right:0;
    top:60px;

    width:75%;
    height:540px;

    overflow:hidden;

    clip-path: polygon(
        0 0,
        100% 0,
        85% 100%,
        0% 100%
    );
}

.main-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Content */

.services-content{
    width:45%;
}

.top-line{
    display:block;
    width:100%;
    height:2px;
    background:var(--green);
    margin-bottom:50px;
}

.services-content h2{
    color: var(--blue);
    font-size:65px;
    font-weight:800;
    line-height:1.1;
    margin-bottom:25px;
}

.services-content p{
    color:#666;
    font-size:22px;
    line-height:1.8;
    max-width:650px;
    margin-bottom:40px;
}

.btn{
    display:inline-flex;
    align-items:center;
    gap:20px;

    background: (var(--green));
    color:#fff;

    text-decoration:none;

    padding:18px 35px;
    font-size:18px;
    font-weight:700;

    transition:.3s;
}

.btn span{
    font-size:28px;
}

.btn:hover{
    transform:translateY(-3px);
}

/* Tablet */

@media(max-width:992px){

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

    .services-images,
    .services-content{
        width:100%;
    }

    .services-images{
        min-height:500px;
    }

    .bg-image{
        height:500px;
    }

    .main-image{
        height:420px;
        width:75%;
    }

    .services-content h2{
        font-size:50px;
    }

    .services-content{
        text-align:center;
    }
}

/* Mobile */

@media(max-width:768px){

    footer .services-section{
        padding:60px 0;
    }

    footer .services-images{
        min-height:350px;
    }

    .bg-image{
        width:75%;
        height:350px;
    }

    .main-image{
        width:80%;
        height:300px;
        top:30px;
    }

    .services-content h2{
        font-size:36px;
    }

    .services-content p{
        font-size:16px;
    }

    .btn{
        width:100%;
        justify-content:center;
    }
}

.contact-section{
    position:relative;
    min-height:700px;
    overflow:hidden;

    background-image:url("img/2.jpeg");
    background-size:cover;
    background-position:center;

    display:flex;
    align-items:center;
}

.contact-overlay{
    position:absolute;
    inset:0;

    background:
    linear-gradient(
        to left,
        #0A4A7F 0%,
        #0a4a7fc2 25%,
        #0a4a7f84 55%,
        #0a4a7f39 80%,
        #0a4a7f00 100%
    );
}

.contact-section .container{
    position:relative;
    z-index:2;

    width:90%;
    max-width:1400px;
    margin:auto;

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:60px;
}

.contact-content{
    max-width:650px;
    color:#fff;
}

.contact-subtitle{
    display:inline-block;

    background:var(--green);
    color:#fff;

    padding:10px 20px;
    margin-bottom:20px;

    font-size:15px;
    font-weight:700;
}

.contact-content h2{
    font-size:58px;
    line-height:1.2;
    margin-bottom:25px;
}

.contact-content p{
    font-size:20px;
    line-height:1.9;
    color:rgba(255,255,255,.85);
}

.contact-card{

    width:420px;

    background:var(--blue);

    padding:45px;

    border-top:6px solid var(--green);

    backdrop-filter:blur(10px);
}

.contact-card h3{
    color:#fff;
    font-size:30px;
    margin-bottom:30px;
}

.contact-card ul{
    list-style:none;
}

.contact-card li{
    color:#fff;
    padding:18px 0;

    border-bottom:1px solid rgba(255,255,255,.15);

    line-height:1.8;
}

.contact-card li span{
    display:block;
    color:var(--green);
    font-weight:700;
    margin-bottom:5px;
}

.contact-btn{
    display:inline-block;

    margin-top:30px;

    background:var(--green);
    color:#fff;

    text-decoration:none;

    padding:16px 35px;
    font-weight:700;

    transition:.3s;
}

.contact-btn:hover{
    transform:translateY(-4px);
}

/* Tablet */

@media(max-width:992px){

    .contact-section{
        min-height:auto;
        padding:100px 0;
    }

    .contact-section .container{
        flex-direction:column;
        text-align:center;
    }

    .contact-content h2{
        font-size:42px;
    }

    .contact-card{
        width:100%;
        max-width:600px;
    }
}

/* Mobile */

@media(max-width:768px){

    .contact-content h2{
        font-size:32px;
    }

    .contact-content p{
        font-size:16px;
    }

    .contact-card{
        padding:30px;
    }

    .contact-card h3{
        font-size:24px;
    }

    .contact-btn{
        width:100%;
        text-align:center;
    }
}

.footer{
    background:var(--blue);
    color:#fff;
}

/* =========================
   TOP BAR
========================= */

.footer-top{
    border-bottom:1px solid var(--green);
    padding:30px 0;
}

.footer-top .container{
    width:min(1200px,90%);
    margin:auto;

    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;
}

.logo{
    width: 200px;
}

.contact-label{
    display:block;
    font-size:.9rem;
    margin-bottom:5px;
}

.contact-phone{
    color:#fff;
    text-decoration:none;
    font-size:1.5rem;
    font-weight:700;
}

/* =========================
   MAIN
========================= */

.footer-main{
    padding:60px 0;
}

.footer-main .container{
    width:min(1200px,90%);
    margin:auto;

    display:flex;
    justify-content:space-between;
    gap:80px;
}

.footer-links{
    flex:1;

    display:grid;
    grid-template-columns:repeat(2,minmax(250px,1fr));
    gap:0;
}

.footer-links a{
    color:#fff;
    text-decoration:none;

    padding:14px 0;

    border-bottom:1px solid var(--green);

    font-size:1.15rem;
    font-weight:700;

    transition:.3s;
}

.footer-links a:hover{
    color:var(--green);
    padding-right:10px;
}

.footer-side{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:30px;
}

.footer-btn{
    display:flex;
    align-items:center;
    gap:15px;

    background:var(--green);
    color:#fff;

    text-decoration:none;

    padding:16px 30px;

    font-weight:700;

    transition:.3s;
}

.footer-btn:hover{
    transform:translateY(-3px);
}

.footer-btn span{
    font-size:1.3rem;
}

.socials{
    display:flex;
    gap:15px;
}

.socials a{
    width:48px;
    height:48px;

    border:1px solid var(--green);
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;
    text-decoration:none;

    transition:.3s;
}

.socials a:hover{
    background:var(--green);
}

/* =========================
   COPYRIGHT
========================= */

.footer-bottom{
    padding:25px 0;
}

.footer-bottom .container{
    width:min(1200px,90%);
    margin:auto;
}

.footer-bottom p{
    margin:0;
    color:rgba(255,255,255,.8);
    font-size:.9rem;
}

/* =========================
   TABLET
========================= */

@media (max-width:992px){

    .footer-main .container{
        flex-direction:column;
    }

    .footer-side{
        align-items:center;
    }

    .footer-links{
        grid-template-columns:1fr 1fr;
    }
}

/* =========================
   MOBILE
========================= */

@media (max-width:768px){

    .footer-top .container{
        flex-direction:column;
        text-align:center;
    }

    .footer-main{
        padding:40px 0;
    }

    .footer-links{
        grid-template-columns:1fr;
    }

    .footer-links a{
        text-align:center;
    }

    .footer-side{
        width:100%;
    }

    .footer-btn{
        width:100%;
        justify-content:center;
    }


    .footer-bottom{
        text-align:center;
    }
}

.about-section{
    overflow:hidden;
}

.about-header{
    background:var(--blue);
    border-top:1px solid var(--green);
    padding:35px 0;
}

.about-header h2{
    color:#fff;
    font-size:3rem;
    font-weight:800;
    margin:0;
}

/* الصورة الثابتة */

.about-banner{
    position:relative;

    background-image:url("img/4.jpeg");
    background-size:cover;
    background-position:center;
    background-attachment:fixed;

    padding:120px 0;
}

.overlay{
    position:absolute;
    inset:0;

    background:rgba(255, 255, 255, 0.677);
}

.about-banner .container{
    position:relative;
    z-index:2;
}

.about-content{
    max-width:900px;
}

.about-content h3{
    color:var(--blue);
    font-size:2rem;
    font-weight:800;
    margin-bottom:25px;
}

.about-content p{
    color:#555;
    font-size:1.3rem;
    line-height:1.9;
    margin-bottom:20px;
}

.container{
    width:min(1200px,90%);
    margin:auto;
}

/* Tablet */

@media(max-width:992px){

    .about-banner{
        padding:90px 0;
    }

    .about-content h3{
        font-size:1.7rem;
    }

    .about-content p{
        font-size:1.1rem;
    }
}

/* Mobile */

@media(max-width:768px){

    .about-header{
        text-align:center;
    }

    .about-header h2{
        font-size:2rem;
    }

    .about-banner{
        padding:70px 0;

        /* إصلاح مشكلة background-attachment على الجوال */
        background-attachment:scroll;
    }

    .about-content h3{
        font-size:1.4rem;
    }

    .about-content p{
        font-size:1rem;
    }
}

.one-team{
    padding:80px 20px;
}

.container{
    max-width:1300px;
    margin:auto;

    display:flex;
    align-items:center;
    gap:70px;
}

.image-side{
    flex:1;
}

.image-side img{
    width:100%;
    max-width:600px;
    display:block;
}

.content{
    flex:1;
}

.content h2{
    color: var(--blue);
    font-size:42px;
    margin-bottom:20px;
    font-weight:800;
}

.intro{
    color:#666;
    font-size:22px;
    line-height:1.8;
    margin-bottom:30px;
}

.content li{
    position:relative;  
    margin-bottom:22px;
    line-height:1.9;
    color:#666;
    font-size:16px;
}

.content strong{
    color: var(--blue);
}

@media(max-width:991px){

    .container{
        flex-direction:column;
        text-align:center;
    }

    .image-side img{
        margin:auto;
    }

    .content li{
        text-align:right;
    }

}