/* =========================================================
   MODUŁ: Hero Slider
   ========================================================= */

.sp-hr {
	--sphr-font:        'Inter', sans-serif;
	/* Badge */
	--sphr-size-badge:   14px;
	--sphr-weight-badge: 600;
	/* Tytuł */
	--sphr-size-tytul:        64px;
	--sphr-size-tytul-mobile: 38px;
	--sphr-size-tytul-min:    40px;
	--sphr-weight-tytul:      800;
	--sphr-lh-tytul:          1.25;
	--sphr-ls-tytul:          -0.01em;
	--sphr-ws-tytul:          0em;
	/* Highlight (mark) */
	--sphr-mark-pad-y:  .05em;
	--sphr-mark-pad-x:  .25em;
	--sphr-mark-radius: 10px;
	/* Opis */
	--sphr-size-opis:   17px;
	--sphr-weight-opis: 400;
	--sphr-lh-opis:     1.55;
	--sphr-ls-opis:     0em;
	/* CTA */
	--sphr-size-cta:    15px;
	--sphr-weight-cta:  700;
	--sphr-ls-cta:      .01em;
	/* Strzałki */
	--sphr-arrow-size:      56px;
	--sphr-arrow-icon-size: 24px;
	--sphr-arrow-offset:    24px;
	--sphr-arrow-opacity:   .7;
	--sphr-arrow-radius:    12px;
	--sphr-max-width:   1280px;
	--sphr-min-height:  720px;
	--sphr-pad-y:       80px;
	--sphr-pad-x:       40px;
	--sphr-gap:         60px;
	--sphr-radius-sec:  0px;
	--sphr-margin-y:    0px;
	--sphr-overlay:     .85;
	--sphr-duration:    700ms;

	--sphr-bg-od:        #1A2540;
	--sphr-bg-do:        #0D1424;
	--sphr-badge-bg:     #264360;
	--sphr-badge-tekst:  #FFFFFF;
	--sphr-badge-dot:    #D4A017;
	--sphr-tytul:        #FFFFFF;
	--sphr-mark-od:      #D4A017;
	--sphr-mark-do:      #B8860B;
	--sphr-mark-tekst:   #1A2540;
	--sphr-opis:         #D6DBE5;
	--sphr-opis-strong:  #FFFFFF;
	--sphr-cta1-od:      #D4A017;
	--sphr-cta1-do:      #E6B844;
	--sphr-cta1-tekst:   #1A2540;
	--sphr-cta2-border:  #FFFFFF;
	--sphr-cta2-tekst:   #FFFFFF;
	--sphr-tel-tekst:    #D6DBE5;
	--sphr-tel-link:     #D4A017;
	--sphr-dot:          #D4A017;
	--sphr-dot-inactive: #FFFFFF;
	--sphr-arrow:        #1A2540;
	--sphr-arrow-ikona:  #FFFFFF;

	font-family: var(--sphr-font);
	position: relative;
	min-height: var(--sphr-min-height);
	border-radius: var(--sphr-radius-sec);
	margin-top: var(--sphr-margin-y);
	margin-bottom: var(--sphr-margin-y);
	overflow: hidden;
	color: var(--sphr-tytul);
	background: linear-gradient(135deg, var(--sphr-bg-od), var(--sphr-bg-do));
}
.sp-hr * { box-sizing: border-box; }

.sp-hr--w-full {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
}
.sp-hr--w-container {
	width: 100%;
	max-width: var(--sphr-max-width);
	margin-left: auto;
	margin-right: auto;
}

.sp-hr--tlo-image {
	background-color: var(--sphr-bg-od);
}

.sp-hr__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, var(--sphr-bg-od), var(--sphr-bg-do));
	opacity: var(--sphr-overlay);
	pointer-events: none;
	z-index: 1;
}
.sp-hr--tlo-gradient .sp-hr__overlay,
.sp-hr--tlo-color .sp-hr__overlay { display: none; }

/* =========================================================
   VIEWPORT + TRACK (slider container)
   ========================================================= */
.sp-hr__viewport {
	position: relative;
	z-index: 2;
	width: 100%;
	overflow: hidden;
}
.sp-hr__track {
	position: relative;
	display: block;
}

/* =========================================================
   SLAJD
   ========================================================= */
.sp-hr__slide {
	width: 100%;
	min-height: var(--sphr-min-height);
	padding: var(--sphr-pad-y) var(--sphr-pad-x);
	display: flex;
	align-items: center;
}

/* TRANSITION: FADE */
.sp-hr--transition-fade .sp-hr__track { display: grid; }
.sp-hr--transition-fade .sp-hr__slide {
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--sphr-duration) ease, visibility var(--sphr-duration);
	pointer-events: none;
}
.sp-hr--transition-fade .sp-hr__slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

