.na-pro-wrap { box-sizing: border-box; }
.na-pro-wrap * { box-sizing: border-box; }
.na-pro-wrap a { text-decoration: none; }
.na-pro-date, .na-pro-author, .na-pro-card__source { font-size: 12px; color: #666; margin-right: 10px; }
.na-pro-card__source { font-weight: 600; text-transform: uppercase; color: #2271b1; }

/* Cards */
.na-pro-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 20px;
}
.na-pro-card {
	border: 1px solid #e2e2e2;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	display: flex;
	flex-direction: column;
}
.na-pro-card__image {
	display: block;
	height: 160px;
	background-size: cover;
	background-position: center;
	background-color: #f0f0f0;
}
.na-pro-card__body { padding: 14px 16px; }
.na-pro-card__title { margin: 0 0 8px; font-size: 17px; line-height: 1.3; }
.na-pro-card__title a { color: #1d2327; }
.na-pro-card__excerpt { font-size: 14px; color: #444; margin: 0 0 10px; }
.na-pro-card__readmore, .na-pro-list__readmore, .na-pro-grid__readmore {
	display: inline-block;
	margin-top: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #2271b1;
}
.na-pro-card__readmore:hover, .na-pro-list__readmore:hover, .na-pro-grid__readmore:hover { text-decoration: underline; }
.na-pro-grid__readmore { display: block; }

/* List */
.na-pro-list { list-style: none; margin: 0; padding: 0; }
.na-pro-list__item { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid #eee; }
.na-pro-list__image img { width: 110px; height: 78px; object-fit: cover; border-radius: 4px; }
.na-pro-list__title { margin: 0 0 6px; font-size: 16px; }
.na-pro-list__title a { color: #1d2327; }
.na-pro-list__excerpt { font-size: 13px; color: #555; margin: 0 0 6px; }

/* Grid */
.na-pro-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 14px;
}
.na-pro-grid__image { display: block; height: 110px; background-size: cover; background-position: center; border-radius: 6px; background-color: #f0f0f0; }
.na-pro-grid__title { font-size: 14px; margin: 8px 0 4px; }
.na-pro-grid__title a { color: #1d2327; }

/* Slider */
.na-pro-slider { position: relative; overflow: hidden; border-radius: 8px; }
.na-pro-slider__track { display: flex; transition: transform .4s ease; }
.na-pro-slider__slide { min-width: 100%; position: relative; }
.na-pro-slider__image { display: block; height: 360px; background-size: cover; background-position: center; }
.na-pro-slider__caption { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,.75)); color: #fff; padding: 30px 20px 16px; }
.na-pro-slider__caption h3 { margin: 0 0 6px; font-size: 20px; }
.na-pro-slider__caption a { color: #fff; }
.na-pro-slider__caption .na-pro-date { color: #ddd; }
.na-pro-slider__prev, .na-pro-slider__next {
	position: absolute; top: 50%; transform: translateY(-50%);
	background: rgba(0,0,0,.5); color: #fff; border: 0; width: 36px; height: 36px;
	border-radius: 50%; cursor: pointer; font-size: 20px; line-height: 1;
}
.na-pro-slider__prev { left: 12px; }
.na-pro-slider__next { right: 12px; }

/* Ticker */
.na-pro-ticker { display: flex; align-items: center; background: #1d2327; color: #fff; border-radius: 4px; overflow: hidden; }
.na-pro-ticker__label { background: #b32d2e; padding: 8px 14px; font-size: 12px; font-weight: 700; text-transform: uppercase; white-space: nowrap; }
.na-pro-ticker__viewport { overflow: hidden; flex: 1; }
.na-pro-ticker__track { list-style: none; display: flex; margin: 0; padding: 0; white-space: nowrap; will-change: transform; }
.na-pro-ticker__track li { padding: 8px 30px 8px 0; }
.na-pro-ticker__track a { color: #fff; font-size: 14px; }
.na-pro-ticker__track em { color: #aaa; font-style: normal; font-size: 12px; }

.na-pro-empty { color: #666; font-style: italic; }

@media (max-width: 480px) {
	.na-pro-cards, .na-pro-grid { grid-template-columns: 1fr 1fr; }
	.na-pro-slider__image { height: 220px; }
}