/* ============================================================
   SOLDIER APPAREL — GLOBAL STYLES (site-wide)
   ============================================================ */

:root {
	--sa-black: #181818;
	--sa-charcoal: #222222;
	--sa-gunmetal: #2c2c2c;
	--sa-steel: #3a3a3a;
	--sa-smoke: #999;
	--sa-mist: #ccc;
	--sa-white: #f5f2ed;
	--sa-olive: #6a6e48;
	--sa-olive-light: #8a8e60;
	--sa-amber: #d4982e;
	--sa-amber-dim: #b07820;
	--sa-red: #9b2020;

	--sa-font-display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
	--sa-font-body:    'Barlow', Arial, sans-serif;
	--sa-font-mono:    'Share Tech Mono', monospace;
}

/* ============================================================
   REUSABLE BUTTON UTILITIES
   Dipakai shortcode [soldier_cta] dan templates baru
   ============================================================ */

.soldier-btn-primary,
body.soldier-site .soldier-btn-primary {
	font-family: var(--sa-font-display);
	font-weight: 700;
	font-size: 14px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-black) !important;
	background: var(--sa-amber);
	padding: 16px 36px;
	text-decoration: none !important;
	display: inline-block;
	transition: background 0.2s;
	clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
	border: none;
	cursor: pointer;
}

.soldier-btn-primary:hover,
body.soldier-site .soldier-btn-primary:hover {
	background: #e0a030;
	color: var(--sa-black) !important;
}

.soldier-btn-ghost,
body.soldier-site .soldier-btn-ghost {
	font-family: var(--sa-font-mono);
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-mist) !important;
	background: transparent;
	border: 1px solid var(--sa-steel);
	padding: 15px 28px;
	text-decoration: none !important;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	transition: all 0.2s;
}

.soldier-btn-ghost:hover,
body.soldier-site .soldier-btn-ghost:hover {
	border-color: var(--sa-amber);
	color: var(--sa-amber) !important;
}


/* ============================================================
   BASE — site-wide reset (gentle, supaya gak break Woo widgets)
   ============================================================ */

body.soldier-site {
	background: var(--sa-black);
	color: var(--sa-white);
	font-family: var(--sa-font-body);
	font-weight: 300;
	margin: 0;
}

body.soldier-site a { color: var(--sa-amber); }
body.soldier-site a:hover { color: #e0a030; }

body.soldier-site h1,
body.soldier-site h2,
body.soldier-site h3,
body.soldier-site h4,
body.soldier-site h5,
body.soldier-site h6 {
	font-family: var(--sa-font-display);
	font-weight: 900;
	color: var(--sa-white);
	letter-spacing: -0.01em;
}

body.soldier-site .soldier-main {
	min-height: 60vh;
}

/* ============================================================
   PARENT THEME (Hello Elementor) WRAPPER RESET
   Hilangkan padding/margin default supaya konten full-width
   tanpa gap antara header (Elementor Theme Builder) dan konten.
   ============================================================ */

body.soldier-site #page,
body.soldier-site .site,
body.soldier-site #content,
body.soldier-site .site-content,
body.soldier-site .site-main,
body.soldier-site .page-content,
body.soldier-site main#content {
	padding: 0 !important;
	margin: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
}

/* ============================================================
   ELEMENTOR THEME BUILDER — Force Full Width pada Header & Footer
   Target SEMUA possible Elementor wrapper, container, column, dan
   flexbox grid biar gak ada gap kiri-kanan.
   ============================================================ */

/* Location wrapper */
body.soldier-site .elementor-location-header,
body.soldier-site .elementor-location-footer {
	margin: 0 !important;
	padding: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
}

/* Elementor outer document */
body.soldier-site .elementor-location-header > .elementor,
body.soldier-site .elementor-location-footer > .elementor {
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
}

/* Section (Boxed, Full Width, atau apapun) */
body.soldier-site .elementor-location-header .elementor-section,
body.soldier-site .elementor-location-footer .elementor-section,
body.soldier-site .elementor-location-header section.elementor-section-boxed,
body.soldier-site .elementor-location-footer section.elementor-section-boxed,
body.soldier-site .elementor-location-header section.elementor-section-full_width,
body.soldier-site .elementor-location-footer section.elementor-section-full_width {
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	height: auto !important;
	min-height: auto !important;
	overflow: visible !important;
}

/* Container baru Elementor (Flexbox/Grid container — versi Elementor terbaru) */
body.soldier-site .elementor-location-header .e-con,
body.soldier-site .elementor-location-footer .e-con,
body.soldier-site .elementor-location-header .e-con-inner,
body.soldier-site .elementor-location-footer .e-con-inner,
body.soldier-site .elementor-location-header .e-flex,
body.soldier-site .elementor-location-footer .e-flex,
body.soldier-site .elementor-location-header .e-grid,
body.soldier-site .elementor-location-footer .e-grid,
body.soldier-site .elementor-location-header [class*="e-con-"],
body.soldier-site .elementor-location-footer [class*="e-con-"] {
	max-width: 100% !important;
	width: 100% !important;
	--container-max-width: 100% !important;
	--container-widget-width: 100% !important;
	--width: 100% !important;
	--content-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

/* Container boxed mode — pakai inner content yang biasanya constrain */
body.soldier-site .elementor-location-header .e-con.e-con-boxed,
body.soldier-site .elementor-location-footer .e-con.e-con-boxed,
body.soldier-site .elementor-location-header .e-con-boxed > .e-con-inner,
body.soldier-site .elementor-location-footer .e-con-boxed > .e-con-inner {
	max-width: 100% !important;
	width: 100% !important;
	--container-max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* .elementor-container (inner box dari section) */
body.soldier-site .elementor-location-header .elementor-container,
body.soldier-site .elementor-location-footer .elementor-container {
	max-width: 100% !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* HTML & body — kill any default margin/padding yang bikin garis ungu di atas */
html,
html body.soldier-site {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	outline: none !important;
}

/* Hello Elementor parent wrapper — pastikan no padding-top yang bikin gap */
body.soldier-site #page,
body.soldier-site .site,
body.soldier-site #content,
body.soldier-site .site-content,
body.soldier-site .site-main,
body.soldier-site main {
	margin-top: 0 !important;
	padding-top: 0 !important;
	border-top: none !important;
}

/* Pastikan area antara header dan content gak ada margin */
body.soldier-site .elementor-location-header + *,
body.soldier-site .elementor-location-header ~ * {
	margin-top: 0 !important;
}

/* Column & widget wrap padding reset */
body.soldier-site .elementor-location-header .elementor-column,
body.soldier-site .elementor-location-footer .elementor-column,
body.soldier-site .elementor-location-header .elementor-column-wrap,
body.soldier-site .elementor-location-footer .elementor-column-wrap,
body.soldier-site .elementor-location-header .elementor-widget-wrap,
body.soldier-site .elementor-location-footer .elementor-widget-wrap {
	padding: 0 !important;
}

/* Shortcode widget wrapper */
body.soldier-site .elementor-widget-shortcode,
body.soldier-site .elementor-widget-shortcode .elementor-widget-container {
	padding: 0 !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

/* ============================================================
   STICKY HEADER VIA ELEMENTOR LOCATION
   Bikin entire location wrapper sticky biar reliable cross-browser.
   Plus pastikan parent wrapper gak punya overflow yang block sticky.
   ============================================================ */

/* Pastikan html/body gak punya margin/padding/overflow yang block layout */
html, body.soldier-site {
	margin: 0 !important;
	padding: 0 !important;
	overflow-x: hidden;
	overflow-y: auto;
	width: 100%;
	max-width: 100%;
}

body.soldier-site #page,
body.soldier-site .site,
body.soldier-site #content,
body.soldier-site .site-content,
body.soldier-site .site-main {
	overflow: visible !important;
	margin: 0 !important;
	padding: 0 !important;
	max-width: 100% !important;
	width: 100% !important;
	border: none !important;
}

/* Elementor location header — FULL WIDTH, no forced sticky.
   Kalau mau sticky, set dari Elementor: edit section → Lanjutan → Motion Effects → Sticky Top. */
body.soldier-site .elementor-location-header {
	width: 100% !important;
	max-width: 100% !important;
	min-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	height: auto !important;
	overflow: visible !important;
	border: none !important;
}

body.soldier-site .elementor-location-footer {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}

/* ============================================================
   HEADER
   ============================================================ */

.soldier-header {
	position: relative;
	width: 100%;
	background: rgba(15, 15, 15, 0.95);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-header-inner {
	max-width: 100%;
	width: 100%;
	margin: 0;
	padding: 14px 48px;
	display: flex;
	align-items: center;
	gap: 32px;
}

.soldier-brand {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none !important;
	color: var(--sa-white) !important;
	flex-shrink: 0;
	max-width: 100%;
	min-width: 0;
}

.soldier-brand-logo {
	/* Default fallback — shortcode bisa override via inline style dengan parameter logo_height */
	height: 40px;
	width: auto;
	max-height: 60px;
	max-width: 280px;
	object-fit: contain;
	display: block;
}

.soldier-brand-text {
	display: flex;
	flex-direction: column;
	line-height: 1;
}

.soldier-brand-text .brand-name {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: 16px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.soldier-brand-text .brand-name .dot { color: var(--sa-amber); }

.soldier-brand-text .brand-tag {
	font-family: var(--sa-font-mono);
	font-size: 9px;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--sa-olive-light);
	margin-top: 3px;
}

.soldier-nav {
	flex: 1;
}

.soldier-nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	gap: 8px;
	justify-content: center;
}

.soldier-nav-list li { position: relative; }

.soldier-nav-list a {
	font-family: var(--sa-font-display);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--sa-mist) !important;
	text-decoration: none !important;
	padding: 10px 16px;
	display: block;
	transition: color 0.2s;
	position: relative;
}

.soldier-nav-list a::after {
	content: '';
	position: absolute;
	bottom: 4px;
	left: 16px;
	right: 16px;
	height: 1px;
	background: var(--sa-amber);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s;
}

.soldier-nav-list a:hover { color: var(--sa-white) !important; }
.soldier-nav-list a:hover::after { transform: scaleX(1); }

.soldier-nav-list .current-menu-item > a { color: var(--sa-amber) !important; }
.soldier-nav-list .current-menu-item > a::after { transform: scaleX(1); }

.soldier-header-actions {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-shrink: 0;
}

.soldier-cart-link {
	position: relative;
	color: var(--sa-mist) !important;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	transition: color 0.2s;
}

.soldier-cart-link:hover { color: var(--sa-amber) !important; }

.soldier-cart-count {
	position: absolute;
	top: -2px;
	right: -2px;
	background: var(--sa-amber);
	color: var(--sa-black);
	font-family: var(--sa-font-mono);
	font-size: 9px;
	font-weight: 700;
	min-width: 16px;
	height: 16px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 4px;
}

.soldier-cart-count[data-count="0"] { display: none; }

.soldier-cta-btn {
	font-family: var(--sa-font-display);
	font-weight: 700;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-black) !important;
	background: var(--sa-amber);
	padding: 11px 22px;
	text-decoration: none !important;
	display: inline-block;
	transition: background 0.2s;
	clip-path: polygon(6px 0%, 100% 0%, calc(100% - 6px) 100%, 0% 100%);
}

.soldier-cta-btn:hover { background: #e0a030; color: var(--sa-black) !important; }

.soldier-burger {
	display: none;
	background: transparent !important;
	border: none !important;
	width: 32px;
	height: 32px;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	cursor: pointer;
	padding: 0 !important;
	box-shadow: none !important;
	outline: none !important;
}

.soldier-burger span {
	display: block !important;
	width: 24px !important;
	height: 2px !important;
	background: var(--sa-white) !important;
	transition: all 0.3s !important;
	margin: 0 auto !important;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	opacity: 1;
}

.soldier-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.soldier-burger.is-open span:nth-child(2) { opacity: 0; }
.soldier-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.soldier-mobile-menu {
	display: none;
	background: var(--sa-charcoal);
	border-top: 1px solid var(--sa-steel);
	padding: 24px 32px;
}

.soldier-mobile-menu.is-open {
	display: block;
}

.soldier-mobile-list {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
}

.soldier-mobile-list li {
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-mobile-list a {
	display: block;
	padding: 16px 0;
	font-family: var(--sa-font-display);
	font-weight: 600;
	font-size: 16px;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--sa-mist) !important;
	text-decoration: none !important;
}

.soldier-mobile-list a:hover { color: var(--sa-amber) !important; }

.soldier-mobile-cta { margin-top: 16px; text-align: center; width: 100%; }

/* Hide header on homepage karena homepage punya hero sendiri */
body.soldier-home-template .soldier-header {
	background: transparent;
	border-bottom: none;
	position: absolute;
	width: 100%;
}

/* ============================================================
   PAGE BANNER — judul halaman dengan vibe Soldier
   Selaras dengan home: ghost text, gradient amber top, diagonal stripes
   ============================================================ */

.soldier-page-banner {
	background: linear-gradient(135deg, #0f0f0f 0%, var(--sa-charcoal) 100%);
	padding: 90px 32px 70px;
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid var(--sa-steel);
}

/* Diagonal stripes overlay */
.soldier-page-banner::before {
	content: '';
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(
		60deg,
		transparent,
		transparent 40px,
		rgba(106, 110, 72, 0.04) 40px,
		rgba(106, 110, 72, 0.04) 41px
	);
	pointer-events: none;
}

/* Top accent line (amber gradient) */
.soldier-page-banner::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, var(--sa-amber) 50%, transparent 100%);
}

.soldier-page-banner-inner {
	max-width: 1400px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}

/* Ghost SOLDIER text di belakang title (match home brand-statement) */
.soldier-page-banner-inner::before {
	content: 'SOLDIER';
	position: absolute;
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(140px, 18vw, 240px);
	color: rgba(255, 255, 255, 0.028);
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	letter-spacing: -0.05em;
	pointer-events: none;
	white-space: nowrap;
	z-index: -1;
	line-height: 1;
}

.banner-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--sa-amber);
	margin-bottom: 16px;
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.banner-eyebrow::before {
	content: '';
	width: 24px;
	height: 1px;
	background: var(--sa-amber);
}

.banner-eyebrow a {
	color: var(--sa-amber) !important;
	text-decoration: none !important;
}

.banner-eyebrow a:hover {
	color: var(--sa-white) !important;
}

.banner-title {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(40px, 6vw, 72px);
	line-height: 0.95;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0 0 18px;
	color: var(--sa-white);
	position: relative;
	z-index: 1;
}

.banner-desc {
	max-width: 640px;
	font-size: 15px;
	color: var(--sa-mist);
	line-height: 1.7;
	margin-top: 18px;
	font-weight: 300;
	position: relative;
	z-index: 1;
}

.banner-desc p { margin: 0 0 8px; }
.banner-desc p:last-child { margin: 0; }

/* ============================================================
   GENERIC PAGE CONTENT (About, Contact, blog post, etc)
   ============================================================ */

.soldier-page-content {
	background: var(--sa-black);
	padding: 60px 32px 100px;
}

.soldier-page-content-inner {
	max-width: 900px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.8;
	color: var(--sa-mist);
}

.soldier-page-content-inner p { margin: 0 0 1.4em; }

.soldier-page-content-inner h2 {
	font-size: 32px;
	margin: 1.6em 0 0.6em;
	color: var(--sa-white);
}

.soldier-page-content-inner h3 {
	font-size: 24px;
	margin: 1.4em 0 0.5em;
}

.soldier-page-content-inner ul,
.soldier-page-content-inner ol {
	padding-left: 1.4em;
	margin: 0 0 1.4em;
}

.soldier-page-content-inner img {
	max-width: 100%;
	height: auto;
}

.soldier-page-content-inner blockquote {
	border-left: 3px solid var(--sa-amber);
	padding: 8px 0 8px 24px;
	margin: 1.6em 0;
	font-style: italic;
	color: var(--sa-white);
}

/* ============================================================
   BLOG GRID (index.php)
   ============================================================ */

.soldier-post-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 24px;
}

