.nw-hero { position: relative; min-height: 380px; display: flex; align-items: center; overflow: hidden; }
.nw-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nw-hero-shade { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.nw-hero .tb-container { position: relative; }
.nw-hero h1 { font-size: clamp(36px,5vw,60px); line-height: 1; font-weight: 700; color: #fff; }

.nw-featured { padding: 70px 0 40px; }
.nw-featured-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%,420px),1fr)); gap: 39px; }
.nw-fcard { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.08); padding: 4px; transition: box-shadow .3s; }
.nw-fcard:hover, .nw-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.12); }
.nw-fcard-media { position: relative; display: block; border-radius: 16px; overflow: hidden; }
.nw-fcard-img { width: 100%; height: 280px; display: block; transition: transform .3s; object-fit: cover; }
.nw-fcard-img:hover, .nw-card-img:hover { transform: scale(1.05); }
.nw-date { position: absolute; top: 12px; left: 12px; background: rgba(255,255,255,.95); padding: 6px 12px; border-radius: 4px; font-size: 14px; font-weight: 500; color: var(--accent); box-shadow: 0 2px 6px rgba(0,0,0,.1); }
.nw-fcard-body { padding: 20px; }
.nw-fcard-body h3 { margin: 0 0 12px; }
.nw-fcard-body h3 a { color: #000; font-size: 22px; line-height: 1.3; font-weight: 700; }
.nw-fcard-body h3 a:hover, .nw-card h3 a:hover { color: var(--primary); }
.nw-author { display: flex; align-items: center; gap: 10px; padding-top: 12px; }
.nw-author img { width: 48px; height: 48px; border-radius: 50%; background: var(--accent-tint); }
.nw-author div { display: flex; flex-direction: column; gap: 2px; }
.nw-author .name { font-size: 16px; font-weight: 500; color: #202939; }
.nw-author .meta { font-size: 16px; color: var(--muted); }

.nw-list { padding: 30px 0 70px; }
.nw-list .tb-container { display: flex; flex-direction: column; gap: 30px; }
.nw-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; flex-wrap: wrap; }
.nw-head h2 { font-size: clamp(28px,3vw,35px); font-weight: 700; color: var(--text); }
.nw-search { background: var(--primary); border-radius: 34px; padding: 6px 7px; width: 413px; max-width: 100%; display: flex; gap: 6px; }
.nw-search input { flex: 1; min-width: 0; height: 38px; border: 1px solid var(--input-border); border-radius: 30px; background: #FEFDFE; padding: 0 16px; font: inherit; font-size: 15px; outline: 0; }
.nw-search span { width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; color: #fff; }

.nw-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.nw-chip { white-space: nowrap; height: 38px; padding: 0 16px; border-radius: 999px; border: 1px solid rgba(11,111,232,.35); background: #fff; color: var(--primary); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.nw-chip.is-on { border-color: var(--primary); background: var(--primary); color: #fff; }

.nw-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%,300px),1fr)); gap: 30px; }
.nw-card { background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.08); padding: 20px; display: flex; flex-direction: column; gap: 16px; transition: box-shadow .3s; }
.nw-card-media { display: block; border-radius: 12px; overflow: hidden; aspect-ratio: 300/180; background: var(--page-alt); }
.nw-card-img { width: 100%; height: 100%; display: block; transition: transform .3s; object-fit: cover; }
.nw-tag { align-self: flex-start; font-size: 12px; font-weight: 600; color: var(--accent-text); background: var(--accent-tint); border-radius: 4px; padding: 4px 8px; }
.nw-card h3 a { color: #000; font-size: 17px; line-height: 1.4; font-weight: 700; text-transform: uppercase; }

.nw-empty { text-align: center; font-size: 16px; color: #999; padding: 40px 0; }
.nw-pages { display: flex; justify-content: center; gap: 8px; align-items: center; }
.nw-page { white-space: nowrap; min-width: 40px; height: 40px; border-radius: 8px; border: 1px solid var(--primary); background: #fff; color: var(--primary); font: inherit; font-weight: 600; cursor: pointer; }
.nw-page.is-on { background: var(--primary); color: #fff; }
a.nw-chip, a.nw-page { display: inline-flex; align-items: center; justify-content: center; }
.nw-page-gap { color: var(--primary); font-weight: 600; padding: 0 4px; }