/* =========================================================
   News/Blog styling — full-bleed, krem dengan nuansa biru,
   gaya editorial minimalis (Playfair Display + Work Sans).
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Work+Sans:wght@300;400;500;600;700&display=swap');

:root{
  --nw-ink:#1C1A17;
  --nw-muted:#6b6055;
  --nw-accent:#2563EB;
  --nw-line:rgba(28,26,23,0.12);
  --nw-bg:#FBFAF8;
  --nw-card:#FFFFFF;
}

#nw-header a,
#nw-list a{
  font-style:normal !important;
}

/* ---------------- HEADER ---------------- */
.nw-header{
  position:relative;
  background:var(--nw-bg);
  font-family:'Work Sans','Helvetica Neue',Arial,sans-serif;
  padding:80px 24px 64px;
  overflow:hidden;
  box-sizing:border-box;
  width:100%;
}
.nw-header.js-full-bleed{ width:100vw !important; max-width:100vw !important; }

.nw-header-bg{
  position:absolute; inset:0; z-index:0;
  background:
    linear-gradient(180deg, var(--nw-bg) 0%, var(--nw-bg) 10%, rgba(251,250,248,0.85) 20%, transparent 42%),
    radial-gradient(55% 70% at 35% 25%,
      rgba(37,99,235,0.09) 0%,
      rgba(37,99,235,0.06) 30%,
      rgba(37,99,235,0.02) 55%,
      rgba(251,250,248,0) 80%
    ),
    var(--nw-bg);
}

.nw-header-inner{
  position:relative; z-index:1;
  max-width:900px;
  margin:0 auto;
}

.nw-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--nw-accent);
  margin:0 0 20px 0;
}
.nw-eyebrow-dot{
  width:7px; height:7px;
  border-radius:50%;
  background:var(--nw-accent);
  display:inline-block;
  flex-shrink:0;
}

.nw-title{
  font-family:'Playfair Display',Georgia,'Times New Roman',serif;
  font-size:clamp(34px,5.2vw,56px);
  font-weight:700;
  letter-spacing:-0.02em;
  line-height:1.1;
  color:var(--nw-ink);
  margin:0 0 22px 0;
}

.nw-subtitle{
  font-size:1rem;
  font-weight:300;
  line-height:1.75;
  color:var(--nw-muted);
  max-width:560px;
  margin:0;
}

/* ---------------- LIST SECTION ---------------- */
.nw-list{
  position:relative;
  background:var(--nw-bg);
  font-family:'Work Sans','Helvetica Neue',Arial,sans-serif;
  padding:0 24px 100px;
  box-sizing:border-box;
  width:100%;
}
.nw-list.js-full-bleed{ width:100vw !important; max-width:100vw !important; }

.nw-list-inner{
  max-width:1160px;
  margin:0 auto;
}

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

.nw-card{
  display:block;
  background:var(--nw-card);
  border:1px solid var(--nw-line);
  border-radius:16px;
  overflow:hidden;
  text-decoration:none !important;
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.nw-card:hover{
  border-color:var(--nw-accent);
  box-shadow:0 20px 40px -26px rgba(37,99,235,0.28);
  transform:translateY(-4px);
}
.nw-card.is-hidden{ display:none; }

.nw-card *{
  text-decoration:none !important;
  font-style:normal !important;
}

.nw-card-media{
  position:relative;
  aspect-ratio:16/10.5;
  overflow:hidden;
  background:#eee9e2;
}
.nw-card-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .6s cubic-bezier(.25,1,.5,1);
}
.nw-card:hover .nw-card-media img{
  transform:scale(1.06);
}

.nw-card-tag{
  position:absolute;
  top:14px; left:14px;
  padding:5px 12px;
  border-radius:999px;
  background:rgba(255,255,255,0.92);
  backdrop-filter:blur(4px);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--nw-accent) !important;
}

.nw-card-body{
  padding:22px 22px 26px;
}

.nw-card-date{
  display:block;
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.04em;
  color:var(--nw-muted) !important;
  margin-bottom:10px;
}

.nw-card-title{
  font-family:'Playfair Display',Georgia,'Times New Roman',serif;
  font-size:1.12rem;
  font-weight:700;
  line-height:1.32;
  color:var(--nw-ink) !important;
  margin:0 0 10px 0;
}

.nw-card-excerpt{
  font-size:.86rem;
  font-weight:300;
  line-height:1.6;
  color:var(--nw-muted) !important;
  margin:0 0 16px 0;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.nw-card-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.84rem;
  font-weight:600;
  color:var(--nw-accent) !important;
}
.nw-card-link svg{ transition:transform .25s ease; }
.nw-card:hover .nw-card-link svg{ transform:translateX(3px); }

.nw-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:56px;
}
.nw-page-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-width:40px;
  height:40px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid var(--nw-line);
  background:var(--nw-card);
  font-size:.86rem;
  font-weight:600;
  color:var(--nw-ink) !important;
  text-decoration:none !important;
  transition:background .25s ease, color .25s ease, border-color .25s ease;
}
.nw-page-btn:hover{
  border-color:var(--nw-accent);
  color:var(--nw-accent) !important;
}
.nw-page-btn--current{
  background:var(--nw-accent);
  border-color:var(--nw-accent);
  color:#fff !important;
  justify-content:center;
  padding:0;
}
.nw-page-next{ padding:0 18px; }

.nw-empty{
  text-align:center;
  padding:60px 20px;
  color:var(--nw-muted);
  font-size:.95rem;
}

@media (max-width:960px){
  .nw-grid{ grid-template-columns:repeat(2, 1fr); }
}
@media (max-width:640px){
  .nw-grid{ grid-template-columns:1fr; }
  .nw-header{ padding:60px 20px 48px; }
  .nw-list{ padding:0 20px 80px; }
}