/* ===========================
   NEWS HIGHWAY HOME CSS
=========================== */

:root{
    --primary:#FFC107;
    --dark:#111111;
    --white:#ffffff;
    --bg:#f4f4f4;
    --text:#333333;
}

body{
    margin:0;
    background:var(--bg);
    font-family:'Poppins',sans-serif;
}

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

/* HERO */

.hero{

    padding:30px 0;

}

.hero .container{

    display:grid;

    grid-template-columns:2fr 1fr;

    gap:25px;

}

.hero-left{

    background:#111;

    color:#fff;

    padding:45px;

    border-radius:12px;

}

.hero-left h1{

    font-size:45px;

    color:#FFC107;

    margin-bottom:20px;

}

.hero-left p{

    line-height:30px;

    font-size:18px;

}

.hero-btn{

    display:inline-block;

    margin-top:25px;

    background:#FFC107;

    color:#111;

    padding:14px 28px;

    border-radius:6px;

    text-decoration:none;

    font-weight:bold;

}

.hero-btn:hover{

    background:#fff;

}

.hero-right img{

    width:100%;

    height:100%;

    object-fit:cover;

    border-radius:12px;

}

/* SECTION */

.latest-section{

    padding:50px 0;

}

.section-title{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:25px;

}

.section-title h2{

    font-size:34px;

    color:#111;

    border-left:6px solid #FFC107;

    padding-left:15px;

}

.section-title a{

    color:#111;

    text-decoration:none;

    font-weight:600;

}

/* GRID */

.news-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

}

/* CARD */

.news-card{

    background:#fff;

    border-radius:12px;

    overflow:hidden;

    transition:.3s;

    box-shadow:0 5px 15px rgba(0,0,0,.08);

}

.news-card:hover{

    transform:translateY(-8px);

}

.news-card img{

    width:100%;

    height:220px;

    object-fit:cover;

}

.news-content{

    padding:20px;

}

.news-date{

    color:#999;

    font-size:13px;

}

.news-content h3{

    margin:12px 0;

    font-size:22px;

    line-height:30px;

}

.news-content h3 a{

    text-decoration:none;

    color:#111;

}

.news-content h3 a:hover{

    color:#FFC107;

}

.news-content p{

    color:#666;

    line-height:28px;

}

.read-more{

    display:inline-block;

    margin-top:15px;

    color:#FFC107;

    font-weight:bold;

    text-decoration:none;

}

/* TABLET */

@media(max-width:992px){

.hero .container{

grid-template-columns:1fr;

}

.news-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* MOBILE */

@media(max-width:768px){

.hero-left{

padding:25px;

}

.hero-left h1{

font-size:30px;

}

.news-grid{

grid-template-columns:1fr;

}

.section-title h2{

font-size:26px;

}

}