
/* ==========================================
   MODURA NEWS
========================================== */

.modura-news {
	padding: 90px 24px;
	background: #f7f7f7;
}

.modura-news__container {
	width: min(100%, 1240px);
	margin-inline: auto;
}

.modura-news__header {
	max-width: 720px;
	margin-bottom: 45px;
}

.modura-news__eyebrow {
	display: block;
	margin-bottom: 10px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.modura-news__heading {
	margin: 0;
	font-size: clamp(32px, 4vw, 52px);
	line-height: 1.1;
}

.modura-news__description {
	margin-top: 16px;
	font-size: 17px;
	line-height: 1.7;
}


/* ==========================================
   STYLE 1 — EDITORIAL
========================================== */

.modura-news__editorial {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: 32px;
}

.modura-news__featured,
.modura-news__card {
	background: #fff;
	overflow: hidden;
}

.modura-news__image,
.modura-news__card-image {
	display: block;
	overflow: hidden;
}

.modura-news__image img,
.modura-news__card-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.35s ease;
}

.modura-news__featured .modura-news__image {
	aspect-ratio: 16 / 9;
}

.modura-news__card-image {
	aspect-ratio: 16 / 10;
}

.modura-news__featured:hover img,
.modura-news__card:hover img {
	transform: scale(1.04);
}

.modura-news__content {
	padding: 28px;
}

.modura-news__side {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 24px;
}

.modura-news__card-content {
	padding: 20px;
}


/* ==========================================
   STYLE 2 — CLEAN GRID
========================================== */

.modura-news__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 28px;
}


/* ==========================================
   CONTENT
========================================== */

.modura-news__category {
	margin-bottom: 10px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
}

.modura-news__category a {
	text-decoration: none;
}

.modura-news__title,
.modura-news__card-title {
	margin: 0;
	line-height: 1.3;
}

.modura-news__title {
	font-size: clamp(25px, 3vw, 38px);
}

.modura-news__card-title {
	font-size: 20px;
}

.modura-news__title a,
.modura-news__card-title a {
	color: inherit;
	text-decoration: none;
}

.modura-news__date {
	margin-top: 12px;
	font-size: 13px;
	opacity: 0.65;
}

.modura-news__excerpt {
	margin-top: 14px;
	line-height: 1.7;
	opacity: 0.8;
}


/* ==========================================
   BUTTON
========================================== */

.modura-news__footer {
	margin-top: 40px;
	text-align: center;
}

.modura-news__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 13px 24px;
	border: 1px solid currentColor;
	color: inherit;
	text-decoration: none;
	font-weight: 600;
	transition: 0.2s ease;
}

.modura-news__button:hover {
	transform: translateY(-2px);
}


