/*
Theme Name:         Flatsome Landing
Theme URI:          http://flatsome.uxthemes.com
Description:        Child Flatsome — landing một cột, container tối đa 450px, padding ngang 15px.
Author:             Tienziven
Author URI:
Version:            1.0.5
Requires at least:  6.4
Requires PHP:       7.4
Template:           flatsome
Text Domain:        flatsome-child
Domain Path:        /languages
License:            GNU General Public License v3 or later
License URI:        http://www.gnu.org/licenses/gpl-3.0.html
*/

/*
 * Không dùng @import — Flatsome đã nạp flatsome.css + file style.css này (flatsome-style).
 * Class body `fs-landing-single` thêm trong functions.php.
 */

/* Self-host fonts to match template rendering.
 * Place .woff2 files in `landing/assets/fonts/` and wire them here.
 * (If fonts are installed locally, `local(...)` will still work.)
 */
@font-face {
	font-family: "Be Vietnam Pro";
	font-style: normal;
	font-weight: 300 800;
	font-display: swap;
	src: local("Be Vietnam Pro");
}

/* Cinzel: nạp qua fonts.googleapis.com trong functions.php (landing-font-cinzel). */

:root {
	--font-sans: "Be Vietnam Pro", system-ui, sans-serif;
	--font-cinzel: "Cinzel", serif;
	--bg: #112148;
	--bg-2: #3d6cb9;
	/* Panel tones used by all PXL blocks */
	--panel: #132440;
	--panel-2: #132440e6;
	--panel-3: #132440;
	--ink: #f0f4f8;
	--ink-2: #d1d9e6;
	--ink-3: #94a3b8;
	--bronze: #8e735b;
	--gold: #c2a378;
	--gold-2: #d4b896;
	--gold-deep: #967b4d;
	--gold-bright: #e8c988;
	--star: #f4d87a;
	--rule: #c2a3781f;
	--rule-2: #c2a37814;
	--glow: #c2a3781a;
}

body.fs-landing-single {
	margin: 0;
	font-family: var(--font-sans) !important;
	background-image: linear-gradient(90deg, #132440 29%, #30538B 100%);
}

/* Force font stack in landing mode (Flatsome/UX Builder can override). */
body.fs-landing-single,
body.fs-landing-single button,
body.fs-landing-single input,
body.fs-landing-single select,
body.fs-landing-single textarea {
	font-family: var(--font-sans) !important;
}

body.fs-landing-single #header {
	display: none !important;
}

body.fs-landing-single #footer.footer-wrapper {
	display: none !important;
}

body.fs-landing-single #comments,
body.fs-landing-single .comments-area,
body.fs-landing-single .comment-respond {
	display: none !important;
}

/* Thanh copyright / links dưới cùng của Flatsome (footer-absolute) */
body.fs-landing-single .absolute-footer {
	display: none !important;
}

/* Sidebar: ẩn widget area + cột shop/product/blog */
body.fs-landing-single #secondary,
body.fs-landing-single #shop-sidebar,
body.fs-landing-single #product-sidebar,
body.fs-landing-single .post-sidebar {
	display: none !important;
}

body.fs-landing-single .shop-sidebar {
	display: none !important;
}

body.fs-landing-single .page-wrapper.page-right-sidebar .row>.large-3.col:not(#content),
body.fs-landing-single .page-wrapper.page-left-sidebar .row>.large-3.col:not(#content) {
	display: none !important;
}

body.fs-landing-single .page-wrapper.page-right-sidebar #content.large-9,
body.fs-landing-single .page-wrapper.page-left-sidebar #content.large-9 {
	flex-basis: 100% !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.fs-landing-single .blog-wrapper .row>.large-9.col {
	flex-basis: 100% !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.fs-landing-single .category-page-row>.col.large-3:has(#shop-sidebar),
body.fs-landing-single .category-page-row>.col.large-3:has(.sidebar-inner) {
	display: none !important;
}

body.fs-landing-single .category-page-row>.col.large-9 {
	flex-basis: 100% !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.fs-landing-single #wrapper {
	box-sizing: border-box;
	max-width: 780px;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	padding: 0px;
	min-height: 100vh;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
	background-color: transparent;
	padding: 0 15px;
}

body.fs-landing-single #main {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	min-height: 0;
	background-color: transparent;
}

body.fs-landing-single.fs-landing-center-main #main>.page-wrapper:first-child,
body.fs-landing-single.fs-landing-center-main #main>.row:first-child {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

body.fs-landing-single #content.content-area.page-wrapper {
	padding: 0px;
}

.col,
.columns,
.gallery-item {
	padding: 0;
}

/* UX Builder landing: reset toàn bộ spacing section/row/col */
.pxl-frame {
	position: relative;
	border-radius: 28px;
	background: radial-gradient(ellipse at top, rgba(212, 184, 150, .06), transparent 50%), linear-gradient(180deg, var(--panel) 0%, var(--bg-2) 100%);
	box-shadow: 0 1px 0 rgba(212, 184, 150, .10) inset, 0 0 0 1px rgba(212, 184, 150, .18), 0 30px 60px -30px rgba(0, 0, 0, .7), 0 0 80px -40px rgba(212, 184, 150, .15);
}

.pxl-banner {
	padding: 56px 28px 70px !important;
	margin-top: 34px !important;
}

.banner-grid {
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.banner-grid {
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.banner-grid>.col {
	margin-left: 0px !important;
	margin-right: 0px !important;
}

.wpcf7-spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: none;
}

/* Responsive margin cho các khối Pxl (desktop + mobile <=480px). */
.pxl-responsive-margin {
	margin: var(--pxl-m);
}

.custom-img-head {
	margin-top: 20px;
}

.custom-img-head img {
	border-radius: 8px;
}

@media (max-width: 480px) {
	.pxl-responsive-margin {
		margin: var(--pxl-m-m, var(--pxl-m));
	}
}


@media (max-width: 549px) {
	.pxl-grid-4-block .bcard .big {
		font-size: 36px;
	}

	.pxl-grid-4-block .banner-grid {
		gap: 10px 10px;
	}

	.pxl-grid-4-block .bcard .head {
		padding: 5px 0 15px;
		margin: 0;
	}

	.pxl-grid-4-block .bcard .head .ttl {
		font-size: 16px;
	}
}

@media (max-width: 480px) {
	.pxl-grid-4-block .bcard .head .ttl {
		font-size: 14px;
		padding: 0 12px;
		letter-spacing: 0.05em;
	}

	.pxl-grid-4-block .banner {
		padding: 0px 0px 5px;
	}

	.pxl-grid-4-block .bcard {
		padding: 30px 0 20px;
	}

	.pxl-grid-4-block .bcard .big {
		font-size: 28px;
	}

	.pxl-grid-4-block .bcard .body {
		gap: 4px;
		padding: 5px 0 0;
	}

	body.fs-landing-single #content.content-area.page-wrapper {
		padding: 0 12px;
	}

	.pxl-grid-4-block .bcard .small {
		letter-spacing: 0.05em;
	}

	.pxl-cta-btn .pxl-footer-box .shell {
		padding: 0 16px 0px;
	}


	.pxl-grid-4-block .bcard .body {
		gap: 4px;
	}

	.pxl-title-block section.hero .desc.pxl-desc-wave {
		font-size: 20px;
	}
}