* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /* font-family: 'Georgia', serif; */
  font-family: Verdana, Geneva, Tahoma, sans-serif;
}

body {
  background: #fff;
  height: 100%;
  width: 100%;
}
/* NAVBAR START  */

/* ===== NDTV STYLE SIDEBAR ===== */
.sidebar-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 998;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.sidebar-overlay.active {
  opacity: 1;
  visibility: visible;
}

.side-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 300px;
  height: 100vh;
  background: #1a1a1a;
  color: #fff;
  z-index: 999;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.side-menu.active {
  transform: translateX(0);
}

.side-menu-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 20px;
  border-bottom: 1px solid #333;
  background: #111;
}
.side-menu-logo {
  display: flex;
  align-items: center;
  gap: 8px;
}
.side-menu-logo h2 {
  font-size: 1.6rem;
  color: #fff;
  font-family: 'Times New Roman', serif;
}
.side-menu-logo img {
  height: 2rem;
  width: 3rem;
}
.side-menu-close {
  font-size: 24px;
  cursor: pointer;
  color: #ccc;
  background: none;
  border: none;
  line-height: 1;
  transition: color 0.2s;
}
.side-menu-close:hover { color: #d0021b; }

.side-menu-section {
  padding: 10px 0;
  border-bottom: 1px solid #2a2a2a;
}
.side-menu-section-title {
  font-size: 11px;
  color: #888;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  padding: 8px 20px 4px;
}
.side-menu-item {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 20px;
  color: #ddd;
  text-decoration: none;
  font-size: 15px;
  transition: background 0.2s, color 0.2s;
  cursor: pointer;
}
.side-menu-item:hover {
  background: #2a2a2a;
  color: #fff;
}
.side-menu-item i {
  font-size: 18px;
  color: #d0021b;
  width: 22px;
  text-align: center;
}

.side-menu-social {
  padding: 16px 20px;
  border-top: 1px solid #2a2a2a;
  margin-top: auto;
}
.side-menu-social p {
  font-size: 11px;
  color: #888;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 10px;
  font-weight: 700;
}
.side-menu-social-icons {
  display: flex;
  gap: 14px;
}
.side-menu-social-icons a {
  color: #aaa;
  font-size: 20px;
  transition: color 0.2s;
}
.side-menu-social-icons a:hover { color: #d0021b; }

/* Mobile par navbar ke beech ke text hide karo */
@media (max-width: 768px) {
  .navbar { display: none; }
}

/* Top Bar */
.top-bar {
  display: flex;
  justify-content: space-between;
  padding: 8px 40px;
  font-size: 14px;
  background: #f5f5f5;
}

.epaper {
  color: red;
  margin-left: 10px;
  cursor: pointer;
}

.top-right a {
  margin-right: 20px;
  text-decoration: none;
  color: black;
}

.subscribe-btn {
  background: #d0021b;
  color: white;
  border: none;
  padding: 6px 12px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 0.2rem;
}

/* Main Header */
.main-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 40px;
  border-bottom: 1px solid #ddd;
}

.main-header-middle{
    display: flex;
    align-items: center;
}

.main-header-middle h1{
    font-size: 3.5rem;
}

.logo {
    height: 3rem;
    width: 4.5rem;
}

.logo-name{
    font-size: 3.5rem;
    font-family: 'Times New Roman', Times, serif;
}

.menu-icon{
  font-size: 22px;
  cursor: pointer;
}

/* Search */
.search-container {
  position: relative;
}

.search-icon {
  font-size: 20px;
  cursor: pointer;
}

#searchBox {
  /* position: absolute; */
  /* left: 30px; */
  /* top: -5px; */
  /* width: 0; */
  padding: 6px;
  border: 1px solid #ccc;
  border-radius: 0.2rem;
  /* outline: none; */
  transition: 0.4s ease;
  /* opacity: 3; */
  /* background-color: #d0021b; */
  height: 2rem;
  width: 5rem;
  text-align: center;

}

#searchBox.active {
  width: 200px;
  opacity: 1;
}


/* Navbar */
.navbar {
  border-bottom: 1px solid #ddd;
}

.navbar ul {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 10px 0;
}

.navbar ul li {
  margin: 0 18px;
}

.navbar ul li a {
  text-decoration: none;
  color: black;
  font-weight: 600;
  transition: 0.3s;
}

.navbar ul li a:hover {
  color: #d0021b;
}

/* NAVBAR ENDS */



/* HERO SECTION STARTS */


.container{
  max-width:1270px;     /* control width */
  margin:2rem auto;        /* center */
  padding:0 0px;       /* left-right breathing space */
  /* background-color: yellow; */
}

/* NEWS STARTS  */

/* MAIN GRID */
.news-section{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:50px;
    /* margin-top: 2rem; */
    align-items: start;
}

/* LEFT SIDE */
.category{
    color:#d0021b;
    font-weight:bold;
    margin-bottom:10px;
}

.main-heading{
    font-size:32px;
    font-weight:bold;
    line-height:1.3;
    margin-bottom:15px;
}

.summary{
    font-size:16px;
    color:#333;
    margin-bottom:35px;
}

.author{
    font-size:14px;
    font-weight:bold;
    margin-bottom:20px;
}

.main-image{
    width:100%;
    margin-bottom:0px;
}

/* SMALL CARDS */
/* 2 Cards Per Row */
.small-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:25px;
  /* background-color: blue */
}

/* CARD */
.card{
  display:flex;
  flex-direction:column;
}

/* IMAGE WRAPPER */
.card-image{
  position:relative;
  overflow:hidden;
  border-radius:6px;
}

.card-image img{
  width:100%;
  height: 15rem;
  display:block;
}

/* CATEGORY INSIDE IMAGE (TOP LEFT) */
.card-category{
  position:absolute;
  top:10px;
  left:10px;
  background:#d0021b;
  color:#fff;
  font-size:11px;
  padding:4px 8px;
  border-radius:3px;
  font-weight:bold;
}

/* AUTHOR + DATE BELOW IMAGE */
.author-date-info{
  display:flex;
  justify-content: flex-start;
  gap: 15px;
  font-size:12px;
  color:#777;
  margin-top:8px;
}

/* TITLE */
.card-title{
  margin-top:6px;
  font-size:15px;
  font-weight:600;
  line-height:1.4;
}

.card-title a{
  color: #000;
  text-decoration: none;
}

/* Responsive */
@media(max-width:768px){
  .small-cards{
    grid-template-columns:1fr;
  }
}

/* RIGHT SIDE WRAPPER */
/* RIGHT SIDEBAR */
.right-content{
  position: sticky;
  top: 20px;
  align-self: start;           /* grid stretch nahi karega */
  max-height: calc(100vh - 40px);
  padding-left: 20px;
  border-left: 1px solid #eee;
}

/* Inner wrapper jo scroll karega — sticky outer pe nahi lagaya overflow */
.sidebar-inner{
  overflow-y: auto;
  max-height: calc(100vh - 40px);
  padding-right: 4px;
}

.sidebar-inner::-webkit-scrollbar{
  width: 4px;
}

.sidebar-inner::-webkit-scrollbar-track{
  background: transparent;
}

.sidebar-inner::-webkit-scrollbar-thumb{
  background: #ddd;
  border-radius: 4px;
}
/* SECTION BLOCK */
.right-section{
    margin-bottom:40px;
    padding-bottom:20px;
    border-bottom:1px solid #ddd;  /* section separation line */
}

/* Section Title */
.section-title{
    color:#d0021b;
    font-size:22px;
    margin-bottom:20px;
    font-weight:bold;
}

/* Timeline */
.timeline{
    position:relative;
    padding-left:20px;
}

