.ssgp-hero {
	--h-bg1: #0e0d10; --h-bg2: #2a1620; --h-bg3: #241a33;
	--h-min-h: 620px; --h-product-size: 340px;
	min-height: var(--h-min-h);
	display: flex; align-items: center;
	padding: 60px 6% 40px;
	border-radius: 18px;
}
.ssgp-hero-bg {
	position: absolute; inset: 0; z-index: 0;
	background: radial-gradient(120% 100% at 85% 15%, var(--h-bg3) 0%, transparent 55%),
	            radial-gradient(90% 90% at 10% 100%, var(--h-bg2) 0%, transparent 60%),
	            var(--h-bg1);
}
.ssgp-hero-bg::after {
	content: ''; position: absolute; inset: 0; opacity: 0.5;
	background-image: radial-gradient(rgba(255,255,255,0.035) 1px, transparent 1px);
	background-size: 26px 26px;
}
.ssgp-hero-inner { position: relative; z-index: 2; width: 100%; }
.ssgp-hero-logo { height: 42px; width: auto; margin-bottom: 34px; }

.ssgp-hero-grid { display: grid; grid-template-columns: 1.05fr 0.95fr; align-items: center; gap: 30px; }
.ssgp-hero-copy { text-align: right; }
.ssgp-hero-title { display: flex; flex-direction: column; gap: 2px; margin-top: 12px; }
.ssgp-title-line { display: block; }
.ssgp-hero-subtitle { margin-top: 18px; color: var(--sgp-text-muted); font-size: 15.5px; max-width: 480px; line-height: 1.9; }
.ssgp-hero-buttons { margin-top: 30px; display: flex; gap: 14px; }

.ssgp-hero-media { position: relative; display: flex; align-items: center; justify-content: center; min-height: var(--h-product-size); }
.ssgp-product-cluster { position: relative; width: var(--h-product-size); height: var(--h-product-size); }
.ssgp-product {
	position: absolute; max-width: 62%; max-height: 62%; object-fit: contain;
	filter: drop-shadow(0 20px 30px rgba(0,0,0,0.45));
	animation: ssgp-float 5.5s ease-in-out infinite;
}
.ssgp-product-1 { top: 8%; right: 10%; width: 58%; animation-delay: 0s; z-index: 3; }
.ssgp-product-2 { bottom: 6%; left: 4%; width: 46%; animation-delay: .8s; z-index: 2; transform: rotate(-6deg); }
.ssgp-product-3 { bottom: 18%; right: 30%; width: 40%; animation-delay: 1.6s; z-index: 1; transform: rotate(8deg); }
@keyframes ssgp-float { 0%,100% { transform: translateY(0) rotate(var(--r,0deg)); } 50% { transform: translateY(-14px) rotate(var(--r,0deg)); } }
.ssgp-product-2 { --r: -6deg; }
.ssgp-product-3 { --r: 8deg; }

.ssgp-badge {
	position: absolute; display: inline-flex; align-items: center; gap: 8px;
	background: rgba(24,22,27,0.85); backdrop-filter: blur(6px);
	border: 1px solid rgba(255,255,255,0.1);
	padding: 9px 16px; border-radius: 999px; font-size: 12.5px; color: var(--sgp-white);
	box-shadow: 0 10px 24px rgba(0,0,0,0.35);
}
.ssgp-badge span { color: var(--sgp-gold); font-size: 14px; }
.ssgp-badge-1 { top: 10%; left: 2%; }
.ssgp-badge-2 { bottom: 10%; right: 2%; }

.ssgp-scroll-wrap { display: flex; justify-content: center; margin-top: 50px; }

@media (max-width: 900px) {
	.ssgp-hero-grid { grid-template-columns: 1fr; }
	.ssgp-hero-copy { text-align: center; }
	.ssgp-hero-buttons { justify-content: center; }
	.ssgp-hero-subtitle { margin-inline: auto; }
	.ssgp-hero-media { order: -1; flex-direction: column; gap: 10px; }
	.ssgp-badge { position: static; margin: 0; }
	.ssgp-hero-logo { margin-inline: auto; margin-bottom: 24px; }
}
