/*!
 * Pay2S Elementor Widgets — Product Hero (hero-1 của template trang sản phẩm pay2s.vn)
 * Phụ thuộc: product.css (token, container, nút theme, keyframes).
 * Số đo /open-api-banking (26/09/2026):
 *  section overflow hidden · vùng chữ max 710, padding 219/0 (180 ≤1400 · 150 ≤1299 · 20 ≤991, căn giữa)
 *  sub-title 20px/1.7 600 in hoa #106a38, margin −.24em 0 17 (18px ≤767 · 16px, cách dưới 12 ≤575)
 *  tiêu đề 40px 700 #0d2719, line-height 1.135 (1.2 ≤991 · 1.24 ≤575), cách dưới 21 (16 ≤575); phần nhấn 500 #106a38
 *  mô tả 16/1.7 #4b5563 cách dưới 43 (28 ≤575) · nhóm nút flex gap 20
 *  ảnh absolute top 60 / right 10% (18% ≥1922 · 1% ≤1700 · top 20 ≤1400 · max 485 ≤1299 · right −10% ≤1199);
 *   ≤991: nằm trên phần chữ, margin 30 0 −60, padding 0 12, căn giữa
 *  quầng #f2ba4c 500×500 opacity .3 blur 300 (right −40, top −180), đổi màu 8s; ẩn ≤991
 *  đường cong 1232×675 top 10% right 0 (jump 7s / jump-reverse 7s) · nền 942×979 bottom −80 left −60 (jump 7s)
 *  hình trang trí tối đa 600px ≤1199 · tắt chuyển động ≤991
 */

.p2sew.p2sew-product-hero {
	position: relative;
	z-index: 2;
	overflow: hidden;
}

/* Ảnh chính */
.p2sew-product-hero .p2sew-product-hero__media {
	position: absolute;
	top: 60px;
	right: 10%;
	z-index: 3;
}

.p2sew-product-hero.p2sew-product-hero--glow .p2sew-product-hero__media::before {
	content: "";
	position: absolute;
	top: -180px;
	right: -40px;
	z-index: -1;
	width: 500px;
	height: 500px;
	border-radius: 50%;
	background-color: var(--p2s-glow-color, #f2ba4c);
	opacity: var(--p2s-glow-opacity, 0.3);
	filter: blur(300px);
}

.p2sew-product-hero.p2sew-product-hero--animated.p2sew-product-hero--glow .p2sew-product-hero__media::before {
	animation: p2sew-bg-color 8s ease-in-out infinite;
}

/* Vùng chữ */
.p2sew-product-hero .p2sew-product-hero__content {
	position: relative;
	z-index: 6;
	max-width: 710px;
	padding: 219px 0;
}

.p2sew-product-hero .p2sew-product-hero__subtitle {
	display: block;
	margin: -0.24em 0 17px;
	color: var(--p2s-product-primary);
	font-family: var(--p2s-product-font);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.7;
	text-transform: uppercase;
}

.p2sew-product-hero .p2sew-product-hero__title {
	margin: 0 0 21px;
	color: var(--p2s-product-title);
	font-family: var(--p2s-product-font);
	font-size: 40px;
	font-weight: 700;
	line-height: 1.135;
	text-transform: none;
}

.p2sew-product-hero .p2sew-product-hero__line {
	display: block;
}

/* Phần nhấn: inline-block như span.text-theme của site (khoảng trắng đầu phần nhấn bị bỏ — "LỚNVỚI"). */
.p2sew-product-hero .p2sew-product-hero__title em {
	display: inline-block;
	color: var(--p2s-product-primary);
	font-style: normal;
	font-weight: 500;
}

.p2sew-product-hero.p2sew-product-hero--gap .p2sew-product-hero__title em {
	display: inline;
}

.p2sew-product-hero .p2sew-product-hero__text {
	margin: 0 0 43px;
	color: var(--p2s-product-text);
	font-size: 16px;
	line-height: 1.7;
}

.p2sew-product-hero .p2sew-product-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--p2s-hero-actions, flex-start);
	gap: 20px;
}

/* Hình trang trí */
.p2sew-product-hero .p2sew-product-hero__shape {
	position: absolute;
	z-index: 2;
	pointer-events: none;
}

.p2sew-product-hero .p2sew-product-hero__shape--1,
.p2sew-product-hero .p2sew-product-hero__shape--2 {
	top: 10%;
	right: 0;
}