/* Vertical Timeline Line */
.timeline::before{
    content:"";
    position:absolute;
    left:6px;
    top:0;
    bottom:0;
    width:2px;
    background:#ddd;
}

/* Timeline Item */
.timeline-item{
    position:relative;
    margin-bottom:25px;
    padding-left:10px;
    margin-right: 1rem;
}

/* Dot */
/* .dot{
    position:absolute;
    left:-28px;
    top:6px;
    width:10px;
    height:10px;
    background:#000;
    border-radius:50%;
} */

/* shadow  */
.box-shadow{
    background:#ffffff;
    padding:10px;
    /* margin-bottom:40px; */
    border-radius:4px;
    box-shadow:0 2px 8px rgba(80, 45, 45);
}

.box-shadow:hover{
    box-shadow:0 2px 10px rgb(44, 2, 7);
}

/* Meta (time + place) */
.meta{
    font-size:12px;
    color:#777;
    margin-bottom:6px;
}

/* Headline */
.headline{
    font-size:15px;
    font-weight:600;
    line-height:1.5;
    cursor:pointer;
    transition:0.3s;
    color: #000;
}
.headline a{
    font-size:15px;
    font-weight:600;
    line-height:1.5;
    cursor:pointer;
    transition:0.3s;
    color: #000;
}

.headline:hover{
    color:#d0021b;
}

/* Read More */
.read-more{
    font-size:13px;
    font-weight:bold;
    margin-top:10px;
    text-transform:uppercase;
    cursor:pointer;
}

.read-more:hover{
    color:#d0021b;
}

/* Responsive — 992px se kam tablets/mobile ke liye */
@media(max-width:992px){
    .news-section{
        grid-template-columns:1fr;
    }
    .right-content{
        position:static;
        height:auto;
        max-height:none;
        border-left:none;
        padding-left:0;
    }
    .sidebar-inner{
        overflow-y: visible;
        max-height: none;
    }
}
/* NEWS STARTS  */


/* INDIA NEWS START  */


/* TOP VIDEOS SECTION */
.top-videos{
  /* margin-top:60px; */
  padding:40px 0;
  background:#ffffff;
  color:#000000;
  /* box-shadow:10px 10px 50px rgba(223, 3, 3, 0.06); */
  width: 100%;
  box-shadow: 0 0 20px rgba(0,0,0,0.06);
  margin: 40px 0;
}

.video-heading{
  font-size:28px;
  margin-bottom:25px;
  color: #d0021b;
  text-align: center;
  padding-left: 2rem;
}

.india-wrapper{
  display:grid;
  grid-template-columns:2fr 1fr;
  gap:30px;
  margin-bottom: 3rem;
  padding-left: 2rem;
}

/* LEFT VIDEO */
.main-india img{
  width:100%;
  height:80%;
  display:block;
  margin-bottom:15px;
}

.india-title{
  font-size:22px;
  margin-bottom:10px;
}

.india-img-desc{
  font-size:15px;
  color:#4b4848;
  /* background-color: red; */
}

/* RIGHT SIDE */
.suggested-india-img{
  max-height:450px;
  overflow-y:auto;
  padding-right:10px;
}

/* Hide scrollbar */
.suggested-india-img::-webkit-scrollbar{
  display:none;
}

.suggested-india-img-item{
  display:flex;
  gap:12px;
  margin-bottom:20px;
  cursor:pointer;
}

.suggested-india-img-item:hover{
    box-shadow: 0 0 20px rgba(207, 19, 19, 0.06);
}

.suggested-india-img-item img{
  width:110px;
  height:75px;
  object-fit:cover;
}

.suggested-india-img-item p{
  font-size:14px;
  line-height:1.4;
}
.suggested-india-img-item a{
  color: #000;
  text-decoration: none;
}

/* VIEW ALL BUTTON */
.view-all-btn{
  margin-top:30px;
  /* width:20%; */
  padding:14px;
  background:#d0021b;
  color:#fff;
  border:none;
  font-weight:bold;
  cursor:pointer;
  transition:0.3s;
  border-radius: 8px;
  margin-left: 2rem;
}

.view-all-btn:hover{
  background:#a80016;
}


/* RESPONSIVE */
@media(max-width:992px){
  .india-wrapper{
    grid-template-columns:1fr;
  }

  .suggested-india-img{
    max-height:300px;
  }
}

/* TOP NEWS TODAY SLIDER CARDS STARTS */

.top-news{
  margin: 40px 0;
  /* background-color: red; */
}

.top-news-heading{
  font-size:28px;
  margin-bottom:25px;
  font-weight:700;
  color: #d0021b;
  text-align: center;
}

.news-slider{
  overflow:hidden;
  position:relative;
}

.news-track{
  display:flex;
  gap:20px;
  animation: slideNews 20s linear infinite;
}

.news-card{
  min-width:calc(35% - 20px);
  position:relative;
  border-radius:6px;
  overflow:hidden;
  height: 100%;
}

.news-card img{
  width:100%;
  height:25rem;
  object-fit:cover;
  display:block;
}

.news-overlay{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:15px;
  background:linear-gradient(to top, rgba(26, 25, 25, 0.55)  );
  color:#fff;
  height: 8rem;
}

.news-overlay h3{
  font-size:18px;
  line-height:1.4;
}

.news-overlay a{
  color: #ffffff;
  text-decoration: none;
  font-weight: 300;
  text-transform: capitalize;
  font-size: 18px;
}

/* Auto Slide Animation */
@keyframes slideNews{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);
  }
}

/* Responsive */
@media(max-width:992px){
  .news-card{
    min-width:50%;
  }
}

@media(max-width:600px){
  .news-card{
    min-width:100%;
  }
}

/* TOP NEWS TODAY SLIDER CARDS ENDS  */

/* world NEWS START  */

.world-section{
  margin:40px 0;
  /* background-color: yellow; */
 /* display: flex;
  align-items: center;
  justify-content: center; */
  /* flex-direction: column; */
}

/* Center Heading with Lines */
.section-header{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:50px;
}

.section-header h2{
  font-size:28px;
  font-weight:700;
  margin:0 20px;
  font-family: 'Times New Roman', serif;
}

.section-header .line{
  flex:1;
  height:2px;
  background:#000000;
  color: red;
}

/* Row Layout */
.world-row{
  /* display:grid; */
  /* grid-template-columns:1fr 1fr; */
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap:60px;
  /* align-items:center; */
  margin-bottom:50px;
  /* background-color: red;  */
  /* width: 80%;  */
    /* box-shadow:  20px rgba(207, 19, 19, 0.06); */
  
}

/* Reverse Layout */
.world-row.reverse{
  /* direction:rtl; */
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: row-reverse;
  /* gap: 30px; */
}

.world-row.reverse .world-content{
  direction:ltr;
}

/* Image */
.world-img img{
  width:100%;
  height:120px;
  object-fit:cover;
  border-radius:8px;
  /* box-shadow: 0 0 20px rgba(207, 19, 19, 0.06); */
}

.world-content{
  display: flex;
  flex-direction: column;
  width: 50%;
}

/* Content */
.world-content h3{
  font-size:18px;
  margin-bottom:10px;
  width: 28rem;
}

.world-content p{
  font-size:14px;
  color:#555;
  margin-bottom:10px;
  line-height:1.6;
  width: 25rem;
}

.world-content a{
  color: #000;
  text-decoration: none;
}

.author{
  font-size:15px;
  font-weight:600;
  color:#888;
}

/* See More Button */
.see-more-wrapper{
  /* text-align:center; */
  margin-top:20px;
}

