/* Carousel */
.carousel-container {
	position: relative;
	overflow: hidden;
	border: 4px solid #1e1e1e;
	box-shadow: 12px 12px 0px #ff7043;
}

.carousel-track { display: flex; transition: transform 0.5s cubic-bezier(0.68,-0.55,0.265,1.55); }

.carousel-slide { min-width: 100%; max-width: 100%; position: relative; overflow: hidden; box-sizing: border-box; }
.carousel-slide:nth-child(odd)  { background: #ff7043; color: #1e1e1e; }
.carousel-slide:nth-child(even) { background: #7e57c2; color: #ffffff; }

.carousel-content {
	padding: 4rem;
	padding-left: 5rem;  /* extra left breathing room for prev arrow */
	padding-right: 5rem; /* extra right breathing room for next arrow */
	min-height: 500px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* prevent content from leaking outside the slide */
	overflow: hidden;
	box-sizing: border-box;
	width: 100%;
}

/* Truncate long titles with ellipsis */
.carousel-content h3 {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: 100%;
}

.carousel-nav {
	position: absolute;
	bottom: 2rem; left: 50%;
	transform: translateX(-50%);
	display: flex; gap: 1rem;
	z-index: 10;
}

.carousel-dot {
	width: 16px; height: 16px;
	border: 3px solid #1e1e1e;
	background: transparent;
	cursor: pointer;
	transition: all 0.3s;
}

.carousel-dot.active { background: #1e1e1e; transform: scale(1.3); }

.carousel-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: #ffffff;
	border: 3px solid #1e1e1e;
	width: 60px; height: 60px;
	display: flex; align-items: center; justify-content: center;
	/* Use a system font stack that reliably renders arrow glyphs */
	font-family: 'Space Mono', monospace, sans-serif;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	transition: all 0.2s;
	z-index: 20;
	/* Prevent the arrow from being clipped by the container */
	pointer-events: auto;
	user-select: none;
}

.carousel-arrow:hover { background: #ff7043; transform: translateY(-50%) scale(1.1); }
.carousel-arrow.prev { left: 1rem; }
.carousel-arrow.next { right: 1rem; }

/* News Grid */
.news-grid { display: grid; grid-template-columns: repeat(1,1fr); gap: 2rem; }
@media (min-width: 768px)  { .news-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .news-grid { grid-template-columns: repeat(4,1fr); } }

.news-card {
	background: #ffffff;
	color: #1e1e1e;
	border: 3px solid #1e1e1e;
	box-shadow: 6px 6px 0px #7e57c2;
	transition: all 0.3s cubic-bezier(0.68,-0.55,0.265,1.55);
	position: relative;
	overflow: hidden;
	display: flex; flex-direction: column;
}

.news-card:hover { transform: translate(-6px,-6px); box-shadow: 12px 12px 0px #ff7043; }
.news-card:nth-child(4n+1) { box-shadow: 6px 6px 0px #ff7043; }
.news-card:nth-child(4n+1):hover { box-shadow: 12px 12px 0px #7e57c2; }
.news-card:nth-child(4n+2) { box-shadow: 6px 6px 0px #1e1e1e; }
.news-card:nth-child(4n+2):hover { box-shadow: 12px 12px 0px #ff7043; }
.news-card:nth-child(4n+3) { box-shadow: 6px 6px 0px #7e57c2; }
.news-card:nth-child(4n+3):hover { box-shadow: 12px 12px 0px #1e1e1e; }

.news-image {
	height: 160px;
	background: linear-gradient(135deg, #ff7043 0%, #7e57c2 100%);
	position: relative;
	overflow: hidden;
}

.news-image::after {
	content: '';
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(0,0,0,0.1) 10px, rgba(0,0,0,0.1) 20px);
}

.news-content { padding: 1.5rem; flex-grow: 1; display: flex; flex-direction: column; }

.news-tag {
	display: inline-block;
	background: #1e1e1e;
	color: #ffffff;
	padding: 4px 12px;
	font-size: 0.65rem;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin-bottom: 0.75rem;
	align-self: flex-start;
}

.news-card:nth-child(4n+1) .news-tag { background: #ff7043; color: #1e1e1e; }
.news-card:nth-child(4n+2) .news-tag { background: #7e57c2; }
.news-card:nth-child(4n+3) .news-tag { background: #1e1e1e; }
.news-card:nth-child(4n+4) .news-tag { background: #ffffff; color: #1e1e1e; border: 2px solid #1e1e1e; }

.news-title { font-family: 'Archivo Black', sans-serif; font-size: 1.25rem; line-height: 1.2; margin-bottom: 0.75rem; text-transform: uppercase; }
.news-excerpt { font-size: 0.8rem; line-height: 1.5; opacity: 0.8; flex-grow: 1; }
.news-date { font-size: 0.7rem; font-weight: bold; margin-top: 1rem; padding-top: 1rem; border-top: 2px solid #1e1e1e; opacity: 0.6; }
/* Blog feed additions */
/* Ensure carousel slides with bg images don't show raw colour underneath */
.carousel-slide[style*="background-image"] {
    background-color: transparent;
}

/* News card — full card is clickable */
.news-card[style*="cursor"] {
    cursor: pointer;
}

/* News card image from blog post */
.news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}