/* ==== Slider Outer Wrapper ==== */
.slider-main {
    width: 100%; overflow: hidden; position: relative;}

/* ==== Swiper Container ==== */
.swiper-main { width: 100%; height: 120vh; /* Full screen by default */ position: relative;}

/* ==== Swiper Slide ==== */
.swiper-slide { position: relative; width: 100%; height: 100%;}

/* ==== Background Image ==== */
.slide-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-size: cover; background-repeat: no-repeat; z-index: 1;}

/* Overlay layer */
.slide-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); /* semi-transparent black */ z-index: 2;}

/* ==== Slide Caption Wrapper ==== */
.slide-caption { position: relative; z-index: 8; max-width:85%; margin: 0 auto; height: 100%; display: flex; flex-direction: column; justify-content: center; /* vertical center */ padding: 20px; color: #ffffff;}

/* ==== Text Alignment Based on Class ==== */
.caption-text-left { text-align: left;}
.caption-text-left .slide-caption { position:relative; max-width:75%; margin:0; padding-left:7%; padding-right:2%;}
.caption-text-left .slide-caption:before { content:''; position:absolute; left:7%; width:600px; height:731px; margin:0 auto; background-image: url('../images/slider-img.png'); background-repeat:no-repeat; background-size:cover; background-position:center; z-index:-1;}
.caption-text-left .slide-caption h4 { position:relative; padding:0 0 0 40px; z-index:2;}

.caption-text-center { text-align: center;}
.caption-text-center .slide-caption { position:relative;}
.caption-text-center .slide-caption:before { content:''; position:absolute; left:0; right:0; width:600px; height:731px; margin:0 auto; background-image: url('../images/slider-img.png'); background-repeat:no-repeat; background-size:cover; background-position:center; z-index:-1;}
.caption-text-center .slide-caption h4 { position:relative; padding:0; z-index:2;}

.caption-text-right { text-align: right;}
.caption-text-right .slide-caption { position:relative; max-width:75%; margin-right:0; padding-right:7%; padding-left:2%;}
.caption-text-right .slide-caption:before { content:''; position:absolute; right:7%; width:600px; height:731px; margin:0 auto; background-image: url('../images/slider-img.png'); background-repeat:no-repeat; background-size:cover; background-position:center; z-index:-1;}
.caption-text-right .slide-caption h4 { position:relative; padding:0 40px 0 0; z-index:2;}

/* ==== Caption Elements ==== */
.slide-caption h2 { font: 400 64px/1.4 'Petit Formal Script'; margin: 10px 0; text-transform:capitalize;}

.slide-caption h2 a { color: #ffffff; text-decoration: none;}

.slide-caption h4 { position:relative; font:500 16px/1 'Jost'; color:#ffffff; margin:0; padding:0; letter-spacing:1px; text-transform:uppercase;}


.slide-caption p { font-size:18px; margin: 10px 0; color: #ffffff; max-width:800px;}

/* ==== Swiper Navigation Buttons ==== */
.swiper-button-prev, .swiper-button-next { width: 60px; height: 60px; border-radius: 8px; background-color: #002642; /* Optional background */ transition: all 200ms ease-in-out; z-index: 10; top: 50%; transform: translateY(-50%);}

/* Positioning */
.swiper-button-prev { left: 15px;}

.swiper-button-next { right: 15px;}

/* Default Swiper arrows */
.swiper-button-prev::after, .swiper-button-next::after { font-size: 24px; color: #fff;}

/* Optional: Hover effect */
.swiper-button-prev:hover, .swiper-button-next:hover { background-color: #738ea5; /* Change background on hover */}

/* ==== Swiper Pagination ==== */
.swiper-main .swiper-pagination { bottom: 30px;}

.swiper-pagination-bullet { background-color:#ffffff; opacity: 0.8; width:15px; height:15px; border-radius:100%;}

.swiper-pagination-bullet-active { background-color:#738ea5; opacity: 1;}

/* ==== Responsive Adjustments ==== */
@media (max-width: 1024px) {
    .slide-caption h2 { font-size:50px !important;}
    .slide-caption p { font-size: 16px;}	
}

@media (max-width: 768px) {
    .slider-main .swiper-slide .slide-caption h2 { font-size:35px !important; margin-top:0;}
    .slider-main .swiper-slide .slide-caption h4 { font-size: 16px;}
    .caption-text-left .slide-caption h4:before, .caption-text-right .slide-caption h4:before, .caption-text-center .slide-caption h4:before { content:none;}
    .slider-main .swiper-slide .sliderbtn { font-size:14px;}
}

@media (max-width: 480px) {
    .slide-caption { text-align:center !important; padding: 10px;}
    .caption-text-left .slide-caption { max-width:100%; padding-left:10px;}
    .caption-text-right .slide-caption { max-width:100%; padding-right:10px;}
    .caption-text-left, .caption-text-right { text-align:center; /* Force center on mobile */ }
    .caption-text-left .slide-caption:before, .caption-text-right .slide-caption:before { opacity:0.5;}
}