.see-more-btn{
   margin-top:0px;
  /* width:20%; */
  padding:14px;
  background:#d0021b;
  color:#fff;
  border:none;
  font-weight:bold;
  cursor:pointer;
  transition:0.3s;
  border-radius: 8px;
  margin-left: 1rem;
}

.see-more-btn:hover{
  background:#000;
  color:#fff;
}

/* Responsive */
@media(max-width:992px){
  .world-row{
    grid-template-columns:1fr;
  }

  .world-row.reverse{
    direction:ltr;
  }
}
/* WORLD NEWS ENDS  */

/* ENTERTAINMENT NEWS START  */
/* SECTION */
.cinema-section{
  margin:70px 0;
}

/* HEADER */
.cinema-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px dotted #aaa;
  padding-bottom:10px;
  margin-bottom:25px;
}

.cinema-header h2{
  font-size:20px;
  font-weight:700;
  text-transform:uppercase;
}

.cinema-arrows span{
  margin-left:15px;
  font-size:18px;
  cursor:pointer;
  color:#d0021b;
}

/* GRID */
.cinema-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px 50px;
}

/* ITEM */
.cinema-item{
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid #ddd;
  padding-bottom:20px;
}

/* TEXT */
.cinema-text h4{
  font-size:16px;
  line-height:1.5;
  margin-bottom:12px;
}

.cinema-text a{
  color: #000;
  text-decoration: none;
}

/* DURATION BADGE */
.duration{
  background:#d0021b;
  color:#fff;
  font-size:12px;
  padding:5px 10px;
  border-radius:20px;
  display:inline-block;
}

/* IMAGE */
.cinema-item img{
  width:110px;
  height:90px;
  object-fit:cover;
}

/* RESPONSIVE */
@media(max-width:992px){
  .cinema-grid{
    grid-template-columns:1fr;
  }

  .cinema-item{
    flex-direction:column;
  }

  .cinema-item img{
    width:100%;
    height:auto;
  }
}
/* ENTERTAINMENT NEWS ENDS  */

/* STATE NEWS START  */
/* SECTION */
.city-news{
  margin:80px 0;
}

/* HEADER */
.city-header{
  display:flex;
  align-items:center;
  gap:20px;
  border-bottom:1px dotted #aaa;
  padding-bottom:10px;
  margin-bottom:25px;
}

/* .city-header h2{
  font-size:20px;
  font-weight:700;
} */

.city-header select{
  padding:6px 10px;
  border:1px solid #ccc;
  font-size:14px;
}

/* WRAPPER */
.city-wrapper{
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:40px;
}

/* LEFT SIDE */
.city-left img{
  width:100%;
  height:280px;
  object-fit:cover;
  margin-bottom:15px;
}

.city-left h3{
  font-size:20px;
  line-height:1.5;
  font-weight:600;
}
.city-left a{
  color: #000;
  text-decoration: none;
}

/* RIGHT SIDE */
.city-right{
  display:flex;
  flex-direction:column;
}

.city-item{
  padding:15px 0;
  border-bottom:1px solid #ddd;
  font-size:15px;
  line-height:1.5;
  cursor:pointer;
  transition:0.3s;
}
.city-item a{
  color: #000;
  text-decoration: none;
}


.city-item:hover{
  color:#d0021b;
}

/* RESPONSIVE */
@media(max-width:992px){
  .city-wrapper{
    grid-template-columns:1fr;
  }

  .city-left img{
    height:auto;
  }
}
/* STATE NEWS ENDS  */


/* SPORTS NEWS START  */
/* SECTION */
.sports-section{
  margin:80px 0;
}

/* HEADER */
.sports-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  border-bottom:1px dotted #aaa;
  padding-bottom:10px;
  margin-bottom:30px;
}

.sports-header h2{
  font-size:28px;
  font-weight:700;
  font-family: 'Times New Roman', serif;
}

.sports-nav span{
  margin-left:20px;
  font-size:14px;
  cursor:pointer;
  transition:0.3s;
}

.sports-nav span:hover{
  color:#d0021b;
}

/* MAIN WRAPPER */
.sports-wrapper{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:40px;
  /* background-color: green; */
}

/* LEFT SIDE */
.sports-main img{
  width:100%;
  height:250px;
  object-fit:cover;
}

.sports-main h3{
  margin-top:12px;
  font-size:20px;
  line-height:1.5;
}

.sports-main a{
  color: #000;
  text-decoration: none;
}

/* SMALL GRID */
.sports-small-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:25px;
}

.sports-small-card img{
  width:100%;
  height:120px;
  object-fit:cover;
}

.sports-small-card p{
  margin-top:8px;
  font-size:14px;
  line-height:1.4;
}

.sports-small-card a{
  color: #000;
  text-decoration: none;
}

/* RIGHT SIDE */
.sports-right{
  display:flex;
  flex-direction:column;
}

.sports-item{
  /* display:flex;
  justify-content:space-between;
  align-items:center; */
  gap:15px;
  padding:15px 0;
  border-bottom:1px solid #ddd;
}

.sport-sub-item{
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

.sports-item p{
  font-size:14px;
  line-height:1.4;
  flex:1;
}

.sports-item img{
  width:90px;
  height:70px;
  object-fit:cover;
}
.sport-sub-item a{
  color: #000;
  text-decoration: none;
}

/* RESPONSIVE */
@media(max-width:992px){

  .sports-wrapper{
    grid-template-columns:1fr;
  }

  .sports-small-grid{
    grid-template-columns:1fr;
  }

  .sports-nav{
    display:none;
  }

  .sports-item{
    flex-direction:column;
    align-items:flex-start;
  }

  .sports-item img{
    width:100%;
    height:auto;
    margin-top:10px;
  }
}
/* SPORTS NEWS END  */


/* HEALTH NEWS START  */
/* SECTION */
.trending-section{
  margin:80px 0;
}

/* HEADER */
.trending-header{
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:30px;
}

.trending-header h2{
  margin:0 20px;
  font-size:28px;
  font-weight:700;
  text-transform:uppercase;
  font-family: 'Times New Roman', serif;
}

.trending-header .line{
  flex:1;
  height:1px;
  background:#000000;
}

/* CARD BASE */
.trending-card{
  /* background:#f3ebeb; */
  border-radius:8px;
  padding:20px;
  margin-bottom:25px;
  box-shadow:0 2px 10px rgba(0, 0, 0, 0.06);
}

/* LARGE CARD */
.trending-card.large h3{
  font-size:22px;
  line-height:1.5;
  margin-bottom:10px;
}

.trending-card.large img{
  width:100%;
  /* height:200px; */
  /* object-fit:cover; */
  border-radius:6px;
  margin-top:15px;
}

.trending-card a{
  color: #000;
  text-decoration: none;
}

.small-content a{
  color: #000;
  text-decoration: none;
}


/* SMALL CARD */
.trending-card.small{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
}

.trending-card.small h4{
  font-size:16px;
  line-height:1.5;
  margin-bottom:8px;
}

.trending-card.small img{
  width:200px;
  height:100px;
  object-fit:contain;
  border-radius:6px;
  padding-right: 2rem;
}

/* META */
.trending-meta{
  font-size:13px;
  color:#777;
}

.tag{
  color:#d0021b;
  font-weight:600;
}

/* RESPONSIVE */
@media(max-width:768px){

  .trending-card.small{
    flex-direction:column;
    align-items:flex-start;
  }

  .trending-card.small img{
    width:100%;
    height:auto;
    margin-top:15px;
  }

  .trending-card.large img{
    height:auto;
  }
}
/* HEALTH NEWS ENDS  */


/* BUSINESS NEWS START  */
.health-section{
  margin:70px 0;
}

.health-heading{
  font-size:22px;
  font-weight:700;
  margin-bottom:25px;
}

.health-wrapper{
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:40px;
}

/* LEFT SLIDER */
.health-slider{
  position:relative;
  overflow: hidden;
}

.slides{
  display:flex;
  transition: transform 0.6s ease-in-out;
}

.slides a{
  color: #000;
  text-decoration: none;
}

.slide{
  min-width: 100%;
}
/* .slide.active{
  display:block;
} */

.slide img{
  width:100%;
  height:350px;
  object-fit:cover;
}

.slide h3{
  margin-top:15px;
  font-size:22px;
  /* line-height:1.5;
  font-weight:600; */
}

/* DOTS */
.slider-dots{
  margin-top:15px;
}

.dot{
  display:inline-block;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#ccc;
  margin-right:8px;
  cursor:pointer;
}

.dot.active{
  background:#d0021b;
}

/* RIGHT SIDE */
.health-card{
  margin-bottom:30px;
}

.health-card img{
  width:100%;
  height:150px;
  object-fit:cover;
  margin-bottom:10px;
}

.health-card p{
  font-size:15px;
  line-height:1.5;
}

.health-card a{
  color: #000;
  text-decoration: none;
}

/* MOBILE RESPONSIVE */
@media(max-width:992px){

  .health-wrapper{
    grid-template-columns:1fr;
  }

  .slide img{
    height:auto;
  }

  .health-card img{
    height:auto;
  }
}
/* BUSINESS NEWS ENDS  */


/* TECHNOLOGY NEWS START  */
/* ===== TECH SLIDER SECTION ===== */

.tech-section{
  margin:60px 0;
  width:100%;
}

.tech-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:20px;
  gap:10px;
  flex-wrap:wrap;
}

