/* Webshero Widgets — WS Hero Slide
 * Depends on Elementor's "e-swiper" stylesheet (Swiper 8 core CSS).
 */

.wsw-hero-slide,
.wsw-hero-slide *,
.wsw-hero-slide *::before,
.wsw-hero-slide *::after {
	box-sizing: border-box;
}

.wsw-hero-slide {
	position: relative;
	width: 100%;
}

/* Swiper container */
.wsw-hero-slide__swiper.swiper {
	width: 100%;
	min-height: 100vh;
	overflow: hidden;
}

/* Wrapper inherits height so fade-mode (slides are absolute) doesn't collapse */
.wsw-hero-slide__swiper > .swiper-wrapper {
	min-height: inherit;
}

/* Slide */
.wsw-hero-slide__slide.swiper-slide {
	position: relative;
	display: flex;
	align-items: stretch;
	width: 100%;
	min-height: 100vh;
	background-color: #1A1308;
	overflow: hidden;
}

.wsw-hero-slide__bg {
	position: absolute;
	inset: 0;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 1;
}

.wsw-hero-slide__overlay {
	position: absolute;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.3);
	z-index: 2;
	pointer-events: none;
}

.wsw-hero-slide__inner {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 12em 4em 10em;
}

.wsw-hero-slide__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 24px;
	text-align: left;
}

/* Heading */
.wsw-hero-slide__heading {
	margin: 0;
	color: #fff;
	font-family: "Manrope", sans-serif;
	font-weight: 700;
	font-size: 5.7rem;
	line-height: 89px;
	max-width: 900px;
}

.wsw-hero-slide__heading .wsw-word {
	display: inline-block;
}

/* Description */
.wsw-hero-slide__description {
	color: #fff;
	font-family: "Manrope", sans-serif;
	max-width: 477px;
	margin: 0 0 16px;
}

.wsw-hero-slide__description > *:first-child { margin-top: 0; }
.wsw-hero-slide__description > *:last-child  { margin-bottom: 0; }

/* Buttons */
.wsw-hero-slide__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	width: 100%;
	justify-content: flex-start;
}

.wsw-hero-slide__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 1.2em 2em;
	border: none;
	border-radius: 999px;
	font-family: "Manrope", sans-serif;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background-color .25s ease, color .25s ease, border-color .25s ease;
}

.wsw-hero-slide__btn:focus { outline: none; }

.wsw-hero-slide__btn--primary {
	background-color: #FFBC58;
	color: #1A1308;
}
.wsw-hero-slide__btn--primary:hover { background-color: #86BD41; }

.wsw-hero-slide__btn--secondary {
	background-color: transparent;
	color: #fff;
}
.wsw-hero-slide__btn--secondary:hover { color: #86BD41; }

.wsw-hero-slide__btn-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 20px;
	height: 20px;
}
.wsw-hero-slide__btn-icon svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* Arrows */
.wsw-hero-slide__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	background: rgba(0, 0, 0, 0.35);
	border: 0;
	border-radius: 50%;
	color: #fff;
	cursor: pointer;
	padding: 0;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: background-color .2s ease, color .2s ease, transform .2s ease;
}
.wsw-hero-slide__arrow:hover {
	background: rgba(255, 188, 88, 1);
	color: #1A1308;
}
.wsw-hero-slide__arrow:focus { outline: none; }
.wsw-hero-slide__arrow--prev { left: 24px; }
.wsw-hero-slide__arrow--next { right: 24px; }
.wsw-hero-slide__arrow svg {
	width: 24px;
	height: 24px;
	display: block;
}

@media (max-width: 767px) {
	.wsw-hero-slide--no-arrows-mobile .wsw-hero-slide__arrow { display: none; }
}

@media (max-width: 600px) {
	.wsw-hero-slide__arrow { width: 44px; height: 44px; }
	.wsw-hero-slide__arrow--prev { left: 12px; }
	.wsw-hero-slide__arrow--next { right: 12px; }
}

/* Pagination */
.wsw-hero-slide__pagination {
	position: absolute;
	bottom: 24px;
	left: 0;
	right: 0;
	text-align: center;
	z-index: 10;
}

/* ----- Entry animations -----
 * Trigger only when Swiper has initialized (.is-ready) on the active slide.
 * `animation-fill-mode: both` => start at 0% (opacity 0) during delay, end at 100% (opacity 1).
 * If the rule doesn't match (no .is-ready), content stays at its default opacity (1).
 */

.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__heading[data-anim="words"] .wsw-word {
	animation: wsw-fadeInUp 1s cubic-bezier(.22,.61,.36,1) both;
	animation-delay: calc(200ms + (var(--wsw-i, 0) * 60ms));
}

.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__heading[data-anim="lines"],
.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__heading[data-anim="fadeInUp"] {
	animation: wsw-fadeInUp 1s cubic-bezier(.22,.61,.36,1) both;
	animation-delay: 150ms;
}

.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__description {
	animation: wsw-fadeInUp 1s cubic-bezier(.22,.61,.36,1) both;
	animation-delay: 500ms;
}

.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__buttons > *:nth-child(1) {
	animation: wsw-fadeInUp 1s cubic-bezier(.22,.61,.36,1) both;
	animation-delay: 650ms;
}

.wsw-hero-slide.is-ready .swiper-slide-active .wsw-hero-slide__buttons > *:nth-child(2) {
	animation: wsw-fadeInUp 1s cubic-bezier(.22,.61,.36,1) both;
	animation-delay: 800ms;
}

@keyframes wsw-fadeInUp {
	0%   { opacity: 0; transform: translate3d(0, 30px, 0); }
	100% { opacity: 1; transform: translate3d(0, 0, 0); }
}

/* Responsive */
@media (max-width: 1024px) {
	.wsw-hero-slide__inner { padding: 240px 24px 80px; }
	.wsw-hero-slide__heading { font-size: 3.6rem; line-height: 1.1; max-width: 670px; }
}

@media (max-width: 600px) {
	.wsw-hero-slide__inner { padding: 160px 20px 60px; }
	.wsw-hero-slide__heading { font-size: 2.4rem; line-height: 1.15; max-width: 100%; }
	.wsw-hero-slide__description { max-width: 100%; }
	.wsw-hero-slide__buttons { gap: 12px 16px; }
}
