@charset "UTF-8";

.topAttention-section {
	position: relative;
	width: 100vw;
	max-width: none;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	padding: 64px 28px;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.88) 0%, rgba(244, 251, 248, 0.92) 52%, rgba(255, 249, 240, 0.88) 100%);
	overflow: hidden;
	box-sizing: border-box;
}

.topAttention-section::before,
.topAttention-section::after {
	content: "";
	position: absolute;
	border-radius: 999px;
	filter: blur(8px);
	pointer-events: none;
}

.topAttention-section::before {
	top: -80px;
	left: -60px;
	width: 280px;
	height: 280px;
	background: radial-gradient(circle, rgba(20, 163, 131, 0.18) 0%, rgba(20, 163, 131, 0) 70%);
}

.topAttention-section::after {
	right: -90px;
	bottom: -90px;
	width: 320px;
	height: 320px;
	background: radial-gradient(circle, rgba(255, 201, 120, 0.24) 0%, rgba(255, 201, 120, 0) 72%);
}

.topAttention-head {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin: 0 auto;
}

.topAttention-copy {
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-top: 0;
	max-width: 760px;
	margin: 0 auto;
}

.topAttention-kicker {
	display: inline-flex;
	align-self: center;
	margin: 0;
	padding: 8px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, #f7fffc 0%, #edf9f4 100%);
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	box-shadow: 0 12px 24px rgba(15, 129, 103, 0.08);
}

.topAttention-copy .topAttention-title {
	margin-bottom: 1em;
	line-height: 1.14;
	letter-spacing: -0.02em;
	max-width: none;
	text-align: center;
}

.topAttention-title.topH2,
.topAttention-title.topH2 span {
	text-align: center;
}

.topAttention-title::before,
.topAttention-title::after {
	left: 50%;
	right: auto;
	transform: translateX(-50%);
}

.topAttention-lead {
	max-width: 42em;
	margin: 0 auto;
	text-align: center;
}

.topAttention-lead p {
	color: #425851;
	font-size: 15px;
	line-height: 1.95;
	margin-bottom: 0.9em;
}

.topAttention-pulse {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 12px 16px;
	align-items: center;
	max-width: 1080px;
	margin: 6px auto 0;
	width: 100%;
}