.tech-header h2{
  font-size:24px;
  font-weight:700;
}

.tech-header span{
  color:#f7931e;
}

.tech-header a{
  text-decoration:none;
  color:#0099cc;
  font-weight:600;
}

.tech-slider{
  overflow:hidden;
  position:relative;
  width:100%;
}

.tech-track{
  display:flex;
  gap:20px;
  transition:transform 0.6s ease-in-out;
}

.tech-card{
  flex:0 0 33.33%;
  max-width:33.33%;
  background:#fff;
  border-radius:8px;
  box-shadow:0 4px 15px rgba(0,0,0,0.05);
  overflow:hidden;
}

.tech-card img{
  width:100%;
  height:200px;
  object-fit:cover;
  display:block;
}

.tech-content{
  padding:15px;
}

.tech-content a{
  color: #000;
  text-decoration: none;
}

.tech-tag{
  font-size:13px;
  font-weight:bold;
  color:#d0021b;
  display:block;
  margin-bottom:6px;
}

.tech-content h3{
  font-size:16px;
  line-height:1.4;
}

/* ===== RESPONSIVE ===== */

/* Tablet */
@media(max-width:992px){

  .tech-card{
    flex:0 0 50%;
    max-width:50%;
  }

  .tech-card img{
    height:190px;
  }

}

/* Mobile */
@media(max-width:600px){

  .tech-section{
    margin:40px 0;
  }

  .tech-header{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }

  .tech-header h2{
    font-size:20px;
  }

  .tech-header a{
    font-size:14px;
  }

  .tech-card{
    flex:0 0 100%;
    max-width:100%;
  }

  .tech-card img{
    height:180px;
  }

  .tech-content{
    padding:14px;
  }

  .tech-content h3{
    font-size:15px;
  }

}

/* TECHNOLOGY NEWS ENDS  */

/* Hero section Ends  */


/* FOOTER START  */

.h16-footer{
  background:#111;
  color:#ccc;
  padding:60px 0 30px;
  position:relative;
  width:100%;
}

/* Logo */
.footer-logo{
  width:10rem;
  height:auto;
  /* margin-left:2rem; */
}

/* Container */
.footer-container{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:40px;
  padding:0 20px;
}

/* Footer Columns */
.footer-col h4{
  color:#fff;
  margin-bottom:15px;
  font-size:16px;
}

.footer-col ul{
  list-style:none;
  padding:0;
}

.footer-col ul a{
  list-style:none;
  padding:0;
  text-decoration: none;
  color: #fff;
}

.footer-col ul li{
  font-size:14px;
  margin-bottom:8px;
  cursor:pointer;
  transition:0.3s;
}

.footer-col ul li:hover{
  color:#d0021b;
}

/* Brand Section */
.footer-brand{
  width:100%;
  max-width:18rem;
  display:flex;
  flex-direction:column;
}

.footer-brand h2{
  color:#fff;
  font-size:26px;
}

.footer-brand span{
  color:#d0021b;
}

.footer-brand p{
  font-size:14px;
  margin:10px 0 20px;
  text-transform:uppercase;
}

/* App Buttons */
.app-buttons img{
  width:140px;
  max-width:100%;
  margin-bottom:10px;
  display:block;
  cursor:pointer;
}

/* Social Icons */
.footer-social{
  text-align:center;
  margin-top:30px;
}

.footer-social a{
  color:#ccc;
  font-size:20px;
  margin:0 10px;
  transition:0.3s;
  text-decoration:none;
}

.footer-social a:hover{
  color:#d0021b;
}

/* Bottom */
.footer-bottom{
  text-align:center;
  margin-top:20px;
  font-size:13px;
  border-top:1px solid #333;
  padding-top:15px;
}

/* Back To Top */
.back-to-top{
  position:fixed;
  bottom:20px;
  right:20px;
  background:#ff001e;
  color:#fff;
  border:none;
  width:45px;
  height:45px;
  border-radius:50%;
  cursor:pointer;
  font-size:18px;
  display:none;
  transition:0.3s;
  font-weight:bolder;
}

.back-to-top:hover{
  background:#000;
}

.footer-title{
text-align:center;
font-family:'Times New Roman', Times, serif;
}

/* ===== Tablet ===== */
@media (max-width:992px){

  .footer-container{
    grid-template-columns:repeat(2,1fr);
    gap:30px;
  }

  .footer-logo{
    margin-left:0;
    /* text-align: center; */
  }

}


/* ===== Mobile ===== */
@media (max-width:600px){

.footer-brand h1{
padding-right:0;
text-align:center;
width:100%;
}
.footer-title{
text-align:center;
padding-right:0;
}

}
/* FOOTER ENDS */


/* ============================================
   ROOT FIX — horizontal scroll band karo
   html/body overflow-x sirf mobile ke liye
   ============================================ */
html, body {
  overflow-x: hidden;
}

/* ============================================
   MOBILE RESPONSIVE — 768px aur neeche
   ============================================ */

