/* ==== 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:70%; margin:0 auto; height:100%; display:inline-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:70%; margin:0; left:5%; padding-top:5%; padding-right:2%;}
.caption-text-left .slide-caption .slide-cap-inner { position:relative; top:5%; padding:2.5% 0; border-top:10px solid #ffffff; border-bottom:10px solid #ffffff;}
.caption-text-left .slide-caption h4 { position:relative; display:inline-block; padding-bottom:20px;}
.caption-text-left .slide-caption h4:before { content:''; position:absolute; bottom:6px; left:0; width:70px; height:2px; background-color:#ff6210;}
.caption-text-left .slide-caption h4:after { content:''; position:absolute; bottom:0px; left:0; width:80px; height:2px; background-color:#ffffff;}
.caption-text-left .slide-caption p { margin-left:0;}

.caption-text-center { text-align: center;}
.caption-text-center .slide-caption { padding:0 0 0;}
.caption-text-center .slide-caption .slide-cap-inner { position:relative; padding:2.5% 0; border-top:10px solid #ffffff; border-bottom:10px solid #ffffff;}
.caption-text-center .slide-caption h4 { position:relative; display:inline-block; padding-bottom:20px;}
.caption-text-center .slide-caption h4:before { content:''; position:absolute; bottom:6px; right:0; left:0; width:70px; height:2px; margin:0 auto; background-color:#ff6210;}
.caption-text-center .slide-caption h4:after { content:''; position:absolute; bottom:0px; right:0; left:0; width:80px; height:2px; margin:0 auto; background-color:#ffffff;}

.caption-text-right { text-align: right;}
.caption-text-right .slide-caption { position:relative; max-width:70%; margin:0; right:5%; padding-top:5%; padding-left:2%;}
.caption-text-right .slide-caption .slide-cap-inner { position:relative; padding:2.5% 0; border-top:10px solid #ffffff; border-bottom:10px solid #ffffff;}
.caption-text-right .slide-caption h4 { position:relative; display:inline-block; padding-bottom:20px;}
.caption-text-right .slide-caption h4:before { content:''; position:absolute; bottom:6px; right:0; width:70px; height:2px; background-color:#ff6210;}
.caption-text-right .slide-caption h4:after { content:''; position:absolute; bottom:0px; right:0; width:80px; height:2px; background-color:#ffffff;}
.caption-text-right .slide-caption p { margin-right:0;}

/* ==== Caption Elements ==== */
.slide-caption h2 { font:700 78px/1.1 'Anek Latin'; margin:0px 0 10px; text-transform:capitalize;}
.slide-caption h2 a { color: #ffffff; text-decoration: none;}

.slide-caption h4 { position:relative; font:500 20px/1 'Anek Latin'; color:#ffffff; margin:0 0 15px 0; letter-spacing:1px; text-transform:uppercase; z-index:9; display:inline-block;}

.slide-caption p { font-size:18px; margin:0px auto 10px; color: #ffffff; max-width:800px;}

/* ==== Swiper Navigation Buttons ==== */
.swiper-button-prev, .swiper-button-next { width: 60px; height: 60px; border-radius: 8px; background-color:#1c0d0a; /* 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: #ff6210; /* Change background on hover */}

/* ==== Swiper Pagination ==== */
.swiper-main .swiper-pagination { bottom:40px;}

.swiper-pagination-bullet { background-color:#ffffff; opacity: 0.8; width:35px; height:10px; border-radius: 20px;}

.swiper-pagination-bullet-active { background-color:#ff6210; 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 { max-width:85%;}
    .slider-main .swiper-slide .slide-caption h2 { font-size:30px !important; margin-top:0;}
    .slider-main .swiper-slide .slide-caption h4 { font-size:16px;}
    .slider-main .swiper-slide .sliderbtn { font-size:14px;}
    .slider-main .caption-text-center .slide-caption .slide-cap-inner { border:none;}
}

@media (max-width: 480px) {
    .slide-caption { text-align:center !important; padding: 10px; width:100%; max-width:100%;}
    .slider-main .swiper-slide .slide-caption h4 { padding:0;}
    .slider-main .swiper-slide .slide-caption h4:before, .slider-main .swiper-slide .slide-caption h4:after { content:none;}
    .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 */ }
    .slider-main .swiper-slide .sliderbtn { display:none;}
}
