/* ===================================================================
 * HERO V8 — Editorial Split (Ritual/AG1/Aesop pattern, NN/g + CXL + Baymard 2024-2025)
 * COMPACT: max 78vh / 600px • bez 3 benefits • bez floating badges • bez secondary link
 * BG cream solid (NIE gradient) — premium muted per Aesop/Ritual
 * =================================================================== */
.gk-home section.gk-hero,
.gk-hero {
	display: block;
	max-width: none;
	width: 100%;
	position: relative;
	overflow: hidden;
	background: #FAF7F2;
	padding: clamp(36px, 4vw, 56px) 0 clamp(36px, 4vw, 56px);
}

/* Subtle abstract green blobs (gradient mesh — Stripe/Linear pattern +6% premium perception) */
.gk-hero__bg-shape {
	position: absolute;
	border-radius: 50%;
	filter: blur(140px);
	pointer-events: none;
	opacity: 0.6;
	z-index: 0;
}
.gk-hero__bg-shape--1 {
	top: -120px;
	right: -120px;
	width: 640px;
	height: 640px;
	background: radial-gradient(circle, rgba(93, 169, 53, 0.20), transparent 70%);
}
.gk-hero__bg-shape--2 {
	bottom: -160px;
	left: -160px;
	width: 520px;
	height: 520px;
	background: radial-gradient(circle, rgba(31, 61, 20, 0.12), transparent 70%);
}

.gk-hero__inner {
	position: relative;
	z-index: 1;
	max-width: var(--gk-container);   /* matched z innymi sekcjami (1440) */
	margin: 0 auto;
	padding: 0 var(--gk-px);
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	align-items: center;
	min-height: 0;          /* let content drive height */
}
@media (min-width: 1024px) {
	/* 55/45 split — copy lewo dominantne dla wellness category (NN/g 2023) */
	.gk-hero__inner {
		grid-template-columns: 1.22fr 1fr;
		gap: 56px;
		min-height: 440px;
	}
}

.gk-hero__copy {
	display: flex;
	flex-direction: column;
	gap: 20px;
	text-align: left;
	animation: gk-hero-fade-up .6s ease-out;
}
@media (min-width: 1024px) {
	.gk-hero__copy { gap: 24px; }
}
/* FIX 2026-05-30: hero nad foldem nie może startować przezroczysty (opacity:0 przez ~0.6s
   = "przezroczyste napisy"). Zostaje subtelny slide-up, ale tekst zawsze pełna opacity. */
@keyframes gk-hero-fade-up {
	from { opacity: 1; transform: translateY(12px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
	.gk-hero__copy { animation: none; }
}

/* Eyebrow — minimal text label (NIE pill background) — Editorial Premium per Aesop/Ritual */
.gk-hero__eyebrow {
	display: inline-block;
	margin: 0;
	padding: 0;
	background: transparent;
	border: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #4F9028;       /* AA contrast 4.61:1 on #FAF7F2 */
	align-self: flex-start;
}
.gk-hero__eyebrow-dot {
	width: 7px;
	height: 7px;
	background: var(--gk-color-primary-container);
	border-radius: 9999px;
	animation: gk-pulse 2s ease-in-out infinite;
}
@keyframes gk-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: 0.5; transform: scale(0.8); }
}

/* H1 — Editorial premium, clamp(36-56px), tight line-height — Ritual/Aesop style */
.gk-hero__title {
	font-family: var(--gk-font-display);
	font-size: clamp(36px, 4.6vw, 56px);
	font-weight: 700;
	line-height: 1.05;
	letter-spacing: -0.025em;
	color: var(--gk-color-dark);
	margin: 0;
	max-width: 540px;
}
.gk-hero__title-accent {
	color: var(--gk-color-primary);
	font-style: normal;
	display: inline-block;
	position: relative;
}
.gk-hero__title-accent::after {
	content: '';
	position: absolute;
	left: -2%;
	right: -2%;
	bottom: 0.05em;
	height: 0.18em;
	background: rgba(93, 169, 53, 0.25);
	border-radius: 9999px;
	z-index: -1;
}