/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 900px) {

	.modura-news__editorial {
		grid-template-columns: 1fr;
	}

	.modura-news__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {

	.modura-news {
		padding: 64px 20px;
	}

	.modura-news__side,
	.modura-news__grid {
		grid-template-columns: 1fr;
	}

	.modura-news__content {
		padding: 22px;
	}
}

/* News Customizer controls */
.modura-news {
	background: var(--modura-news-section-bg, #f7f7f7);
	padding-top: var(--modura-news-padding-top, 90px);
	padding-bottom: var(--modura-news-padding-bottom, 90px);
}

.modura-news .modura-news__header {
	margin-bottom: var(--modura-news-header-gap, 45px);
}

.modura-news .modura-news__eyebrow {
	color: var(--modura-news-eyebrow-color, #111827);
	font-size: var(--modura-news-eyebrow-size, 13px);
	font-weight: var(--modura-news-eyebrow-weight, 700);
	line-height: var(--modura-news-eyebrow-line-height, 1.4);
	letter-spacing: var(--modura-news-eyebrow-letter-spacing, 1.56px);
}

.modura-news .modura-news__heading {
	color: var(--modura-news-heading-color, #111827);
	font-size: var(--modura-news-heading-size, 52px);
	font-weight: var(--modura-news-heading-weight, 600);
	line-height: var(--modura-news-heading-line-height, 1.1);
	letter-spacing: var(--modura-news-heading-letter-spacing, 0px);
}

.modura-news .modura-news__description {
	color: var(--modura-news-description-color, #536077);
	font-size: var(--modura-news-description-size, 17px);
	font-weight: var(--modura-news-description-weight, 400);
	line-height: var(--modura-news-description-line-height, 1.7);
	letter-spacing: var(--modura-news-description-letter-spacing, 0px);
}

.modura-news .modura-news__editorial {
	gap: var(--modura-news-editorial-gap, 32px);
}

.modura-news .modura-news__grid {
	gap: var(--modura-news-grid-gap, 28px);
}

.modura-news .modura-news__side {
	gap: var(--modura-news-side-gap, 24px);
}

.modura-news .modura-news__featured,
.modura-news .modura-news__card {
	background: var(--modura-news-card-bg, #ffffff);
}

.modura-news .modura-news__content {
	padding: var(--modura-news-featured-padding, 28px);
}

.modura-news .modura-news__card-content {
	padding: var(--modura-news-card-padding, 20px);
}

.modura-news .modura-news__title {
	color: var(--modura-news-featured-color, #111827);
	font-size: var(--modura-news-featured-size, 38px);
	font-weight: var(--modura-news-featured-weight, 600);
	line-height: var(--modura-news-featured-line-height, 1.3);
	letter-spacing: var(--modura-news-featured-letter-spacing, 0px);
}

.modura-news .modura-news__card-title {
	color: var(--modura-news-card-color, #111827);
	font-size: var(--modura-news-card-size, 20px);
	font-weight: var(--modura-news-card-weight, 600);
	line-height: var(--modura-news-card-line-height, 1.3);
	letter-spacing: var(--modura-news-card-letter-spacing, 0px);
}

.modura-news .modura-news__category,
.modura-news .modura-news__category a {
	color: var(--modura-news-category-color, #111827);
	font-size: var(--modura-news-category-size, 12px);
	font-weight: var(--modura-news-category-weight, 700);
	line-height: var(--modura-news-category-line-height, 1.4);
	letter-spacing: var(--modura-news-category-letter-spacing, 0px);
}

.modura-news .modura-news__date {
	color: var(--modura-news-date-color, #647084);
	font-size: var(--modura-news-date-size, 13px);
	font-weight: var(--modura-news-date-weight, 400);
	line-height: var(--modura-news-date-line-height, 1.4);
	letter-spacing: var(--modura-news-date-letter-spacing, 0px);
	opacity: 1;
}

.modura-news .modura-news__excerpt {
	color: var(--modura-news-excerpt-color, #536077);
	font-size: var(--modura-news-excerpt-size, 16px);
	font-weight: var(--modura-news-excerpt-weight, 400);
	line-height: var(--modura-news-excerpt-line-height, 1.7);
	letter-spacing: var(--modura-news-excerpt-letter-spacing, 0px);
	opacity: 1;
}

.modura-news .modura-news__button {
	padding:
		var(--modura-news-button-padding-y, 13px)
		var(--modura-news-button-padding-x, 24px);
	background: var(--modura-news-button-bg, #f7f7f7);
	color: var(--modura-news-button-text, #111827);
	border-color: var(--modura-news-button-border, #111827);
	font-size: var(--modura-news-button-size, 14px);
	font-weight: var(--modura-news-button-weight, 600);
	line-height: var(--modura-news-button-line-height, 1.4);
	letter-spacing: var(--modura-news-button-letter-spacing, 0px);
}

.modura-news .modura-news__button:hover,
.modura-news .modura-news__button:focus-visible {
	background: var(--modura-news-button-hover-bg, #111827);
	color: var(--modura-news-button-hover-text, #ffffff);
}

@media (max-width: 900px) {
	.modura-news .modura-news__eyebrow {
		font-size: var(--modura-news-eyebrow-tablet-size, 13px);
	}

	.modura-news .modura-news__heading {
		font-size: var(--modura-news-heading-tablet-size, 40px);
	}

	.modura-news .modura-news__description {
		font-size: var(--modura-news-description-tablet-size, 16px);
	}

	.modura-news .modura-news__title {
		font-size: var(--modura-news-featured-tablet-size, 32px);
	}

	.modura-news .modura-news__card-title {
		font-size: var(--modura-news-card-tablet-size, 20px);
	}

	.modura-news .modura-news__category,
	.modura-news .modura-news__category a {
		font-size: var(--modura-news-category-tablet-size, 12px);
	}

	.modura-news .modura-news__date {
		font-size: var(--modura-news-date-tablet-size, 13px);
	}

	.modura-news .modura-news__excerpt {
		font-size: var(--modura-news-excerpt-tablet-size, 16px);
	}

	.modura-news .modura-news__button {
		font-size: var(--modura-news-button-tablet-size, 14px);
	}
}

@media (max-width: 600px) {
	.modura-news {
		padding-top: var(--modura-news-mobile-padding-top, 64px);
		padding-bottom: var(--modura-news-mobile-padding-bottom, 64px);
	}

	.modura-news .modura-news__eyebrow {
		font-size: var(--modura-news-eyebrow-mobile-size, 12px);
	}

	.modura-news .modura-news__heading {
		font-size: var(--modura-news-heading-mobile-size, 32px);
	}

	.modura-news .modura-news__description {
		font-size: var(--modura-news-description-mobile-size, 15px);
	}

	.modura-news .modura-news__title {
		font-size: var(--modura-news-featured-mobile-size, 25px);
	}

	.modura-news .modura-news__card-title {
		font-size: var(--modura-news-card-mobile-size, 18px);
	}

	.modura-news .modura-news__category,
	.modura-news .modura-news__category a {
		font-size: var(--modura-news-category-mobile-size, 11px);
	}

	.modura-news .modura-news__date {
		font-size: var(--modura-news-date-mobile-size, 12px);
	}

	.modura-news .modura-news__excerpt {
		font-size: var(--modura-news-excerpt-mobile-size, 15px);
	}

	.modura-news .modura-news__button {
		font-size: var(--modura-news-button-mobile-size, 14px);
	}
}