/* 04 Tűzivíztározó (/tuzitarozo/): szekció elrendezés. A részek stílusa a pages/content.css-ben (.tf-lp-). */

/* ---------- Hero ---------- */
.tf-tuziviz-hero {
	--tf-hero-min-m: 440px;
}

/* ---------- Bevezető ---------- */
.tf-tuziviz-intro {
	margin-top: 36px;
}

/* ---------- Szabályok: infografika + kulcsszámok + lenyitható összefoglaló ---------- */
.tf-tuziviz-rules {
	display: grid;
	gap: 28px;
	margin-top: 36px;
}

.tf-tuziviz-rules__more {
	grid-column: 1 / -1;
}

.tf-tuziviz-rules__title {
	margin-bottom: 14px;
	font-size: clamp(1.75rem, 1.3rem + 1.9vw, 2.75rem);
	line-height: 1.2;
}

.tf-tuziviz-rules__eyebrow {
	margin-bottom: 10px;
}

/* ---------- Fóliák tározókhoz ---------- */
.tf-tuziviz-liners {
	margin-top: 36px;
}

.tf-tuziviz-liners__title {
	margin-bottom: 22px;
	font-size: clamp(1.75rem, 1.3rem + 1.9vw, 2.75rem);
	line-height: 1.2;
}

.tf-tuziviz-liners__notes {
	display: grid;
	gap: 10px;
	max-width: 860px;
	margin-top: 20px;
	color: var(--c-text-2);
	font-size: var(--fs-sm);
	line-height: 1.6;
}

.tf-tuziviz-liners__notes a {
	color: var(--c-blue-strong);
	font-weight: 600;
}

/* ---------- Árgarancia + figyelmeztetés ---------- */
.tf-tuziviz-trust {
	display: grid;
	gap: 11px;
	margin-top: 32px;
}

.tf-tuziviz-guarantee {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 220px;
	padding: 30px 22px;
	overflow: hidden;
	border-radius: var(--r-xl);
	background: var(--c-blue-strong);
	color: #fff;
	isolation: isolate;
}

.tf-tuziviz-guarantee__img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Kék duotone a fotón, mint a designban. */
.tf-tuziviz-guarantee::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background: rgba(24, 134, 196, 0.8);
}

.tf-tuziviz-guarantee__title {
	color: #fff;
	font-size: clamp(2rem, 1.7rem + 1vw, 2.375rem);
	line-height: 1.2;
}

.tf-tuziviz-guarantee__text {
	margin-top: 8px;
	color: rgba(255, 255, 255, 0.95);
	font-size: var(--fs-body);
	line-height: 1.5;
}

.tf-tuziviz-warning {
	padding: 26px 22px 28px;
	border-radius: var(--r-xl);
	background: #fff4e0;
	color: #5a3d0c;
}

.tf-tuziviz-warning__title {
	color: #5a3d0c;
	font-size: clamp(1.375rem, 1.25rem + 0.4vw, 1.625rem);
	font-weight: 700;
	line-height: 1.25;
}

.tf-tuziviz-warning__text {
	margin-top: 6px;
	font-size: var(--fs-body);
	line-height: 1.55;
}

/* ---------- Referenciák (ha vannak) ---------- */
.tf-tuziviz-refs {
	margin-top: 48px;
}

.tf-tuziviz-refs__title {
	margin-bottom: 22px;
	font-size: clamp(1.75rem, 1.3rem + 1.9vw, 2.75rem);
}

.tf-tuziviz-refs__list {
	display: grid;
	gap: 24px;
}

.tf-tuziviz-refs__name {
	margin-top: 12px;
	color: var(--c-navy);
	font-family: var(--f-head);
	font-size: var(--fs-card);
	font-weight: 600;
}

.tf-tuziviz-refs__meta {
	color: var(--c-muted);
	font-size: var(--fs-xs);
}

/* ---------- Ajánlatkérés sáv ---------- */
.tf-tuziviz-quote {
	margin-top: 40px;
	padding-block: 40px;
	background: var(--c-sky-100);
	scroll-margin-top: var(--header-h);
}

.tf-tuziviz-quote__card {
	max-width: 1040px;
	margin-inline: auto;
}

/* A design szerint a CTA sáv közvetlenül az ajánlatkérő sáv alatt indul. */
.tf-page-tuziviz .tf-cta-wrap {
	padding-top: 2px;
}

@media (min-width: 640px) {
	.tf-tuziviz-refs__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (min-width: 960px) {
	.tf-tuziviz-intro {
		margin-top: 96px;
	}

	.tf-tuziviz-rules {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 40px 65px;
		align-items: center;
		margin-top: 72px;
	}

	.tf-tuziviz-liners__notes {
		margin-top: 28px;
		font-size: var(--fs-body);
	}

	.tf-tuziviz-rules__title {
		margin-bottom: 18px;
	}

	.tf-tuziviz-liners {
		margin-top: 88px;
	}

	.tf-tuziviz-liners__title {
		margin-bottom: 30px;
	}

	.tf-tuziviz-trust {
		grid-template-columns: minmax(0, 755fr) minmax(0, 580fr);
		gap: 25px;
		margin-top: 96px;
	}

	.tf-tuziviz-guarantee {
		min-height: 300px;
		padding: 54px 48px 46px;
	}

	.tf-tuziviz-guarantee__text {
		margin-top: 12px;
		font-size: var(--fs-sm);
	}

	.tf-tuziviz-warning {
		padding: 40px 40px 44px;
	}

	.tf-tuziviz-warning__text {
		margin-top: 12px;
		font-size: var(--fs-sm);
		line-height: 1.75;
	}

	.tf-tuziviz-refs {
		margin-top: 96px;
	}

	.tf-tuziviz-refs__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.tf-tuziviz-quote {
		margin-top: 96px;
		padding-block: 96px 94px;
	}
}