/* Lead — 1-2 zdania max 25 słów, contrast 7.1:1 */
.gk-hero__lead {
	font-size: clamp(15px, 1.15vw, 17px);
	line-height: 1.6;
	color: #555555;
	max-width: 480px;
	margin: 0;
}
.gk-hero__lead strong { color: var(--gk-color-dark); font-weight: 700; }

/* Trust line — inline pod CTA (NN/g 2024 +18% CTR vs floating badges) */
.gk-hero__trust-line {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin: 4px 0 0;
	font-size: 13px;
	font-weight: 600;
	color: #555555;
	letter-spacing: -0.005em;
}
.gk-hero__trust-line .material-symbols-outlined {
	font-size: 16px;
	color: #4F9028;
}
.gk-hero__trust-sep {
	margin: 0 4px;
	color: #C5CFB5;
	font-weight: 700;
}

/* Social proof rating — gwiazdki + customer count (BrightLocal +29% CR) */
.gk-hero__rating {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	align-self: center;
	padding: 10px 16px;
	background: #fff;
	border: 1px solid rgba(31, 61, 20, 0.08);
	border-radius: 9999px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}
@media (min-width: 1024px) {
	.gk-hero__rating { align-self: flex-start; }
}
.gk-hero__rating-stars {
	color: #F59E0B;
	font-size: 15px;
	letter-spacing: 1px;
	line-height: 1;
}
.gk-hero__rating-meta {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-size: 13px;
	color: var(--gk-color-text-muted);
}
.gk-hero__rating-meta strong {
	font-size: 14px;
	font-weight: 800;
	color: var(--gk-color-dark);
}
.gk-hero__rating-count {
	font-weight: 700;
	color: var(--gk-color-primary);
}

/* 3 outcome benefits (StoryBrand — customer = hero, NIE features) */
.gk-hero__benefits {
	display: grid;
	grid-template-columns: 1fr;
	gap: 12px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}
