/* =====================================================================
   Elite Fashion Slider — v3.1.0
   Premium, GPU-accelerated, fully responsive stylesheet
   ===================================================================== */

.efs-wrapper {
	position: relative;
	width: 100%;
	overflow: hidden;
	isolation: isolate;
	contain: layout style paint;
}

.efs-swiper {
	width: 100%;
	height: 90vh;
	position: relative;
	overflow: hidden;
	background: #0a0015;
}

.efs-swiper .swiper-slide {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
	will-change: transform, opacity;
}

/* ---------------------------------------------------------------------
   Background layer
   --------------------------------------------------------------------- */
.efs-bg-wrap {
	position: absolute;
	inset: 0;
	background-image: var(--efs-bg-desk);
	background-repeat: no-repeat;
	will-change: transform;
	transform: translateZ(0) scale(1.001); /* GPU layer hint */
	backface-visibility: hidden;
	opacity: 0;
	transition: opacity .6s ease;
}
.efs-bg-wrap.efs-bg-loaded,
.efs-bg-wrap[data-efs-preload="1"] {
	opacity: 1;
}
.efs-swiper-initial-active .efs-bg-wrap {
	opacity: 1;
}

/* Background animations (Ken Burns family) */
@keyframes efsKenBurns {
	0%   { transform: scale(1) translate3d(0,0,0); }
	100% { transform: scale(1.15) translate3d(0,0,0); }
}
@keyframes efsZoomOut {
	0%   { transform: scale(1.15) translate3d(0,0,0); }
	100% { transform: scale(1) translate3d(0,0,0); }
}
@keyframes efsSlowPanLeft {
	0%   { transform: scale(1.1) translate3d(2%,0,0); }
	100% { transform: scale(1.1) translate3d(-2%,0,0); }
}
@keyframes efsSlowPanRight {
	0%   { transform: scale(1.1) translate3d(-2%,0,0); }
	100% { transform: scale(1.1) translate3d(2%,0,0); }
}
@keyframes efsSlowPanUp {
	0%   { transform: scale(1.1) translate3d(0,2%,0); }
	100% { transform: scale(1.1) translate3d(0,-2%,0); }
}
@keyframes efsSlowPanDown {
	0%   { transform: scale(1.1) translate3d(0,-2%,0); }
	100% { transform: scale(1.1) translate3d(0,2%,0); }
}
@keyframes efsFloat {
	0%, 100% { transform: scale(1.05) translate3d(0,0,0); }
	50%      { transform: scale(1.05) translate3d(0,-1.5%,0); }
}
@keyframes efsRotateSlight {
	0%   { transform: scale(1.1) rotate(0deg); }
	100% { transform: scale(1.1) rotate(1.5deg); }
}
@keyframes efsFadeZoom {
	0%   { transform: scale(1); opacity: .85; }
	100% { transform: scale(1.1); opacity: 1; }
}
@keyframes efsCinematic {
	0%   { transform: scale(1.08) translate3d(-1%,1%,0); }
	50%  { transform: scale(1.15) translate3d(1%,-1%,0); }
	100% { transform: scale(1.08) translate3d(-1%,1%,0); }
}
@keyframes efsBreathe {
	0%, 100% { transform: scale(1.04); }
	50%      { transform: scale(1.1); }
}
@keyframes efsParallax {
	0%   { transform: scale(1.12) translate3d(0,0,0); }
	100% { transform: scale(1.12) translate3d(0,-3%,0); }
}