@media (max-width: 768px) {

  /* --- ROOT OVERFLOW & WIDTH --- */
  html, body {
    overflow-x: hidden;
    width: 100%;
  }

  /* Images aur media 100% se bahar na jayein */
  img, video, iframe, embed, object {
    max-width: 100% !important;
    height: auto;
  }

  /* ---- TOP BAR ---- */
  .top-bar {
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 8px 16px;
    font-size: 12px;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
  }

  /* ---- MAIN HEADER ---- */
  .main-header {
    padding: 10px 16px;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: 100%;
    box-sizing: border-box;
  }

  .main-header-middle {
    flex: 1;
    justify-content: center;
  }

  .main-header-middle h1 {
    font-size: 1.8rem;
  }

  .logo-name {
    font-size: 1.8rem;
  }

  .logo {
    height: 1.8rem;
    width: 2.5rem;
  }

  .menu-icon {
    font-size: 20px;
    flex-shrink: 0;
  }

  .search-container {
    flex-shrink: 0;
  }

  #searchBox {
    width: 3.5rem;
    font-size: 12px;
  }

  /* ---- NAVBAR ---- */
  .navbar {
    width: 100%;
    overflow-x: auto;
  }

  .navbar ul {
    flex-wrap: wrap;
    justify-content: center;
    padding: 8px 12px;
    gap: 2px 0;
    width: 100%;
  }

  .navbar ul li {
    margin: 4px 10px;
  }

  .navbar ul li a {
    font-size: 13px;
    white-space: nowrap;
  }

  /* ---- CONTAINER ---- */
  .container {
    padding: 0 14px;
    margin: 1rem auto;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
  }

  /* ---- NEWS SECTION GRID ---- */
  .news-section {
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
  }

  .left-content {
    width: 100%;
    overflow: hidden;
  }

  /* ---- MAIN HEADING ---- */
  .main-heading {
    font-size: 20px;
    line-height: 1.4;
  }

  .summary {
    font-size: 15px;
  }

  /* ---- MAIN IMAGE ---- */
  .main-image {
    width: 100%;
    height: auto;
    display: block;
  }

  /* ---- SMALL CARDS ---- */
  .small-cards {
    grid-template-columns: 1fr;
    gap: 20px;
    width: 100%;
  }

  .card {
    width: 100%;
  }

  .card-image img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* ---- INDIA / TOP VIDEOS SECTION ---- */
  .top-videos {
    padding: 20px 14px;
    width: 100%;
    box-sizing: border-box;
    margin: 24px 0;
  }

  .india-wrapper {
    grid-template-columns: 1fr;
    padding-left: 0;
    gap: 20px;
    width: 100%;
  }

  .main-india img {
    width: 100%;
    height: auto;
  }

  .india-title {
    font-size: 18px;
  }

  .suggested-india-img {
    max-height: none;
    overflow-y: visible;
    width: 100%;
  }

  .suggested-india-img-item {
    width: 100%;
    gap: 10px;
  }

  .suggested-india-img-item img {
    width: 90px;
    height: 65px;
    flex-shrink: 0;
  }

  .view-all-btn {
    margin-left: 0;
    width: 100%;
  }

  /* ---- TOP NEWS SLIDER ---- */
  .top-news {
    width: 100%;
    overflow: hidden;
  }

  .news-slider {
    width: 100%;
    overflow: hidden;
  }

  .news-track {
    width: max-content;
  }

  .news-card {
    min-width: 80vw;
    height: 200px;
  }

  .news-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
  }

  /* ---- SECTION HEADER ---- */
  .section-header {
    margin-bottom: 20px;
    width: 100%;
  }

  .section-header h2 {
    font-size: 18px;
    margin: 0 10px;
    white-space: nowrap;
  }

  /* ---- WORLD NEWS ---- */
  .world-section {
    margin: 24px 0;
    width: 100%;
    overflow: hidden;
    display: flex;
    
  }

  .world-row {
    flex-direction: column !important;
    gap: 16px;
    margin-bottom: 28px;
    width: 100%;
  }

  .world-row.reverse {
    flex-direction: column !important;
  }

  .world-img {
    width: 100%;
  }

  .world-img img {
    width: 100%;
    height: auto;
    border-radius: 6px;
  }

  .world-content {
    width: 100%;
    
  }

  .world-content h3 {
    font-size: 14px;
  }

  .see-more-btn {
    margin-left: 0;
    width: auto;
    padding: 10px 20px;
  }

  /* ---- ENTERTAINMENT (cinema) SECTION ---- */
  .cinema-section {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .cinema-header {
    flex-wrap: wrap;
    gap: 8px;
  }

  .cinema-grid {
    grid-template-columns: 1fr;
    gap: 0;
    width: 100%;
  }

  .cinema-item {
    flex-direction: row;
    gap: 12px;
    padding-bottom: 16px;
    width: 100%;
    box-sizing: border-box;
  }

  .cinema-text {
    flex: 1;
    min-width: 0;
  }

  .cinema-text h4 {
    font-size: 14px;
  }

  .cinema-item img {
    width: 90px;
    height: 75px;
    flex-shrink: 0;
    object-fit: cover;
  }

  .cinema-text h4 a{
    color: #000;
    text-decoration: none;
  }


  /* ---- STATE / CITY NEWS ---- */
  .city-news {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .city-header {
    flex-wrap: wrap;
    gap: 8px;
  }

  .city-wrapper {
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
  }

  .city-left {
    width: 100%;
  }

  .city-left img {
    width: 100%;
    height: auto;
  }

  .city-left h3 {
    font-size: 17px;
  }

  .city-right {
    width: 100%;
  }

  .city-item {
    font-size: 14px;
    padding: 12px 0;
  }

  /* ---- SPORTS NEWS ---- */
  .sports-section {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .sports-header {
    flex-wrap: wrap;
    gap: 8px;
  }

  .sports-header h2 {
    font-size: 20px;
  }

  .sports-nav {
    display: none;
  }

  .sports-wrapper {
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
  }

  .sports-main {
    width: 100%;
  }

  .sports-main img {
    width: 100%;
    height: auto;
  }

  .sports-main h3 {
    font-size: 17px;
  }

  .sports-small-grid {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 20px;
  }

  .sports-small-card img {
    width: 100%;
    height: auto;
  }

  .sports-right {
    width: 100%;
  }

  .sports-item {
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 0;
  }

  .sport-sub-item {
    flex-direction: row;
    gap: 10px;
  }

  .sports-item img {
    width: 80px;
    height: 65px;
    flex-shrink: 0;
    object-fit: cover;
  }

  .sports-item p {
    font-size: 13px;
  }

  /* ---- HEALTH / TRENDING SECTION ---- */
  .trending-section {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .trending-header h2 {
    font-size: 20px;
  }

  .trending-card {
    padding: 14px;
  }

  .trending-card.large h3 {
    font-size: 18px;
  }

  .trending-card.large img {
    width: 100%;
    height: auto;
  }

  .trending-card.small {
    flex-direction: row;
    align-items: flex-start;
    gap: 12px;
  }

  .trending-card.small img {
    width: 90px;
    height: 80px;
    flex-shrink: 0;
    margin-top: 0;
  }

  .trending-card.small h4 {
    font-size: 14px;
  }

  /* ---- BUSINESS SLIDER SECTION ---- */
  .health-section {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .health-wrapper {
    grid-template-columns: 1fr;
    gap: 24px;
    width: 100%;
  }

  .health-slider {
    width: 100%;
  }

  .slide {
    width: 100%;
  }

  .slide img {
    width: 100%;
    height: auto;
  }

  .slide h3 {
    font-size: 17px;
  }

  .health-card {
    width: 100%;
  }

  .health-card img {
    width: 100%;
    height: auto;
  }

  /* ---- TECH SECTION ---- */
  .tech-section {
    margin: 36px 0;
    width: 100%;
    overflow: hidden;
  }

  .tech-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    width: 100%;
  }

  .tech-header h2 {
    font-size: 18px;
  }

  .tech-slider {
    width: 100%;
    overflow: hidden;
  }

  .tech-track {
    width: max-content;
  }

  .tech-card {
    flex: 0 0 80vw;
    max-width: 80vw;
  }

  .tech-card img {
    width: 100%;
    height: 160px;
    object-fit: cover;
  }

  /* ---- RIGHT SIDEBAR ---- */
  .right-content {
    position: static;
    height: auto;
    overflow: visible;
    border-left: none;
    padding-left: 0;
    border-top: 2px solid #eee;
    padding-top: 20px;
    width: 100%;
  }

  .timeline {
    padding-left: 16px;
  }

  .timeline-item {
    margin-right: 0;
  }

  .box-shadow {
    padding: 10px 12px;
  }

  /* ---- FOOTER ---- */
  .h16-footer {
    padding: 36px 0 20px;
    width: 100%;
    overflow: hidden;
  }

  .footer-container {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 0 16px;
    width: 100%;
    box-sizing: border-box;
  }

  .footer-brand {
    grid-column: 1 / -1;
    align-items: center;
    text-align: center;
    max-width: 100%;
    margin: 0 auto;
  }

  .footer-logo {
    margin: 0 auto;
    display: block;
    width: 7rem;
  }

  .footer-col h4 {
    font-size: 14px;
  }

  .footer-col ul li {
    font-size: 13px;
  }

  .app-buttons img {
    width: 120px;
  }

  .footer-social a {
    font-size: 18px;
    margin: 0 8px;
  }
}

/* ============================================
   EXTRA SMALL — 480px aur neeche
   ============================================ */

@media (max-width: 480px) {

  /* ---- HEADER ---- */
  .main-header {
    padding: 8px 12px;
  }

  .main-header-middle h1 {
    font-size: 1.5rem;
  }

  .logo-name {
    font-size: 1.5rem;
  }

  .logo {
    height: 1.6rem;
    width: 2.2rem;
  }

  #searchBox {
    width: 3rem;
  }

  /* ---- TOP BAR ---- */
  .top-bar {
    padding: 6px 12px;
  }

  .subscribe-btn {
    padding: 5px 10px;
    font-size: 11px;
  }

  /* ---- SLIDERS ---- */
  .news-card {
    min-width: 88vw;
    height: 180px;
  }

  .news-card img {
    height: 180px;
  }

  .tech-card {
    flex: 0 0 88vw;
    max-width: 88vw;
  }

  /* ---- SPORTS SMALL GRID ---- */
  .sports-small-grid {
    grid-template-columns: 1fr;
  }

  /* ---- FOOTER ---- */
  .footer-container {
    grid-template-columns: 1fr;
    text-align: center;
    gap: 20px;
  }

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

  .app-buttons img {
    margin: 0 auto;
  }

  .footer-col {
    width: 100%;
  }

  .footer-bottom {
    font-size: 11px;
    padding: 12px 16px 0;
  }
}


/* -------------------------------------------------------------------------------------------------------
-------------------------------------------CATEGORY STYLING--------------------------------------------
------------------------------------------------------------------------------------------------------- */

.india-section{
max-width:1200px;
margin:60px auto;
padding:0 20px;
font-family:Georgia, serif;
}

.home-btn{
  background-color:#c30018;
  padding: 0.6rem;
  border-radius: 7px;
  color: #f5f5f5;
  border: none;
}

.live a {
  color: #fff;
}

.india-left a{
  margin-top: 2rem;
}

.india-header{
text-align:center;
margin-bottom:30px;
}

.india-header h2{
color:#c30018;
font-size:30px;
}

/* GRID */

.india-layout{
display:grid;
grid-template-columns:1fr 2fr 1fr;
gap:30px;
}

/* LEFT COLUMN */

.news-small{
border-bottom:1px solid #ddd;
padding-bottom:12px;
margin-bottom:15px;
}

.tag{
font-size:11px;
color:#c30018;
font-weight:bold;
}

.news-small h4{
font-size:14px;
line-height:1.4;
margin-top:5px;
}

.source{
font-size:11px;
color:#777;
margin-top:6px;
}

.news-image img{
width:100%;
margin-top:10px;
height: 200px;
}

.news-image h4{
font-size:14px;
margin-top:8px;
}

.india-layout a{
  color: #000;
  text-decoration: none;
}

/* CENTER */

.live{
color:#c30018;
font-size:12px;
font-weight:bold;
margin-bottom:5px;
display: flex;
align-items: center;
justify-content: space-between;
}

.india-main h1{
font-size:26px;
line-height:1.4;
margin-bottom:15px;
}

.main-story{
/* display:grid; */
/* grid-template-columns:1fr 1fr; */
/* gap:15px; */

}

.main-story img{
width:100%;
height: 300px;
}

.main-story p{
font-size:14px;
color:#444;
}

.main-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px;
margin-top:20px;

}

.main-card img{
width:100%;
margin-bottom:8px;
height: 160px;
}

.main-card h4{
font-size:15px;
line-height:1.4;
}

/* .main-story p{
  border-bottom:1px solid #ddd;
  padding-bottom:12px;
margin-bottom:15px;
} */

/* RIGHT COLUMN */

.india-right h3{
font-size:18px;
color:#c30018;
margin-bottom:15px;
}



.popular{
display:flex;
gap:10px;
margin-bottom:15px;  
/* box-shadow: 0 0 20px rgba(0,0,0,0.06); */

}

.popular img{
width:70px;
height:55px;
object-fit:cover;
}

.popular p{
font-size:14px;
line-height:1.4;
}


/* ======================
RESPONSIVE
====================== */

@media(max-width:1024px){

.india-layout{
grid-template-columns:1fr 2fr;
}

.india-right{
grid-column:span 2;
}

}

@media(max-width:768px){

.india-layout{
grid-template-columns:1fr;
}

.main-story{
grid-template-columns:1fr;
}

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

.popular{
flex-direction:column;
}

.popular img{
width:100%;
height:auto;
}

.india-main h1{
font-size:22px;
}

}

@media(max-width:480px){

.india-main h1{
font-size:20px;
}

.india-header h2{
font-size:24px;
}

}

/* divider line  */
.section-divider{
width:100%;
max-width:1200px;
margin:40px auto;
height:6px;
border-top:2px solid #ddd;
border-bottom:2px solid #ddd;
}


@media(max-width:768px){

/* GRID हटाकर FLEX लगाओ */
.india-layout{
display:flex;
flex-direction:column;
}

/* ORDER FIX */

.india-main{
order:1;
}

.india-left{
order:2;
}

.india-right{
order:3;
}

/* बाकी responsive fixes */

.main-story{
grid-template-columns:1fr;
}

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

.popular{
flex-direction:column;
}

.popular img{
width:100%;
height:auto;
}

.india-main h1{
font-size:22px;
}

}

/* Missed section  */
.missed-section{
max-width:1200px;
margin:60px auto;
padding:0 20px;
}

/* HEADER */

.missed-header{
display:flex;
align-items:center;
justify-content:center;
margin-bottom:30px;
}

.missed-header h2{
margin:0 20px;
font-size:24px;
font-weight:700;
color:#c40018;
font-family:'Times New Roman', serif;
}

.missed-header .line{
flex:1;
height:2px;
background:#ccc;
}

/* GRID */

.missed-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:25px;
}