/* TRANSITION: SLIDE */
.sp-hr--transition-slide .sp-hr__track {
	display: flex;
	transition: transform var(--sphr-duration) cubic-bezier(.4,.0,.2,1);
}
.sp-hr--transition-slide .sp-hr__slide {
	flex: 0 0 100%;
	min-width: 100%;
}

/* TRANSITION: SLIDE + FADE */
.sp-hr--transition-slide-fade .sp-hr__track { display: grid; }
.sp-hr--transition-slide-fade .sp-hr__slide {
	grid-area: 1 / 1;
	opacity: 0;
	visibility: hidden;
	transform: translateX(40px);
	transition: opacity var(--sphr-duration) ease, transform var(--sphr-duration) cubic-bezier(.4,.0,.2,1), visibility var(--sphr-duration);
	pointer-events: none;
}
.sp-hr--transition-slide-fade .sp-hr__slide.is-active {
	opacity: 1;
	visibility: visible;
	transform: translateX(0);
	pointer-events: auto;
}

/* =========================================================
   ZAWARTOŚĆ SLAJDA
   ========================================================= */
.sp-hr__inner {
	max-width: var(--sphr-max-width);
	margin: 0 auto;
	width: 100%;
}
.sp-hr__grid {
	display: grid;
	gap: var(--sphr-gap);
	align-items: center;
}
.sp-hr--uklad-image-right .sp-hr__grid,
.sp-hr--uklad-image-left .sp-hr__grid { grid-template-columns: 1.2fr 1fr; }
.sp-hr--uklad-no-image .sp-hr__grid { grid-template-columns: 1fr; max-width: 920px; }
@media (max-width: 980px) {
	.sp-hr--uklad-image-right .sp-hr__grid,
	.sp-hr--uklad-image-left .sp-hr__grid { grid-template-columns: 1fr; }
}

/* ===== BADGE ===== */
.sp-hr__badge {
	display: inline-flex;
	align-items: center;
	gap: .6em;
	background: var(--sphr-badge-bg);
	color: var(--sphr-badge-tekst);
	padding: .55em 1.2em;
	border-radius: 999px;
	font-size: var(--sphr-size-badge);
	font-weight: var(--sphr-weight-badge, 600);
	margin-bottom: 1.75rem;
	border: 1px solid rgba(255,255,255,.08);
	backdrop-filter: blur(8px);
}
.sp-hr__badge-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--sphr-badge-dot);
	box-shadow: 0 0 0 4px rgba(212,160,23,.20);
	animation: sp-hr-pulse 2.4s ease-in-out infinite;
}
@keyframes sp-hr-pulse {
	0%, 100% { box-shadow: 0 0 0 4px rgba(212,160,23,.20); }
	50%      { box-shadow: 0 0 0 8px rgba(212,160,23,.05); }
}

/* ===== TYTUŁ ===== */
.sp-hr__tytul {
	font-size: clamp(var(--sphr-size-tytul-min, 40px), 6.5vw, var(--sphr-size-tytul));
	font-weight: var(--sphr-weight-tytul);
	line-height: var(--sphr-lh-tytul, 1.25);
	letter-spacing: var(--sphr-ls-tytul, -0.01em);
	word-spacing: var(--sphr-ws-tytul, 0);
	color: var(--sphr-tytul);
	margin: 0 0 1.5rem;
}
.sp-hr__tytul mark {
	display: inline;
	background: linear-gradient(135deg, var(--sphr-mark-od), var(--sphr-mark-do));
	color: var(--sphr-mark-tekst);
	padding: var(--sphr-mark-pad-y, .05em) var(--sphr-mark-pad-x, .25em);
	border-radius: var(--sphr-mark-radius, 10px);
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
	/* Trick: lekkie marginesy zapewniają że highlighty z różnych wierszy nigdy się nie stykają */
	margin: .08em 0;
}
.sp-hr__tytul em {
	font-style: italic;
	font-family: 'Cormorant Garamond', 'Playfair Display', Georgia, serif;
	font-weight: 600;
}

/* ===== OPIS ===== */
.sp-hr__opis {
	font-size: var(--sphr-size-opis);
	font-weight: var(--sphr-weight-opis, 400);
	line-height: var(--sphr-lh-opis, 1.55);
	letter-spacing: var(--sphr-ls-opis, 0);
	color: var(--sphr-opis);
	margin: 0 0 2.25rem;
	max-width: 600px;
}
.sp-hr__opis strong { color: var(--sphr-opis-strong); font-weight: 700; }
.sp-hr__opis em { font-style: italic; }