@media (min-width: 540px) {
	.gk-hero__benefits { grid-template-columns: repeat(3, 1fr); gap: 14px; }
}
.gk-hero__benefit {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px 14px 14px 12px;
	background: rgba(255, 255, 255, 0.65);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	border: 1px solid rgba(31, 61, 20, 0.07);
	border-radius: 14px;
	text-align: left;
	transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.gk-hero__benefit:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 32px rgba(31, 61, 20, 0.08);
	border-color: rgba(93, 169, 53, 0.25);
}
.gk-hero__benefit-icon {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	border-radius: 12px;
	background: linear-gradient(135deg, var(--gk-color-primary-container), var(--gk-color-dark));
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 4px 12px rgba(93, 169, 53, 0.30);
}
.gk-hero__benefit-icon .material-symbols-outlined {
	font-size: 20px;
	color: #fff;
	font-variation-settings: 'FILL' 1;
}
.gk-hero__benefit > div {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.gk-hero__benefit strong {
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	font-weight: 700;
	color: var(--gk-color-dark);
	letter-spacing: -0.01em;
	line-height: 1.3;
}
.gk-hero__benefit span {
	font-size: 12px;
	color: var(--gk-color-text-muted);
	line-height: 1.4;
}

/* CTA row — single primary + secondary text link (HubSpot 2024 +21% vs dual buttons) */
.gk-hero__cta-row {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin-top: 6px;
}
@media (min-width: 1024px) {
	.gk-hero__cta-row { justify-content: flex-start; }
}

.gk-btn--lg {
	padding: 18px 32px;
	font-size: 15px;
	font-weight: 700;
}

/* Wyższa specyfity — globalny `.gk-home a {color:inherit}` w przeciwnym razie wygrywa */
.gk-home a.gk-hero__cta-link,
.gk-hero__cta-link {
	font-size: 14px;
	font-weight: 700;
	color: var(--gk-color-dark);
	border-bottom: 1.5px solid currentColor;
	padding-bottom: 2px;
	letter-spacing: -0.01em;
	transition: color .2s ease, border-color .2s ease;
}
.gk-home a.gk-hero__cta-link:hover,
.gk-hero__cta-link:hover {
	color: var(--gk-color-primary);
	border-color: var(--gk-color-primary);
}

/* Microcopy pod CTA (Unbounce 2024 +11% CR) */
.gk-hero__microcopy {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: 12px;
	font-weight: 500;
	color: var(--gk-color-text-muted);
	align-self: center;
}
@media (min-width: 1024px) {
	.gk-hero__microcopy { align-self: flex-start; }
}
.gk-hero__microcopy .material-symbols-outlined {
	font-size: 16px;
	color: var(--gk-color-primary);
}
.gk-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 28px;
	border-radius: 9999px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.01em;
	transition: all var(--gk-dur-fast) var(--gk-ease-out);
	cursor: pointer;
	border: 0;
	text-decoration: none;
}
.gk-btn--dark {
	background: var(--gk-color-dark);
	color: #fff;
	box-shadow: 0 8px 24px rgba(31, 61, 20, 0.20);
}
.gk-btn--dark:hover {
	background: var(--gk-color-primary);
	transform: translateY(-1px);
	box-shadow: var(--gk-shadow-cta);
}
.gk-btn--outline {
	background: transparent;
	color: var(--gk-color-dark);
	border: 2px solid var(--gk-color-dark);
}
.gk-btn--outline:hover {
	background: var(--gk-color-dark);
	color: #fff;
}
.gk-btn--white {
	background: #fff;
	color: var(--gk-color-dark);
	box-shadow: var(--gk-shadow-lg);
}
.gk-btn--white:hover {
	background: var(--gk-color-accent-bio);
	transform: scale(1.05);
}
.gk-btn--accent {
	background: var(--gk-color-accent-bio);
	color: #fff;
	font-weight: 700;
	box-shadow: 0 8px 24px rgba(93, 169, 53, 0.30);
}
.gk-btn--accent:hover {
	background: #4F9028;
	color: #fff;
	transform: translateY(-1px);
	box-shadow: 0 12px 32px rgba(93, 169, 53, 0.40);
}
/* ===================================================================
 * HERO V8 VISUAL — kompaktowy packshot 1:1 (mniej height-dominantny)
 * Brak floating badges (CXL 2024: floating -8% CTR)
 * =================================================================== */
.gk-hero__visual {
	position: relative;
	width: 100%;
	max-width: 380px;
	height: 380px;
	justify-self: center;
	align-self: center;
}
@media (min-width: 1024px) {
	.gk-hero__visual {
		justify-self: end;
		max-width: 420px;
		height: 420px;
	}
}
@media (max-width: 767px) {
	.gk-hero__visual { max-width: 300px; height: 300px; }
}

/* V8: pure packshot, no frame/glow — Editorial Premium clean */
.gk-hero__visual-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	border-radius: 24px;
	box-shadow:
		0 30px 60px -24px rgba(31, 61, 20, 0.25),
		0 12px 24px -12px rgba(0, 0, 0, 0.10);
}

/* Floating badges — Cialdini social proof + scarcity (real, NIE fake) */
.gk-hero__badge {
	position: absolute;
	z-index: 2;
	background: #fff;
	border: 1px solid rgba(31, 61, 20, 0.08);
	border-radius: 18px;
	padding: 12px 16px;
	display: flex;
	flex-direction: column;
	gap: 2px;
	box-shadow: 0 16px 40px -8px rgba(31, 61, 20, 0.25);
	animation: gk-hero-float-reverse 6s ease-in-out infinite;
}

.gk-hero__badge--top-right {
	top: -8px;
	right: -8px;
	min-width: 150px;
}
@media (min-width: 1024px) {
	.gk-hero__badge--top-right { top: 20px; right: -32px; }
}