/* CARD */

.missed-card img{
width:100%;
height:180px;
object-fit:cover;
margin-bottom:10px;
}

.missed-card p{
font-size:14px;
line-height:1.4;
}

.missed-card a{
  color: #000;
  text-decoration: none;
}


/* SEE MORE BUTTON */

.missed-more{
  text-align:center;
  margin-top:30px;
}

.see-more-btn{
  background:#d0021b;
  color:#fff;
  border:none;
  padding:12px 28px;
  font-size:14px;
  font-weight:600;
  border-radius:6px;
  cursor:pointer;
  transition:all 0.3s ease;
}

.see-more-btn:hover{
  background:#000;
  transform:translateY(-2px);
}

/* MOBILE */

@media(max-width:600px){

  .see-more-btn{
    width:100%;
    max-width:250px;
  }

}

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

@media(max-width:992px){

.missed-grid{
grid-template-columns:repeat(2,1fr);
}

}

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

@media(max-width:600px){

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

.missed-card img{
height:auto;
}

.missed-header h2{
font-size:20px;
}

}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------detail-news STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */

.article-wrapper{
max-width:1200px;
margin:60px auto;
padding:0 20px;
font-family:Georgia, serif;
}

.popular-item a{
  color: #000;
  text-decoration: none;
}