.soldier-post-card {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	transition: border-color 0.2s, transform 0.2s;
}

.soldier-post-card:hover {
	border-color: var(--sa-amber);
	transform: translateY(-2px);
}

.soldier-post-card a {
	display: block;
	color: var(--sa-white) !important;
	text-decoration: none !important;
}

.post-card-thumb {
	aspect-ratio: 16/10;
	overflow: hidden;
	background: var(--sa-gunmetal);
}

.post-card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.post-card-body { padding: 20px; }

.post-card-date {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-amber);
	margin-bottom: 8px;
}

.post-card-title {
	font-family: var(--sa-font-display);
	font-weight: 700;
	font-size: 20px;
	line-height: 1.2;
	text-transform: uppercase;
	margin: 0 0 12px;
}

.post-card-excerpt {
	font-size: 13px;
	color: var(--sa-smoke);
	line-height: 1.6;
}

.soldier-pagination {
	margin-top: 48px;
	text-align: center;
}

.soldier-pagination .page-numbers {
	display: inline-block;
	padding: 10px 16px;
	font-family: var(--sa-font-mono);
	font-size: 12px;
	color: var(--sa-mist) !important;
	border: 1px solid var(--sa-steel);
	margin: 0 4px;
	text-decoration: none !important;
}

.soldier-pagination .page-numbers.current,
.soldier-pagination .page-numbers:hover {
	background: var(--sa-amber);
	color: var(--sa-black) !important;
	border-color: var(--sa-amber);
}

/* ============================================================
   404 PAGE
   ============================================================ */

.soldier-404 {
	min-height: 80vh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--sa-black);
	padding: 60px 32px;
	position: relative;
	overflow: hidden;
}

.soldier-404::before {
	content: '';
	position: absolute;
	inset: 0;
	background: repeating-linear-gradient(
		-45deg,
		transparent,
		transparent 60px,
		rgba(155, 32, 32, 0.04) 60px,
		rgba(155, 32, 32, 0.04) 61px
	);
}

.soldier-404-inner {
	text-align: center;
	position: relative;
	z-index: 1;
	max-width: 600px;
}

.soldier-404 .error-code {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(140px, 22vw, 240px);
	line-height: 0.9;
	color: var(--sa-steel);
	margin-bottom: 12px;
}

.soldier-404 .error-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 12px;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--sa-amber);
	margin-bottom: 20px;
}

.soldier-404 .error-title {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(48px, 7vw, 88px);
	line-height: 0.9;
	text-transform: uppercase;
	margin: 0 0 24px;
}

.soldier-404 .error-title .accent { color: var(--sa-amber); }

.soldier-404 .error-desc {
	font-size: 16px;
	color: var(--sa-mist);
	margin-bottom: 36px;
	line-height: 1.7;
}

.soldier-404 .error-actions {
	display: flex;
	gap: 20px;
	justify-content: center;
	flex-wrap: wrap;
	align-items: center;
}

/* 404 pakai reusable .soldier-btn-primary / .soldier-btn-ghost dari atas */
.soldier-404 .soldier-btn-ghost::after {
	content: '→';
	transition: transform 0.2s;
	margin-left: 2px;
}

.soldier-404 .soldier-btn-ghost:hover::after { transform: translateX(4px); }

/* ============================================================
   SITE-WIDE FOOTER (untuk halaman non-homepage)
   ============================================================ */

.soldier-footer.sa-footer {
	background: var(--sa-charcoal);
	border-top: 1px solid var(--sa-steel);
	padding: 60px 0 32px;
}

.soldier-footer .soldier-footer-inner {
	max-width: 100%;
	width: 100%;
	margin: 0;
	padding: 0 48px;
}

.soldier-footer .footer-top {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
	gap: 48px;
	padding-bottom: 48px;
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-footer .footer-brand-name {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: 24px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-bottom: 12px;
	color: var(--sa-white);
}

.soldier-footer .footer-brand-name span { color: var(--sa-amber); }

.soldier-footer .footer-tagline {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-olive-light);
	margin-bottom: 20px;
}

.soldier-footer .footer-desc {
	font-size: 13px;
	color: var(--sa-smoke);
	line-height: 1.7;
	font-weight: 300;
	max-width: 280px;
	margin: 0;
}

.soldier-footer .footer-col-title {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: var(--sa-mist);
	margin-bottom: 20px;
}

.soldier-footer .footer-links {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 0;
	margin: 0;
}

.soldier-footer .footer-links a {
	font-size: 13px;
	color: var(--sa-smoke) !important;
	text-decoration: none !important;
	transition: color 0.2s;
	font-weight: 300;
}

.soldier-footer .footer-links a:hover { color: var(--sa-amber) !important; }

.soldier-footer .footer-bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-top: 28px;
	flex-wrap: wrap;
	gap: 16px;
}

.soldier-footer .footer-copy {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.15em;
	color: var(--sa-smoke);
	text-transform: uppercase;
}

.soldier-footer .footer-socials {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}

.soldier-footer .social-link {
	font-family: var(--sa-font-mono);
	font-size: 9px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--sa-smoke) !important;
	text-decoration: none !important;
	padding: 8px 14px;
	border: 1px solid var(--sa-steel);
	transition: all 0.2s;
}

.soldier-footer .social-link:hover {
	border-color: var(--sa-amber);
	color: var(--sa-amber) !important;
}

/* ============================================================
   FLOATING WHATSAPP (site-wide)
   ============================================================ */

body.soldier-site .wa-float {
	position: fixed;
	bottom: 28px;
	right: 28px;
	z-index: 9999;
	background: #25d366;
	color: white !important;
	width: 58px;
	height: 58px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none !important;
	box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4);
	transition: transform 0.3s, box-shadow 0.3s;
	animation: saWaPulseGlobal 2s ease-in-out infinite;
}

body.soldier-site .wa-float:hover {
	transform: scale(1.1);
	box-shadow: 0 6px 28px rgba(37, 211, 102, 0.6);
}

body.soldier-site .wa-float svg {
	width: 30px;
	height: 30px;
	fill: white;
}

@keyframes saWaPulseGlobal {
	0%, 100% { box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4); }
	50%      { box-shadow: 0 4px 32px rgba(37, 211, 102, 0.7), 0 0 0 8px rgba(37, 211, 102, 0.1); }
}

/* Homepage punya WA button sendiri di template, hide yang dari hook */
body.soldier-home-template > .wa-float {
	display: none;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 1024px) {
	.soldier-nav { display: none; }
	.soldier-burger { display: flex !important; }
}

@media (max-width: 768px) {
	.soldier-header-inner {
		padding: 10px 16px !important;
		gap: 12px !important;
	}
	.soldier-brand-text { display: none !important; }
	.soldier-cta-btn { display: none !important; }

	/* Logo lebih kecil di mobile, max-width ketat biar gak gede */
	.soldier-brand-logo {
		height: 32px !important;
		max-height: 32px !important;
		max-width: 180px !important;
	}

	.soldier-brand {
		flex: 1;
		min-width: 0;
	}

	.soldier-header-actions {
		gap: 10px !important;
		flex-shrink: 0;
	}

	.soldier-cart-link {
		width: 36px !important;
		height: 36px !important;
	}

	.soldier-page-banner { padding: 50px 20px 40px; }
	.soldier-page-content { padding: 40px 20px 60px; }

	.soldier-footer.sa-footer { padding: 48px 0 24px; }
	.soldier-footer .soldier-footer-inner { padding: 0 20px; }
	.soldier-footer .footer-top { grid-template-columns: 1fr 1fr; gap: 32px; }
	.soldier-footer .footer-bottom { flex-direction: column; text-align: center; }
	.soldier-footer .footer-socials { justify-content: center; }

	.soldier-404 .error-actions { flex-direction: column; align-items: center; }
}

@media (max-width: 480px) {
	/* Footer tetap 2x2 grid di phone kecil supaya gak terlalu memanjang
	   vertikal — keep 2 col bukan stack 1 col. */
	.soldier-footer .footer-top {
		grid-template-columns: 1fr 1fr;
		gap: 24px 16px;
	}
	.soldier-footer .footer-col-title {
		font-size: 11px;
		letter-spacing: 0.18em;
	}
	.soldier-footer .footer-links a {
		font-size: 12px;
	}
	.soldier-footer .footer-brand-name {
		font-size: 22px;
	}
	.soldier-footer .footer-desc {
		font-size: 12px;
		line-height: 1.55;
	}
}

@media (max-width: 360px) {
	/* Stack baru di phone super kecil (galaxy fold, dll) */
	.soldier-footer .footer-top { grid-template-columns: 1fr; }
	.sa-wrapper .footer-top { grid-template-columns: 1fr; }
	.sa-wrapper .statement-specs { grid-template-columns: 1fr; }
}

/* ============================================================
   SOLDIER SERIES PAGE — all product categories grid
   ============================================================ */

.soldier-series-template {
	background: var(--sa-black);
	color: var(--sa-mist);
	min-height: 60vh;
}

.soldier-series-template .soldier-page-banner {
	background: var(--sa-charcoal);
	padding: 80px clamp(24px, 6vw, 96px) 64px;
	position: relative;
	overflow: hidden;
}

.soldier-series-template .soldier-page-banner::before {
	content: 'SERIES';
	position: absolute;
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(140px, 18vw, 240px);
	color: rgba(255, 255, 255, 0.025);
	top: 50%;
	right: -2vw;
	transform: translateY(-50%);
	letter-spacing: -0.05em;
	pointer-events: none;
	white-space: nowrap;
	z-index: 0;
}

.soldier-series-template .soldier-page-banner-inner {
	max-width: 1320px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.soldier-series-template .banner-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 11px;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--sa-amber);
	margin-bottom: 14px;
}

.soldier-series-template .banner-eyebrow a {
	color: var(--sa-amber) !important;
	text-decoration: none !important;
	transition: color 0.2s;
}

.soldier-series-template .banner-eyebrow a:hover {
	color: var(--sa-white) !important;
}

.soldier-series-template .banner-title {
	font-family: var(--sa-font-display) !important;
	font-weight: 900 !important;
	font-size: clamp(48px, 7vw, 88px) !important;
	letter-spacing: -0.02em !important;
	text-transform: uppercase;
	color: var(--sa-white) !important;
	line-height: 0.95 !important;
	margin: 0 0 18px !important;
}

.soldier-series-template .banner-desc {
	font-family: var(--sa-font-body);
	font-size: 15px;
	color: var(--sa-mist);
	max-width: 640px;
	line-height: 1.7;
}

.soldier-series-content {
	padding: 60px clamp(24px, 6vw, 96px) 100px;
	background: var(--sa-black);
}

