/**
 * ShopKart Heading Banner — Frontend Styles
 *
 * Structural defaults only. The background gradient is written inline by
 * PHP (palette presets + custom colors + optional image overlay all resolve
 * server-side into a single `background` declaration). Typography, colors,
 * line opacity/gap, and spacing flow from Elementor's `selectors` API.
 *
 * HTML structure:
 *   .sksa-hb               — banner shell, holds background
 *     .sksa-hb-title       — main heading line
 *     .sksa-hb-sub         — subtitle line
 *
 * Inner gold hairlines: ::before / ::after on .sksa-hb
 * Outer gold lines:     border-top / border-bottom on .sksa-hb
 */

.sksa-hb {
	color: #ffffff;
	text-align: center;
	padding: 22px 24px;
	border-top: 1px solid #c9a063;
	border-bottom: 1px solid #c9a063;
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	box-sizing: border-box;
	overflow: hidden;
}

.sksa-hb::before,
.sksa-hb::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	height: 1px;
	background-color: #c9a063;
	opacity: 0.5;
	pointer-events: none;
	z-index: 1;
}
.sksa-hb::before { top: 4px; }
.sksa-hb::after  { bottom: 4px; }

.sksa-hb-title {
	margin: 0 0 5px;
	line-height: 1.2;
	position: relative;
	z-index: 2;
	font-family: inherit;
	font-size: 19px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #ffffff;
}

.sksa-hb-sub {
	margin: 0;
	line-height: 1.2;
	position: relative;
	z-index: 2;
	font-family: inherit;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: 3px;
	text-transform: uppercase;
	color: #e8c989;
	opacity: 0.9;
}