.news-page{
    color:#1e293b;
}

.news-hero{

    height:380px;

    background:
    linear-gradient(
    rgba(5,20,45,.75),
    rgba(5,20,45,.75)),
    url("/static/images/news-banner.jpg");

    background-size:cover;
    background-position:center;

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

    text-align:center;

}

.news-overlay{

    color:white;

}

.news-overlay h1{

    font-size:52px;
    margin-bottom:20px;

}

.news-overlay p{

    font-size:20px;
    max-width:760px;
    margin:auto;
    color:#e8eef8;

}

.news-container{

    width:90%;
    max-width:1300px;
    margin:80px auto;

}

.news-container h2{

    text-align:center;
    color:#fcfcfc;
    margin-bottom:50px;
    font-size:38px;

}

.news-grid{

    display:grid;

    grid-template-columns:
    repeat(auto-fit,minmax(320px,1fr));

    gap:35px;

}

.news-card{

    background:white;

    border-radius:18px;

    padding:30px;

    box-shadow:0 12px 35px rgba(0,0,0,.08);

    transition:.35s;

}

.news-card:hover{

    transform:translateY(-8px);

}

.news-badge{

    display:inline-block;

    background:#16a34a;

    color:white;

    padding:8px 18px;

    border-radius:25px;

    font-size:13px;

    margin-bottom:20px;

}

.news-badge.blue{

    background:#2563eb;

}

.news-badge.orange{

    background:#ea580c;

}

.news-badge.green{

    background:#16a34a;

}

.news-card h3{

    color:#0b2d5a;

    margin-bottom:15px;

}

.news-meta{

    color:#64748b;

    margin-bottom:20px;

}

.news-card p{

    color:#555;

    line-height:1.8;

}

.news-card a{

    display:inline-block;

    margin-top:20px;

    color:#2563eb;

    font-weight:700;

    text-decoration:none;

}

.newsletter-section{

    margin:90px auto;

    width:90%;

    max-width:1000px;

    background:#eef5ff;

    border-radius:20px;

    padding:60px;

    text-align:center;

}

.newsletter-section h2{

    color:#0b2d5a;

    margin-bottom:20px;

}

.newsletter-section p{

    color:#555;

    margin-bottom:35px;

}

.newsletter-section form{

    display:flex;

    justify-content:center;

    gap:15px;

    flex-wrap:wrap;

}

.newsletter-section input{

    width:420px;

    padding:15px;

    border-radius:10px;

    border:1px solid #ccc;

}

.newsletter-section button{

    background:#1d4ed8;

    color:white;

    border:none;

    padding:15px 35px;

    border-radius:10px;

    cursor:pointer;

}

.newsletter-section button:hover{

    background:#163ea8;

}

@media(max-width:768px){

.news-overlay h1{

    font-size:38px;

}

.news-overlay p{

    font-size:18px;

}

.newsletter-section{

    padding:40px 25px;

}

.newsletter-section input{

    width:100%;

}

}