/* =========================================================
   Profit Forest — style dựng từ index.html gốc, áp lên cấu trúc Flatsome
   Màu chính khai báo trong Customizer (primary = gold, secondary = navy).
   ========================================================= */
:root {
	--pf-navy: #0b1724;
	--pf-navy2: #122638;
	--pf-gold: #c8aa78;
	--pf-gold-dark: #ad8956;
	--pf-cream: #f5f4f0;
	--pf-ink: #172737;
	--pf-muted: #687581;
}

body, h1, h2, h3, h4, h5, h6, .nav > li > a, .button, input, button {
	font-family: Inter, 'Noto Sans TC', 'Noto Sans', Arial, sans-serif;
}
body { color: var(--pf-ink); background: var(--pf-cream); }
html { scroll-behavior: smooth; }

/* ---------- Header ---------- */
.header-main .logo img { width: auto; }
[id] { scroll-margin-top: 70px; } /* anchor không bị header sticky che */
.header-wrapper:not(.stuck) .header-main { border-bottom: 1px solid rgba(255, 255, 255, .18); }
.header-main .nav > li > a { font-size: 12px; letter-spacing: .06em; font-weight: 500; text-transform: none; }
.header-main .nav > li > a, .header-main .nav > li.active > a { color: #fff !important; }
.header-main .nav > li > a:hover { color: var(--pf-gold) !important; }
/* Trang thường: header navy. Trang template transparent: trong suốt, khi sticky → navy */
.header:not(.transparent) .header-main,
.header-wrapper.stuck .header-main { background: var(--pf-navy) !important; }
.header.transparent .header-wrapper:not(.stuck) .header-main,
.header.transparent .header-wrapper:not(.stuck) .header-bg-color { background: transparent !important; }

.pf-langs { display: flex; gap: 5px; border-left: 1px solid rgba(255, 255, 255, .31); padding-left: 18px; }
.pf-langs a { display: inline-block; color: #b6c1c9 !important; padding: 7px; font-size: 11px; line-height: 1; letter-spacing: 0; }
.pf-langs a:hover { color: #fff !important; }
.pf-langs a.active { color: var(--pf-gold) !important; font-weight: 700; }
.off-canvas .pf-langs, .mobile-nav .pf-langs { border-left: 0; padding-left: 0; }

/* ---------- Common ---------- */
.pf-kicker { color: var(--pf-gold-dark); font-size: 12px; letter-spacing: .24em; font-weight: 700; text-transform: uppercase; }
.dark .pf-kicker { color: var(--pf-gold); }
.pf-section h2, .pf-split h2, .pf-contact h2 { font-weight: 500; line-height: 1.3; margin: 15px 0 0; }
.pf-section h2 { font-size: clamp(29px, 3.4vw, 47px); }
.pf-muted { color: var(--pf-muted); font-size: 14px; line-height: 1.9; margin: 0; }
.pf-section .pf-head { margin-bottom: 30px; }

/* Buttons (Flatsome [button class="pf-btn"]) */
.button.pf-btn { border-radius: 0; padding: 0 24px; min-height: 52px; line-height: 50px; font-size: 13px; font-weight: 700; letter-spacing: 0; text-transform: none; margin: 26px 10px 0 0; }
.button.pf-btn.primary:not(.is-outline) { background: var(--pf-gold); border: 1px solid var(--pf-gold); color: var(--pf-navy); }
.button.pf-btn.primary:not(.is-outline):hover { background: #e4c89b; box-shadow: none; }
.button.pf-btn.is-outline { border: 1px solid rgba(255, 255, 255, .5); color: #fff; }
.button.pf-btn.is-outline:hover { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .5); color: #fff; box-shadow: none; }

/* ---------- 1. Hero ---------- */
.pf-hero { min-height: 730px; max-height: 950px; }
.pf-hero .section-bg-overlay { background: linear-gradient(90deg, rgba(7, 20, 33, .93) 0%, rgba(10, 28, 46, .84) 38%, rgba(11, 27, 43, .35) 100%) !important; }
.pf-hero .section-bg:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 140px; background: linear-gradient(transparent, rgba(11, 23, 36, .67)); }
.pf-hero .section-content { width: 100%; padding: 90px 0 110px; }
.pf-eyebrow { color: var(--pf-gold); font-size: 12px; letter-spacing: .3em; font-weight: 700; text-transform: uppercase; }
.pf-hero h1 { font-size: clamp(40px, 5.5vw, 77px); line-height: 1.23; letter-spacing: .045em; font-weight: 500; max-width: 850px; margin: 25px 0; color: #fff; }
/* Tiếng Việt: mọi tiêu đề h2–h6 in đậm (chữ Latin ở weight 500/600 trông mảnh hơn chữ Hán ở bản zh) */
html[lang="vi"] h2, html[lang="vi"] h3, html[lang="vi"] h4, html[lang="vi"] h5, html[lang="vi"] h6 { font-weight: 700; }
/* Tiếng Việt: chữ Latin mảnh hơn chữ Hán ở cùng weight → in đậm 700, giữ đúng 2 dòng như bản zh (mỗi dòng ngắt bằng <br>) */
html[lang="vi"] .pf-hero h1 { font-weight: 700; letter-spacing: .01em; line-height: 1.2; max-width: none; white-space: nowrap; }
.pf-hero p { max-width: 570px; color: #d4dce1; font-size: 17px; line-height: 1.9; margin: 0; }
.pf-hero-index { position: absolute; left: 0; bottom: 40px; width: 100%; z-index: 2; color: #e0e4e6; font-size: 10px; letter-spacing: .25em; }
.pf-hero-index .pf-wrap { max-width: 1180px; margin: 0 auto; padding: 0 15px; display: flex; justify-content: space-between; }

/* ---------- 2. About / features ---------- */
.pf-card > .col-inner { background: #fff; height: 100%; }
.pf-feature > .col-inner { border-top: 2px solid #c5aa80; padding: 36px 31px 43px; min-height: 255px; }
.pf-num, .pf-tag { font-size: 12px; color: #b29367; letter-spacing: .15em; }
.pf-feature h3 { font-size: 22px; margin: 37px 0 14px; font-weight: 600; }
.pf-feature p, .pf-solution p { font-size: 14px; color: var(--pf-muted); line-height: 1.85; margin: 0; }

/* ---------- 3. Split (dark) ---------- */
.pf-split .pf-split-image, .pf-split .pf-split-image > .col-inner, .pf-split .pf-split-image .banner { height: 100%; min-height: 450px; }
.pf-split .pf-split-copy > .col-inner { display: flex; flex-direction: column; justify-content: center; height: 100%; }
.pf-split h2 { font-size: clamp(30px, 3vw, 46px); line-height: 1.4; color: #fff; }
.pf-split p { color: #b8c4cb; line-height: 2; font-size: 15px; }
.pf-line-link { color: var(--pf-gold) !important; font-size: 13px; letter-spacing: .07em; margin-top: 10px; }
.pf-line-link:hover { color: #e4c89b !important; }

.pf-video .overlay { background: radial-gradient(ellipse at center, rgba(8, 23, 38, .72) 0%, rgba(8, 23, 38, .45) 55%, rgba(8, 23, 38, .3) 100%) !important; } /* tối vùng giữa để nút/chữ nổi trên nền nhiều chi tiết */
.pf-video .video-button-wrapper { margin-bottom: 18px; }
.pf-video .button.open-video { border: 1.5px solid var(--pf-gold) !important; color: var(--pf-gold) !important; background: rgba(11, 23, 36, .35); transition: transform .25s, background .25s; } /* thắng màu outline mặc định của Flatsome */
.pf-video .button.open-video:hover { background: var(--pf-gold); color: var(--pf-navy) !important; transform: scale(1.06); }
.pf-video-label { color: #fff; font-size: 20px; font-weight: 600; letter-spacing: .04em; text-shadow: 0 1px 12px rgba(0, 0, 0, .6); }
.pf-video-meta { color: #e0e4e6; font-size: 10px; letter-spacing: .25em; margin-top: 8px; text-shadow: 0 1px 8px rgba(0, 0, 0, .7); }

/* ---------- 4. Solutions ---------- */
.pf-solution > .col-inner { border: 1px solid #e5e7e8; padding: 28px 25px; min-height: 210px; }
.pf-solution .pf-tag { font-size: 11px; letter-spacing: .14em; color: #b49465; }
.pf-solution h3 { font-size: 24px; margin: 40px 0 12px; font-weight: 700; }
.pf-solution p { font-size: 13px; line-height: 1.7; }

/* ---------- 5. Quality ---------- */
.pf-quality p { line-height: 2; color: #5f6e78; }
.pf-checks { margin: 0; }
.pf-check { padding: 22px 0; border-bottom: 1px solid #cbd2d3; display: flex; align-items: center; gap: 22px; }
.pf-check b { font-size: 12px; color: var(--pf-gold-dark); }

/* ---------- 6. Contact ---------- */
.pf-contact h2 { font-size: clamp(32px, 4vw, 55px); margin: 20px 0; color: #fff; }
.pf-contact p { color: #b7c4cd; line-height: 1.9; }
.pf-contact p a { color: inherit; border-bottom: 1px solid rgba(183, 196, 205, .35); }
.pf-contact p a:hover { color: var(--pf-gold); border-color: var(--pf-gold); }
.pf-contact .button.pf-btn { margin: 25px 0 0; }

/* ---------- Footer (absolute footer của Flatsome) ---------- */
.absolute-footer { font-size: 12px; color: #8f9da8; padding: 34px 0; letter-spacing: .02em; }
.absolute-footer .footer-primary, .absolute-footer .footer-secondary { color: #8f9da8; }
.absolute-footer .container { max-width: 1180px; }

/* ---------- Responsive ---------- */
@media (max-width: 849px) {
	.pf-langs { padding-left: 7px; border-left: 0; }
	.pf-langs a { padding: 5px; }
	.pf-split .pf-split-image, .pf-split .pf-split-image > .col-inner, .pf-split .pf-split-image .banner { min-height: 360px; }
}
@media (max-width: 549px) {
	.pf-hero { min-height: 690px; }
	.pf-hero h1 { font-size: 41px; }
	html[lang="vi"] .pf-hero h1 { font-size: calc((100vw - 64px) / 11.4); } /* vừa khít bề ngang → vẫn 2 dòng trên điện thoại */
	.pf-hero p { font-size: 15px; }
	.button.pf-btn.is-outline { display: table; margin-left: 0; }
	.pf-hero-index { bottom: 22px; }
	.pf-hero-index .pf-wrap span:last-child { display: none; }
	.pf-feature > .col-inner { min-height: 0; }
	.pf-feature h3 { margin-top: 24px; }
	.absolute-footer .footer-secondary { float: none; text-align: left; padding-top: 6px; }
	}