/*
Theme Name: SunTechMall VPro
Author: SunTechMall
Description: A premium, modular and extension-ready WordPress theme with a controlled design system, advanced header and footer, and a dedicated Theme Setup panel.
Version: 2.2.5
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 7.4
Text Domain: suntechmall-vpro
License: GPL-3.0-or-later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, wide-blocks, blog
Update URI: false
*/


:root {
	--stmv-primary: #ff7900;
	--stmv-primary-dark: #111b32;
	--stmv-accent: #10a34a;
	--stmv-ink: #070b12;
	--stmv-muted: #56616d;
	--stmv-bg: #f4f8f7;
	--stmv-surface: #ffffff;
	--stmv-border: #e1e4e8;
	--stmv-link: #0c6f72;
	--stmv-danger: #b42318;
	--stmv-success: #067647;
	--stmv-radius-sm: 8px;
	--stmv-radius: 12px;
	--stmv-radius-lg: 18px;
	--stmv-shadow-sm: 0 8px 24px rgba(7, 11, 18, 0.05);
	--stmv-shadow: 0 18px 50px rgba(7, 11, 18, 0.08);
	--stmv-container: 1150px;
	--stmv-content: 980px;
	--stmv-sidebar: 320px;
	--stmv-section-space: 64px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--stmv-bg);
	color: var(--stmv-ink);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px;
	line-height: 1.6;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}
body.stmv-offcanvas-open { overflow: hidden; }
a { color: var(--stmv-link); text-decoration: none; }
a:hover { color: var(--stmv-primary); }
img { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; }
button, [type="button"], [type="submit"] { cursor: pointer; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--stmv-accent) 75%, white); outline-offset: 3px; }

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
.screen-reader-text:focus {
	position: fixed !important;
	top: 8px;
	left: 8px;
	z-index: 100000;
	width: auto;
	height: auto;
	padding: 12px 16px;
	margin: 0;
	clip: auto;
	background: #fff;
	color: #111;
	box-shadow: 0 4px 20px rgba(0, 0, 0, .2);
}

