/* G01: justified long-form content; Elementor controls can override this default. */
.fdsh-tinq-lalla__body,
.fdsh-tinq-lalla__closing {
	text-align: justify;
	text-justify: inter-word;
}

.fdsh-tinq-lalla {
	--fdsh-tinq-lalla-object-x: 50%;
	--fdsh-tinq-lalla-object-y: 50%;
	width: 100%;
	background: #f7f4ee;
	color: #303030;
}

.fdsh-tinq-lalla__inner {
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 72px 32px;
}

.fdsh-tinq-lalla__row {
	display: flex;
	align-items: stretch;
	gap: 34px;
	width: 100%;
}

.fdsh-tinq-lalla__main,
.fdsh-tinq-lalla__media-wrap,
.fdsh-tinq-lalla__metric {
	min-width: 0;
}

.fdsh-tinq-lalla__main {
	flex: 0 1 46%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.fdsh-tinq-lalla__media-wrap {
	flex: 0 1 34%;
	display: flex;
	align-items: stretch;
}

.fdsh-tinq-lalla__media {
	width: 100%;
	height: 560px;
	overflow: hidden;
	background: #e5e0d5;
}

.fdsh-tinq-lalla__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: var(--fdsh-tinq-lalla-object-x) var(--fdsh-tinq-lalla-object-y);
}

.fdsh-tinq-lalla__metric {
	flex: 0 1 20%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 28px;
	background: #e8e2d5;
}

.fdsh-tinq-lalla__chapter {
	margin: 0 0 18px;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.2;
	color: #b6a700;
}

.fdsh-tinq-lalla__chapter span {
	display: inline-flex;
	align-items: center;
	gap: 14px;
}

.fdsh-tinq-lalla__chapter span::after {
	content: "";
	display: block;
	width: 40px;
	height: 1px;
	background: currentColor;
}

.fdsh-tinq-lalla__title {
	margin: 0 0 8px;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 48px;
	font-weight: 600;
	line-height: 1.08;
	color: #303030;
}

.fdsh-tinq-lalla__subtitle {
	margin: 0 0 22px;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 22px;
	font-weight: 400;
	line-height: 1.3;
	color: #6b625f;
}

.fdsh-tinq-lalla__body {
	margin: 0;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.6;
	color: #303030;
}

.fdsh-tinq-lalla__closing {
	margin: 24px 0 0;
	padding-top: 20px;
	border-top: 1px solid rgba(182, 167, 0, .55);
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 18px;
	font-weight: 500;
	line-height: 1.45;
	color: #303030;
}

.fdsh-tinq-lalla__metric-number {
	margin: 0 0 8px;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 44px;
	font-weight: 600;
	line-height: 1;
	color: #303030;
}

.fdsh-tinq-lalla__metric-label {
	margin: 0;
	font-family: "Myriad Pro", Arial, sans-serif;
	font-size: 18px;
	font-weight: 400;
	line-height: 1.25;
	color: #6b625f;
}

.fdsh-tinq-lalla__metric-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	margin: 0 0 18px;
	font-size: 34px;
	line-height: 1;
	color: #b6a700;
}

.fdsh-tinq-lalla__metric-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.fdsh-tinq-lalla__metric-image {
	margin: 0 0 18px;
}

.fdsh-tinq-lalla__metric-image img {
	display: block;
	width: 54px;
	height: auto;
	max-width: 100%;
}

[dir="rtl"] .fdsh-tinq-lalla__chapter span::after {
	order: -1;
}

@media (max-width: 1024px) {
	.fdsh-tinq-lalla__inner {
		padding: 54px 24px;
	}

	.fdsh-tinq-lalla__row {
		flex-wrap: wrap;
		gap: 26px;
	}

	.fdsh-tinq-lalla__main {
		flex-basis: 50%;
	}

	.fdsh-tinq-lalla__media-wrap {
		flex-basis: 44%;
	}

	.fdsh-tinq-lalla__metric {
		flex-basis: 100%;
	}

	.fdsh-tinq-lalla__media {
		height: 500px;
	}
}

@media (max-width: 767px) {
	.fdsh-tinq-lalla__inner {
		padding: 40px 18px;
	}

	.fdsh-tinq-lalla__row {
		flex-direction: column;
		gap: 22px;
	}

	.fdsh-tinq-lalla__main,
	.fdsh-tinq-lalla__media-wrap,
	.fdsh-tinq-lalla__metric {
		flex-basis: 100%;
		width: 100%;
	}

	.fdsh-tinq-lalla__title {
		font-size: 36px;
	}

	.fdsh-tinq-lalla__media {
		height: 320px;
	}
}