.topAttention-pulseLabel {
	grid-column: 1 / -1;
	color: #0f8167;
	font-size: 12px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.topAttention-pulseLine {
	position: relative;
	display: block;
	width: 92px;
	height: 2px;
	background: linear-gradient(90deg, #0f8167 0%, rgba(15, 129, 103, 0.12) 100%);
}

.topAttention-pulseLine::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #0f8167;
	box-shadow: 0 0 0 8px rgba(15, 129, 103, 0.12);
	transform: translateY(-50%);
}

.topAttention-pulseText {
	color: #4b625a;
	font-size: 14px;
	line-height: 1.8;
}

.topAttention-videoWrap {
	position: relative;
	width: 100%;
	max-width: 1080px;
	margin: 0 auto;
	padding: 18px;
	border-radius: 28px;
	background: linear-gradient(160deg, rgba(247, 255, 252, 0.92) 0%, rgba(255, 255, 255, 0.82) 100%);
	box-shadow: 0 20px 40px rgba(16, 61, 51, 0.08);
	box-sizing: border-box;
}

.topAttention-videoLabel {
	margin-bottom: 12px;
	color: #5f756d;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
}

.topAttention-video {
	position: relative;
	padding-top: 56.25%;
	border-radius: 22px;
	overflow: hidden;
	background: #16372f;
	box-shadow: 0 18px 38px rgba(12, 36, 31, 0.18);
}

.topAttention-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.topAttention-points {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 22px;
	margin-top: 42px;
	margin-bottom: 36px;
	position: relative;
	z-index: 1;
	max-width: 1080px;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.topAttention-points > p {
	display: none;
}

.topAttention-item {
	position: relative;
	background: linear-gradient(180deg, #ffffff 0%, #f8fcfb 100%);
	border-radius: 26px;
	padding: 28px 20px 22px;
	border: 1px solid rgba(21, 104, 86, 0.06);
	box-shadow: 0 16px 30px rgba(16, 61, 51, 0.06);
	text-align: center;
	overflow: hidden;
}

.topAttention-item::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 5px;
	background: linear-gradient(90deg, #14a383 0%, #ffd47c 100%);
}

.topAttention-itemNumber {
	position: absolute;
	top: 16px;
	right: 18px;
	color: rgba(21, 104, 86, 0.16);
	font-size: 24px;
	font-weight: 900;
	letter-spacing: 0.04em;
}

.topAttention-itemIcon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 94px;
	height: 94px;
	margin: 0 auto 16px;
	border-radius: 24px;
	background: linear-gradient(145deg, #eff8f5 0%, #fffdfa 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
}

.topAttention-itemIcon img {
	width: 62px;
	height: 62px;
	object-fit: contain;
	margin-bottom: 0;
}

.topAttention-item .topAttention-itemTitle {
	color: #156856;
	font-size: 20px;
	font-weight: 800;
	margin-bottom: 0.5em;
}

.topAttention-item .topAttention-itemText {
	color: #556962;
	font-size: 14px;
	margin-bottom: 0;
	line-height: 1.8;
}

.topAttention-warning {
	position: relative;
	max-width: 1080px;
	width: 100%;
	margin: 0 auto;
	padding: 28px 24px 24px;
	background: linear-gradient(160deg, rgba(255, 249, 226, 0.96) 0%, rgba(255, 243, 204, 0.96) 100%);
	border-radius: 20px;
	text-align: center;
	box-shadow: 0 18px 30px rgba(145, 109, 14, 0.08);
	box-sizing: border-box;
}

.topAttention-section .buttonCTA {
	max-width: 1080px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.topAttention-warningBadge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
	padding: 7px 14px;
	border-radius: 999px;
	background: #f0c400;
	color: #6b5200;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.topAttention-warningHeading {
	color: #6b5200;
	font-weight: 800;
	font-size: 20px;
	line-height: 1.55;
	margin-bottom: 0;
}

.topAttention-warningBreak {
	display: none;
}

.topAttention-warningText {
	color: #6b5200;
	font-weight: 700;
	font-size: 15px;
	line-height: 1.85;
	margin: 10px 0 0;
}

@media screen and (max-width: 960px) {
	.topAttention-points {
		grid-template-columns: 1fr;
	}

	.topAttention-copy {
		padding-top: 0;
		max-width: none;
	}

	.topAttention-videoWrap {
		width: 100%;
		margin: 0 auto;
	}
}

@media screen and (max-width: 767px) {
	.topAttention-section {
		padding: 42px 18px;
	}

	.topAttention-kicker {
		font-size: 11px;
	}

	.topAttention-title {
		max-width: none;
	}

	.topAttention-lead p {
		font-size: 14px;
		line-height: 1.85;
	}

	.topAttention-lead {
		text-align: left;
	}

	.topAttention-pulse {
		grid-template-columns: 1fr;
		gap: 10px;
	}

	.topAttention-pulseLine {
		width: 74px;
	}

	.topAttention-pulse,
	.topAttention-pulseLabel,
	.topAttention-pulseText {
		text-align: left;
	}

	.topAttention-videoWrap {
		padding: 14px;
		border-radius: 20px;
	}

	.topAttention-item {
		padding: 22px 16px 20px;
		border-radius: 20px;
	}

	.topAttention-itemNumber {
		font-size: 20px;
		top: 14px;
		right: 14px;
	}

	.topAttention-itemTitle {
		font-size: 18px;
	}

	.topAttention-warning {
		padding: 24px 16px 20px;
		border-radius: 20px;
	}

	.topAttention-warningText {
		font-size: 14px;
		line-height: 1.75;
	}

	.topAttention-warningHeading {
		font-size: 18px;
	}

	.topAttention-warningBreak {
		display: block;
	}
}