/* =========================================================
   MODUŁ: Sekcja „Bezpłatna konsultacja"
   ========================================================= */

.sp-sk {
	--spsk-font:        'Inter', sans-serif;
	--spsk-size-label:  14px;
	--spsk-size-tytul:  36px;
	--spsk-size-opis:   17px;
	--spsk-size-bt:     18px;
	--spsk-size-bo:     15px;
	--spsk-max-width:   1200px;
	--spsk-padding-y:   80px;
	--spsk-padding-x:   32px;
	--spsk-gap:         60px;
	--spsk-media-radius:20px;
	--spsk-section-radius: 0px;
	--spsk-margin-y:    0px;
	--spsk-bg:          #F8F3E0;
	--spsk-label:       #D4A017;
	--spsk-tytul:       #1A2540;
	--spsk-opis:        #5A5A5A;
	--spsk-bik-tlo:     #D4A017;
	--spsk-bik-color:   #FFFFFF;
	--spsk-bt-color:    #1A2540;
	--spsk-bo-color:    #5A5A5A;
	--spsk-cta-bg:      #D4A017;
	--spsk-cta-text:    #FFFFFF;

	font-family: var(--spsk-font);
	background: var(--spsk-bg);
	color: var(--spsk-opis);
	padding: var(--spsk-padding-y) var(--spsk-padding-x);
	position: relative;
	border-radius: var(--spsk-section-radius);
	margin-top: var(--spsk-margin-y);
	margin-bottom: var(--spsk-margin-y);
}

/* Wariant: pełna szerokość — rozciąga się poza kontener motywu */
.sp-sk--w-full {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}

/* Wariant: w kontenerze — mieści się w treści, idealny dla zaokrągleń */
.sp-sk--w-container {
	width: 100%;
	max-width: var(--spsk-max-width);
	margin-left: auto;
	margin-right: auto;
}
.sp-sk * { box-sizing: border-box; }

.sp-sk__inner {
	max-width: var(--spsk-max-width);
	margin: 0 auto;
}

/* GRID — układ side-by-side */
.sp-sk__grid {
	display: grid;
	gap: var(--spsk-gap);
	align-items: center;
}

.sp-sk--left .sp-sk__grid,
.sp-sk--right .sp-sk__grid {
	grid-template-columns: 1fr 1fr;
}

.sp-sk--top .sp-sk__grid,
.sp-sk--none .sp-sk__grid {
	grid-template-columns: 1fr;
}

.sp-sk--none .sp-sk__inner,
.sp-sk--top .sp-sk__inner {
	max-width: 900px;
}
.sp-sk--top .sp-sk__inner,
.sp-sk--none .sp-sk__inner {
	text-align: center;
}
.sp-sk--top .sp-sk__bloki,
.sp-sk--none .sp-sk__bloki {
	text-align: left;
}

/* ===== CONTENT ===== */
.sp-sk__content {
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
}

.sp-sk__label {
	font-size: var(--spsk-size-label);
	color: var(--spsk-label);
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	margin: 0;
}

.sp-sk__tytul {
	font-size: var(--spsk-size-tytul);
	color: var(--spsk-tytul);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -.01em;
	margin: 0;
}

.sp-sk__opis {
	font-size: var(--spsk-size-opis);
	color: var(--spsk-opis);
	line-height: 1.6;
	margin: 0;
}

/* ===== BLOKI KORZYŚCI ===== */
.sp-sk__bloki {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	margin-top: .75rem;
}
.sp-sk--bloki-2 .sp-sk__bloki {
	grid-template-columns: repeat(2, 1fr);
}
@media (max-width: 720px) {
	.sp-sk--bloki-2 .sp-sk__bloki {
		grid-template-columns: 1fr;
	}
}

.sp-sk__blok {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	text-align: left;
}

.sp-sk__blok-ikona {
	flex-shrink: 0;
	width: 48px;
	height: 48px;
	background: var(--spsk-bik-tlo);
	color: var(--spsk-bik-color);
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 6px 16px rgba(212,160,23,.30);
}
.sp-sk__blok-ikona svg { width: 24px; height: 24px; }

.sp-sk__blok-tresc { flex: 1; }

.sp-sk__blok-tytul {
	font-size: var(--spsk-size-bt);
	color: var(--spsk-bt-color);
	font-weight: 700;
	margin: 0 0 .25em;
	line-height: 1.3;
}

.sp-sk__blok-opis {
	font-size: var(--spsk-size-bo);
	color: var(--spsk-bo-color);
	line-height: 1.55;
	margin: 0;
}

/* ===== MEDIA (image / video) ===== */
.sp-sk__media {
	width: 100%;
}
.sp-sk__media--top {
	margin-bottom: var(--spsk-gap);
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.sp-sk__media-img {
	width: 100%;
	height: auto;
	display: block;
	border-radius: var(--spsk-media-radius);
	box-shadow: 0 20px 60px rgba(26,37,64,.15);
}

.sp-sk__video-wrap {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%; /* 16:9 */
	border-radius: var(--spsk-media-radius);
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(26,37,64,.15);
	background: #000;
}

/* Formularz jako media — wymuś pełną szerokość kolumny */
.sp-sk__form-wrap {
	width: 100%;
}
.sp-sk__form-wrap .sp-form {
	max-width: 100% !important;
	margin: 0 !important;
}

/* Avatar jako media — wycentruj */
.sp-sk__avatar-wrap {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sp-sk__video-wrap iframe,
.sp-sk__video-wrap video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

/* ===== CTA ===== */
.sp-sk__cta-wrap {
	margin-top: 1rem;
}
.sp-sk--top .sp-sk__cta-wrap,
.sp-sk--none .sp-sk__cta-wrap {
	text-align: center;
}

.sp-sk__cta {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	background: var(--spsk-cta-bg);
	color: var(--spsk-cta-text);
	padding: 1em 1.8em;
	border-radius: 999px;
	font-weight: 700;
	font-size: 17px;
	text-decoration: none;
	box-shadow: 0 8px 20px rgba(212,160,23,.30);
	transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
	border: none;
}
.sp-sk__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 28px rgba(212,160,23,.40);
	filter: brightness(1.05);
	color: var(--spsk-cta-text);
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 900px) {
	.sp-sk--left .sp-sk__grid,
	.sp-sk--right .sp-sk__grid {
		grid-template-columns: 1fr;
	}
	.sp-sk--left .sp-sk__media,
	.sp-sk--right .sp-sk__media {
		max-width: 600px;
		margin: 0 auto;
	}
}

@media (max-width: 600px) {
	.sp-sk {
		--spsk-padding-y: 50px;
		--spsk-padding-x: 20px;
		--spsk-size-tytul: 28px;
	}
}
