/*=========================
ArabSeed Portal
==========================*/

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

body{

background:#f4f6fb;

font-family:Cairo,Tahoma,sans-serif;

direction:rtl;

color:#333;

line-height:1.8;

}

a{

text-decoration:none;

color:inherit;

}

img{

max-width:100%;

display:block;

}


/*=========================
Container
==========================*/

.container{

width:95%;

max-width:1300px;

margin:40px auto;

}


/*=========================
Title
==========================*/

h1{

font-size:34px;

margin-bottom:30px;

font-weight:700;

}

h2{

font-size:22px;

margin-bottom:12px;

}


/*=========================
News Grid
==========================*/

.news-grid{

display:grid;

grid-template-columns:repeat(auto-fill,minmax(340px,1fr));

gap:30px;

}


/*=========================
Card
==========================*/

.news-card {
    /* background: #fff; */
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08);
    transition: .3s;
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(18, 24, 35, 0.84);
    border-radius: 26px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(10px);
}

.news-card:hover{

transform:translateY(-6px);

}

.news-card img{

height:220px;

width:100%;

object-fit:cover;

}


/*=========================
Body
==========================*/

.news-body{

padding:22px;

}

.news-body p{

color:#777;

margin:15px 0;

line-height:1.9;

}


/*=========================
Button
==========================*/

.read-more{

display:inline-block;

padding:12px 22px;

background:#2563eb;

color:#fff;

border-radius:8px;

margin-top:15px;

transition:.3s;

}

.read-more:hover{

background:#1d4ed8;

}


/*=========================
Article
==========================*/

.article {
    /* background: #fff; */
    padding: 40px;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08);
    border: 1px solid rgba(255, 255, 255, 0.10);
    background: rgba(18, 24, 35, 0.84);
    border-radius: 26px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, 0.38);
    backdrop-filter: blur(10px);
}

.article h1{

font-size:40px;

margin-bottom:15px;

}

.article .date{

color:#888;

margin-bottom:25px;

font-size:14px;

}

.cover{

margin-bottom:30px;

border-radius:10px;

}

.content{

font-size:18px;

line-height:2.2;

}

.content img{

margin:25px auto;

border-radius:10px;

}

.content iframe{

width:100%;

height:500px;

border:none;

margin:25px 0;

}


/*=========================
Alert
==========================*/

.alert{

background:#fff8e1;

padding:18px;

border-right:5px solid orange;

margin-bottom:30px;

border-radius:10px;

}