:root{
  --brand-radius: 16px;
}
.brand-logo{
  width: 36px;
  height: 36px;
  object-fit: contain;
  background: rgba(255,255,255,.15);
  border-radius: 10px;
  padding: 4px;
}
.brand-logo-placeholder{
  width: 36px;
  height: 36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 10px;
  background: rgba(255,255,255,.15);
}
.footer-logo{
  width: 44px;
  height: 44px;
  object-fit: contain;
  background: #f1f5f9;
  border-radius: 12px;
  padding: 6px;
}
.footer-logo-placeholder{
  width: 44px;
  height: 44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius: 12px;
  background: #f1f5f9;
}
.card-soft{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: var(--brand-radius);
}
.hero{
  border-radius: 24px;
  background: radial-gradient(1200px 600px at 20% 10%, rgba(13,110,253,.18), transparent 60%),
              radial-gradient(900px 500px at 90% 30%, rgba(25,135,84,.18), transparent 55%),
              linear-gradient(180deg, #ffffff, #f8fafc);
  border: 1px solid rgba(15,23,42,.08);
}
.badge-soft{
  background: rgba(13,110,253,.12);
  color: #0d6efd;
}
.prose img{
  max-width: 100%;
  height: auto;
  border-radius: 12px;
}
.prose iframe{
  max-width: 100%;
}

/* Cover image untuk postingan */
.post-cover-sm{
  width: 100%;
  height: 180px;
  object-fit: cover;
}
.post-cover-placeholder{
  width: 100%;
  height: 180px;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
}
.post-cover-lg{
  width: 100%;
  max-height: 420px;
  object-fit: cover;
  border-radius: 18px;
}


/* ================================
   Home (Landing) - Modern UI
   ================================ */
.home-hero{
  border-radius: 26px;
  background: radial-gradient(1100px 520px at 15% 10%, rgba(13,110,253,.20), transparent 60%),
              radial-gradient(900px 520px at 95% 30%, rgba(25,135,84,.18), transparent 58%),
              linear-gradient(180deg, #ffffff, #f8fafc);
  border: 1px solid rgba(15,23,42,.08);
  position: relative;
  overflow: hidden;
}
.home-hero::after{
  content:"";
  position:absolute;
  inset:-80px -120px auto auto;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle at 30% 30%, rgba(13,110,253,.35), rgba(13,110,253,0));
  filter: blur(10px);
  pointer-events:none;
}
.home-hero-strip{
  background: linear-gradient(90deg, rgba(13,110,253,.95), rgba(25,135,84,.90));
}
.stat-card{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  background: rgba(255,255,255,.7);
  backdrop-filter: blur(6px);
  padding: 14px 14px 12px;
  text-align: center;
}
.stat-icon{
  display:inline-flex;
  width: 38px;
  height: 38px;
  align-items:center;
  justify-content:center;
  border-radius: 14px;
  background: rgba(13,110,253,.12);
  color: #0d6efd;
  margin-bottom: 6px;
}
.stat-value{
  font-weight: 800;
  font-size: 1.15rem;
  line-height: 1.1;
}
.stat-label{
  font-size: .82rem;
  color: #64748b;
}

.home-slide-card{
  border-radius: 24px;
}
.home-slide-img{
  width: 100%;
  height: 240px;
  object-fit: cover;
}
.home-slide-placeholder{
  width: 100%;
  height: 240px;
  background: #f1f5f9;
  display:flex;
  align-items:center;
  justify-content:center;
}
@media (min-width: 992px){
  .home-slide-img, .home-slide-placeholder{
    height: 100%;
    min-height: 330px;
  }
}

/* Carousel indicators lebih jelas */
.carousel-indicators [data-bs-target]{
  width: 10px;
  height: 10px;
  border-radius: 999px;
}