.efs-bg-anim-ken-burns      { animation: efsKenBurns var(--efs-bg-anim-speed,12s) ease-out forwards; }
.efs-bg-anim-zoom-out       { animation: efsZoomOut var(--efs-bg-anim-speed,12s) ease-out forwards; }
.efs-bg-anim-slow-pan-left  { animation: efsSlowPanLeft var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-slow-pan-right { animation: efsSlowPanRight var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-slow-pan-up    { animation: efsSlowPanUp var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-slow-pan-down  { animation: efsSlowPanDown var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-float          { animation: efsFloat var(--efs-bg-anim-speed,12s) ease-in-out infinite; }
.efs-bg-anim-rotate         { animation: efsRotateSlight var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-fade-zoom      { animation: efsFadeZoom var(--efs-bg-anim-speed,12s) ease-out forwards; }
.efs-bg-anim-cinematic      { animation: efsCinematic var(--efs-bg-anim-speed,12s) ease-in-out infinite; }
.efs-bg-anim-breathe        { animation: efsBreathe var(--efs-bg-anim-speed,12s) ease-in-out infinite; }
.efs-bg-anim-parallax       { animation: efsParallax var(--efs-bg-anim-speed,12s) ease-in-out infinite alternate; }
.efs-bg-anim-none           { animation: none; transform: scale(1); }

@media (prefers-reduced-motion: reduce) {
	.efs-bg-wrap { animation: none !important; transform: scale(1) !important; }
}

/* ---------------------------------------------------------------------
   Overlay & flare
   --------------------------------------------------------------------- */
.efs-overlay {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
}
.efs-overlay.efs-blur { z-index: 1; }

.efs-light-flare {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 30% 20%, rgba(255,215,0,0.12), transparent 55%);
	pointer-events: none;
	z-index: 2;
	mix-blend-mode: screen;
}

/* ---------------------------------------------------------------------
   Content positioning
   --------------------------------------------------------------------- */
.efs-content-wrap {
	position: absolute;
	inset: 0;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 5%;
	pointer-events: none;
}
.efs-content-inner {
	max-width: 700px;
	pointer-events: auto;
}
/* Content is only hidden pre-animation once JS confirms it is driving the
   reveal (.efs-js-ready). If JS is delayed, blocked, or fails, content stays
   visible by default instead of being permanently stuck at opacity:0. */
.efs-wrapper.efs-js-ready .efs-content-inner {
	opacity: 0;
}
.efs-wrapper.efs-js-ready .efs-content-wrap.efs-anim-play .efs-content-inner,
.efs-wrapper.efs-js-ready .efs-anim-play.efs-content-wrap .efs-content-inner {
	opacity: 1;
}

.efs-device-tablet-content,
.efs-device-mobile-content {
	display: none;
}

/* Optional per-slide device-specific content overrides ("Separate" device
   mode). These only ever hide the unified content on a slide+breakpoint
   where a matching override actually exists — never as a blanket rule — so
   unified content (heading/subtitle/description/buttons) is always the safe
   default and can never silently vanish on tablet/mobile just because the
   viewport got narrower. Falls back mobile -> tablet -> unified, consistent
   with how this plugin already handles image fallbacks. */
@media (max-width: 1024px) {
	.swiper-slide[data-has-tablet-content="1"] .efs-device-tablet-content {
		display: flex;
	}
	.swiper-slide[data-has-tablet-content="1"] .efs-content-wrap:not(.efs-device-tablet-content):not(.efs-device-mobile-content) {
		display: none;
	}
}
@media (max-width: 767px) {
	.swiper-slide[data-has-mobile-content="1"] .efs-device-mobile-content {
		display: flex;
	}
	.swiper-slide[data-has-mobile-content="1"] .efs-device-tablet-content,
	.swiper-slide[data-has-mobile-content="1"] .efs-content-wrap:not(.efs-device-tablet-content):not(.efs-device-mobile-content) {
		display: none;
	}
}

/* ---------------------------------------------------------------------
   Typography
   --------------------------------------------------------------------- */
.efs-slide-icon {
	font-size: 2.5rem;
	color: #FFD700;
	margin-bottom: 1rem;
}
.efs-slide-badge {
	display: inline-block;
	padding: 6px 18px;
	border-radius: 30px;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #FFD700;
	background: rgba(255,215,0,0.15);
	margin-bottom: 1.25rem;
	border: 1px solid rgba(255,215,0,0.35);
}
.efs-slide-title {
	font-size: clamp(2rem, 5vw, 4.5rem);
	font-weight: 700;
	line-height: 1.1;
	margin: 0 0 1rem;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.efs-slide-subtitle {
	font-size: clamp(1rem, 2vw, 1.5rem);
	font-weight: 400;
	color: #f5e8c0;
	margin: 0 0 1rem;
	line-height: 1.4;
}
.efs-slide-description {
	font-size: 1rem;
	color: rgba(255,255,255,0.85);
	line-height: 1.6;
	margin: 0 0 1.5rem;
}
.efs-slide-extra {
	font-size: 0.9rem;
	color: rgba(255,255,255,0.7);
	margin: 0 0 1.5rem;
}

/* ---------------------------------------------------------------------
   Buttons
   --------------------------------------------------------------------- */
.efs-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 1.5rem;
}

.efs-slide-btn,
.efs-slide-btn2,
.efs-layer-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 36px;
	border-radius: 50px;
	font-size: 0.95rem;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	background: rgba(255,255,255,0.12);
	border: 1px solid rgba(255,215,0,0.4);
	cursor: pointer;
	position: relative;
	overflow: hidden;
	will-change: transform, box-shadow, background-color;
	transition: transform .35s cubic-bezier(.2,.8,.2,1),
				box-shadow .35s ease,
				background-color .35s ease,
				color .35s ease,
				border-color .35s ease;
}
.efs-slide-btn2 {
	background: transparent;
	border: 1px solid #FFD700;
	color: #FFD700;
}
.efs-btn-icon { font-size: 1.1em; line-height: 1; }

/* Hover animation variants */
.efs-btn-glow:hover { box-shadow: 0 0 24px rgba(255,215,0,0.65); background: #FFD700; color: #1a0a00; border-color: #FFD700; }
.efs-btn-scale:hover { transform: scale(1.07); }
.efs-btn-pulse:hover { animation: efsBtnPulse 1s ease-out infinite; }
@keyframes efsBtnPulse {
	0%   { box-shadow: 0 0 0 0 rgba(255,215,0,0.5); }
	70%  { box-shadow: 0 0 0 12px rgba(255,215,0,0); }
	100% { box-shadow: 0 0 0 0 rgba(255,215,0,0); }
}
.efs-btn-lift:hover { transform: translateY(-4px); box-shadow: 0 12px 24px rgba(0,0,0,0.35); }
.efs-btn-shake:hover { animation: efsBtnShake .4s ease-in-out; }
@keyframes efsBtnShake {
	0%,100% { transform: translateX(0); }
	25%     { transform: translateX(-4px); }
	75%     { transform: translateX(4px); }
}
.efs-btn-bounce:hover { animation: efsBtnBounce .5s ease; }
@keyframes efsBtnBounce {
	0%,100% { transform: translateY(0); }
	50%     { transform: translateY(-8px); }
}
.efs-btn-gradient:hover { background: linear-gradient(135deg,#FFD700,#FFA500); color:#1a0a00; border-color:transparent; }

/* Shimmer sweep */
.efs-btn-shimmer { background-position: -200% center; }
.efs-btn-shimmer::before {
	content: '';
	position: absolute; inset: 0;
	background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.5) 50%, transparent 70%);
	background-size: 200% 100%;
	background-position: 200% center;
	transition: background-position .8s ease;
	pointer-events: none;
}
.efs-btn-shimmer:hover::before { background-position: -200% center; }

/* Ripple */
.efs-btn-ripple { isolation: isolate; }
.efs-btn-ripple::after {
	content: '';
	position: absolute;
	width: 0; height: 0;
	left: 50%; top: 50%;
	background: rgba(255,255,255,0.5);
	border-radius: 50%;
	transform: translate(-50%,-50%);
	transition: width .5s ease, height .5s ease, opacity .6s ease;
	opacity: 0;
	pointer-events: none;
	z-index: -1;
}
.efs-btn-ripple:hover::after { width: 260px; height: 260px; opacity: 1; }

/* Fill slide */
.efs-btn-fill { z-index: 0; }
.efs-btn-fill::before {
	content: '';
	position: absolute; inset: 0;
	background: #FFD700;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .4s ease;
	z-index: -1;
}
.efs-btn-fill:hover::before { transform: scaleX(1); }
.efs-btn-fill:hover { color: #1a0a00; }

/* ---------------------------------------------------------------------
   Neon text system
   --------------------------------------------------------------------- */
.efs-neon-text {
	-webkit-font-smoothing: antialiased;
}

/* ---------------------------------------------------------------------
   Independent layer system
   --------------------------------------------------------------------- */
.efs-layer {
	position: absolute;
	pointer-events: auto;
	will-change: transform, opacity;
}
.efs-wrapper.efs-js-ready .efs-layer {
	opacity: 0;
}
.efs-layer-image img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: inherit;
}
.efs-layer-divider {
	width: 60px;
	height: 2px;
	background: currentColor;
	border: none;
	opacity: 0.6;
}
.efs-layer-badge {
	display: inline-block;
	padding: 6px 16px;
	border-radius: 30px;
	font-size: 0.75rem;
	letter-spacing: 1.5px;
}
.efs-layer-heading {
	margin: 0;
	line-height: 1.15;
}
.efs-layer-text { margin: 0; line-height: 1.5; }

/* ---------------------------------------------------------------------
   Entrance animation library (shared: main content + layers)
   --------------------------------------------------------------------- */
/* These animation classes are printed directly into layer markup at render
   time (see luxury-hero.php), so — like .efs-layer above — they must only
   hide content once .efs-js-ready confirms JS is actually driving the
   reveal. Un-gated, a layer would render permanently invisible whenever the
   anim class is applied server-side but JS never gets a chance to run. */
.efs-wrapper.efs-js-ready .efs-anim-fade-up,
.efs-wrapper.efs-js-ready .efs-anim-fade-down,
.efs-wrapper.efs-js-ready .efs-anim-fade-left,
.efs-wrapper.efs-js-ready .efs-anim-fade-right,
.efs-wrapper.efs-js-ready .efs-anim-zoom-in,
.efs-wrapper.efs-js-ready .efs-anim-zoom-out,
.efs-wrapper.efs-js-ready .efs-anim-bounce,
.efs-wrapper.efs-js-ready .efs-anim-flip-x,
.efs-wrapper.efs-js-ready .efs-anim-flip-y,
.efs-wrapper.efs-js-ready .efs-anim-rotate,
.efs-wrapper.efs-js-ready .efs-anim-blur-in,
.efs-wrapper.efs-js-ready .efs-anim-elastic,
.efs-wrapper.efs-js-ready .efs-anim-luxury,
.efs-wrapper.efs-js-ready .efs-anim-neon {
	opacity: 0;
}

.efs-anim-play.efs-anim-fade-up    { animation: efsFadeUp var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-fade-down  { animation: efsFadeDown var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-fade-left  { animation: efsFadeLeft var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-fade-right { animation: efsFadeRight var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-zoom-in    { animation: efsZoomIn var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-zoom-out   { animation: efsZoomOutIn var(--efs-anim-duration,800ms) cubic-bezier(.2,.8,.2,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-bounce     { animation: efsBounceUp var(--efs-anim-duration,900ms) cubic-bezier(.34,1.56,.64,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-flip-x     { animation: efsFlipX var(--efs-anim-duration,800ms) ease var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-flip-y     { animation: efsFlipY var(--efs-anim-duration,800ms) ease var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-rotate     { animation: efsRotateIn var(--efs-anim-duration,800ms) ease var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-blur-in    { animation: efsBlurIn var(--efs-anim-duration,800ms) ease var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-elastic    { animation: efsElastic var(--efs-anim-duration,1000ms) cubic-bezier(.68,-0.6,.32,1.6) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-luxury     { animation: efsLuxury var(--efs-anim-duration,1100ms) cubic-bezier(.16,1,.3,1) var(--efs-anim-delay,0ms) forwards; }
.efs-anim-play.efs-anim-neon       { animation: efsNeonFlash var(--efs-anim-duration,700ms) ease var(--efs-anim-delay,0ms) forwards; }

@keyframes efsFadeUp    { from { opacity:0; transform:translate3d(0,40px,0); } to { opacity:1; transform:translate3d(0,0,0); } }
@keyframes efsFadeDown  { from { opacity:0; transform:translate3d(0,-40px,0); } to { opacity:1; transform:translate3d(0,0,0); } }
@keyframes efsFadeLeft  { from { opacity:0; transform:translate3d(-50px,0,0); } to { opacity:1; transform:translate3d(0,0,0); } }
@keyframes efsFadeRight { from { opacity:0; transform:translate3d(50px,0,0); } to { opacity:1; transform:translate3d(0,0,0); } }
@keyframes efsZoomIn    { from { opacity:0; transform:scale(0.8); } to { opacity:1; transform:scale(1); } }
@keyframes efsZoomOutIn { from { opacity:0; transform:scale(1.3); } to { opacity:1; transform:scale(1); } }
@keyframes efsBounceUp  { 0% { opacity:0; transform:translate3d(0,60px,0); } 60% { opacity:1; transform:translate3d(0,-12px,0); } 100% { opacity:1; transform:translate3d(0,0,0); } }
@keyframes efsFlipX     { from { opacity:0; transform:perspective(800px) rotateX(60deg); } to { opacity:1; transform:perspective(800px) rotateX(0); } }
@keyframes efsFlipY     { from { opacity:0; transform:perspective(800px) rotateY(60deg); } to { opacity:1; transform:perspective(800px) rotateY(0); } }
@keyframes efsRotateIn  { from { opacity:0; transform:rotate(-15deg) scale(0.9); } to { opacity:1; transform:rotate(0) scale(1); } }
@keyframes efsBlurIn    { from { opacity:0; filter:blur(12px); } to { opacity:1; filter:blur(0); } }
@keyframes efsElastic   { 0% { opacity:0; transform:scale(0.3); } 60% { opacity:1; transform:scale(1.08); } 100% { opacity:1; transform:scale(1); } }
@keyframes efsLuxury    { from { opacity:0; transform:translate3d(0,24px,0) scale(0.97); letter-spacing:6px; } to { opacity:1; transform:translate3d(0,0,0) scale(1); letter-spacing:normal; } }
@keyframes efsNeonFlash { 0%,18%,22%,25%,53%,57%,100% { opacity:1; } 20%,24%,55% { opacity:0.3; } from { opacity:0; } }

@media (prefers-reduced-motion: reduce) {
	.efs-anim-play { animation: none !important; opacity: 1 !important; transform: none !important; }
	.efs-content-inner { opacity: 1 !important; }
}

/* ---------------------------------------------------------------------
   Navigation arrows
   --------------------------------------------------------------------- */
.efs-btn-prev,
.efs-btn-next {
	position: absolute;
	top: 50%;
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(10,0,21,0.55);
	color: #FFD700;
	border: 1px solid rgba(255,215,0,0.4);
	border-radius: 50%;
	cursor: pointer;
	z-index: 20;
	transform: translateY(-50%);
	transition: background .3s ease, color .3s ease, transform .3s ease, opacity .3s ease;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.efs-btn-prev { left: 20px; }
.efs-btn-next { right: 20px; }
.efs-btn-prev:hover,
.efs-btn-next:hover {
	background: #FFD700;
	color: #1a0a00;
}
.efs-btn-prev.swiper-button-disabled,
.efs-btn-next.swiper-button-disabled {
	opacity: 0.3;
	cursor: not-allowed;
}
.efs-btn-prev svg, .efs-btn-next svg { width: 1em; height: 1em; }

/* ---------------------------------------------------------------------
   Pagination
   --------------------------------------------------------------------- */
.efs-pagination {
	position: absolute;
	bottom: 20px;
	left: 0;
	right: 0;
	z-index: 20;
	display: flex;
	justify-content: center;
	gap: 8px;
}
.efs-pagination .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: rgba(255,255,255,0.4);
	opacity: 1;
	margin: 0;
	cursor: pointer;
	transition: background .3s ease, width .3s ease;
}
.efs-pagination .swiper-pagination-bullet-active {
	background: #FFD700;
}
.efs-pagination.swiper-pagination-fraction {
	width: auto;
	left: 50%;
	transform: translateX(-50%);
	bottom: 20px;
}
.efs-pagination.swiper-pagination-progressbar {
	display: block;
}

/* ---------------------------------------------------------------------
   Responsive overrides
   --------------------------------------------------------------------- */
@media (max-width: 1024px) {
	.efs-content-inner { max-width: 90%; }
	.efs-btn-prev, .efs-btn-next { width: 40px; height: 40px; }
}

@media (max-width: 767px) {
	.efs-slide-title { font-size: clamp(1.6rem, 7vw, 2.5rem); }
	.efs-slide-subtitle { font-size: 1rem; }
	.efs-btn-row { gap: 10px; }
	.efs-slide-btn, .efs-slide-btn2 { padding: 12px 24px; font-size: 0.85rem; }
	.efs-btn-prev, .efs-btn-next { width: 36px; height: 36px; }
	.efs-content-wrap { padding: 0 6%; }
}

/* ---------------------------------------------------------------------
   Performance / accessibility
   --------------------------------------------------------------------- */
.efs-wrapper * { box-sizing: border-box; }
.efs-swiper, .efs-bg-wrap, .efs-content-inner, .efs-layer {
	backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
}
.efs-wrapper img { max-width: 100%; }

/* Elementor editor: force-show first slide for design context */
.elementor-editor-active .efs-wrapper .swiper-slide:first-child .efs-content-inner,
.elementor-editor-active .efs-wrapper .swiper-slide:first-child .efs-layer {
	opacity: 1 !important;
	animation: none !important;
}
