/* Nệm Bình Dương · hero slider shortcode [nbd_hero_slider]. */
.nbd-hero-slider {
	position: relative;
	z-index: 1;
	width: 100%;
	height: var(--nbd-slider-height, 585px);
	min-height: 420px;
	margin: 0 auto;
	background: #071f3d;
	color: #fff;
	font-family: var(--nbd-slider-main-font, var(--nbd-body-font, "Be Vietnam Pro", sans-serif));
	overflow: hidden;
	isolation: isolate;
	touch-action: pan-y pinch-zoom;
	user-select: none;
	-webkit-user-select: none;
	cursor: grab;
}

.nbd-hero-slider.is-dragging { cursor: grabbing; }

.nbd-hero-slider :is(a, button) { cursor: pointer; }

.nbd-hero-slider.is-dragging :is(a, button) { cursor: grabbing; }

.nbd-hero-slider img,
.nbd-hero-slider a {
	-webkit-user-drag: none;
}

.nbd-hero-slider--full {
	left: 50%;
	width: 100vw;
	max-width: 100vw;
	margin-left: -50vw;
}

.nbd-hero-slider--container {
	border-radius: 18px;
}

.nbd-hero-slider *,
.nbd-hero-slider *::before,
.nbd-hero-slider *::after {
	box-sizing: border-box;
}

body.nbd-product-ui .nbd-hero-slider :where(p, h2, h3, a, button, b, small, span),
.nbd-hero-slider :where(p, h2, h3, a, button, b, small, span) {
	font-family: var(--nbd-slider-main-font, var(--nbd-body-font, "Be Vietnam Pro", sans-serif)) !important;
}

.nbd-hero-slider__track,
.nbd-hero-slider__slide,
.nbd-hero-slider__picture,
.nbd-hero-slider__picture img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.nbd-hero-slider__slide {
	z-index: 0;
	visibility: hidden;
	opacity: 0;
	transition: opacity var(--nbd-slider-speed, 650ms) ease, visibility var(--nbd-slider-speed, 650ms) step-end;
	pointer-events: none;
}

.nbd-hero-slider__slide.is-active {
	z-index: 1;
	visibility: visible;
	opacity: 1;
	transition: opacity var(--nbd-slider-speed, 650ms) ease;
	pointer-events: auto;
}

.nbd-hero-slider__picture {
	z-index: -2;
	margin: 0;
	background: #071f3d;
}

.nbd-hero-slider__picture img {
	object-fit: cover;
	object-position: var(--nbd-slide-position, center center);
	transform: scale(1.018);
	transition: transform 8s ease;
}

.nbd-hero-slider__slide.is-active .nbd-hero-slider__picture img {
	transform: scale(1);
}

.nbd-hero-slider__slide::after {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, var(--nbd-slide-overlay) 0%, var(--nbd-slide-overlay) 34%, rgba(5, 23, 34, .7) 48%, rgba(5, 23, 34, .1) 71%, transparent 86%);
	content: "";
	pointer-events: none;
}

.nbd-hero-slider__container {
	position: relative;
	z-index: 2;
	display: flex;
	height: 100%;
	align-items: center;
	padding-top: 24px;
	padding-bottom: 24px;
}

.nbd-hero-slider__content {
	display: flex;
	width: min(100%, var(--nbd-slider-content-width, 570px));
	min-width: 0;
	flex-direction: column;
	align-items: flex-start;
	padding: 4px 0 7px;
	text-align: left;
}

.nbd-hero-slider__brand {
	display: flex;
	min-height: 48px;
	align-items: center;
	margin: 0 0 18px;
}

.nbd-hero-slider__brand--image img {
	display: block;
	width: min(var(--nbd-slider-logo-width, 245px), 100%);
	max-height: 72px;
	object-fit: contain;
	object-position: left center;
}

.nbd-hero-slider__brand--image.nbd-hero-slider__brand--white img {
	filter: brightness(0) invert(1);
}

.nbd-hero-slider__brand--text {
	gap: 11px;
}