/* ===== CTA ===== */
.sp-hr__cta-row {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	margin-bottom: 2rem;
}
.sp-hr__cta {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	padding: 1.1em 2em;
	border-radius: 999px;
	font-weight: var(--sphr-weight-cta, 700);
	font-size: var(--sphr-size-cta);
	letter-spacing: var(--sphr-ls-cta, .01em);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, background .2s ease, filter .2s ease;
	border: 2px solid transparent;
	white-space: nowrap;
	line-height: 1;
}
.sp-hr__cta--primary {
	background: linear-gradient(135deg, var(--sphr-cta1-od), var(--sphr-cta1-do));
	color: var(--sphr-cta1-tekst);
	box-shadow: 0 10px 30px rgba(212,160,23,.40);
}
.sp-hr__cta--primary:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 40px rgba(212,160,23,.55);
	filter: brightness(1.05);
}
.sp-hr__cta--ghost {
	background: transparent;
	color: var(--sphr-cta2-tekst);
	border-color: rgba(255,255,255,.25);
	backdrop-filter: blur(8px);
}
.sp-hr__cta--ghost:hover {
	background: rgba(255,255,255,.08);
	border-color: var(--sphr-cta2-border);
	transform: translateY(-2px);
}

/* ===== TELEFON ===== */
.sp-hr__tel {
	font-size: 15px;
	color: var(--sphr-tel-tekst);
	display: flex;
	align-items: center;
	gap: .5em;
	flex-wrap: wrap;
}
.sp-hr__tel-link {
	color: var(--sphr-tel-link);
	text-decoration: none;
	font-weight: 700;
	border-bottom: 1px dashed rgba(212,160,23,.4);
	padding-bottom: 1px;
}
.sp-hr__tel-link:hover { color: #fff; }
.sp-hr__tel-godziny { opacity: .8; }

/* =========================================================
   OBRAZ — wtopiony w tło
   ========================================================= */
.sp-hr__col--image {
	display: flex;
	width: 100%;
	min-height: 100%;
}
.sp-hr__col--img-pos-bottom { align-items: flex-end; }
.sp-hr__col--img-pos-center { align-items: center; }
.sp-hr__col--img-pos-top    { align-items: flex-start; }

.sp-hr__image {
	max-width: var(--sphr-img-skala, 100%);
	width: var(--sphr-img-skala, 100%);
	max-height: calc(var(--sphr-min-height, 720px) - var(--sphr-pad-y, 80px));
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: 0;
	pointer-events: none;
	user-select: none;
}
@media (max-width: 980px) {
	.sp-hr__image {
		max-height: 480px;
		margin-left: auto;
		margin-right: auto;
		max-width: 320px;
	}
}

.sp-hr__col--img-efekt-shadow .sp-hr__image {
	filter: drop-shadow(0 30px 40px rgba(0,0,0,.45)) drop-shadow(0 60px 80px rgba(0,0,0,.30));
}
.sp-hr__col--img-efekt-glow .sp-hr__image {
	filter: drop-shadow(0 0 30px var(--sphr-cta1-od)) drop-shadow(0 0 60px rgba(212,160,23,.40)) drop-shadow(0 20px 30px rgba(0,0,0,.30));
}
.sp-hr__col--img-efekt-float .sp-hr__image {
	animation: sp-hr-img-float 6s ease-in-out infinite;
	filter: drop-shadow(0 30px 50px rgba(0,0,0,.40));
}
@keyframes sp-hr-img-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-15px); }
}
.sp-hr__col--img-efekt-lift .sp-hr__image {
	transition: transform .4s cubic-bezier(.2,.6,.2,1), filter .4s ease;
	filter: drop-shadow(0 20px 30px rgba(0,0,0,.30));
}
.sp-hr__col--img-efekt-lift .sp-hr__image:hover {
	transform: translateY(-10px) scale(1.02);
	filter: drop-shadow(0 40px 60px rgba(0,0,0,.45));
	pointer-events: auto;
}

/* =========================================================
   NAWIGACJA — kropki (dots)
   ========================================================= */
.sp-hr__dots {
	position: absolute;
	bottom: 30px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: .65rem;
	z-index: 10;
}
.sp-hr__dot {
	width: 32px;
	height: 4px;
	border-radius: 999px;
	background: var(--sphr-dot-inactive);
	opacity: .3;
	border: none;
	cursor: pointer;
	transition: opacity .25s ease, width .25s ease, background .25s ease;
	padding: 0;
}
.sp-hr__dot:hover { opacity: .6; }
.sp-hr__dot.is-active {
	background: var(--sphr-dot);
	opacity: 1;
	width: 56px;
}

/* =========================================================
   NAWIGACJA — strzałki (5 stylów × 7 ikon)
   ========================================================= */
