/* === DASAR & STRUKTUR === */
* {box-sizing: border-box; margin:0; padding:0;}
body {font-family: 'Segoe UI', sans-serif; background:#f9f9f9; color:#333;}
.container {width:92%; max-width:1200px; margin:0 auto;}
a {text-decoration:none; color:inherit;}
img {width:100%; height:auto; object-fit:cover;}

/* === HEADER SUDAH ADA & RAPI === */
.ie-header-top {background:#fff; border-bottom:2px solid #d90429; padding:12px 0; position:sticky; top:0; z-index:999; box-shadow:0 2px 5px rgba(0,0,0,0.05);}
.ie-flex {display:flex; align-items:center; justify-content:space-between;}
.ie-hamburger, .ie-search-icon {font-size:22px; border:none; background:none; cursor:pointer; color:#111;}
.ie-logo a {font-weight:900; font-size:32px;}
.logo-indo {color:#111;}
.logo-ekspres {color:#d90429;}
.logo-com {color:#0056b3; font-size:16px; font-weight:600;}
.ie-search-box {max-height:0; overflow:hidden; transition:0.3s; background:#fff; border-bottom:1px solid #eee;}
.ie-search-box.aktif {max-height:60px; padding:10px 0;}
.ie-search-box input {width:100%; padding:8px; border:1px solid #ddd; border-radius:4px;}
.ie-menu-daerah {background:#fff; border-bottom:1px solid #eee;}
.ie-nav-list {list-style:none; display:flex; gap:20px; overflow-x:auto; padding:10px 0;}
.ie-nav-list li a {color:#333; font-weight:500; white-space:nowrap;}
.ie-nav-list li a:hover {color:#d90429; border-bottom:2px solid #d90429;}

/* === SLIDER SUMSEL === */
.ie-slider-sumsel {position:relative; margin:20px 0; border-radius:8px; overflow:hidden; box-shadow:0 3px 8px rgba(0,0,0,0.1);}
.ie-slider-wrapper {display:flex; transition:transform 0.5s ease-in-out;}
.ie-slide {min-width:100%; position:relative;}
.ie-slide img {width:100%; height:450px; object-fit:cover;}

/* === TULISAN DI DALAM SLIDER === */
.ie-slide-info {
  position:absolute; bottom:0; left:0; right:0;
  padding:30px 25px;
  background:linear-gradient(to top, rgba(0,0,0,0.9), rgba(0,0,0,0.2), transparent);
}
.ie-tag {
  display:inline-block;
  background:#d90429;
  color:#fff;
  padding:4px 12px;
  border-radius:3px;
  font-weight:bold;
  font-size:14px;
  margin-right:10px;
}
.ie-tanggal {
  color:#0056b3;
  font-weight:500;
  font-size:14px;
}
.ie-slide-info h2 {
  color:#111;
  margin-top:12px;
  font-size:28px;
  line-height:1.3;
}

/* TOMBOL GESER SLIDER */
.ie-slide-btn {
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.4);
  color:#fff;
  border:none;
  font-size:24px;
  padding:10px 15px;
  cursor:pointer;
  z-index:10;
}
.prev {left:10px;}
.next {right:10px;}
.ie-slide-btn:hover {background:#d90429;}

/* === BERITA LAINNYA === */
.ie-terbaru h3, .ie-daerah h3 {
  border-left:4px solid #d90429;
  padding-left:10px;
  margin:30px 0 15px;
  color:#222;
}
.ie-grid {display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:20px;}
.ie-card {background:#fff; border-radius:6px; overflow:hidden; box-shadow:0 2px 5px rgba(0,0,0,0.05);}
.ie-card img {height:160px;}
.ie-date {font-size:13px; color:#666; margin:8px 10px; display:block;}
.ie-card h4 {margin:0 10px 10px; color:#222;}
.ie-card p {margin:0 10px 12px; color:#555; font-size:14px;}
.ie-list-item {display:flex; gap:12px; padding:10px 0; border-bottom:1px solid #eee; background:#fff; padding:10px; border-radius:4px; margin-bottom:8px;}
.ie-list-item img {width:100px; height:75px; border-radius:4px;}

/* === FOOTER === */
.ie-footer {background:#111; color:#ddd; padding:30px 0; margin-top:40px;}

/* === RESPONSIF HP === */
@media(max-width:768px){
  .ie-slide img {height:280px;}
  .ie-slide-info h2 {font-size:18px;}
  .ie-logo a {font-size:24px;}
  .logo-com {font-size:13px;}
}

/* === BERITA TERBARU UKURAN KECIL === */
.ie-terbaru .ie-grid {
  grid-template-columns: repeat(4, 1fr); /* 4 berita berdampingan */
  gap: 12px;
}
.ie-terbaru .ie-card img {
  height: 90px !important; /* Gambar jadi kecil */
  object-fit: cover;
}
.ie-terbaru .ie-card h4 {
  font-size: 14px;
  margin: 8px;
}
/* Di HP tetap rapi */
@media(max-width:768px){
  .ie-terbaru .ie-grid {grid-template-columns: repeat(2, 1fr);}
}