.soldier-series-wrapper {
	max-width: 1320px;
	margin: 0 auto;
}

.soldier-series-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
}

@media (max-width: 1280px) { .soldier-series-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 900px)  { .soldier-series-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px)  { .soldier-series-grid { grid-template-columns: 1fr; } }

.soldier-series-card {
	position: relative;
	aspect-ratio: 3 / 4;
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	display: block;
	text-decoration: none !important;
	overflow: hidden;
	transition: border-color 0.3s ease, transform 0.3s ease;
}

.soldier-series-card:hover {
	border-color: var(--sa-amber);
	transform: translateY(-2px);
}

.soldier-series-card::before {
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 2px;
	background: var(--sa-amber);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.35s ease;
	z-index: 4;
}

.soldier-series-card:hover::before {
	transform: scaleX(1);
}

.soldier-series-card .series-card-bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform 0.5s ease, filter 0.5s ease;
	filter: brightness(0.55) saturate(0.85);
}

.soldier-series-card .series-card-bg-placeholder {
	background: linear-gradient(135deg, var(--sa-gunmetal) 0%, var(--sa-charcoal) 100%);
}

.soldier-series-card:hover .series-card-bg {
	transform: scale(1.06);
	filter: brightness(0.75) saturate(1);
}

.soldier-series-card .series-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(0deg, rgba(10, 10, 10, 0.95) 0%, rgba(10, 10, 10, 0.3) 60%, rgba(10, 10, 10, 0.1) 100%);
}

.soldier-series-card .series-card-num {
	position: absolute;
	top: 16px;
	right: 18px;
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: 64px;
	color: rgba(255, 255, 255, 0.08);
	line-height: 1;
	z-index: 2;
	pointer-events: none;
}

.soldier-series-card .series-card-arrow {
	position: absolute;
	top: 18px;
	left: 18px;
	color: var(--sa-amber);
	font-size: 16px;
	opacity: 0;
	transition: opacity 0.3s, transform 0.3s;
	z-index: 3;
}

.soldier-series-card:hover .series-card-arrow {
	opacity: 1;
	transform: translate(2px, -2px);
}

.soldier-series-card .series-card-info {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 18px 18px 20px;
	z-index: 3;
}

.soldier-series-card .series-card-tag {
	display: inline-block;
	font-family: var(--sa-font-mono);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--sa-amber);
	margin-bottom: 8px;
}

.soldier-series-card .series-card-name {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: 19px;
	color: var(--sa-white) !important;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	line-height: 1.15;
	margin-bottom: 4px;
}

.soldier-series-card .series-card-desc {
	font-family: var(--sa-font-body);
	font-size: 11px;
	color: var(--sa-smoke);
	line-height: 1.5;
	font-style: italic;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.series-empty {
	text-align: center;
	color: var(--sa-smoke);
	font-size: 15px;
	padding: 60px 20px;
}

/* ============================================================
   BLOG PAGE — templates/soldier-blog.php
   ============================================================ */

.soldier-blog-template {
	background: var(--sa-black);
	color: var(--sa-white);
	min-height: 60vh;
}

.soldier-blog-template .soldier-page-banner {
	background: var(--sa-charcoal);
	padding: 110px 24px 80px;
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-blog-template .soldier-page-banner::before {
	content: "FIELD NOTES";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(120px, 16vw, 240px);
	color: rgba(255, 255, 255, 0.025);
	letter-spacing: -0.02em;
	white-space: nowrap;
	pointer-events: none;
	z-index: 0;
}

.soldier-blog-template .soldier-page-banner-inner {
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	text-align: center;
}

.soldier-blog-template .banner-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 11px;
	color: var(--sa-amber);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	margin-bottom: 18px;
	font-weight: 600;
}

.soldier-blog-template .banner-title {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(48px, 8vw, 96px);
	color: var(--sa-white);
	letter-spacing: -0.02em;
	line-height: 0.95;
	margin: 0 0 22px;
	text-transform: uppercase;
}

.soldier-blog-template .banner-desc {
	max-width: 640px;
	margin: 0 auto;
	color: var(--sa-mist);
	font-size: 15px;
	line-height: 1.7;
}

/* Main blog area */
.soldier-blog-template .blog-main {
	padding: 80px clamp(24px, 6vw, 96px);
	background: var(--sa-black);
}

.soldier-blog-template .blog-main-inner {
	max-width: 1320px;
	margin: 0 auto;
}

/* Featured post — full-width hero card */
.soldier-blog-template .blog-featured {
	margin-bottom: 80px;
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	transition: transform 0.4s ease, border-color 0.4s ease;
}

.soldier-blog-template .blog-featured:hover {
	border-color: var(--sa-amber);
	transform: translateY(-4px);
}

.soldier-blog-template .featured-link {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	text-decoration: none;
	color: inherit;
}

.soldier-blog-template .featured-image {
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--sa-gunmetal);
}

.soldier-blog-template .featured-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.soldier-blog-template .blog-featured:hover .featured-image img {
	transform: scale(1.04);
}

.soldier-blog-template .featured-content {
	padding: 48px 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 14px;
}

.soldier-blog-template .featured-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	color: var(--sa-amber);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	font-weight: 600;
}

.soldier-blog-template .featured-date {
	font-family: var(--sa-font-mono);
	font-size: 11px;
	color: var(--sa-olive-light);
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.soldier-blog-template .featured-title {
	font-family: var(--sa-font-display);
	font-weight: 800;
	font-size: clamp(26px, 3vw, 38px);
	line-height: 1.1;
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0;
}

.soldier-blog-template .featured-excerpt {
	color: var(--sa-mist);
	font-size: 15px;
	line-height: 1.7;
	margin: 6px 0;
}

.soldier-blog-template .featured-read {
	font-family: var(--sa-font-mono);
	font-size: 12px;
	color: var(--sa-amber);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	font-weight: 600;
	margin-top: 12px;
	display: inline-block;
}

/* Recent posts section */
.soldier-blog-template .blog-section-title {
	font-family: var(--sa-font-display);
	font-weight: 800;
	font-size: clamp(28px, 3vw, 40px);
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin: 0 0 38px;
	padding-left: 38px;
	position: relative;
}

.soldier-blog-template .blog-section-title::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 24px;
	height: 2px;
	background: var(--sa-amber);
}

.soldier-blog-template .blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.soldier-blog-template .blog-card {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	transition: transform 0.3s ease, border-color 0.3s ease;
	position: relative;
}

.soldier-blog-template .blog-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--sa-amber);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
}

.soldier-blog-template .blog-card:hover {
	border-color: var(--sa-amber);
	transform: translateY(-4px);
}

.soldier-blog-template .blog-card:hover::before {
	transform: scaleX(1);
}

.soldier-blog-template .blog-card a {
	display: block;
	text-decoration: none;
	color: inherit;
}

.soldier-blog-template .blog-card-thumb {
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--sa-gunmetal);
}

.soldier-blog-template .blog-card-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.5s ease;
}

.soldier-blog-template .blog-card:hover .blog-card-thumb img {
	transform: scale(1.06);
}

.soldier-blog-template .blog-card-body {
	padding: 24px 22px 28px;
}

.soldier-blog-template .blog-card-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
	font-family: var(--sa-font-mono);
	font-size: 9px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

.soldier-blog-template .blog-card-cat {
	color: var(--sa-amber);
	font-weight: 600;
	padding: 3px 8px;
	border: 1px solid var(--sa-amber);
	border-radius: 2px;
}

.soldier-blog-template .blog-card-date {
	color: var(--sa-smoke);
}