.article-grid{
display:grid;
grid-template-columns:2fr 1fr;
gap:40px;
}

/* LEFT CONTENT */

.breadcrumb{
font-size:12px;
color:#777;
margin-bottom:15px;
}

.breadcrumb span{
color:#c40018;
}

.article-title{
font-size:34px;
line-height:1.3;
margin-bottom:15px;
}

.article-summary{
font-size:16px;
color:#444;
margin-bottom:15px;
}

.article-meta{
font-size:12px;
color:#888;
margin-bottom:20px;
}

.author{
display:flex;
align-items:center;
gap:10px;
margin-bottom:20px;
margin-top: 20px;
}

.author img{
width:35px;
height:35px;
border-radius:50%;
}

.article-image{
width:100%;
margin:20px 0;
}

.article-text{
font-size:17px;
line-height:1.8;
margin-bottom:15px;
color:#333;
}


/* SIDEBAR */

.article-sidebar{
position:sticky;
top:20px;
height:fit-content;
  /* box-shadow: 0 0 20px rgba(0,0,0,0.06); */
  background:#fff;
    padding:10px;
    /* margin-bottom:40px; */
    border-radius:4px;
    box-shadow:0 2px 10px rgba(0, 0, 0, 0.06);

}

.sidebar-title{
color:#c40018;
font-size:18px;
margin-bottom:20px;
}

.popular-item{
display:flex;
gap:10px;
margin-bottom:15px;
border-bottom:1px solid #eee;
padding-bottom:10px;
}

.popular-item img{
width:70px;
height:60px;
object-fit:cover;
}

.popular-item p{
font-size:14px;
line-height:1.4;
}


/* RESPONSIVE */

@media(max-width:992px){

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

.article-sidebar{
position:static;
margin-top:40px;
}

}

@media(max-width:768px){

.article-title{
font-size:26px;
}

.article-summary{
font-size:14px;
}

.popular-item{
flex-direction:column;
}

.popular-item img{
width:100%;
height:auto;
}

}

@media(max-width:480px){

.article-title{
font-size:22px;
}

}

.news-links{
  text-decoration: none;
  color: black;
}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------ABOUT STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */

.about-page{
background:#fafafa;
padding:60px 20px;
font-family:Georgia, serif;
}

.about-container{
max-width:1100px;
margin:auto;
}


/* HERO */

.about-hero{
text-align:center;
margin-bottom:50px;
}

.about-hero h1{
font-size:38px;
margin-bottom:10px;
border-bottom:3px solid #d0021b;
display:inline-block;
padding-bottom:5px;
}

.about-hero p{
max-width:700px;
margin:auto;
font-size:18px;
color:#555;
}


/* STATS */

.about-stats{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-bottom:60px;
}

.stat-box{
background:#fff;
padding:25px;
text-align:center;
border-radius:6px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.stat-box h3{
font-size:28px;
color:#d0021b;
}

.stat-box p{
font-size:14px;
color:#666;
}


/* SECTIONS */

.about-section{
margin-bottom:50px;
}

.about-section h2{
font-size:28px;
margin-bottom:15px;
}

.about-section ul{
padding-left:20px;
line-height:1.7;
}


/* VISION MISSION */

.about-cards{
display:grid;
grid-template-columns:1fr 1fr;
gap:30px;
margin-bottom:60px;
}

.about-card{
background:#fff;
padding:25px;
border-left:4px solid #d0021b;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.about-card h3{
margin-bottom:10px;
}


/* GALLERY */

.about-gallery{
margin-bottom:60px;
}

.about-gallery h2{
margin-bottom:20px;
}

.gallery-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:10px;
}

.gallery-grid img{
width:100%;
height:180px;
object-fit:cover;
border-radius:4px;
}


/* CONTACT */

