/*!
 * CNC Notícias Pro — Frontend
 * (c) S2 Tecnologia
 */

/* Base */
.cnp { --cnp-radius: 8px; --cnp-bg: transparent; --cnp-text: inherit; }
.cnp * { box-sizing: border-box; }
.cnp a { text-decoration: none; color: inherit; }
.cnp img { max-width: 100%; height: auto; display: block; }

/* Card base */
.cnp-card {
	display: flex;
	flex-direction: column;
	background: var(--cnp-bg);
	color: var(--cnp-text);
	border-radius: var(--cnp-radius);
	overflow: hidden;
	height: 100%;
	position: relative;
	transition: transform .25s ease, box-shadow .25s ease;
}
.cnp-card--equal { height: 100%; }

/* Aparências (Posts-nativo style) */
.cnp-card--classic  { background: transparent; }
.cnp-card--minimal  { background: transparent; }
.cnp-card--minimal .cnp-thumb { border-radius: 8px; }
.cnp-card--cards {
	background: #fff;
	box-shadow: 0 4px 14px rgba(15, 23, 42, .08);
	border-radius: 10px;
}
.cnp-card--cards:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(15, 23, 42, .14); }
.cnp-card--cards .cnp-content { padding: 20px; }

/* Filtros front-end */
.cnp-filters {
	display: flex; flex-wrap: wrap; gap: 8px;
	margin: 0 0 20px;
}
.cnp-filters .cnp-filter {
	border: 1px solid rgba(0,0,0,.12);
	background: transparent;
	color: inherit;
	padding: 8px 16px;
	border-radius: 999px;
	cursor: pointer;
	font: inherit;
	line-height: 1.2;
	transition: background .2s, color .2s, border-color .2s;
}
.cnp-filters .cnp-filter:hover { border-color: #0b3d91; color: #0b3d91; }
.cnp-filters .cnp-filter.is-active { background: #0b3d91; color: #fff; border-color: #0b3d91; }
.cnp-filters--tabs { gap: 0; border-bottom: 1px solid rgba(0,0,0,.1); }
.cnp-filters--tabs .cnp-filter { border: 0; border-bottom: 2px solid transparent; border-radius: 0; padding: 12px 16px; }
.cnp-filters--tabs .cnp-filter.is-active { background: transparent; color: #0b3d91; border-bottom-color: #0b3d91; }
.cnp-filters--dropdown .cnp-filter-select {
	padding: 10px 14px; border-radius: 6px; border: 1px solid rgba(0,0,0,.15); background: #fff; color: inherit;
}
.cnp-card.is-hidden { display: none !important; }

.cnp-content { padding: 16px; flex: 1 1 auto; display: flex; flex-direction: column; gap: 8px; }

/* Image positions */
.cnp-card--img-left,
.cnp-card--img-right { flex-direction: row; align-items: stretch; }
.cnp-card--img-left .cnp-thumb,
.cnp-card--img-right .cnp-thumb { flex: 0 0 40%; max-width: 40%; }
.cnp-card--img-right { flex-direction: row-reverse; }
.cnp-card--img-bottom { flex-direction: column-reverse; }

/* Thumbnails */
.cnp-thumb { position: relative; overflow: hidden; }
.cnp-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease, filter .35s ease, opacity .35s ease; }
.cnp-thumb::after {
	content: ""; position: absolute; inset: 0; background: transparent; opacity: 0; transition: opacity .35s ease; pointer-events: none;
}

/* Aspect ratios */
.cnp-ratio-1-1   { aspect-ratio: 1 / 1; }
.cnp-ratio-4-3   { aspect-ratio: 4 / 3; }
.cnp-ratio-3-2   { aspect-ratio: 3 / 2; }
.cnp-ratio-16-9  { aspect-ratio: 16 / 9; }
.cnp-ratio-21-9  { aspect-ratio: 21 / 9; }

/* Image hover effects */
.cnp-card:hover .cnp-hover-zoom img      { transform: scale(1.06); }
.cnp-card:hover .cnp-hover-fade img      { opacity: .85; }
.cnp-card:hover .cnp-hover-grayscale img { filter: grayscale(0); }
.cnp-hover-grayscale img                 { filter: grayscale(1); }
.cnp-card:hover .cnp-hover-blur img      { filter: blur(2px); }

/* Badge */
.cnp-badge {
	position: absolute; top: 12px; left: 12px;
	z-index: 2;
	display: inline-block;
	font-size: 12px; line-height: 1;
	background: #0b3d91; color: #fff;
	padding: 4px 10px; border-radius: 4px;
}
.cnp-badge-pos--top-right .cnp-badge    { left: auto; right: 12px; }
.cnp-badge-pos--bottom-left .cnp-badge  { top: auto; bottom: 12px; }
.cnp-badge-pos--bottom-right .cnp-badge { top: auto; bottom: 12px; left: auto; right: 12px; }

/* Title / excerpt / meta */
.cnp-title { margin: 0; font-size: 18px; line-height: 1.3; font-weight: 600; }
.cnp-excerpt { margin: 0; font-size: 14px; line-height: 1.5; opacity: .85; }
.cnp-meta {
	display: flex; flex-wrap: wrap; align-items: center;
	gap: 6px;
	font-size: 12px; line-height: 1.4; opacity: .8;
}
.cnp-meta-sep { opacity: .5; }
.cnp-avatar { border-radius: 50%; vertical-align: middle; margin-right: 6px; }

/* Read more */
.cnp-readmore {
	display: inline-flex; align-items: center; gap: 8px;
	margin-top: 8px;
	padding: 10px 18px;
	background: #0b3d91; color: #fff;
	border-radius: 4px;
	transition: background .2s, color .2s, transform .2s;
	align-self: flex-start;
}
.cnp-readmore svg, .cnp-readmore i { font-size: 0.85em; }

/* Grid */
.cnp-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

/* List */
.cnp-list { display: flex; flex-direction: column; gap: 16px; }
.cnp-list .cnp-card { flex-direction: row; }
.cnp-list--img-right .cnp-card { flex-direction: row-reverse; }
.cnp-list .cnp-thumb { flex: 0 0 35%; max-width: 35%; }

/* Carousel */
.cnp-skin-carousel .cnp-swiper { position: relative; }
.cnp-skin-carousel .swiper-slide { height: auto; }
.cnp-skin-carousel .swiper-button-prev,
.cnp-skin-carousel .swiper-button-next {
	color: #fff; background: rgba(0,0,0,.5); border-radius: 50%;
	width: 40px; height: 40px; padding: 14px; border: 0; cursor: pointer;
}
.cnp-skin-carousel .swiper-button-prev::after,
.cnp-skin-carousel .swiper-button-next::after { font-size: 14px; }
.cnp-skin-carousel .swiper-pagination { position: relative; margin-top: 16px; bottom: auto; }

/* Masonry (CSS columns fallback; JS upgrade opcional) */
.cnp-masonry { display: block; column-count: 3; column-gap: 24px; }
.cnp-masonry .cnp-card { display: inline-block; width: 100%; margin: 0 0 24px; break-inside: avoid; }

/* Featured */
.cnp-featured { display: grid; gap: 24px; grid-template-columns: 1.3fr 1fr; align-items: stretch; }
.cnp-featured--right .cnp-featured { grid-template-columns: 1fr 1.3fr; }
.cnp-featured--right .cnp-featured__hero { order: 2; }
.cnp-featured--top .cnp-featured { grid-template-columns: 1fr; }
.cnp-featured__hero .cnp-card { height: 100%; }
.cnp-featured__hero .cnp-thumb { height: 100%; min-height: 260px; }
.cnp-featured__list { display: flex; flex-direction: column; gap: 16px; }
.cnp-featured__list .cnp-card { flex-direction: row; }
.cnp-featured__list .cnp-thumb { flex: 0 0 38%; max-width: 38%; }

/* Cards overlay */
.cnp-overlay .cnp-card--overlay { position: relative; min-height: 280px; color: #fff; overflow: hidden; }
.cnp-overlay .cnp-card--overlay .cnp-thumb { position: absolute; inset: 0; }
.cnp-overlay .cnp-card--overlay .cnp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cnp-overlay .cnp-card--overlay .cnp-thumb::after { background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.75) 100%); opacity: 1; }
.cnp-overlay .cnp-content--overlay { position: relative; z-index: 1; margin-top: auto; padding: 20px; }
.cnp-overlay .cnp-card--overlay .cnp-title { color: #fff; }
.cnp-overlay .cnp-card__link { position: absolute; inset: 0; z-index: 2; }

/* Timeline */
.cnp-timeline { position: relative; display: flex; flex-direction: column; gap: 24px; padding: 16px 0; }
.cnp-timeline::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 2px; background: rgba(0,0,0,.1); transform: translateX(-50%); }
.cnp-timeline__item { position: relative; width: 50%; padding: 0 24px; }
.cnp-timeline__item--left  { align-self: flex-start; }
.cnp-timeline__item--right { align-self: flex-end; }
.cnp-timeline__marker {
	position: absolute; top: 16px; width: 14px; height: 14px;
	border-radius: 50%; background: #0b3d91; border: 3px solid #fff;
}
.cnp-timeline__item--left  .cnp-timeline__marker { right: -8px; }
.cnp-timeline__item--right .cnp-timeline__marker { left: -8px; }

/* Ticker */
.cnp-skin-ticker { overflow: hidden; }
.cnp-ticker { width: 100%; overflow: hidden; }
.cnp-ticker__track {
	display: inline-flex; gap: 32px;
	white-space: nowrap;
	animation: cnp-marquee var(--cnp-ticker-speed, 30s) linear infinite;
	animation-direction: var(--cnp-ticker-dir, normal);
}
.cnp-ticker__item { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; }
.cnp-ticker__item .cnp-badge { position: static; }
.cnp-ticker__title { white-space: nowrap; }
.cnp-ticker--pause-hover:hover .cnp-ticker__track { animation-play-state: paused; }

@keyframes cnp-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

/* Pagination */
.cnp-pagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 24px; }
.cnp-pagination a, .cnp-pagination span {
	display: inline-block; padding: 8px 12px; border-radius: 4px;
	background: #f3f4f6; color: #111;
}
.cnp-pagination .current { background: #0b3d91; color: #fff; }
.cnp-load-more {
	display: inline-flex; align-items: center; justify-content: center;
	margin: 24px auto 0; padding: 12px 22px;
	background: #0b3d91; color: #fff; border: 0; border-radius: 4px; cursor: pointer;
}
.cnp-load-more[disabled] { opacity: .6; cursor: not-allowed; }
.cnp-status { text-align: center; margin-top: 16px; opacity: .8; }
.cnp-empty { text-align: center; padding: 24px; opacity: .8; }

/* Responsivo */
@media (max-width: 1024px) {
	.cnp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.cnp-masonry { column-count: 2; }
	.cnp-featured { grid-template-columns: 1fr; }
	.cnp-featured--right .cnp-featured__hero { order: 0; }
}
@media (max-width: 640px) {
	.cnp-grid { grid-template-columns: 1fr; }
	.cnp-masonry { column-count: 1; }
	.cnp-list .cnp-card,
	.cnp-list--img-right .cnp-card { flex-direction: column; }
	.cnp-list .cnp-thumb { max-width: 100%; flex-basis: auto; }
	.cnp-timeline::before { left: 12px; }
	.cnp-timeline__item { width: 100%; padding-left: 32px; align-self: flex-start; }
	.cnp-timeline__item--left .cnp-timeline__marker,
	.cnp-timeline__item--right .cnp-timeline__marker { left: 4px; right: auto; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
	.cnp-card, .cnp-thumb img, .cnp-readmore { transition: none !important; }
	.cnp-ticker__track { animation: none !important; }
}