.soldier-blog-template .blog-card-title {
	font-family: var(--sa-font-display);
	font-weight: 700;
	font-size: 17px;
	line-height: 1.25;
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: 0.01em;
	margin: 0 0 12px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.soldier-blog-template .blog-card:hover .blog-card-title {
	color: var(--sa-amber);
}

.soldier-blog-template .blog-card-excerpt {
	color: var(--sa-mist);
	font-size: 13px;
	line-height: 1.6;
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.soldier-blog-template .blog-no-posts {
	text-align: center;
	padding: 80px 20px;
	color: var(--sa-mist);
}

.soldier-blog-template .blog-no-posts h2 {
	font-family: var(--sa-font-display);
	font-size: 32px;
	color: var(--sa-white);
	text-transform: uppercase;
	margin-bottom: 14px;
}

.soldier-blog-template .blog-more {
	text-align: center;
	margin-top: 60px;
}

.soldier-blog-template .soldier-btn-primary {
	display: inline-block;
	background: transparent;
	color: var(--sa-amber);
	border: 1px solid var(--sa-amber);
	padding: 14px 36px;
	font-family: var(--sa-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	text-decoration: none;
	transition: all 0.25s ease;
}

.soldier-blog-template .soldier-btn-primary:hover {
	background: var(--sa-amber);
	color: var(--sa-black);
}

/* Blog responsive */
@media (max-width: 1024px) {
	.soldier-blog-template .blog-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.soldier-blog-template .featured-link {
		grid-template-columns: 1fr;
	}
	.soldier-blog-template .featured-content {
		padding: 32px 26px;
	}
}

@media (max-width: 600px) {
	.soldier-blog-template .blog-main {
		padding: 50px 18px;
	}
	.soldier-blog-template .blog-grid {
		grid-template-columns: 1fr;
	}
	.soldier-blog-template .blog-featured {
		margin-bottom: 50px;
	}
	.soldier-blog-template .soldier-page-banner {
		padding: 70px 18px 50px;
	}
	.soldier-blog-template .blog-section-title {
		padding-left: 30px;
		margin-bottom: 28px;
	}
}

/* ============================================================
   BLOG ARCHIVE PAGE — Elementor Archive Template #178
   ============================================================
   /blog/ di-render via Elementor Theme Builder Archive Template
   (BUKAN soldier-blog.php template) karena Blog (122) set sebagai
   page_for_posts di Settings → Reading. Elementor Archive override
   default WordPress posts page.

   Markup widget Elementor Posts (.elementor-widget-posts):
     .elementor-posts-container.elementor-posts.elementor-posts--skin-classic.elementor-grid
       article.elementor-post.elementor-grid-item.post-XXX
         a.elementor-post__thumbnail__link
           .elementor-post__thumbnail > img
         .elementor-post__text
           h3.elementor-post__title > a
           .elementor-post__meta-data > span.elementor-post-date
           .elementor-post__excerpt > p
           a.elementor-post__read-more "Read More"
   ============================================================ */

/* Blog body — force black bg + tactical theme */
body.blog,
body.archive.category,
body.archive.tag,
body.search-results {
	background: var(--sa-black) !important;
	color: var(--sa-white);
}

/* Wrapper kontainer Elementor di blog page → transparent supaya body bg show */
body.blog .elementor-section,
body.blog .e-con,
body.blog .elementor-container,
body.blog .elementor-element {
	background-color: transparent !important;
}

/* Posts container — MAIN grid (thumbnail-top widget) jadi 1 column stacked
   vertical. Card horizontal: thumb kiri + text kanan, kasih breathing room. */
body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid {
	display: flex !important;
	flex-direction: column !important;
	gap: 24px !important;
	grid-template-columns: none !important;
}

/* Post card */
body.blog article.elementor-post,
body.blog .elementor-post.elementor-grid-item,
body.archive .elementor-post.elementor-grid-item {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	overflow: hidden;
	transition: transform 0.3s ease, border-color 0.3s ease;
	position: relative;
	padding: 0 !important;
	display: flex !important;
	flex-direction: column;
}

body.blog .elementor-post.elementor-grid-item::before,
body.archive .elementor-post.elementor-grid-item::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 2px;
	background: var(--sa-amber);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.4s ease;
	z-index: 2;
}

body.blog .elementor-post.elementor-grid-item:hover,
body.archive .elementor-post.elementor-grid-item:hover {
	border-color: var(--sa-amber) !important;
	transform: translateY(-4px);
}

body.blog .elementor-post.elementor-grid-item:hover::before,
body.archive .elementor-post.elementor-grid-item:hover::before {
	transform: scaleX(1);
}

/* Post thumbnail */
body.blog .elementor-post__thumbnail__link,
body.archive .elementor-post__thumbnail__link {
	display: block;
	overflow: hidden;
	margin: 0 !important;
	background: var(--sa-gunmetal);
}

body.blog .elementor-post__thumbnail,
body.archive .elementor-post__thumbnail {
	aspect-ratio: 16 / 10 !important;
	overflow: hidden;
	background: var(--sa-gunmetal);
}

body.blog .elementor-post__thumbnail img,
body.archive .elementor-post__thumbnail img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	transition: transform 0.5s ease !important;
}

body.blog .elementor-post:hover .elementor-post__thumbnail img,
body.archive .elementor-post:hover .elementor-post__thumbnail img {
	transform: scale(1.06);
}

/* Post text block */
body.blog .elementor-post__text,
body.archive .elementor-post__text {
	padding: 24px 22px 28px !important;
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1;
}

/* Post title */
body.blog .elementor-post__title,
body.archive .elementor-post__title {
	font-family: var(--sa-font-display) !important;
	font-weight: 700 !important;
	font-size: 17px !important;
	line-height: 1.25 !important;
	color: var(--sa-white) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.01em !important;
	margin: 0 !important;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.blog .elementor-post__title a,
body.archive .elementor-post__title a {
	color: var(--sa-white) !important;
	text-decoration: none !important;
	transition: color 0.2s;
}

body.blog .elementor-post:hover .elementor-post__title a,
body.archive .elementor-post:hover .elementor-post__title a {
	color: var(--sa-amber) !important;
}

/* Post meta (date) */
body.blog .elementor-post__meta-data,
body.archive .elementor-post__meta-data {
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	color: var(--sa-olive-light) !important;
	margin: 0 !important;
}

body.blog .elementor-post-date,
body.blog .elementor-post-author,
body.archive .elementor-post-date,
body.archive .elementor-post-author {
	color: var(--sa-olive-light) !important;
	font-family: var(--sa-font-mono) !important;
}

/* Excerpt */
body.blog .elementor-post__excerpt,
body.archive .elementor-post__excerpt {
	color: var(--sa-mist) !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
	margin: 0 !important;
}

body.blog .elementor-post__excerpt p,
body.archive .elementor-post__excerpt p {
	color: var(--sa-mist) !important;
	margin: 0 !important;
}

/* Read more link → amber tactical */
body.blog .elementor-post__read-more,
body.archive .elementor-post__read-more {
	display: inline-block !important;
	margin-top: 8px !important;
	color: var(--sa-amber) !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	border-bottom: 1px solid transparent;
	transition: border-color 0.2s;
}

body.blog .elementor-post__read-more:hover,
body.archive .elementor-post__read-more:hover {
	border-bottom-color: var(--sa-amber) !important;
}

/* Headings di archive page (kalau ada elementor-widget-heading) */
body.blog .elementor-widget-heading h1,
body.blog .elementor-widget-heading h2,
body.blog .elementor-widget-heading h3,
body.archive .elementor-widget-heading h1,
body.archive .elementor-widget-heading h2,
body.archive .elementor-widget-heading h3 {
	color: var(--sa-white) !important;
	font-family: var(--sa-font-display) !important;
	text-transform: uppercase !important;
	letter-spacing: -0.01em !important;
}

/* Pagination Elementor */
body.blog .elementor-pagination,
body.archive .elementor-pagination {
	margin-top: 50px !important;
	text-align: center;
}

body.blog .elementor-pagination .page-numbers,
body.archive .elementor-pagination .page-numbers {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	color: var(--sa-mist) !important;
	padding: 10px 16px !important;
	margin: 0 4px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	border-radius: 0 !important;
	transition: all 0.2s !important;
}

body.blog .elementor-pagination .page-numbers.current,
body.blog .elementor-pagination .page-numbers:hover,
body.archive .elementor-pagination .page-numbers.current,
body.archive .elementor-pagination .page-numbers:hover {
	background: var(--sa-amber) !important;
	color: var(--sa-black) !important;
	border-color: var(--sa-amber) !important;
}

/* Mobile blog grid */
@media (max-width: 1024px) {
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}
}

@media (max-width: 600px) {
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-posts-container.elementor-grid {
		grid-template-columns: 1fr !important;
	}
}

/* ============================================================
   BLOG SIDEBAR WIDGETS
   ============================================================
   Sidebar punya widget: heading (FILTER BY CATEGORIES, SOCIALS,
   RECENT POST), MailChimp (mis-labeled "Search"), Category List
   ElementsKit, Social Share ElementsKit, recent posts.
   ============================================================ */

/* Semua heading widget (semua heading level h1-h6) → tactical visible */
body.blog .elementor-widget-heading .elementor-heading-title,
body.blog .elementor-widget-heading h1,
body.blog .elementor-widget-heading h2,
body.blog .elementor-widget-heading h3,
body.blog .elementor-widget-heading h4,
body.blog .elementor-widget-heading h5,
body.blog .elementor-widget-heading h6,
body.archive .elementor-widget-heading .elementor-heading-title,
body.archive .elementor-widget-heading h1,
body.archive .elementor-widget-heading h2,
body.archive .elementor-widget-heading h3,
body.archive .elementor-widget-heading h4,
body.archive .elementor-widget-heading h5,
body.archive .elementor-widget-heading h6 {
	color: var(--sa-white) !important;
	font-family: var(--sa-font-display) !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em !important;
}

/* Divider widgets di sidebar — pakai steel line + amber accent */
body.blog .elementor-widget-divider .elementor-divider-separator,
body.archive .elementor-widget-divider .elementor-divider-separator {
	border-top-color: var(--sa-steel) !important;
	border-top-width: 1px !important;
}

/* ===== Category list (.elementor-widget-elementskit-category-list) ===== */
body.blog .elementor-widget-elementskit-category-list .ekit-wid-con,
body.archive .elementor-widget-elementskit-category-list .ekit-wid-con {
	background: transparent !important;
	padding: 0 !important;
}

body.blog .elementor-widget-elementskit-category-list ul.elementor-icon-list-items,
body.archive .elementor-widget-elementskit-category-list ul.elementor-icon-list-items {
	list-style: none !important;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 2px !important;
}

body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-item,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-item {
	margin: 0 !important;
	padding: 0 !important;
}

body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-item a,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-item a {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	padding: 11px 14px !important;
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	color: var(--sa-mist) !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	transition: all 0.2s !important;
}

body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-item a:hover,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-item a:hover {
	background: var(--sa-gunmetal) !important;
	color: var(--sa-amber) !important;
	border-color: var(--sa-amber) !important;
}

body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-icon,
body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-icon svg,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-icon,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-icon svg {
	color: var(--sa-amber) !important;
	fill: var(--sa-amber) !important;
	width: 11px !important;
	height: 11px !important;
}

body.blog .elementor-widget-elementskit-category-list .elementor-icon-list-text,
body.archive .elementor-widget-elementskit-category-list .elementor-icon-list-text {
	color: inherit !important;
	font-family: inherit !important;
}

/* ===== Social Share (.ekit_socialshare) ===== */
body.blog .ekit_socialshare,
body.archive .ekit_socialshare {
	list-style: none !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 8px !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.blog .ekit_socialshare li,
body.archive .ekit_socialshare li {
	margin: 0 !important;
	padding: 0 !important;
}

body.blog .ekit_socialshare li > div,
body.archive .ekit_socialshare li > div {
	background: var(--sa-charcoal) !important;
	background-color: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	width: 38px !important;
	height: 38px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	cursor: pointer;
	transition: all 0.2s !important;
}

body.blog .ekit_socialshare li > div:hover,
body.archive .ekit_socialshare li > div:hover {
	background: var(--sa-amber) !important;
	background-color: var(--sa-amber) !important;
	border-color: var(--sa-amber) !important;
}

body.blog .ekit_socialshare li > div i,
body.blog .ekit_socialshare li > div svg,
body.archive .ekit_socialshare li > div i,
body.archive .ekit_socialshare li > div svg {
	color: var(--sa-amber) !important;
	fill: var(--sa-amber) !important;
	font-size: 14px !important;
	transition: color 0.2s !important;
}

body.blog .ekit_socialshare li > div:hover i,
body.blog .ekit_socialshare li > div:hover svg,
body.archive .ekit_socialshare li > div:hover i,
body.archive .ekit_socialshare li > div:hover svg {
	color: var(--sa-black) !important;
	fill: var(--sa-black) !important;
}

/* ===== MailChimp / Search widget (.ekit-mailChimpForm) ===== */
body.blog .elementor-widget-elementskit-mail-chimp,
body.archive .elementor-widget-elementskit-mail-chimp {
	background: transparent !important;
}

body.blog .ekit-mailChimpForm,
body.archive .ekit-mailChimpForm {
	background: transparent !important;
}

body.blog .ekit-mail-chimp-email,
body.blog .elementskit_form_wraper.elementskit_inline_form,
body.archive .ekit-mail-chimp-email,
body.archive .elementskit_form_wraper.elementskit_inline_form {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
}

body.blog .ekit_mail_email,
body.blog input.ekit_mail_email,
body.blog input.ekit_form_control,
body.archive .ekit_mail_email,
body.archive input.ekit_mail_email,
body.archive input.ekit_form_control {
	background: var(--sa-gunmetal) !important;
	background-color: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 12px 14px !important;
	font-family: var(--sa-font-body) !important;
	font-size: 14px !important;
	box-shadow: none !important;
	width: 100% !important;
}

body.blog .ekit_mail_email:focus,
body.archive .ekit_mail_email:focus {
	border-color: var(--sa-amber) !important;
	outline: none !important;
}

body.blog .ekit_mail_email::placeholder,
body.archive .ekit_mail_email::placeholder {
	color: var(--sa-smoke) !important;
	font-family: var(--sa-font-body) !important;
}

/* Submit button — currently RED, force amber tactical */
body.blog .ekit-mail-submit,
body.blog button.ekit-mail-submit,
body.archive .ekit-mail-submit,
body.archive button.ekit-mail-submit {
	background: var(--sa-amber) !important;
	background-color: var(--sa-amber) !important;
	background-image: none !important;
	color: var(--sa-black) !important;
	border: 1px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	padding: 12px 16px !important;
	cursor: pointer !important;
	transition: all 0.2s !important;
	box-shadow: none !important;
}

body.blog .ekit-mail-submit:hover,
body.archive .ekit-mail-submit:hover {
	background: transparent !important;
	background-color: transparent !important;
	color: var(--sa-amber) !important;
}

body.blog .ekit-mail-submit svg,
body.blog .ekit-mail-submit i,
body.archive .ekit-mail-submit svg,
body.archive .ekit-mail-submit i {
	fill: var(--sa-black) !important;
	color: var(--sa-black) !important;
	width: 16px !important;
	height: 16px !important;
	transition: fill 0.2s !important;
}

body.blog .ekit-mail-submit:hover svg,
body.blog .ekit-mail-submit:hover i,
body.archive .ekit-mail-submit:hover svg,
body.archive .ekit-mail-submit:hover i {
	fill: var(--sa-amber) !important;
	color: var(--sa-amber) !important;
}

body.blog .ekit-mail-message,
body.archive .ekit-mail-message {
	color: var(--sa-mist) !important;
	font-size: 12px !important;
}

/* ===== Recent Posts sidebar widget (.elementor-posts--thumbnail-left) =====
   Different layout from main grid (thumb di kiri, text di kanan,
   compact, no excerpt). Override main grid rules untuk widget ini. */
body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-posts-container,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-posts-container {
	display: flex !important;
	flex-direction: column !important;
	gap: 12px !important;
	grid-template-columns: none !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post {
	display: grid !important;
	grid-template-columns: 90px minmax(0, 1fr) !important;
	gap: 14px !important;
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	padding: 10px !important;
	transform: none !important;
	flex-direction: row !important;
	align-items: stretch !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post::before,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post::before {
	display: none !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post:hover,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post:hover {
	border-color: var(--sa-amber) !important;
	transform: none !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail__link,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail__link {
	margin: 0 !important;
	display: block !important;
	width: 90px !important;
	height: 90px !important;
	flex-shrink: 0 !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail {
	aspect-ratio: 1 / 1 !important;
	width: 90px !important;
	height: 90px !important;
	margin: 0 !important;
	overflow: hidden !important;
	position: relative !important;
	display: block !important;
	background: var(--sa-gunmetal) !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail img,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__thumbnail img {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	max-height: 100% !important;
	object-fit: cover !important;
	object-position: center !important;
	display: block !important;
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	transition: transform 0.5s ease !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post:hover .elementor-post__thumbnail img,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post:hover .elementor-post__thumbnail img {
	transform: scale(1.06) !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__text,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__text {
	padding: 0 !important;
	gap: 6px !important;
	justify-content: center !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__title,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__title {
	font-size: 12px !important;
	line-height: 1.3 !important;
	margin: 0 !important;
	-webkit-line-clamp: 2 !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__excerpt,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__excerpt {
	display: none !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__read-more,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__read-more {
	display: none !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__meta-data,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-left .elementor-post__meta-data {
	font-size: 9px !important;
	letter-spacing: 0.16em !important;
	margin: 0 !important;
}

/* ===== MAIN posts (thumbnail-top widget) — 1 col stacked, card horizontal:
   thumb 280px kiri + text fluid kanan. Spacious, title 2 line natural. */
body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post {
	display: grid !important;
	grid-template-columns: 280px minmax(0, 1fr) !important;
	gap: 0 !important;
	flex-direction: row !important;
	padding: 0 !important;
	width: 100% !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail__link,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail__link {
	height: 100% !important;
	display: block !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail {
	aspect-ratio: auto !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 200px;
	overflow: hidden;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail img,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__text,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__text {
	padding: 28px 32px !important;
	justify-content: center !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__title,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__title {
	font-size: 22px !important;
	line-height: 1.2 !important;
	-webkit-line-clamp: 2 !important;
}

body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__excerpt p,
body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__excerpt p {
	font-size: 14px !important;
	line-height: 1.7 !important;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Mobile: stack vertical (thumb top, text bottom) */
@media (max-width: 768px) {
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post {
		grid-template-columns: 1fr !important;
	}
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__thumbnail {
		aspect-ratio: 16 / 9 !important;
		min-height: auto;
	}
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__title,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__title {
		font-size: 18px !important;
	}
	body.blog .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__text,
	body.archive .elementor-widget-posts.elementor-posts--thumbnail-top .elementor-post__text {
		padding: 22px 22px !important;
	}
}

/* Banner judul "Bahan Quick Dry" dll yang nempel di gambar — itu overlay banner
   Elementor image yang ada di thumbnail. Kasih readable shadow.  */
body.blog .elementor-post__thumbnail__link .elementor-post__title-overlay,
body.archive .elementor-post__thumbnail__link .elementor-post__title-overlay {
	background: linear-gradient(transparent 50%, rgba(0,0,0,0.7) 100%) !important;
}

/* ============================================================
   SINGLE POST — child theme index.php markup
   ============================================================
   Markup (from index.php):
     .soldier-page-banner > .soldier-page-banner-inner
       .banner-eyebrow "post"
       h1.banner-title (post title)
     .soldier-page-content > .soldier-page-content-inner
       article.soldier-single-post
         .post-thumb > img (featured image)
         (the_content() output: p.wp-block-paragraph, h2, h3, ul, ol, img, etc.)
   ============================================================ */

body.single-post {
	background: var(--sa-black) !important;
	color: var(--sa-mist);
}

/* Force Elementor wrapper bg transparent (since elementor-page-72 enqueued
   global Elementor CSS that might color bg) */
body.single-post .elementor-section,
body.single-post .e-con,
body.single-post .elementor-container,
body.single-post .elementor-element {
	background-color: transparent !important;
}

/* Banner — tactical hero dengan watermark "FIELD NOTES" */
body.single-post .soldier-page-banner {
	background: var(--sa-charcoal) !important;
	padding: 90px 24px 50px;
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid var(--sa-steel);
}

body.single-post .soldier-page-banner::before {
	content: "FIELD NOTES";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(120px, 16vw, 220px);
	color: rgba(255, 255, 255, 0.025);
	letter-spacing: -0.02em;
	white-space: nowrap;
	pointer-events: none;
	z-index: 0;
}

body.single-post .soldier-page-banner-inner {
	max-width: 880px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	text-align: center;
}

body.single-post .banner-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 11px;
	color: var(--sa-amber);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	margin-bottom: 14px;
	font-weight: 600;
}

body.single-post .banner-title {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(28px, 4vw, 48px);
	color: var(--sa-white);
	letter-spacing: -0.01em;
	line-height: 1.1;
	margin: 0;
	text-transform: uppercase;
}

/* Content wrapper */
body.single-post .soldier-page-content {
	background: var(--sa-black);
	padding: 60px clamp(20px, 5vw, 60px) 80px;
}

body.single-post .soldier-page-content-inner {
	max-width: 820px;
	margin: 0 auto;
}

/* Article wrapper */
body.single-post article.soldier-single-post {
	background: transparent;
	color: var(--sa-mist);
	padding: 0;
}

/* Featured image (post-thumb) */
body.single-post .post-thumb {
	background: var(--sa-charcoal);
	padding: 14px;
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	margin: 0 0 40px;
	overflow: hidden;
	position: relative;
}

body.single-post .post-thumb img {
	width: 100%;
	height: auto;
	display: block;
	max-height: 480px;
	object-fit: cover;
}

/* Content typography */
body.single-post article.soldier-single-post p,
body.single-post .wp-block-paragraph {
	color: var(--sa-mist);
	font-family: var(--sa-font-body);
	font-size: 16px;
	line-height: 1.8;
	margin: 0 0 22px;
}

body.single-post article.soldier-single-post h1,
body.single-post article.soldier-single-post h2,
body.single-post article.soldier-single-post h3,
body.single-post article.soldier-single-post h4,
body.single-post article.soldier-single-post h5,
body.single-post article.soldier-single-post h6 {
	color: var(--sa-white);
	font-family: var(--sa-font-display);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.01em;
	margin: 50px 0 18px;
	position: relative;
	padding-left: 28px;
}

body.single-post article.soldier-single-post h1 { font-size: 32px; }
body.single-post article.soldier-single-post h2 { font-size: 26px; }
body.single-post article.soldier-single-post h3 { font-size: 21px; }
body.single-post article.soldier-single-post h4 { font-size: 18px; }

body.single-post article.soldier-single-post h2::before,
body.single-post article.soldier-single-post h3::before,
body.single-post article.soldier-single-post h4::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 18px;
	height: 2px;
	background: var(--sa-amber);
}

/* Inline links */
body.single-post article.soldier-single-post a,
body.single-post .wp-block-paragraph a {
	color: var(--sa-amber);
	text-decoration: none;
	border-bottom: 1px solid rgba(255, 191, 30, 0.4);
	transition: border-color 0.2s, color 0.2s;
}

body.single-post article.soldier-single-post a:hover,
body.single-post .wp-block-paragraph a:hover {
	color: var(--sa-white);
	border-bottom-color: var(--sa-amber);
}

/* Lists */
body.single-post article.soldier-single-post ul,
body.single-post article.soldier-single-post ol {
	color: var(--sa-mist);
	font-size: 15px;
	line-height: 1.8;
	padding-left: 26px;
	margin: 0 0 24px;
}

body.single-post article.soldier-single-post ul {
	list-style: none;
	padding-left: 0;
}

body.single-post article.soldier-single-post ul li {
	position: relative;
	padding-left: 24px;
	margin-bottom: 10px;
}

body.single-post article.soldier-single-post ul li::before {
	content: '—';
	position: absolute;
	left: 0;
	color: var(--sa-amber);
	font-weight: 700;
}

body.single-post article.soldier-single-post ol {
	counter-reset: post-counter;
	list-style: none;
	padding-left: 0;
}

body.single-post article.soldier-single-post ol li {
	counter-increment: post-counter;
	position: relative;
	padding-left: 36px;
	margin-bottom: 10px;
}

body.single-post article.soldier-single-post ol li::before {
	content: counter(post-counter, decimal-leading-zero);
	position: absolute;
	left: 0;
	color: var(--sa-amber);
	font-family: var(--sa-font-mono);
	font-weight: 700;
	font-size: 12px;
	top: 2px;
}

/* Blockquote */
body.single-post article.soldier-single-post blockquote,
body.single-post .wp-block-quote {
	background: var(--sa-charcoal);
	border-left: 3px solid var(--sa-amber);
	padding: 22px 26px;
	margin: 32px 0;
	font-style: italic;
	color: var(--sa-white);
	font-size: 17px;
	line-height: 1.6;
}

body.single-post article.soldier-single-post blockquote p,
body.single-post .wp-block-quote p {
	color: var(--sa-white);
	margin: 0;
	font-style: italic;
}

/* Inline images */
body.single-post article.soldier-single-post img:not(.wp-post-image) {
	max-width: 100%;
	height: auto;
	border: 1px solid var(--sa-steel);
	margin: 24px 0;
}

body.single-post article.soldier-single-post figure {
	margin: 32px 0;
}

body.single-post article.soldier-single-post figcaption {
	color: var(--sa-smoke);
	font-family: var(--sa-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-align: center;
	margin-top: 10px;
}

/* Code blocks */
body.single-post article.soldier-single-post code {
	background: var(--sa-gunmetal);
	color: var(--sa-amber);
	padding: 2px 6px;
	font-family: var(--sa-font-mono);
	font-size: 13px;
	border: 1px solid var(--sa-steel);
}

body.single-post article.soldier-single-post pre {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-left: 3px solid var(--sa-amber);
	padding: 18px 22px;
	overflow-x: auto;
	margin: 24px 0;
}

body.single-post article.soldier-single-post pre code {
	background: transparent;
	border: none;
	padding: 0;
	color: var(--sa-white);
}

/* Strong/em */
body.single-post article.soldier-single-post strong,
body.single-post article.soldier-single-post b {
	color: var(--sa-white);
	font-weight: 700;
}

body.single-post article.soldier-single-post em,
body.single-post article.soldier-single-post i {
	color: var(--sa-amber);
}

/* HR — tactical divider */
body.single-post article.soldier-single-post hr,
body.single-post .wp-block-separator {
	border: none;
	height: 1px;
	background: var(--sa-steel);
	margin: 40px 0;
	position: relative;
}

body.single-post article.soldier-single-post hr::after,
body.single-post .wp-block-separator::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 60px;
	height: 1px;
	background: var(--sa-amber);
}

/* Post categories/tags at bottom (kalau Elementor inject) */
body.single-post .post-categories,
body.single-post .post-tags,
body.single-post .entry-meta {
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid var(--sa-steel);
	font-family: var(--sa-font-mono);
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

body.single-post .post-categories a,
body.single-post .post-tags a {
	display: inline-block;
	color: var(--sa-amber);
	border: 1px solid var(--sa-amber);
	padding: 6px 12px;
	margin-right: 8px;
	text-decoration: none;
	font-weight: 600;
	transition: all 0.2s;
}

body.single-post .post-categories a:hover,
body.single-post .post-tags a:hover {
	background: var(--sa-amber);
	color: var(--sa-black);
}

/* Mobile single post */
@media (max-width: 768px) {
	body.single-post .soldier-page-banner {
		padding: 60px 18px 36px;
	}
	body.single-post .soldier-page-content {
		padding: 40px 18px 60px;
	}
	body.single-post article.soldier-single-post p,
	body.single-post .wp-block-paragraph {
		font-size: 15px;
	}
	body.single-post article.soldier-single-post h2 { font-size: 22px; }
	body.single-post article.soldier-single-post h3 { font-size: 18px; }
}

/* ============================================================
   CONTACT PAGE — soldier-contact-template + page-id-172
   ============================================================
   Contact page (ID 172) saat ini Elementor-built. CSS di sini cover
   2 skenario: (1) kalau template di-switch ke soldier-contact.php
   nanti, (2) override tactical visual untuk Elementor build current.
   ============================================================ */

.soldier-contact-template {
	background: var(--sa-black);
	color: var(--sa-white);
	min-height: 60vh;
}

.soldier-contact-template .soldier-page-banner {
	background: var(--sa-charcoal);
	padding: 110px 24px 80px;
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-contact-template .soldier-page-banner::before {
	content: "CONTACT";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(120px, 18vw, 280px);
	color: rgba(255, 255, 255, 0.025);
	letter-spacing: -0.02em;
	white-space: nowrap;
	pointer-events: none;
	z-index: 0;
}

.soldier-contact-template .soldier-page-banner-inner {
	max-width: 1100px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
	text-align: center;
}

.soldier-contact-template .banner-eyebrow {
	font-family: var(--sa-font-mono);
	font-size: 11px;
	color: var(--sa-amber);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	margin-bottom: 18px;
	font-weight: 600;
}

.soldier-contact-template .banner-title {
	font-family: var(--sa-font-display);
	font-weight: 900;
	font-size: clamp(44px, 7vw, 88px);
	color: var(--sa-white);
	letter-spacing: -0.02em;
	line-height: 0.95;
	margin: 0 0 22px;
	text-transform: uppercase;
}

.soldier-contact-template .banner-desc {
	max-width: 620px;
	margin: 0 auto;
	color: var(--sa-mist);
	font-size: 15px;
	line-height: 1.7;
}

/* Main grid: info aside + form section */
.soldier-contact-template .contact-main {
	padding: 80px clamp(24px, 6vw, 96px);
	background: var(--sa-black);
}

.soldier-contact-template .contact-main-inner {
	max-width: 1200px;
	margin: 0 auto;
	display: grid;
	grid-template-columns: 380px 1fr;
	gap: 40px;
	align-items: start;
}

/* Contact info aside */
.soldier-contact-template .contact-info {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	padding: 38px 32px;
}

.soldier-contact-template .contact-info-title {
	font-family: var(--sa-font-display);
	font-weight: 800;
	font-size: 22px;
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 28px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-contact-template .contact-block {
	display: grid;
	grid-template-columns: 44px 1fr;
	gap: 14px;
	margin-bottom: 22px;
	align-items: start;
}

.soldier-contact-template .contact-icon {
	width: 44px;
	height: 44px;
	background: var(--sa-gunmetal);
	border: 1px solid var(--sa-steel);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: var(--sa-amber);
	flex-shrink: 0;
}

.soldier-contact-template .contact-label {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	color: var(--sa-olive-light);
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin-bottom: 4px;
	font-weight: 600;
}

.soldier-contact-template .contact-value {
	color: var(--sa-white);
	font-size: 14px;
	line-height: 1.5;
	text-decoration: none;
	transition: color 0.2s;
}

a.contact-value:hover {
	color: var(--sa-amber);
}

.soldier-contact-template .contact-socials {
	margin-top: 28px;
	padding-top: 22px;
	border-top: 1px solid var(--sa-steel);
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.soldier-contact-template .contact-social {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--sa-amber);
	background: transparent;
	border: 1px solid var(--sa-amber);
	padding: 7px 12px;
	text-decoration: none;
	transition: all 0.2s;
}

.soldier-contact-template .contact-social:hover {
	background: var(--sa-amber);
	color: var(--sa-black);
}

/* Form section */
.soldier-contact-template .contact-form-section {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	padding: 38px 36px;
}

.soldier-contact-template .contact-form-title {
	font-family: var(--sa-font-display);
	font-weight: 800;
	font-size: clamp(24px, 3vw, 32px);
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 26px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--sa-steel);
}

.soldier-contact-template .contact-form-content input[type="text"],
.soldier-contact-template .contact-form-content input[type="email"],
.soldier-contact-template .contact-form-content input[type="tel"],
.soldier-contact-template .contact-form-content textarea,
.soldier-contact-template .contact-form-content select {
	width: 100%;
	background: var(--sa-gunmetal);
	border: 1px solid var(--sa-steel);
	border-radius: 0;
	padding: 12px 14px;
	color: var(--sa-white);
	font-family: var(--sa-font-body);
	font-size: 14px;
	margin-bottom: 14px;
	transition: border-color 0.2s;
}

.soldier-contact-template .contact-form-content input:focus,
.soldier-contact-template .contact-form-content textarea:focus,
.soldier-contact-template .contact-form-content select:focus {
	border-color: var(--sa-amber);
	outline: none;
}

.soldier-contact-template .contact-form-content textarea {
	min-height: 130px;
	resize: vertical;
}

.soldier-contact-template .contact-form-content label {
	font-family: var(--sa-font-mono);
	font-size: 10px;
	color: var(--sa-olive-light);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 6px;
	display: block;
}

.soldier-contact-template .contact-form-content button,
.soldier-contact-template .contact-form-content input[type="submit"] {
	background: transparent;
	color: var(--sa-amber);
	border: 1px solid var(--sa-amber);
	padding: 13px 32px;
	font-family: var(--sa-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	cursor: pointer;
	transition: all 0.25s;
}

.soldier-contact-template .contact-form-content button:hover,
.soldier-contact-template .contact-form-content input[type="submit"]:hover {
	background: var(--sa-amber);
	color: var(--sa-black);
}

.soldier-contact-template .contact-form-fallback {
	color: var(--sa-mist);
	font-size: 13px;
	line-height: 1.6;
	margin: 20px 0 18px;
}

.soldier-contact-template .soldier-btn-primary {
	display: inline-block;
	background: var(--sa-amber);
	color: var(--sa-black);
	padding: 13px 32px;
	font-family: var(--sa-font-mono);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.25em;
	text-transform: uppercase;
	text-decoration: none;
	border: 1px solid var(--sa-amber);
	transition: all 0.25s;
}

.soldier-contact-template .soldier-btn-primary:hover {
	background: transparent;
	color: var(--sa-amber);
}

/* Contact responsive */
@media (max-width: 1024px) {
	.soldier-contact-template .contact-main-inner {
		grid-template-columns: 1fr;
		gap: 28px;
	}
}

@media (max-width: 600px) {
	.soldier-contact-template .contact-main {
		padding: 50px 18px;
	}
	.soldier-contact-template .contact-info,
	.soldier-contact-template .contact-form-section {
		padding: 28px 22px;
	}
	.soldier-contact-template .soldier-page-banner {
		padding: 70px 18px 50px;
	}
}

/* ============================================================
   CONTACT PAGE Elementor build (page-id-172)
   ============================================================
   Struktur Elementor (extracted dari DB _elementor_data):
   - Section 5aed91ae (bg HARDCODED #FFFFFF — penyebab utama white area)
     - Column 7f2924d4 (LEFT — Informasi Toko)
       - Heading 770f31c3 "INFORMASI TOKO"
       - text-editor 1d83fc8d (deskripsi)
       - 4× icon-box (4fc6dd22, c9e4aee, 48df0b1e, 33d678f) → Alamat,
         Hubungi Kami, Email, Jam Operasional
       - Divider 47383f9c
     - Column 694ad695 (RIGHT — Form)
       - Heading 5acba68e "PUNYA PERTANYAAN?"
       - text-editor 10deafac
       - Form widget 6e067f8c ← Elementor Pro Form, BUKAN CF7
   ============================================================ */

body.page-id-172 {
	background: var(--sa-black) !important;
	color: var(--sa-white);
}

/* Section utama dgn bg hardcoded #FFFFFF — force black via ID specific */
body.page-id-172 .elementor-element.elementor-element-5aed91ae,
body.page-id-172 .elementor-element.elementor-element-5aed91ae > .elementor-background-overlay,
body.page-id-172 section.elementor-section,
body.page-id-172 .elementor-section,
body.page-id-172 .e-con,
body.page-id-172 .elementor-container,
body.page-id-172 .elementor-column,
body.page-id-172 .elementor-column-wrap {
	background: var(--sa-black) !important;
	background-color: var(--sa-black) !important;
	background-image: none !important;
}

/* Heading widgets (INFORMASI TOKO, PUNYA PERTANYAAN?) */
body.page-id-172 .elementor-widget-heading .elementor-heading-title,
body.page-id-172 .elementor-widget-heading h1,
body.page-id-172 .elementor-widget-heading h2,
body.page-id-172 .elementor-widget-heading h3,
body.page-id-172 .elementor-widget-heading h4 {
	color: var(--sa-white) !important;
	font-family: var(--sa-font-display) !important;
	font-weight: 800 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.01em !important;
}

/* Text editor descriptions (deskripsi paragraf di bawah heading) */
body.page-id-172 .elementor-widget-text-editor,
body.page-id-172 .elementor-widget-text-editor p,
body.page-id-172 .elementor-widget-text-editor div,
body.page-id-172 .elementor-widget-text-editor span {
	color: var(--sa-mist) !important;
}

/* Icon boxes (Alamat, Hubungi Kami, Email, Jam Operasional) — force visible */
body.page-id-172 .elementor-widget-icon-box,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-wrapper {
	background: transparent !important;
}

body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-title,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-title a,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-title span {
	color: var(--sa-white) !important;
	font-family: var(--sa-font-display) !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.04em !important;
	font-size: 14px !important;
}

body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-description,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-content p,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-box-content {
	color: var(--sa-mist) !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
}

body.page-id-172 .elementor-widget-icon-box .elementor-icon,
body.page-id-172 .elementor-widget-icon-box .elementor-icon i,
body.page-id-172 .elementor-widget-icon-box .elementor-icon svg,
body.page-id-172 .elementor-widget-icon-box .elementor-icon-wrapper {
	color: var(--sa-amber) !important;
	fill: var(--sa-amber) !important;
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
}

body.page-id-172 .elementor-widget-icon-box .elementor-icon i::before {
	color: var(--sa-amber) !important;
}

/* Divider widget */
body.page-id-172 .elementor-widget-divider .elementor-divider-separator {
	border-top-color: var(--sa-steel) !important;
}

body.page-id-172 .elementor-widget-divider .elementor-divider__text {
	color: var(--sa-mist) !important;
	font-family: var(--sa-font-mono) !important;
}

/* ===== Elementor Pro FORM widget (id 6e067f8c) =====
   Field defaults: white bg + dark text → flip ke gunmetal + white */
body.page-id-172 .elementor-widget-form .elementor-form,
body.page-id-172 .elementor-widget-form {
	background: transparent !important;
}

body.page-id-172 .elementor-widget-form .elementor-field-group label,
body.page-id-172 .elementor-widget-form .elementor-field-group .elementor-field-label {
	color: var(--sa-olive-light) !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	font-weight: 600 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	margin-bottom: 6px !important;
}

body.page-id-172 .elementor-widget-form .elementor-field,
body.page-id-172 .elementor-widget-form input.elementor-field,
body.page-id-172 .elementor-widget-form textarea.elementor-field,
body.page-id-172 .elementor-widget-form select.elementor-field,
body.page-id-172 .elementor-widget-form .elementor-field-textual,
body.page-id-172 .elementor-widget-form input[type="text"],
body.page-id-172 .elementor-widget-form input[type="email"],
body.page-id-172 .elementor-widget-form input[type="tel"],
body.page-id-172 .elementor-widget-form input[type="url"],
body.page-id-172 .elementor-widget-form input[type="number"],
body.page-id-172 .elementor-widget-form textarea {
	background: var(--sa-gunmetal) !important;
	background-color: var(--sa-gunmetal) !important;
	background-image: none !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 14px 16px !important;
	font-family: var(--sa-font-body) !important;
	font-size: 14px !important;
	box-shadow: none !important;
	transition: border-color 0.2s !important;
}

body.page-id-172 .elementor-widget-form .elementor-field::placeholder,
body.page-id-172 .elementor-widget-form input::placeholder,
body.page-id-172 .elementor-widget-form textarea::placeholder {
	color: var(--sa-smoke) !important;
	opacity: 1 !important;
	font-family: var(--sa-font-body) !important;
}

body.page-id-172 .elementor-widget-form .elementor-field:focus,
body.page-id-172 .elementor-widget-form input:focus,
body.page-id-172 .elementor-widget-form textarea:focus,
body.page-id-172 .elementor-widget-form select:focus {
	border-color: var(--sa-amber) !important;
	outline: none !important;
	box-shadow: 0 0 0 1px var(--sa-amber) !important;
}

body.page-id-172 .elementor-widget-form textarea.elementor-field {
	min-height: 130px !important;
	resize: vertical !important;
}

/* Submit button "KIRIM PESAN" — currently RED, force amber tactical */
body.page-id-172 .elementor-widget-form button[type="submit"],
body.page-id-172 .elementor-widget-form .elementor-button[type="submit"],
body.page-id-172 .elementor-widget-form .e-form__buttons__wrapper button,
body.page-id-172 .elementor-widget-form .elementor-button,
body.page-id-172 .elementor-widget-form button.elementor-button {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	color: var(--sa-amber) !important;
	border: 1px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	padding: 16px 32px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	transition: all 0.25s !important;
	box-shadow: none !important;
	text-shadow: none !important;
	width: 100% !important;
	margin-top: 8px !important;
}

body.page-id-172 .elementor-widget-form button[type="submit"]:hover,
body.page-id-172 .elementor-widget-form .e-form__buttons__wrapper button:hover,
body.page-id-172 .elementor-widget-form .elementor-button:hover,
body.page-id-172 .elementor-widget-form button.elementor-button:hover {
	background: var(--sa-amber) !important;
	background-color: var(--sa-amber) !important;
	color: var(--sa-black) !important;
}

body.page-id-172 .elementor-widget-form .elementor-button-text,
body.page-id-172 .elementor-widget-form .elementor-button .elementor-button-content-wrapper,
body.page-id-172 .elementor-widget-form .elementor-button-icon,
body.page-id-172 .elementor-widget-form .elementor-button-icon i {
	color: inherit !important;
}

/* Form response messages */
body.page-id-172 .elementor-message,
body.page-id-172 .elementor-message-success,
body.page-id-172 .elementor-message-error {
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-left: 3px solid var(--sa-amber) !important;
	color: var(--sa-white) !important;
	padding: 12px 16px !important;
	font-size: 13px !important;
}

body.page-id-172 .elementor-message-error {
	border-left-color: #e74c3c !important;
}

/* Contact Form 7 fallback (kalau user pakai CF7 di editor) */
body.page-id-172 .wpcf7 input[type="text"],
body.page-id-172 .wpcf7 input[type="email"],
body.page-id-172 .wpcf7 input[type="tel"],
body.page-id-172 .wpcf7 input[type="url"],
body.page-id-172 .wpcf7 textarea,
body.page-id-172 .wpcf7 select {
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 12px 14px !important;
	font-family: var(--sa-font-body) !important;
	width: 100% !important;
}

body.page-id-172 .wpcf7 input:focus,
body.page-id-172 .wpcf7 textarea:focus {
	border-color: var(--sa-amber) !important;
	outline: none !important;
}

body.page-id-172 .wpcf7-submit,
body.page-id-172 .wpcf7 input[type="submit"] {
	background: transparent !important;
	color: var(--sa-amber) !important;
	border: 1px solid var(--sa-amber) !important;
	padding: 13px 32px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	transition: all 0.25s !important;
}

body.page-id-172 .wpcf7-submit:hover,
body.page-id-172 .wpcf7 input[type="submit"]:hover {
	background: var(--sa-amber) !important;
	color: var(--sa-black) !important;
}

/* ============================================================
   MY ACCOUNT — body.woocommerce-account
   ============================================================
   Page WC standard. Markup:
   .woocommerce-MyAccount-navigation (sidebar dengan endpoint links)
   .woocommerce-MyAccount-content (panel utama: dashboard, orders, dll)
   ============================================================ */

body.woocommerce-account {
	background: var(--sa-black) !important;
	color: var(--sa-white);
}

body.woocommerce-account .entry-title,
body.woocommerce-account h1.entry-title {
	font-family: var(--sa-font-display) !important;
	font-weight: 900 !important;
	font-size: clamp(36px, 5vw, 64px) !important;
	color: var(--sa-white) !important;
	text-transform: uppercase !important;
	letter-spacing: -0.01em !important;
	text-align: center !important;
	padding: 60px 24px 32px !important;
	margin: 0 !important;
	background: var(--sa-charcoal) !important;
	border-bottom: 1px solid var(--sa-steel) !important;
	position: relative;
}

body.woocommerce-account .entry-title::after {
	content: '';
	display: block;
	width: 60px;
	height: 2px;
	background: var(--sa-amber);
	margin: 18px auto 0;
}

body.woocommerce-account .entry-content,
body.woocommerce-account .site-main,
body.woocommerce-account main {
	background: var(--sa-black);
	padding: 0;
}

/* Wrapper layout */
body.woocommerce-account .woocommerce {
	max-width: 1200px;
	margin: 0 auto;
	padding: 60px clamp(20px, 5vw, 60px);
}

body.woocommerce-account .woocommerce-account .woocommerce::after,
body.woocommerce-account .woocommerce::after,
body.woocommerce-account .woocommerce::before {
	content: none !important;
	display: none !important;
}

/* My Account layout: sidebar nav + content panel */
body.woocommerce-account.logged-in .woocommerce {
	display: grid;
	grid-template-columns: 260px 1fr;
	gap: 36px;
	align-items: start;
}

/* Sidebar navigation */
body.woocommerce-account .woocommerce-MyAccount-navigation {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	padding: 24px 0;
	width: 100%;
	float: none;
	margin: 0;
}

body.woocommerce-account .woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	position: relative;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li:last-child {
	border-bottom: none;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 14px 22px;
	font-family: var(--sa-font-mono);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--sa-mist);
	text-decoration: none;
	transition: all 0.2s;
	border-left: 3px solid transparent;
}

body.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	color: var(--sa-amber);
	background: var(--sa-gunmetal);
	border-left-color: var(--sa-amber);
}

body.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,
body.woocommerce-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--is-active a {
	color: var(--sa-amber);
	background: var(--sa-gunmetal);
	border-left-color: var(--sa-amber);
}

/* Content panel */
body.woocommerce-account .woocommerce-MyAccount-content {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	padding: 36px 32px;
	width: 100%;
	float: none;
	margin: 0;
	color: var(--sa-mist);
}

body.woocommerce-account .woocommerce-MyAccount-content h2,
body.woocommerce-account .woocommerce-MyAccount-content h3 {
	font-family: var(--sa-font-display);
	font-weight: 800;
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: 0.01em;
	margin: 0 0 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sa-steel);
}

body.woocommerce-account .woocommerce-MyAccount-content p {
	color: var(--sa-mist);
	font-size: 14px;
	line-height: 1.7;
}

body.woocommerce-account .woocommerce-MyAccount-content a {
	color: var(--sa-amber);
}

body.woocommerce-account .woocommerce-MyAccount-content a:hover {
	text-decoration: underline;
}

/* Tables (orders, downloads) */
body.woocommerce-account .woocommerce-MyAccount-content table.shop_table,
body.woocommerce-account .woocommerce-orders-table {
	width: 100% !important;
	border-collapse: collapse !important;
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	margin-bottom: 28px;
}

body.woocommerce-account .woocommerce-MyAccount-content table thead th {
	background: var(--sa-black) !important;
	color: var(--sa-amber) !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	padding: 14px 16px !important;
	border-bottom: 2px solid var(--sa-amber) !important;
	text-align: left;
}

body.woocommerce-account .woocommerce-MyAccount-content table tbody td {
	padding: 14px 16px !important;
	color: var(--sa-mist) !important;
	background: var(--sa-gunmetal) !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
	font-size: 13px !important;
}

body.woocommerce-account .woocommerce-MyAccount-content table tbody tr:hover td {
	background: var(--sa-charcoal) !important;
}

body.woocommerce-account .woocommerce-MyAccount-content table .button,
body.woocommerce-account .woocommerce-MyAccount-content .button {
	background: transparent !important;
	color: var(--sa-amber) !important;
	border: 1px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	padding: 9px 18px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	font-weight: 700 !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	text-shadow: none !important;
	transition: all 0.2s !important;
	display: inline-block;
	text-decoration: none;
	line-height: 1.4 !important;
}

body.woocommerce-account .woocommerce-MyAccount-content .button:hover,
body.woocommerce-account .woocommerce-MyAccount-content table .button:hover {
	background: var(--sa-amber) !important;
	color: var(--sa-black) !important;
}

/* Order status badges */
body.woocommerce-account .woocommerce-orders-table__cell-order-status,
body.woocommerce-account .woocommerce-order-status {
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: var(--sa-amber) !important;
	font-weight: 600 !important;
}

/* Login / Register form (untuk visitor non-login) */
body.woocommerce-account .u-column1.col-1,
body.woocommerce-account .u-column2.col-2 {
	background: var(--sa-charcoal);
	border: 1px solid var(--sa-steel);
	border-top: 2px solid var(--sa-amber);
	padding: 32px 28px;
	width: 100% !important;
	max-width: 100% !important;
}

body.woocommerce-account .u-columns.col2-set {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
	max-width: 1000px;
	margin: 0 auto;
}

body.woocommerce-account .u-column1 h2,
body.woocommerce-account .u-column2 h2 {
	font-family: var(--sa-font-display);
	font-weight: 800;
	color: var(--sa-white);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-size: 22px;
	margin: 0 0 20px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--sa-steel);
}

/* Form fields (login, register, edit-address, edit-account) */
body.woocommerce-account form.woocommerce-form .form-row,
body.woocommerce-account form.checkout .form-row,
body.woocommerce-account .form-row {
	margin-bottom: 16px;
}

body.woocommerce-account form.woocommerce-form label,
body.woocommerce-account .form-row label {
	display: block;
	font-family: var(--sa-font-mono);
	font-size: 10px;
	color: var(--sa-olive-light);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	font-weight: 600;
	margin-bottom: 6px;
}

body.woocommerce-account form.woocommerce-form input[type="text"],
body.woocommerce-account form.woocommerce-form input[type="email"],
body.woocommerce-account form.woocommerce-form input[type="password"],
body.woocommerce-account form.woocommerce-form input[type="tel"],
body.woocommerce-account form.woocommerce-form input[type="url"],
body.woocommerce-account form.woocommerce-form input[type="number"],
body.woocommerce-account form.woocommerce-form textarea,
body.woocommerce-account form.woocommerce-form select,
body.woocommerce-account .form-row input.input-text,
body.woocommerce-account .form-row select,
body.woocommerce-account .form-row textarea,
body.woocommerce-account input.input-text {
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 12px 14px !important;
	font-family: var(--sa-font-body) !important;
	font-size: 14px !important;
	width: 100% !important;
	box-shadow: none !important;
	transition: border-color 0.2s;
}

body.woocommerce-account form.woocommerce-form input:focus,
body.woocommerce-account form.woocommerce-form textarea:focus,
body.woocommerce-account form.woocommerce-form select:focus {
	border-color: var(--sa-amber) !important;
	outline: none !important;
}

body.woocommerce-account form.woocommerce-form input::placeholder {
	color: var(--sa-smoke);
}

body.woocommerce-account .woocommerce-form-login__rememberme {
	display: block;
	margin: 12px 0;
	color: var(--sa-mist);
	font-size: 12px;
}

body.woocommerce-account .lost_password a,
body.woocommerce-account .woocommerce-LostPassword a {
	color: var(--sa-amber);
	font-family: var(--sa-font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	text-decoration: none;
}

body.woocommerce-account .lost_password a:hover {
	text-decoration: underline;
}

/* Submit buttons (login, register, save changes) */
body.woocommerce-account form.woocommerce-form button.button,
body.woocommerce-account form.woocommerce-form input[type="submit"],
body.woocommerce-account .woocommerce-Button,
body.woocommerce-account button[name="login"],
body.woocommerce-account button[name="register"],
body.woocommerce-account button[name="save_account_details"],
body.woocommerce-account button[name="save_address"] {
	background: transparent !important;
	color: var(--sa-amber) !important;
	border: 1px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	padding: 13px 28px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	text-shadow: none !important;
	box-shadow: none !important;
	transition: all 0.25s !important;
	margin-top: 8px;
}

body.woocommerce-account form.woocommerce-form button.button:hover,
body.woocommerce-account .woocommerce-Button:hover,
body.woocommerce-account button[name="login"]:hover,
body.woocommerce-account button[name="register"]:hover,
body.woocommerce-account button[name="save_account_details"]:hover,
body.woocommerce-account button[name="save_address"]:hover {
	background: var(--sa-amber) !important;
	color: var(--sa-black) !important;
}

/* Edit address columns */
body.woocommerce-account .woocommerce-Addresses,
body.woocommerce-account .addresses {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 28px;
}

body.woocommerce-account .woocommerce-Address {
	background: var(--sa-gunmetal);
	border: 1px solid var(--sa-steel);
	padding: 24px;
	width: 100% !important;
	float: none !important;
}

body.woocommerce-account .woocommerce-Address-title h2,
body.woocommerce-account .woocommerce-Address h3 {
	font-family: var(--sa-font-display);
	color: var(--sa-white);
	text-transform: uppercase;
	font-size: 18px;
	margin: 0 0 14px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--sa-steel);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

body.woocommerce-account .woocommerce-Address-title .edit {
	color: var(--sa-amber);
	font-family: var(--sa-font-mono);
	font-size: 10px;
	letter-spacing: 0.18em;
	font-weight: 600;
	text-decoration: none;
}

body.woocommerce-account address {
	color: var(--sa-mist);
	font-style: normal;
	line-height: 1.7;
	font-size: 13px;
}

/* Notices (success, info, error) */
body.woocommerce-account .woocommerce-notices-wrapper,
body.woocommerce-account .woocommerce-message,
body.woocommerce-account .woocommerce-info,
body.woocommerce-account .woocommerce-error {
	background: var(--sa-gunmetal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-left: 3px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 14px 18px !important;
	margin-bottom: 22px !important;
	font-size: 13px !important;
	list-style: none !important;
}

body.woocommerce-account .woocommerce-error {
	border-left-color: #e74c3c !important;
}

body.woocommerce-account .woocommerce-message a,
body.woocommerce-account .woocommerce-info a {
	color: var(--sa-amber) !important;
	margin-left: 12px;
}

/* Dashboard intro paragraph (Hello, {name}!) */
body.woocommerce-account .woocommerce-MyAccount-content > p:first-child {
	font-size: 15px;
	line-height: 1.7;
	color: var(--sa-mist);
	padding: 16px 20px;
	background: var(--sa-gunmetal);
	border-left: 3px solid var(--sa-amber);
	margin-bottom: 24px;
}

body.woocommerce-account .woocommerce-MyAccount-content mark {
	background: transparent;
	color: var(--sa-amber);
	font-weight: 700;
	padding: 0;
}

/* Responsive my-account */
@media (max-width: 900px) {
	body.woocommerce-account.logged-in .woocommerce {
		grid-template-columns: 1fr;
		gap: 22px;
	}
	body.woocommerce-account .u-columns.col2-set {
		grid-template-columns: 1fr;
	}
	body.woocommerce-account .woocommerce-Addresses,
	body.woocommerce-account .addresses {
		grid-template-columns: 1fr;
	}
	body.woocommerce-account .entry-title {
		padding: 40px 18px 24px !important;
		font-size: 36px !important;
	}
	body.woocommerce-account .woocommerce {
		padding: 36px 18px;
	}
}

@media (max-width: 600px) {
	body.woocommerce-account .woocommerce-MyAccount-content {
		padding: 22px 18px;
	}
	body.woocommerce-account .woocommerce-MyAccount-content table thead th,
	body.woocommerce-account .woocommerce-MyAccount-content table tbody td {
		padding: 10px 8px !important;
		font-size: 11px !important;
	}
}

/* ============================================================
   ELEMENTOR MY ACCOUNT WIDGET (page-id-17)
   ============================================================
   Widget Elementor Pro 'woocommerce-my-account' di vertical mode
   (class wrapper: .e-my-account-tabs-vertical).
   PENTING: class .e-my-account-tab.e-my-account-tab__<endpoint> itu
   CONTENT PANEL (login form / dashboard / orders), BUKAN nav tab!
   Markup actual (logged-out):
     .elementor-widget-woocommerce-my-account
       .e-my-account-tab.e-my-account-tab__dashboard ← CONTENT WRAPPER
         .woocommerce
           .u-columns.col2-set #customer_login
             .u-column1.col-1 → form login
             .u-column2.col-2 → form register
   Jadi class .e-my-account-tab di-reset jadi transparent container, dan
   styling sebagai card panel di-apply ke .u-column1/.u-column2 langsung. */

body.page-id-17,
body.woocommerce-account.page-id-17 {
	background: var(--sa-black) !important;
}

/* Wrapper Elementor section default bg */
body.page-id-17 .elementor-section,
body.page-id-17 .e-con,
body.page-id-17 .elementor-container,
body.page-id-17 .elementor-element,
body.woocommerce-account .elementor-element,
body.woocommerce-account .e-con-inner {
	background-color: transparent !important;
}

/* Divider "My Account" jadi tactical heading dengan amber dash */
body.page-id-17 .elementor-widget-divider,
body.woocommerce-account .elementor-widget-divider {
	padding: 0 0 24px;
}

body.page-id-17 .elementor-divider__text,
body.woocommerce-account .elementor-divider__text {
	font-family: var(--sa-font-display) !important;
	font-weight: 900 !important;
	font-size: clamp(28px, 4vw, 48px) !important;
	color: var(--sa-white) !important;
	text-transform: uppercase !important;
	letter-spacing: -0.01em !important;
	padding-left: 38px !important;
	position: relative;
	background: transparent !important;
}

body.page-id-17 .elementor-divider__text::before,
body.woocommerce-account .elementor-divider__text::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 24px;
	height: 2px;
	background: var(--sa-amber);
}

body.page-id-17 .elementor-divider-separator,
body.woocommerce-account .elementor-divider-separator {
	background: transparent !important;
	border: none !important;
}

body.page-id-17 .elementor-divider-separator::before,
body.page-id-17 .elementor-divider-separator::after,
body.woocommerce-account .elementor-divider-separator::before,
body.woocommerce-account .elementor-divider-separator::after {
	display: none !important;
}

/* Elementor My Account widget container — transparent biar parent bg show */
body.page-id-17 .elementor-widget-woocommerce-my-account,
body.woocommerce-account .elementor-widget-woocommerce-my-account {
	background: transparent !important;
}

/* CONTENT WRAPPER (.e-my-account-tab.e-my-account-tab__dashboard / __orders /
   __edit-account / dll) — reset jadi transparent container, JANGAN
   distyling sebagai tab pill. Padding & spacing dipindah ke child cards. */
body.page-id-17 .elementor-widget-woocommerce-my-account .e-my-account-tab,
body.woocommerce-account .elementor-widget-woocommerce-my-account .e-my-account-tab {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
	flex: none !important;
	display: block !important;
	width: 100% !important;
	color: var(--sa-mist) !important;
	border-radius: 0 !important;
}

/* Vertical tabs wrapper bisa restore default block, jangan flex */
body.page-id-17 .e-my-account-tabs-vertical,
body.woocommerce-account .e-my-account-tabs-vertical {
	display: block !important;
	background: transparent !important;
}

/* WooCommerce container di dalam widget panel */
body.woocommerce-account .elementor-widget-woocommerce-my-account .woocommerce {
	padding: 0 !important;
	background: transparent !important;
	max-width: none !important;
	margin: 0 !important;
}

/* ===== LOGGED OUT STATE: col2-set login + register grid =====
   Markup: .u-columns.col2-set > .u-column1.col-1 (Login) + .u-column2.col-2 (Register) */
body.woocommerce-account .u-columns.col2-set,
body.woocommerce-account #customer_login.u-columns.col2-set,
body.woocommerce-account .elementor-widget-woocommerce-my-account #customer_login {
	display: grid !important;
	grid-template-columns: 1fr 1fr !important;
	gap: 24px !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}

body.woocommerce-account .u-columns.col2-set::before,
body.woocommerce-account .u-columns.col2-set::after {
	content: none !important;
	display: none !important;
}

/* Login + Register cards */
body.woocommerce-account .u-column1.col-1,
body.woocommerce-account .u-column2.col-2 {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-top: 2px solid var(--sa-amber) !important;
	padding: 36px 32px !important;
	width: 100% !important;
	max-width: 100% !important;
	float: none !important;
	margin: 0 !important;
	box-sizing: border-box;
}

body.woocommerce-account .u-column1.col-1 h2,
body.woocommerce-account .u-column2.col-2 h2 {
	font-family: var(--sa-font-display) !important;
	font-weight: 800 !important;
	color: var(--sa-white) !important;
	text-transform: uppercase !important;
	letter-spacing: 0.02em !important;
	font-size: 22px !important;
	margin: 0 0 24px !important;
	padding-bottom: 14px !important;
	border-bottom: 1px solid var(--sa-steel) !important;
}

/* Login form rows */
body.woocommerce-account .woocommerce-form-login,
body.woocommerce-account .woocommerce-form-register,
body.woocommerce-account .woocommerce-form {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.woocommerce-account p.woocommerce-form-row,
body.woocommerce-account p.form-row,
body.woocommerce-account p.form-row-wide {
	background: transparent !important;
	padding: 0 !important;
	margin: 0 0 16px !important;
}

body.woocommerce-account .woocommerce-form .form-row label,
body.woocommerce-account .woocommerce-form-row label {
	display: block !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 10px !important;
	color: var(--sa-olive-light) !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	font-weight: 600 !important;
	margin-bottom: 8px !important;
}

body.woocommerce-account .woocommerce-form .form-row .required {
	color: var(--sa-amber) !important;
}

/* Input fields force dark */
body.woocommerce-account .woocommerce-Input,
body.woocommerce-account input.woocommerce-Input--text,
body.woocommerce-account input.input-text,
body.woocommerce-account .woocommerce-form input[type="text"],
body.woocommerce-account .woocommerce-form input[type="email"],
body.woocommerce-account .woocommerce-form input[type="password"],
body.woocommerce-account .woocommerce-form input[type="tel"] {
	background: var(--sa-gunmetal) !important;
	background-color: var(--sa-gunmetal) !important;
	background-image: none !important;
	border: 1px solid var(--sa-steel) !important;
	border-radius: 0 !important;
	color: var(--sa-white) !important;
	padding: 13px 14px !important;
	font-family: var(--sa-font-body) !important;
	font-size: 14px !important;
	width: 100% !important;
	box-shadow: none !important;
	transition: border-color 0.2s !important;
}

body.woocommerce-account .woocommerce-Input:focus,
body.woocommerce-account input.input-text:focus {
	border-color: var(--sa-amber) !important;
	outline: none !important;
	box-shadow: 0 0 0 1px var(--sa-amber) !important;
}

body.woocommerce-account .woocommerce-Input::placeholder,
body.woocommerce-account input.input-text::placeholder {
	color: var(--sa-smoke) !important;
}

/* Show/hide password toggle button */
body.woocommerce-account .show-password-input,
body.woocommerce-account .password-input {
	position: relative;
	display: block;
}

body.woocommerce-account .show-password-input::after,
body.woocommerce-account button.show-password-input {
	color: var(--sa-mist) !important;
}

/* Bottom form row: rememberme + submit + lost_password.
   Render-nya: <p.form-row> <label.rememberme> <button.submit> </p>
   <p.lost_password> <a>...</a> </p> */
body.woocommerce-account .woocommerce-form-login .form-row:has(button[type="submit"]),
body.woocommerce-account .woocommerce-form-login p.form-row:last-of-type {
	background: transparent !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 14px !important;
	align-items: stretch !important;
	margin-top: 8px !important;
}

/* Rememberme label — readable size */
body.woocommerce-account .woocommerce-form__label-for-checkbox,
body.woocommerce-account .woocommerce-form-login__rememberme {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	color: var(--sa-mist) !important;
	font-family: var(--sa-font-body) !important;
	font-size: 13px !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-weight: 400 !important;
	margin: 0 !important;
	cursor: pointer;
}

body.woocommerce-account .woocommerce-form__label-for-checkbox span,
body.woocommerce-account .woocommerce-form-login__rememberme span {
	color: var(--sa-mist) !important;
	font-size: 13px !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-family: var(--sa-font-body) !important;
}

body.woocommerce-account .woocommerce-form__input-checkbox,
body.woocommerce-account input[type="checkbox"].woocommerce-form__input-checkbox {
	width: 16px !important;
	height: 16px !important;
	accent-color: var(--sa-amber) !important;
	cursor: pointer;
	margin: 0 !important;
}

/* Submit buttons — login Masuk, register Daftar */
body.woocommerce-account .woocommerce-Button,
body.woocommerce-account button.woocommerce-button,
body.woocommerce-account button.woocommerce-form-login__submit,
body.woocommerce-account button.woocommerce-form-register__submit,
body.woocommerce-account button[name="login"],
body.woocommerce-account button[name="register"],
body.woocommerce-account .woocommerce-form button[type="submit"] {
	background: transparent !important;
	background-color: transparent !important;
	background-image: none !important;
	color: var(--sa-amber) !important;
	border: 1px solid var(--sa-amber) !important;
	border-radius: 0 !important;
	padding: 14px 28px !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 12px !important;
	font-weight: 700 !important;
	letter-spacing: 0.25em !important;
	text-transform: uppercase !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
	transition: all 0.25s !important;
	width: 100% !important;
	display: block !important;
	line-height: 1.4 !important;
}

body.woocommerce-account .woocommerce-Button:hover,
body.woocommerce-account button.woocommerce-form-login__submit:hover,
body.woocommerce-account button.woocommerce-form-register__submit:hover,
body.woocommerce-account button[name="login"]:hover,
body.woocommerce-account button[name="register"]:hover {
	background: var(--sa-amber) !important;
	color: var(--sa-black) !important;
}

/* Lost password link (blue → amber) */
body.woocommerce-account .woocommerce-LostPassword,
body.woocommerce-account p.lost_password {
	margin: 14px 0 0 !important;
	padding: 0 !important;
	background: transparent !important;
	text-align: center;
}

body.woocommerce-account .woocommerce-LostPassword a,
body.woocommerce-account p.lost_password a {
	color: var(--sa-amber) !important;
	font-family: var(--sa-font-mono) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	transition: color 0.2s;
}

body.woocommerce-account .woocommerce-LostPassword a:hover,
body.woocommerce-account p.lost_password a:hover {
	color: var(--sa-white) !important;
}

/* Privacy text di bawah register form */
body.woocommerce-account .woocommerce-privacy-policy-text,
body.woocommerce-account .woocommerce-privacy-policy-text p {
	color: var(--sa-smoke) !important;
	font-size: 11px !important;
	line-height: 1.6 !important;
	margin: 10px 0 14px !important;
}

body.woocommerce-account .woocommerce-privacy-policy-text a,
body.woocommerce-account .woocommerce-privacy-policy-link {
	color: var(--sa-amber) !important;
}

/* ============================================================
   LOGGED IN STATE — Elementor My Account widget VERTICAL nav
   ============================================================
   Untuk vertical tabs, Elementor render nav di kiri dengan class
   yang serupa tapi struktur grid different. Style applied saat
   widget render nav links untuk authenticated user. */

body.woocommerce-account.logged-in .elementor-widget-woocommerce-my-account .e-my-account-tab {
	padding: 32px !important;
}

body.woocommerce-account.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-navigation {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-top: 2px solid var(--sa-amber) !important;
}

body.woocommerce-account.logged-in .elementor-widget-woocommerce-my-account .woocommerce-MyAccount-content {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-top: 2px solid var(--sa-amber) !important;
}

/* Track my order section (id 30905f98 wc-elements widget) */
body.page-id-17 .elementor-element.elementor-element-621aa838,
body.page-id-17 .elementor-element.elementor-element-30905f98 {
	background: transparent !important;
}

body.page-id-17 .elementor-widget-wc-elements .woocommerce {
	background: var(--sa-charcoal) !important;
	border: 1px solid var(--sa-steel) !important;
	border-top: 2px solid var(--sa-amber) !important;
	padding: 32px !important;
	margin-top: 24px !important;
}

/* Mobile responsive */
@media (max-width: 768px) {
	body.woocommerce-account .u-columns.col2-set,
	body.woocommerce-account #customer_login.u-columns.col2-set {
		grid-template-columns: 1fr !important;
		gap: 18px !important;
	}
	body.woocommerce-account .u-column1.col-1,
	body.woocommerce-account .u-column2.col-2 {
		padding: 24px 20px !important;
	}
	body.woocommerce-account .u-column1.col-1 h2,
	body.woocommerce-account .u-column2.col-2 h2 {
		font-size: 19px !important;
	}
}

/* ============================================================
   GLOBAL — HIDE DUMMY RATING & SOLD COUNT
   ============================================================
   Apply di semua page (termasuk home yang gak load soldier-woocommerce.css).
   Selectors mencakup:
   - TBSC plugin (.tbsc-meta, .tbsc-star1, .tbsc-rnum, .tbsc-sold)
   - WC default (.star-rating, .woocommerce-product-rating)
   - Home featured custom (.product-sold di template soldier-home.php)
   - Elementor Pro product widget rating
   ============================================================ */

.tbsc-meta,
.tbsc-star1,
.tbsc-rnum,
.tbsc-sold,
.tbsc-rating,
.tbsc-soldnum,
li.product .tbsc-meta,
li.product .star-rating,
li.product .woocommerce-product-rating,
.products li .star-rating,
.elementor-widget-woocommerce-products .star-rating,
.elementor-widget-wc-archive-products .star-rating,
.elementor-post__excerpt .star-rating,
.woocommerce-page .star-rating,
.woocommerce ul.products li.product .star-rating,
.woocommerce div.product .woocommerce-product-rating,
.woocommerce div.product .star-rating,
.woocommerce-review-link,
.woocommerce-product-details__rating-count,
.sa-wrapper .product-sold,
.sa-wrapper .product-rating,
.sa-wrapper .product-meta-rating,
body.single-product .woocommerce-product-rating,
body.single-product .star-rating,
body.home .product-sold,
body.home .product-rating {
	display: none !important;
	visibility: hidden !important;
	height: 0 !important;
	width: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Home featured products — .product-bottom kasih full width ke price karena
   .product-sold di hide, biar gak ada empty space di kanan price */
.sa-wrapper .product-bottom {
	justify-content: flex-start !important;
}

/* ============================================================
   ARCHIVE SHOP — Force card bg charcoal supaya gak ada white area
   ============================================================
   Setelah .tbsc-meta di-hide, kalau ada empty space di card,
   parent bg harus dark. Force li.product + semua wrapper bg
   biar konsisten charcoal — no white peek-through. */

.soldier-woo-content ul.products li.product,
.soldier-woo-content ul.products li.product.first,
.soldier-woo-content ul.products li.product.last,
.woocommerce ul.products li.product,
ul.products li.product {
	background: var(--sa-charcoal, #1a1a1a) !important;
	background-color: var(--sa-charcoal, #1a1a1a) !important;
}

.soldier-woo-content ul.products li.product:hover,
.woocommerce ul.products li.product:hover {
	background: var(--sa-charcoal, #1a1a1a) !important;
}

/* Ensure tbsc-img-wrap (image container) gak ada white bg */
.soldier-woo-content ul.products li.product .tbsc-img-wrap,
.woocommerce ul.products li.product .tbsc-img-wrap {
	background: var(--sa-charcoal, #1a1a1a) !important;
}

/* Padding bottom di tbsc-price-row supaya gak ada gap setelah meta hide */
.soldier-woo-content ul.products li.product .tbsc-price-row {
	padding-bottom: 16px !important;
}