.nbd-hero-slider__brand--text > svg {
	width: 66px;
	height: auto;
	color: var(--nbd-slider-accent, #ffc928);
	fill: none;
	stroke: currentColor;
	stroke-width: 5;
	stroke-linecap: round;
}

.nbd-hero-slider__brand--text > span {
	display: grid;
	gap: 2px;
}

.nbd-hero-slider__brand--text b {
	color: #fff;
	font-family: var(--nbd-slider-main-font, var(--nbd-heading-font, "Manrope", sans-serif));
	font-size: 18px;
	font-weight: 800;
	line-height: 1.05;
}

.nbd-hero-slider__brand--text small {
	color: rgba(255,255,255,.72);
	font-size: 9px;
	line-height: 1.3;
}

body.nbd-product-ui .nbd-hero-slider__script,
.nbd-hero-slider__script {
	position: relative;
	margin: 0 0 -7px 10px;
	color: var(--nbd-slider-script-color, #fff);
	font-family: var(--nbd-slider-script-font, var(--nbd-script-font, "Dancing Script", cursive)) !important;
	font-size: var(--nbd-slider-script-size, 54px) !important;
	font-weight: 400;
	line-height: .95;
	letter-spacing: -.025em;
	transform: translateY(-15px) rotate(-4deg);
	text-shadow: 0 4px 20px rgba(0,0,0,.16);
}

.nbd-hero-slider__script::after {
	position: absolute;
	right: -76px;
	bottom: 2px;
	width: 68px;
	height: 4px;
	background: currentColor;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	content: "";
	opacity: .82;
	transform: rotate(4deg);
	transform-origin: left center;
}

body.nbd-product-ui .nbd-hero-slider__content h2,
.nbd-hero-slider__content h2 {
	width: 100%;
	max-width: none;
	margin: 0;
	color: var(--nbd-slider-title-color, #ffd34a) !important;
	font-family: var(--nbd-slider-main-font, var(--nbd-heading-font, "Manrope", sans-serif)) !important;
	font-size: var(--nbd-slider-title-size, 50px) !important;
	font-weight: 800 !important;
	line-height: .98;
	letter-spacing: -.048em;
	text-wrap: balance;
	text-shadow: 0 8px 28px rgba(0,0,0,.16);
}

body.nbd-product-ui .nbd-hero-slider__content h3,
.nbd-hero-slider__content h3 {
	margin: 7px 0 0;
	color: var(--nbd-slider-subtitle-color, #fff) !important;
	font-family: var(--nbd-slider-main-font, var(--nbd-heading-font, "Manrope", sans-serif)) !important;
	font-size: var(--nbd-slider-subtitle-size, 25px) !important;
	font-weight: 800 !important;
	line-height: 1.1;
	letter-spacing: -.025em;
}

body.nbd-product-ui .nbd-hero-slider__description,
.nbd-hero-slider__description {
	max-width: 100%;
	margin: 9px 0 0;
	color: var(--nbd-slider-description-color, #d9e7e7);
	font-size: var(--nbd-slider-description-size, 15px) !important;
	font-style: italic;
	font-weight: 400;
	line-height: 1.45;
}

.nbd-hero-slider__benefits {
	display: grid;
	width: min(100%, 485px);
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 24px 0 0;
}

.nbd-hero-slider__benefit {
	display: grid;
	min-width: 0;
	justify-items: center;
	text-align: center;
}

.nbd-hero-slider__benefit > span {
	display: grid;
	width: 44px;
	height: 44px;
	place-items: center;
	margin-bottom: 7px;
	border: 1.5px solid var(--nbd-slider-accent, #ffc928);
	border-radius: 50%;
	background: rgba(4,31,42,.18);
	box-shadow: inset 0 0 0 3px rgba(255,255,255,.04), 0 5px 18px rgba(0,0,0,.09);
	color: #fff;
}

.nbd-hero-slider__benefit svg {
	width: 25px;
	height: 25px;
}

.nbd-hero-slider__benefit b {
	color: #fff;
	font-size: var(--nbd-slider-benefit-title-size, 14px) !important;
	font-weight: 800;
	line-height: 1.15;
}

.nbd-hero-slider__benefit small {
	display: block;
	margin-top: 2px;
	color: rgba(255,255,255,.82);
	font-size: var(--nbd-slider-benefit-text-size, 11px) !important;
	font-weight: 500;
	line-height: 1.25;
}

.nbd-hero-slider__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 25px;
}

.nbd-hero-slider__button {
	display: inline-flex;
	min-height: 50px;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin: 0;
	padding: 12px 22px;
	border: 1px solid transparent;
	border-radius: 11px;
	font-size: var(--nbd-slider-button-size, 14px) !important;
	font-weight: 800;
	line-height: 1.15;
	text-decoration: none !important;
	transition: transform .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.nbd-hero-slider__button svg {
	flex: 0 0 21px;
	width: 21px;
	height: 21px;
}

.nbd-hero-slider__button--primary {
	background: linear-gradient(135deg, #ffd94a, var(--nbd-slider-accent, #ffc928));
	box-shadow: 0 9px 24px rgba(255,193,18,.25);
	color: #092846 !important;
}

.nbd-hero-slider__button--secondary {
	border-color: rgba(255,255,255,.7);
	background: rgba(5,36,45,.16);
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.07);
	color: #fff !important;
	backdrop-filter: blur(5px);
}

.nbd-hero-slider__button:hover {
	transform: translateY(-2px);
}

.nbd-hero-slider__button--primary:hover {
	box-shadow: 0 12px 30px rgba(255,193,18,.34);
}

.nbd-hero-slider__button--secondary:hover {
	border-color: #fff;
	background: rgba(255,255,255,.1);
}

.nbd-hero-slider__arrow {
	position: absolute;
	top: 50%;
	z-index: 8;
	display: grid;
	width: 46px;
	height: 46px;
	place-items: center;
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid rgba(255,255,255,.55);
	border-radius: 50%;
	background: rgba(3,23,38,.3);
	box-shadow: 0 8px 25px rgba(0,0,0,.12);
	color: #fff;
	backdrop-filter: blur(6px);
	transition: background-color .2s ease, transform .2s ease;
}

.nbd-hero-slider__arrow:hover {
	background: rgba(3,23,38,.58);
	transform: translateY(-50%) scale(1.05);
}

.nbd-hero-slider__arrow svg {
	width: 24px;
	height: 24px;
}

.nbd-hero-slider__arrow--prev { left: 18px; }
.nbd-hero-slider__arrow--next { right: 18px; }

.nbd-hero-slider__dots {
	position: absolute;
	left: 50%;
	bottom: 18px;
	z-index: 8;
	display: flex;
	align-items: center;
	gap: 8px;
	transform: translateX(-50%);
}

.nbd-hero-slider__dots button {
	width: 9px;
	height: 9px;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255,255,255,.52);
	box-shadow: 0 2px 9px rgba(0,0,0,.18);
	transition: width .2s ease, background-color .2s ease;
}

.nbd-hero-slider__dots button.is-active {
	width: 28px;
	background: var(--nbd-slider-accent, #ffc928);
}

.nbd-hero-slider__slide .nbd-hero-slider__content > * {
	opacity: 0;
	transform: translateY(14px);
}

.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > * {
	opacity: 1;
	transform: translateY(0);
	transition: opacity .52s ease, transform .52s ease;
}

/* Giữ góc chữ và vị trí cao hơn 15px sau khi hiệu ứng xuất hiện kết thúc. */
.nbd-hero-slider__slide .nbd-hero-slider__content > .nbd-hero-slider__script {
	transform: translateY(-1px) rotate(-4deg);
}

.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > .nbd-hero-slider__script {
	transform: translateY(-15px) rotate(-4deg);
}

.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > :nth-child(2) { transition-delay: .06s; }
.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > :nth-child(3) { transition-delay: .11s; }
.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > :nth-child(4) { transition-delay: .16s; }
.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > :nth-child(5) { transition-delay: .21s; }
.nbd-hero-slider__slide.is-active .nbd-hero-slider__content > :nth-child(6) { transition-delay: .26s; }

@media (max-width: 1280px) {
	.nbd-hero-slider__content { padding-left: 38px; }
	.nbd-hero-slider__arrow--prev { left: 10px; }
	.nbd-hero-slider__arrow--next { right: 10px; }
}

@media (max-width: 820px) {
	.nbd-hero-slider__slide::after {
		background: linear-gradient(90deg, var(--nbd-slide-overlay) 0%, var(--nbd-slide-overlay) 48%, rgba(5,23,34,.38) 78%, rgba(5,23,34,.16) 100%);
	}
	.nbd-hero-slider__content { width: min(74%, var(--nbd-slider-content-width, 570px)); }
}

@media (max-width: 620px) {
	.nbd-hero-slider {
		height: var(--nbd-slider-height-mobile, 620px);
		min-height: 460px;
	}

	.nbd-hero-slider--container { border-radius: 12px; }

	.nbd-hero-slider__picture img {
		object-position: var(--nbd-slide-position-mobile, 68% center);
	}

	.nbd-hero-slider__slide::after {
		background: linear-gradient(180deg, rgba(3,18,36,.48) 0%, rgba(3,21,38,.62) 35%, rgba(3,25,40,.92) 100%);
	}

	.nbd-hero-slider__container {
		align-items: flex-end;
		padding: 24px 20px 44px;
	}

	.nbd-hero-slider__content {
		width: 100%;
		padding: 0;
	}

	.nbd-hero-slider__brand { min-height: 36px; margin-bottom: 8px; }
	.nbd-hero-slider__brand--image img { width: min(var(--nbd-slider-logo-width-mobile, 185px), 72vw); max-height: 48px; }
	.nbd-hero-slider__brand--text { gap: 7px; }
	.nbd-hero-slider__brand--text > svg { width: 46px; }
	.nbd-hero-slider__brand--text b { font-size: 14px; }
	.nbd-hero-slider__brand--text small { font-size: 7px; }

	body.nbd-product-ui .nbd-hero-slider__script,
	.nbd-hero-slider__script {
		margin-bottom: -3px;
		font-size: var(--nbd-slider-script-size-mobile, 39px) !important;
	}

	body.nbd-product-ui .nbd-hero-slider__content h2,
	.nbd-hero-slider__content h2 {
		width: 100%;
		max-width: none;
		font-size: var(--nbd-slider-title-size-mobile, 34px) !important;
		line-height: 1;
	}

	body.nbd-product-ui .nbd-hero-slider__content h3,
	.nbd-hero-slider__content h3 {
		margin-top: 5px;
		font-size: var(--nbd-slider-subtitle-size-mobile, 19px) !important;
	}

	body.nbd-product-ui .nbd-hero-slider__description,
	.nbd-hero-slider__description {
		margin-top: 6px;
		font-size: var(--nbd-slider-description-size-mobile, 13px) !important;
	}

	.nbd-hero-slider__benefits {
		gap: 7px;
		margin-top: 15px;
	}

	.nbd-hero-slider__benefit > span {
		width: 36px;
		height: 36px;
		margin-bottom: 5px;
	}

	.nbd-hero-slider__benefit svg { width: 20px; height: 20px; }
	.nbd-hero-slider__benefit b { font-size: var(--nbd-slider-benefit-title-size-mobile, 12px) !important; }
	.nbd-hero-slider__benefit small { font-size: var(--nbd-slider-benefit-text-size-mobile, 9px) !important; }

	.nbd-hero-slider__actions {
		width: 100%;
		gap: 8px;
		margin-top: 16px;
	}

	.nbd-hero-slider__button {
		min-height: 43px;
		flex: 1 1 calc(50% - 4px);
		gap: 7px;
		padding: 9px 11px;
		border-radius: 8px;
		font-size: var(--nbd-slider-button-size-mobile, 12px) !important;
	}

	.nbd-hero-slider__button svg { width: 18px; height: 18px; }

	.nbd-hero-slider__arrow {
		top: 38%;
		width: 36px;
		height: 36px;
	}

	.nbd-hero-slider__arrow--prev { left: 8px; }
	.nbd-hero-slider__arrow--next { right: 8px; }
	.nbd-hero-slider__arrow svg { width: 19px; height: 19px; }
	.nbd-hero-slider__dots { bottom: 13px; }
}

@media (max-width: 380px) {
	.nbd-hero-slider__container { padding-right: 14px; padding-left: 14px; }
	.nbd-hero-slider__button { font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
	.nbd-hero-slider__slide,
	.nbd-hero-slider__picture img,
	.nbd-hero-slider__content > *,
	.nbd-hero-slider__button,
	.nbd-hero-slider__dots button {
		transition: none !important;
	}
}