.p2sew-product-hero .p2sew-product-hero__shape--3 {
	bottom: -80px;
	left: -60px;
}

.p2sew-product-hero.p2sew-product-hero--animated .p2sew-product-hero__shape--1,
.p2sew-product-hero.p2sew-product-hero--animated .p2sew-product-hero__shape--3 {
	animation: p2sew-jump 7s linear infinite;
}

.p2sew-product-hero.p2sew-product-hero--animated .p2sew-product-hero__shape--2 {
	animation: p2sew-jump-reverse 7s linear infinite;
}

@media (min-width: 1922px) {
	:where(:not(.p2sew-rwd-container)) > .p2sew-product-hero .p2sew-product-hero__media {
		right: 18%;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (min-width: 1922px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		right: 18%;
	}
}

@media (max-width: 1700px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		right: 1%;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 1700px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		right: 1%;
	}
}

@media (max-width: 1400px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		top: 20px;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 180px 0;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 1400px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		top: 20px;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 180px 0;
	}
}

@media (max-width: 1299px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		max-width: 485px;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 150px 0;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 1299px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		max-width: 485px;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 150px 0;
	}
}

@media (max-width: 1199px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		right: -10%;
	}

	.p2sew-product-hero .p2sew-product-hero__shape {
		max-width: 600px;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 1199px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		right: -10%;
	}

	.p2sew-product-hero .p2sew-product-hero__shape {
		max-width: 600px;
	}
}

@media (max-width: 991px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		position: relative;
		top: 0;
		right: 0;
		max-width: 100%;
		margin: 30px 0 -60px;
		padding: 0 12px;
		text-align: center;
	}

	.p2sew-product-hero.p2sew-product-hero--glow .p2sew-product-hero__media::before {
		display: none;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 20px 0;
		text-align: center;
		--p2s-hero-actions: center;
	}

	.p2sew-product-hero .p2sew-product-hero__title {
		line-height: 1.2;
	}

	.p2sew-product-hero .p2sew-product-hero__text {
		margin-right: auto;
		margin-left: auto;
	}

	.p2sew-product-hero.p2sew-product-hero--animated .p2sew-product-hero__shape {
		animation: none;
		transform: none;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 991px) {
	.p2sew-product-hero .p2sew-product-hero__media {
		position: relative;
		top: 0;
		right: 0;
		max-width: 100%;
		margin: 30px 0 -60px;
		padding: 0 12px;
		text-align: center;
	}

	.p2sew-product-hero.p2sew-product-hero--glow .p2sew-product-hero__media::before {
		display: none;
	}

	.p2sew-product-hero .p2sew-product-hero__content {
		padding: 20px 0;
		text-align: center;
		--p2s-hero-actions: center;
	}

	.p2sew-product-hero .p2sew-product-hero__title {
		line-height: 1.2;
	}

	.p2sew-product-hero .p2sew-product-hero__text {
		margin-right: auto;
		margin-left: auto;
	}

	.p2sew-product-hero.p2sew-product-hero--animated .p2sew-product-hero__shape {
		animation: none;
		transform: none;
	}
}

@media (max-width: 767px) {
	.p2sew-product-hero .p2sew-product-hero__subtitle {
		font-size: 18px;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 767px) {
	.p2sew-product-hero .p2sew-product-hero__subtitle {
		font-size: 18px;
	}
}

@media (max-width: 575px) {
	.p2sew-product-hero .p2sew-product-hero__subtitle {
		margin-bottom: 12px;
		font-size: 16px;
	}

	.p2sew-product-hero .p2sew-product-hero__title {
		margin-bottom: 16px;
		line-height: 1.24;
	}

	.p2sew-product-hero .p2sew-product-hero__text {
		margin-bottom: 28px;
	}
}

/* container-mode: bản sao tự sinh từ @media phía trên (tools/container-mode.js) */
@container p2sew (max-width: 575px) {
	.p2sew-product-hero .p2sew-product-hero__subtitle {
		margin-bottom: 12px;
		font-size: 16px;
	}

	.p2sew-product-hero .p2sew-product-hero__title {
		margin-bottom: 16px;
		line-height: 1.24;
	}

	.p2sew-product-hero .p2sew-product-hero__text {
		margin-bottom: 28px;
	}
}