.about-contact{
background:#fff;
padding:30px;
text-align:center;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.contact-buttons{
margin-top:15px;
}

.contact-buttons a{
display:inline-block;
margin:5px;
padding:8px 14px;
background:#d0021b;
color:#fff;
text-decoration:none;
font-size:14px;
border-radius:4px;
}

.contact-buttons a:hover{
background:#000;
}


/* TABLET */

@media(max-width:992px){

.about-stats{
grid-template-columns:repeat(2,1fr);
}

.gallery-grid{
grid-template-columns:repeat(2,1fr);
}

.about-cards{
grid-template-columns:1fr;
}

}


/* MOBILE */

@media(max-width:600px){

.about-hero h1{
font-size:28px;
}

.about-hero p{
font-size:16px;
}

.about-stats{
grid-template-columns:1fr;
}

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

}

/* ------------------------------------------------------------------------------------------------------
-------------------------------------------CONTACT STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */

.contact-page{
background:#f6f6f6;
padding:60px 20px;
font-family:Arial, sans-serif;
}

.contact-container{
max-width:1100px;
margin:auto;
}


/* HEADER */

.contact-header{
text-align:center;
margin-bottom:40px;
}

.contact-header h1{
font-size:34px;
margin-bottom:10px;
border-bottom:3px solid #d0021b;
display:inline-block;
padding-bottom:6px;
}

.contact-header p{
color:#555;
font-size:16px;
}


/* GRID */

.contact-grid{
display:grid;
grid-template-columns:1fr 1.5fr;
gap:30px;
margin-bottom:40px;
}


/* INFO BOX */

.contact-info{
display:flex;
flex-direction:column;
gap:20px;
}

.info-box{
background:#fff;
padding:20px;
border-left:4px solid #d0021b;
box-shadow:0 2px 8px rgba(0,0,0,0.05);
}

.info-box h3{
margin-bottom:10px;
}


/* FORM */

.contact-form{
background:#fff;
padding:25px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.contact-form form{
display:flex;
flex-direction:column;
gap:15px;
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
}

.contact-form input,
.contact-form textarea{
padding:12px;
border:1px solid #ddd;
border-radius:4px;
font-size:14px;
width:100%;
}

.contact-form textarea{
height:120px;
resize:none;
}

.contact-form button{
background:#d0021b;
color:#fff;
border:none;
padding:12px;
cursor:pointer;
font-weight:bold;
border-radius:4px;
}

.contact-form button:hover{
background:#000;
}


/* MAP */

.contact-map{
margin:40px 0;
}

.contact-map iframe{
width:100%;
height:350px;
border:0;
}


/* ALERT */

.fraud-alert{
background:#fff;
padding:25px;
border-left:5px solid #d0021b;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.fraud-alert h2{
margin-bottom:10px;
}

.fraud-alert ul{
padding-left:20px;
margin-top:10px;
}

.alert-contact{
margin-top:15px;
font-weight:bold;
}


/* TABLET */

@media(max-width:992px){

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

.form-row{
grid-template-columns:1fr;
}

}


/* MOBILE */

@media(max-width:600px){

.contact-header h1{
font-size:26px;
}

.contact-map iframe{
height:250px;
}

}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------ADVERTISE STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */



.advertise-page{
padding:60px 20px;
background:#fafafa;
font-family:Arial, sans-serif;
}

.advertise-container{
max-width:1100px;
margin:auto;
}


/* HERO */

.advertise-hero{
text-align:center;
margin-bottom:50px;
}

.advertise-hero h1{
font-size:36px;
margin-bottom:10px;
border-bottom:3px solid #d0021b;
display:inline-block;
padding-bottom:6px;
}

.advertise-hero p{
max-width:700px;
margin:auto;
color:#555;
}


/* SECTION */

.advertise-section{
margin-bottom:50px;
}

.advertise-section h2{
font-size:28px;
margin-bottom:15px;
}


/* GRID */

.adv-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
}

.adv-card{
background:#fff;
padding:20px;
border-left:4px solid #d0021b;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.adv-card h3{
margin-bottom:8px;
}


/* LIST */

.adv-list{
padding-left:20px;
line-height:1.7;
}


/* STATS */

.advertise-stats{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
margin-bottom:50px;
}

.stat-box{
background:#fff;
padding:25px;
text-align:center;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.stat-box h3{
color:#d0021b;
font-size:28px;
}


/* CONTACT */

.advertise-contact{
background:#fff;
padding:30px;
text-align:center;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.contact-buttons{
margin-top:15px;
}

.contact-buttons a{
display:inline-block;
margin:5px;
padding:10px 18px;
background:#d0021b;
color:#fff;
text-decoration:none;
border-radius:4px;
}

.contact-buttons a:hover{
background:#000;
}


/* TABLET */

@media(max-width:992px){

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

.advertise-stats{
grid-template-columns:1fr 1fr;
}

}


/* MOBILE */

@media(max-width:600px){

.advertise-hero h1{
font-size:26px;
}

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

.advertise-stats{
grid-template-columns:1fr;
}

}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------CAREERS STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */




.careers-page{
padding:60px 20px;
background:#f8f8f8;
font-family:Arial, sans-serif;
}

.careers-container{
max-width:1100px;
margin:auto;
}


/* HERO */

.careers-hero{
text-align:center;
margin-bottom:50px;
}

.careers-hero h1{
font-size:36px;
margin-bottom:10px;
border-bottom:3px solid #d0021b;
display:inline-block;
padding-bottom:5px;
}

.careers-hero p{
color:#555;
max-width:700px;
margin:auto;
}


/* SECTION */

.careers-section{
margin-bottom:50px;
}

.careers-section h2{
font-size:28px;
margin-bottom:20px;
}


/* CARDS */

.career-cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
}

.career-card{
background:#fff;
padding:20px;
border-left:4px solid #d0021b;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}


/* JOB LIST */

.job-list{
display:flex;
flex-direction:column;
gap:15px;
}

.job-item{
background:#fff;
padding:20px;
display:flex;
justify-content:space-between;
align-items:center;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.job-item button{
background:#d0021b;
color:#fff;
border:none;
padding:8px 16px;
cursor:pointer;
border-radius:4px;
}

.job-item button:hover{
background:#000;
}


/* INTERNS */

.intern-list{
padding-left:20px;
line-height:1.7;
}


/* FORM */

.career-form{
background:#fff;
padding:25px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
display:flex;
flex-direction:column;
gap:15px;
}

.form-row{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
}

.career-form input,
.career-form textarea{
padding:10px;
border:1px solid #ddd;
border-radius:4px;
}

.career-form textarea{
height:120px;
resize:none;
}

.career-form button{
background:#d0021b;
color:#fff;
border:none;
padding:12px;
cursor:pointer;
border-radius:4px;
}


/* ALERT */

.fraud-alert{
background:#fff;
padding:20px;
border-left:5px solid #d0021b;
margin-bottom:40px;
}


/* CONTACT */

.career-contact{
text-align:center;
background:#fff;
padding:25px;
box-shadow:0 2px 10px rgba(0,0,0,0.05);
}


/* TABLET */

@media(max-width:992px){

.career-cards{
grid-template-columns:1fr 1fr;
}

.form-row{
grid-template-columns:1fr;
}

.job-item{
flex-direction:column;
align-items:flex-start;
gap:10px;
}

}


/* MOBILE */

@media(max-width:600px){

.career-cards{
grid-template-columns:1fr;
}

.careers-hero h1{
font-size:26px;
}

}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------PRIVACY POLICY STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */

.privacy-page{
background:#f7f7f7;
padding:60px 20px;
font-family:Georgia, serif;
}

.privacy-container{
max-width:1000px;
margin:auto;
background:#fff;
padding:40px;
box-shadow:0 2px 10px rgba(0,0,0,0.08);
border-radius:6px;
}


/* HEADER */

.privacy-header{
border-bottom:3px solid #d0021b;
padding-bottom:15px;
margin-bottom:30px;
}

.privacy-header h1{
font-size:34px;
margin-bottom:5px;
}

.update{
font-size:14px;
color:#777;
}


/* INTRO */

.privacy-intro{
font-size:16px;
line-height:1.7;
margin-bottom:30px;
}


/* SECTION */

.policy-section{
margin-bottom:35px;
padding-bottom:25px;
border-bottom:1px solid #eee;
}

.policy-section h2{
font-size:22px;
margin-bottom:15px;
color:#111;
}

.policy-section h4{
margin-top:10px;
margin-bottom:8px;
font-size:17px;
}

.policy-section p{
line-height:1.7;
font-size:15px;
color:#333;
}

.policy-section ul{
padding-left:20px;
}

.policy-section ul li{
margin-bottom:6px;
line-height:1.6;
}



/* LINKS */

.policy-section a{
color:#d0021b;
text-decoration:none;
}

.policy-section a:hover{
text-decoration:underline;
}



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

@media(max-width:992px){

.privacy-container{
padding:30px;
}

.privacy-header h1{
font-size:28px;
}

}



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

@media(max-width:600px){

.privacy-page{
padding:40px 15px;
}

.privacy-container{
padding:20px;
}

.privacy-header h1{
font-size:24px;
}

.policy-section h2{
font-size:18px;
}

.policy-section p,
.policy-section li{
font-size:14px;
}

}


/* ------------------------------------------------------------------------------------------------------
-------------------------------------------PRIVACY POLICY STYLING-----------------------------------------------
------------------------------------------------------------------------------------------------------- */

.terms-page{
background:#f6f6f6;
padding:60px 20px;
font-family:Georgia, serif;
}

.terms-container{
max-width:1000px;
margin:auto;
background:#fff;
padding:40px;
box-shadow:0 2px 12px rgba(0,0,0,0.08);
border-radius:6px;
}


/* HEADER */

.terms-header{
border-bottom:3px solid #d0021b;
padding-bottom:20px;
margin-bottom:35px;
}

.terms-header h1{
font-size:34px;
margin-bottom:10px;
}

.terms-header p{
font-size:16px;
color:#444;
line-height:1.7;
}


/* SECTION */

.terms-section{
margin-bottom:30px;
padding-bottom:25px;
border-bottom:1px solid #eee;
}

.terms-section h2{
font-size:22px;
margin-bottom:12px;
color:#111;
}

.terms-section p{
font-size:15px;
line-height:1.7;
color:#333;
}

.terms-section ul{
padding-left:20px;
}

.terms-section ul li{
margin-bottom:8px;
line-height:1.6;
}


/* LINKS */

.terms-section a{
color:#d0021b;
text-decoration:none;
}

.terms-section a:hover{
text-decoration:underline;
}


/* TABLET */

@media(max-width:992px){

.terms-container{
padding:30px;
}

.terms-header h1{
font-size:28px;
}

}


/* MOBILE */

@media(max-width:600px){

.terms-page{
padding:40px 15px;
}

.terms-container{
padding:20px;
}

.terms-header h1{
font-size:24px;
}

.terms-section h2{
font-size:18px;
}

.terms-section p,
.terms-section li{
font-size:14px;
}

}