/* v0.1.11 — make the ecological ally and nursery metric more prominent. */
.fdsh-tinq-lalla__inner { padding-top: 76px; padding-bottom: 76px; }
.fdsh-tinq-lalla__body { font-size: 17px; line-height: 1.6; }
.fdsh-tinq-lalla__media { height: 590px; }
.fdsh-tinq-lalla__metric { padding: 34px; background: #e4dccb; }
.fdsh-tinq-lalla__metric-number { font-size: 50px; }

/* v0.1.14 — side metrics are compact editorial cards, not stretched columns. */
.fdsh-tinq-lalla__metric {
	align-self: center;
	height: auto;
	min-height: 220px;
}
@media (max-width: 1024px) {
	.fdsh-tinq-lalla__metric { min-height: 170px; }
}
@media (max-width: 767px) {
	.fdsh-tinq-lalla__metric { min-height: 0; }
}


/* v0.1.15 — compact metric overlaps the image, while the image fills the remaining width. */
.fdsh-tinq-lalla {
	--fdsh-tinq-overlay-width: 240px;
	--fdsh-tinq-overlay-right: 0px;
}
.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap {
	position: relative;
	flex: 0 1 54%;
}
.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__metric {
	position: absolute;
	top: 50%;
	right: var(--fdsh-tinq-overlay-right);
	transform: translateY(-50%);
	z-index: 2;
	width: min(var(--fdsh-tinq-overlay-width), 48%);
	max-width: 100%;
	min-height: 0;
	height: auto;
	align-self: auto;
	box-shadow: 0 18px 40px rgba(0,0,0,.12);
}
.fdsh-tinq-lalla--metric-overlay-anchor-top .fdsh-tinq-lalla__metric { top: 28px; bottom: auto; transform: none; }
.fdsh-tinq-lalla--metric-overlay-anchor-center .fdsh-tinq-lalla__metric { top: 50%; bottom: auto; transform: translateY(-50%); }
.fdsh-tinq-lalla--metric-overlay-anchor-bottom .fdsh-tinq-lalla__metric { top: auto; bottom: 28px; transform: none; }
@media (max-width: 1024px) {
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__metric {
		position: static;
		width: 100%;
		transform: none;
		box-shadow: none;
	}
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap { flex-basis: 44%; }
}
@media (max-width: 767px) {
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__metric { width: 100%; }
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap { flex-basis: 100%; }
}


/* v0.1.16 — functional metric placement controls + truly adjustable media width. */
.fdsh-tinq-lalla {
	--fdsh-tinq-lalla-media-width: 54%;
	--fdsh-tinq-overlay-edge: 28px;
}
.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap {
	flex: 0 1 var(--fdsh-tinq-lalla-media-width);
	max-width: var(--fdsh-tinq-lalla-media-width);
}
.fdsh-tinq-lalla--metric-overlay-anchor-top .fdsh-tinq-lalla__metric {
	top: var(--fdsh-tinq-overlay-edge);
	bottom: auto;
	transform: none;
}
.fdsh-tinq-lalla--metric-overlay-anchor-center .fdsh-tinq-lalla__metric {
	top: 50%;
	bottom: auto;
	transform: translateY(-50%);
}
.fdsh-tinq-lalla--metric-overlay-anchor-bottom .fdsh-tinq-lalla__metric {
	top: auto;
	bottom: var(--fdsh-tinq-overlay-edge);
	transform: none;
}
@media (max-width: 1024px) {
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap {
		max-width: none;
	}
}
@media (max-width: 767px) {
	.fdsh-tinq-lalla--metric-overlay .fdsh-tinq-lalla__media-wrap {
		max-width: 100%;
	}
}


/* v0.1.17 — vertical offset works for Top, Center and Bottom. */
.fdsh-tinq-lalla { --fdsh-tinq-overlay-vertical-offset: 0px; }
.fdsh-tinq-lalla--metric-overlay-anchor-top .fdsh-tinq-lalla__metric {
	top: calc(var(--fdsh-tinq-overlay-edge, 28px) + var(--fdsh-tinq-overlay-vertical-offset, 0px));
	bottom: auto;
	transform: none;
}
.fdsh-tinq-lalla--metric-overlay-anchor-center .fdsh-tinq-lalla__metric {
	top: calc(50% + var(--fdsh-tinq-overlay-vertical-offset, 0px));
	bottom: auto;
	transform: translateY(-50%);
}
.fdsh-tinq-lalla--metric-overlay-anchor-bottom .fdsh-tinq-lalla__metric {
	top: auto;
	bottom: calc(var(--fdsh-tinq-overlay-edge, 28px) - var(--fdsh-tinq-overlay-vertical-offset, 0px));
	transform: none;
}