.stmv-homepage { min-height: 0; display: flow-root; background: var(--stmv-home-bg, #f7f7f7); }
.stmv-container { width: min(calc(100% - 32px), var(--stmv-container)); margin-inline: auto; }
.site-main { min-height: 60vh; padding-block: 44px var(--stmv-section-space); }
.stmv-home-content { width: 100%; padding: 0 0 20px; }
.stmv-home-content > .stmv-container > :first-child { margin-top: 0; }
.stmv-home-content > .stmv-container > :last-child { margin-bottom: 0; }
.site-content { min-width: 0; }

.stmv-button,
input[type="submit"],
.wp-element-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 10px 20px;
	border: 1px solid var(--stmv-primary);
	border-radius: 9px;
	background: var(--stmv-primary);
	color: #fff;
	font: inherit;
	font-weight: 750;
	line-height: 1.2;
	transition: transform .2s ease, background-color .2s ease, border-color .2s ease;
}
.stmv-button:hover, input[type="submit"]:hover, .wp-element-button:hover {
	transform: translateY(-1px);
	background: var(--stmv-primary-dark);
	border-color: var(--stmv-primary-dark);
	color: #fff;
}
.stmv-button--ghost { background: transparent; color: var(--stmv-primary); }
.stmv-button--ghost:hover { background: var(--stmv-primary); color: #fff; }

.stmv-hero {
	position: relative;
	overflow: hidden;
	padding: clamp(58px, 8vw, 108px) 0;
	background: linear-gradient(135deg, #f3f7f6 0%, #ffffff 70%, #fff5df 100%);
	border-bottom: 1px solid var(--stmv-border);
}
.stmv-hero::before,
.stmv-hero::after {
	content: "";
	position: absolute;
	border-radius: 999px;
	pointer-events: none;
}
.stmv-hero::before { width: 400px; height: 400px; right: -70px; top: 24px; background: color-mix(in srgb, var(--stmv-primary) 24%, white); }
.stmv-hero::after { width: 205px; height: 205px; right: 65px; top: 104px; background: var(--stmv-primary); }
.stmv-hero__content { position: relative; z-index: 1; max-width: 820px; }
.stmv-eyebrow { display: inline-block; color: var(--stmv-primary); font-size: .8rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.stmv-hero h1 { max-width: 900px; margin: 14px 0 20px; font-size: clamp(2.65rem, 6vw, 5.4rem); line-height: .98; letter-spacing: -.055em; }
.stmv-hero p { max-width: 680px; margin: 0 0 30px; color: var(--stmv-muted); font-size: clamp(1.05rem, 2vw, 1.25rem); }
.stmv-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.stmv-entry-card {
	margin-bottom: 26px;
	padding: clamp(24px, 4vw, 44px);
	background: var(--stmv-surface);
	border: 1px solid var(--stmv-border);
	border-radius: var(--stmv-radius);
	box-shadow: var(--stmv-shadow-sm);
}
.stmv-entry-title { margin: 0 0 18px; line-height: 1.18; letter-spacing: -.025em; }
.stmv-entry-title a { color: var(--stmv-ink); }
.stmv-entry-title a:hover { color: var(--stmv-primary); }
.stmv-entry-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: -6px 0 18px; color: var(--stmv-muted); font-size: .9rem; }
.stmv-entry-thumbnail { display: block; margin: -12px -12px 26px; overflow: hidden; border-radius: calc(var(--stmv-radius) - 4px); }
.stmv-entry-thumbnail img { display: block; width: 100%; }
.stmv-entry-content > :first-child { margin-top: 0; }
.stmv-entry-content > :last-child { margin-bottom: 0; }
.stmv-entry-content img { border-radius: var(--stmv-radius-sm); }
.stmv-entry-content table { width: 100%; border-collapse: collapse; }
.stmv-entry-content th, .stmv-entry-content td { padding: 12px; border: 1px solid var(--stmv-border); text-align: left; }

.stmv-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 36px; align-items: start; }
.stmv-layout--has-sidebar { grid-template-columns: minmax(0, 1fr) var(--stmv-sidebar); }
.stmv-sidebar { display: grid; gap: 20px; }
.stmv-sidebar-widget { padding: 22px; background: var(--stmv-surface); border: 1px solid var(--stmv-border); border-radius: var(--stmv-radius); box-shadow: var(--stmv-shadow-sm); }
.stmv-sidebar-widget__title { margin: 0 0 16px; font-size: 1.05rem; }
.stmv-sidebar-widget ul { margin: 0; padding: 0; list-style: none; }
.stmv-sidebar-widget li + li { margin-top: 10px; }

.navigation.pagination, .posts-navigation, .post-navigation { margin-top: 30px; }
.nav-links { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; }
.page-numbers, .nav-previous a, .nav-next a { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 8px 14px; background: var(--stmv-surface); border: 1px solid var(--stmv-border); border-radius: 10px; }
.page-numbers.current { background: var(--stmv-primary); border-color: var(--stmv-primary); color: #fff; }

.stmv-search-form { display: flex; gap: 10px; }
.stmv-search-form__field { min-width: 0; flex: 1; min-height: 46px; padding: 10px 14px; border: 1px solid var(--stmv-border); border-radius: 12px; background: #fff; color: var(--stmv-ink); }
.stmv-search-form__submit { min-height: 46px; padding-inline: 18px; border: 1px solid var(--stmv-primary); border-radius: 12px; background: var(--stmv-primary); color: #fff; font-weight: 750; }

.stmv-comments { margin-top: 28px; }
.comment-list { padding: 0; list-style: none; }
.comment-body { margin-bottom: 16px; padding: 20px; background: var(--stmv-surface); border: 1px solid var(--stmv-border); border-radius: var(--stmv-radius); }
.comment-meta { margin-bottom: 10px; }
.comment-form input:not([type="checkbox"]):not([type="submit"]), .comment-form textarea { width: 100%; padding: 12px 14px; border: 1px solid var(--stmv-border); border-radius: 10px; }

.stmv-scroll-top {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 60;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 2px solid var(--stmv-primary);
	border-radius: 50%;
	background: var(--stmv-primary);
	color: #fff;
	box-shadow: none;
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: .2s ease;
}
.stmv-scroll-top.is-visible { opacity: 1; visibility: visible; transform: none; }
.stmv-scroll-top svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }

@media (max-width: 1023px) {
	.stmv-layout--has-sidebar { grid-template-columns: 1fr; }
	.stmv-sidebar { display: none; }
	.stmv-hero::before { right: -220px; }
	.stmv-hero::after { right: -80px; opacity: .85; }
}
@media (max-width: 640px) {
	.stmv-container { width: min(calc(100% - 20px), var(--stmv-container)); }
	.stmv-hero { padding-block: 52px; }
	.stmv-hero h1 { font-size: clamp(2.4rem, 13vw, 4rem); }
	.stmv-hero::before, .stmv-hero::after { opacity: .18; }
	.stmv-entry-card { border-radius: 14px; }
	.stmv-search-form { flex-direction: column; }
}

/* v1.2.3 — global viewport containment.
 * Prevents stale horizontal document offsets after responsive aspect changes.
 */
html, body {
	width: 100%;
	max-width: 100%;
	overflow-x: clip;
}

@supports not (overflow: clip) {
	html, body { overflow-x: hidden; }
}

#primary-content,
.site-main,
.site-content,
.stmv-hero,
.stmv-site-header,
.stmv-footer {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

img, video, iframe, canvas, svg { max-width: 100%; }