.sp-hr__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: var(--sphr-arrow-size, 56px);
	height: var(--sphr-arrow-size, 56px);
	background: var(--sphr-arrow);
	color: var(--sphr-arrow-ikona);
	border: none;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .25s cubic-bezier(.4,0,.2,1), background .15s ease, opacity .25s ease, box-shadow .25s ease;
	opacity: var(--sphr-arrow-opacity, .7);
	padding: 0;
	font: inherit;
}
.sp-hr__arrow:hover {
	opacity: 1;
	transform: translateY(-50%) scale(1.08);
}
.sp-hr__arrow:active {
	transform: translateY(-50%) scale(.96);
}
.sp-hr__arrow-icon {
	display: inline-flex;
	width: var(--sphr-arrow-icon-size, 24px);
	height: var(--sphr-arrow-icon-size, 24px);
}
.sp-hr__arrow-icon svg {
	width: 100%;
	height: 100%;
	display: block;
}
/* arrow-long ma wider viewBox 32×24 — dopasuj wymiary */
.sp-hr__arrow-icon svg[viewBox="0 0 32 24"] {
	width: calc(var(--sphr-arrow-icon-size, 24px) * 1.33);
}

/* === Style tła === */
.sp-hr--arrow-styl-circle .sp-hr__arrow {
	border-radius: 50%;
	box-shadow: 0 10px 30px rgba(0,0,0,.30), 0 2px 6px rgba(0,0,0,.15);
	backdrop-filter: blur(8px);
}
.sp-hr--arrow-styl-pill .sp-hr__arrow {
	width: calc(var(--sphr-arrow-size, 56px) * 1.4);
	border-radius: 999px;
	box-shadow: 0 8px 24px rgba(0,0,0,.25), 0 2px 4px rgba(0,0,0,.12);
	backdrop-filter: blur(8px);
}
.sp-hr--arrow-styl-square .sp-hr__arrow {
	border-radius: var(--sphr-arrow-radius, 12px);
	box-shadow: 0 8px 24px rgba(0,0,0,.25);
	backdrop-filter: blur(8px);
}
.sp-hr--arrow-styl-minimal .sp-hr__arrow {
	background: transparent !important;
	box-shadow: none;
	backdrop-filter: none;
	color: var(--sphr-arrow-ikona);
}
.sp-hr--arrow-styl-minimal .sp-hr__arrow:hover {
	color: var(--sphr-mark-od);
}
.sp-hr--arrow-styl-outline .sp-hr__arrow {
	background: transparent !important;
	border: 2px solid var(--sphr-arrow);
	border-radius: 50%;
	color: var(--sphr-arrow);
	box-shadow: none;
}
.sp-hr--arrow-styl-outline .sp-hr__arrow:hover {
	background: var(--sphr-arrow) !important;
	color: var(--sphr-arrow-ikona);
}

/* === Pozycja === */
.sp-hr--arrow-pos-inside .sp-hr__arrow--prev { left: var(--sphr-arrow-offset, 24px); }
.sp-hr--arrow-pos-inside .sp-hr__arrow--next { right: var(--sphr-arrow-offset, 24px); }

.sp-hr--arrow-pos-outside .sp-hr__arrow--prev { left: calc(var(--sphr-arrow-offset, 24px) * -1); }
.sp-hr--arrow-pos-outside .sp-hr__arrow--next { right: calc(var(--sphr-arrow-offset, 24px) * -1); }

.sp-hr--arrow-pos-bottom .sp-hr__arrow {
	top: auto;
	bottom: 24px;
	transform: none;
}
.sp-hr--arrow-pos-bottom .sp-hr__arrow:hover {
	transform: scale(1.08);
}
.sp-hr--arrow-pos-bottom .sp-hr__arrow:active {
	transform: scale(.96);
}
.sp-hr--arrow-pos-bottom .sp-hr__arrow--prev {
	left: 50%;
	margin-left: -90px;
}
.sp-hr--arrow-pos-bottom .sp-hr__arrow--next {
	right: 50%;
	margin-right: -90px;
}

@media (max-width: 768px) {
	.sp-hr__arrow {
		--sphr-arrow-size: 40px;
		--sphr-arrow-icon-size: 18px;
		--sphr-arrow-offset: 12px;
	}
}

/* ===== RESPONSIVE ===== */
@media (max-width: 600px) {
	.sp-hr {
		--sphr-pad-y: 50px;
		--sphr-pad-x: 20px;
		--sphr-size-tytul: var(--sphr-size-tytul-mobile, 38px);
		--sphr-size-tytul-min: 28px;
	}
	.sp-hr__cta { padding: .95em 1.5em; font-size: 14px; }
	.sp-hr__dots { bottom: 20px; }
}
