/* =========================================================================
   Service Hero Block V1 — all rules scoped under .service-hero-block-v1.
   Per-block CSS (loaded via enqueue_assets only when the block is present).
   Tokens: green #028d40, bright #28a745, violet #605cb8, dark #14181b,
   graphite #343a40, muted #777, border #e6e6e6.
   ========================================================================= */
.service-hero-block-v1 { position: relative; overflow: hidden; background: #14181b; }

/* Decorative background layers */
.service-hero-block-v1 .shb-bg-glow,
.service-hero-block-v1 .shb-bg-stars { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.service-hero-block-v1 .shb-bg-glow {
	background:
		radial-gradient(900px 520px at 78% 18%, rgba(2,141,64,.30), transparent 60%),
		radial-gradient(700px 480px at 12% 88%, rgba(96,92,184,.26), transparent 62%),
		radial-gradient(420px 320px at 60% 95%, rgba(40,167,69,.18), transparent 70%);
}
.service-hero-block-v1 .shb-bg-stars {
	opacity: .5;
	background-image:
		radial-gradient(1.4px 1.4px at 20% 30%, rgba(255,255,255,.7) 50%, transparent),
		radial-gradient(1.2px 1.2px at 67% 22%, rgba(255,255,255,.55) 50%, transparent),
		radial-gradient(1.6px 1.6px at 85% 60%, rgba(255,255,255,.6) 50%, transparent),
		radial-gradient(1.1px 1.1px at 40% 75%, rgba(255,255,255,.45) 50%, transparent),
		radial-gradient(1.3px 1.3px at 92% 38%, rgba(255,255,255,.5) 50%, transparent);
}

/* Container */
.service-hero-block-v1 .shb-container { position: relative; z-index: 1; max-width: 1140px;
	padding-top: 28px; padding-bottom: 80px; }

/* Breadcrumbs — site NavXT output (.breadcrumbs) is already styled white by the theme; spacing only here */
.service-hero-block-v1 .breadcrumbs { display: block; margin-bottom: 46px; font-size: 13px; }

/* Badge pill */
.service-hero-block-v1 .shb-badge { display: inline-flex; align-items: center; gap: 8px;
	background: #028d40; color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .08em;
	text-transform: uppercase; padding: 7px 14px; border-radius: .25rem; margin-bottom: 22px; }
.service-hero-block-v1 .shb-badge i { font-size: 12px; line-height: 1; }

/* Heading + accent */
.service-hero-block-v1 .shb-title { font-size: 52px; line-height: 1.1; font-weight: 500;
	color: #fff; margin: 0 0 20px; }
.service-hero-block-v1 .shb-title__accent { color: #28a745; }

/* Lead */
.service-hero-block-v1 .shb-col-text { max-width: 600px; }
.service-hero-block-v1 .shb-lead { font-size: 19px; line-height: 1.6; color: rgba(255,255,255,.82);
	margin: 0 0 34px; }
.service-hero-block-v1 .shb-lead p:last-child { margin-bottom: 0; }

/* Buttons: base + signature sweep */
.service-hero-block-v1 .shb-actions { gap: 14px; }
.service-hero-block-v1 .shb-btn { position: relative; overflow: hidden; z-index: 0;
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 16px 32px; border-radius: .25rem; font-size: 16px; font-weight: 500; line-height: 1;
	text-decoration: none; border: 1px solid transparent;
	transition: color .25s ease, border-color .25s ease, background .25s ease; }
.service-hero-block-v1 .shb-btn__label { position: relative; z-index: 1; }
.service-hero-block-v1 .shb-btn--primary { background: #028d40; color: #fff; border-color: #028d40; }
.service-hero-block-v1 .shb-btn--primary::before { content: ""; position: absolute; inset: 0;
	background: #605cb8; transform: scaleY(0); transform-origin: bottom;
	transition: transform .3s ease-out; z-index: -1; }
.service-hero-block-v1 .shb-btn--primary:hover, .service-hero-block-v1 .shb-btn--primary:focus { color: #fff; border-color: #605cb8; }
.service-hero-block-v1 .shb-btn--primary:hover::before, .service-hero-block-v1 .shb-btn--primary:focus::before { transform: scaleY(1); }
.service-hero-block-v1 .shb-btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.35); }
.service-hero-block-v1 .shb-btn--outline:hover, .service-hero-block-v1 .shb-btn--outline:focus { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.6); }

/* Benefit cards (repeater) */
.service-hero-block-v1 .shb-stats { gap: 14px; margin-top: 54px; }
.service-hero-block-v1 .shb-stat { flex: 1 1 200px; background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.12); border-radius: .25rem; padding: 20px 22px; }
.service-hero-block-v1 .shb-stat__num { display: block; font-size: 28px; font-weight: 500;
	color: #fff; line-height: 1.1; }
.service-hero-block-v1 .shb-stat__label { display: block; font-size: 14px;
	color: rgba(255,255,255,.65); margin-top: 4px; }

/* Decorative browser mockup */
.service-hero-block-v1 .shb-col-visual { position: relative; }
.service-hero-block-v1 .shb-mock { background: #fff; border-radius: 12px;
	box-shadow: 0 30px 60px rgba(0,0,0,.45); overflow: hidden; border: 1px solid rgba(255,255,255,.14); }
.service-hero-block-v1 .shb-mock__bar { display: flex; align-items: center; gap: 10px;
	padding: 11px 14px; background: #f1f3f4; border-bottom: 1px solid #e3e6e8; }
.service-hero-block-v1 .shb-dot { width: 11px; height: 11px; border-radius: 50%; flex: 0 0 auto; }
.service-hero-block-v1 .shb-dot--r { background: #ff5f57; }
.service-hero-block-v1 .shb-dot--y { background: #febc2e; }
.service-hero-block-v1 .shb-dot--g { background: #28c840; }
.service-hero-block-v1 .shb-mock__address { flex: 1; display: flex; align-items: center; gap: 7px;
	background: #fff; border: 1px solid #e3e6e8; border-radius: 100px; padding: 6px 12px;
	font-size: 11.5px; color: #777; overflow: hidden; white-space: nowrap; }
.service-hero-block-v1 .shb-mock__address i { display: inline-flex; }
.service-hero-block-v1 .shb-mock__address svg { width: 10px; height: 10px; fill: #028d40; }
.service-hero-block-v1 .shb-mock__view { background: #14181b; padding: 22px 20px 24px;
	display: flex; flex-direction: column; align-items: flex-start; }
.service-hero-block-v1 .shb-wire-badge { display: inline-block; width: 96px; height: 16px;
	border-radius: 4px; background: #028d40; }
.service-hero-block-v1 .shb-wire-line { display: block; border-radius: 4px; }
.service-hero-block-v1 .shb-wire-line--lg { width: 82%; height: 11px; background: rgba(255,255,255,.85); margin: 13px 0 7px; }
.service-hero-block-v1 .shb-wire-line--accent { width: 52%; height: 11px; background: #28a745; }
.service-hero-block-v1 .shb-wire-line--sm { width: 92%; height: 6px; background: rgba(255,255,255,.18); margin-top: 15px; }
.service-hero-block-v1 .shb-wire-line--sm + .shb-wire-line--sm { width: 84%; margin-top: 7px; }
.service-hero-block-v1 .shb-wire-pill { width: 96px; height: 26px; border-radius: 5px; background: #028d40; margin-top: 15px; }
.service-hero-block-v1 .shb-mock__tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 14px; background: #fff; }
.service-hero-block-v1 .shb-tile { border: 1px solid #e6e6e6; border-radius: 6px; padding: 11px 8px;
	display: flex; flex-direction: column; align-items: center; gap: 7px; }
.service-hero-block-v1 .shb-tile__ic { width: 24px; height: 24px; border-radius: 50%; background: rgba(2,141,64,.12); }
.service-hero-block-v1 .shb-tile__bar { width: 72%; height: 5px; border-radius: 3px; background: #e6e6e6; }

/* Responsive (theme Bootstrap breakpoints; col-lg-* stacks the split, d-none d-lg-block hides the visual) */
@media (max-width: 991.98px) {
	.service-hero-block-v1 .shb-container { padding-top: 24px; padding-bottom: 56px; }
	.service-hero-block-v1 .breadcrumbs { margin-bottom: 28px; }
	.service-hero-block-v1 .shb-title { font-size: 36px; }
}
@media (max-width: 575.98px) {
	.service-hero-block-v1 .shb-title { font-size: 30px; }
	.service-hero-block-v1 .shb-stat { flex: 1 1 100%; }
	.service-hero-block-v1 .shb-btn { flex: 1 1 auto; }
}