.gk-hero__badge--bottom-left {
	bottom: -8px;
	left: -8px;
	flex-direction: row;
	align-items: center;
	gap: 12px;
}
.gk-hero__badge--bottom-left > div { display: flex; flex-direction: column; gap: 2px; }
@media (min-width: 1024px) {
	.gk-hero__badge--bottom-left { bottom: 32px; left: -40px; }
}

@keyframes gk-hero-float-reverse {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(8px); }
}

.gk-hero__badge-tag {
	font-size: 11px;
	font-weight: 700;
	color: var(--gk-color-primary);
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.gk-hero__badge-title {
	font-family: var(--gk-font-display);
	font-size: 15px;
	font-weight: 800;
	color: var(--gk-color-dark);
	letter-spacing: -0.01em;
}
.gk-hero__badge-price {
	font-size: 14px;
	font-weight: 800;
	color: var(--gk-color-emerald);
	letter-spacing: -0.01em;
}
.gk-hero__badge-dot {
	width: 10px;
	height: 10px;
	border-radius: 9999px;
	background: var(--gk-color-primary-container);
	box-shadow: 0 0 0 4px rgba(93, 169, 53, 0.25);
	animation: gk-pulse 1.6s ease-in-out infinite;
	flex-shrink: 0;
}
.gk-hero__badge--bottom-left strong {
	font-size: 13px;
	font-weight: 800;
	color: var(--gk-color-dark);
	line-height: 1.2;
}
.gk-hero__badge--bottom-left span {
	font-size: 11px;
	color: var(--gk-color-text-muted);
}

/* Reduced motion — wyłącz floating + glow pulse */
@media (prefers-reduced-motion: reduce) {
	.gk-hero__visual,
	.gk-hero__badge {
		animation: none !important;
	}
}

/* ===================================================================
 * TRUST BAR V2 — cream neutral bg (Eyequant 2023 +24% vs dark)
 * icon + text format, 4 elementy = sweet spot
 * =================================================================== */
.gk-trust {
	background: #F7F7F4;
	border-top: 1px solid rgba(31, 61, 20, 0.06);
	border-bottom: 1px solid rgba(31, 61, 20, 0.06);
	color: var(--gk-color-dark);
	padding: 28px 0 22px;
	overflow: hidden;
}

.gk-trust__inner {
	max-width: var(--gk-container);
	margin: 0 auto;
	padding: 0 var(--gk-px);
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px 16px;
}
@media (min-width: 768px) {
	.gk-trust__inner { grid-template-columns: repeat(4, 1fr); gap: 24px; }
}

.gk-trust__item {
	display: flex;
	align-items: center;
	gap: 14px;
	justify-content: center;
	text-align: left;
}
@media (min-width: 1024px) {
	.gk-trust__item { justify-content: flex-start; }
}

.gk-trust__icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 12px;
	background: linear-gradient(135deg, rgba(93, 169, 53, 0.15), rgba(31, 61, 20, 0.05));
	border: 1px solid rgba(31, 61, 20, 0.08);
	color: var(--gk-color-dark);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.gk-trust__icon .material-symbols-outlined {
	font-size: 22px;
	color: var(--gk-color-dark);
}

.gk-trust__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	line-height: 1.3;
}
.gk-trust__text strong {
	font-family: 'Open Sans', sans-serif;
	font-size: 13px;
	font-weight: 800;
	color: var(--gk-color-dark);
	letter-spacing: -0.01em;
}
.gk-trust__text span {
	font-size: 11px;
	color: var(--gk-color-text-muted);
	font-weight: 500;
}

/* GIS compliance disclaimer (PL wymóg ustawowy) */
.gk-trust__disclaimer {
	max-width: var(--gk-container);
	margin: 18px auto 0;
	padding: 0 var(--gk-px);
	font-size: 11px;
	font-style: italic;
	color: var(--gk-color-text-muted);
	text-align: center;
	letter-spacing: 0.01em;
}

