/* ─── Parent wrapper ─── */

 #home_banner.home_banner {
     width: 100%;
     overflow: hidden;
     position: relative;
 }

 /* ─── Swiper ─── */
 #home_banner .swiper {
     width: 100%;
     height: 100vh;
     min-height: 480px;
 }

 /* ─── Each slide ─── */
 #home_banner .swiper-slide {
     position: relative;
     overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: flex-end;
 }

 /* ─── BG image with zoom-out animation ─── */
 #home_banner .slide-bg {
     position: absolute;
     inset: 0;
     background-size: cover;
     background-position: center;
     transform: scale(1.18);
     animation: none;
     /* triggered by JS on active */
     will-change: transform;
 }

 #home_banner .swiper-slide-active .slide-bg {
     animation: zoomOut 7s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
 }

 @keyframes zoomOut {
     from {
         transform: scale(1.18);
     }

     to {
         transform: scale(1.00);
     }
 }

 /* ─── Gradient overlay ─── */
 #home_banner .slide-bg::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(100deg,
             rgba(0, 0, 0, 0.08) 0%,
             rgba(0, 0, 0, 0.0) 40%,
             rgba(20, 10, 40, 0.45) 100%);
 }

 /* ─── Content box (right side) ─── */
 #home_banner .slide-content {
     position: relative;
     z-index: 2;
     text-align: start;
     padding: 0 0 0 0%;
 }

 /* ─── Headline ─── */
 #home_banner .slide-title {
     font-size: clamp(8.2rem, 18vw, 16.5rem);
     font-weight: 700;
     font-style: bold;
     line-height: 0.95;
     color: #fff;
     letter-spacing: 0.02em;
     overflow: visible;
 }

 /* each word wraps in a clip-box */
 #home_banner .word-wrap {
     display: block;
     overflow: hidden;
     line-height: 1.05;
 }

 #home_banner .word {
     display: inline-block;
     transform: translateY(-110%);
     opacity: 0;
     transition: none;
     /* driven by JS */
 }

 /* ─── CTA button ─── */
 #home_banner .slide-cta {
     display: inline-flex;
     align-items: center;
     gap: 10px;
     margin-top: clamp(1.4rem, 3vw, 2.4rem);
     padding: 14px 34px;
     background: #002AC4;
     color: #fff;

     font-size: 1.5rem;
     font-weight: 600;
     letter-spacing: 0.08em;
     border-radius: 50px;
     text-decoration: none;
     border: none;
     cursor: pointer;
     opacity: 0;
     transform: translateY(20px);
     transition: background 0.3s ease, transform 0.3s ease;
 }

 #home_banner .slide-cta:hover {
     background: #002AC4;
     transform: translateY(0) scale(1.04);
 }

 #home_banner .slide-cta .arrow {
     font-size: 1.1em;
     transition: transform 0.3s ease;
 }

 #home_banner .slide-cta:hover .arrow {
     transform: translateX(4px) translateY(-2px);
 }

 /* ─── Swiper pagination ─── */
 #home_banner .swiper-pagination {
     bottom: 28px;
 }

 #home_banner .swiper-pagination-bullet {
     width: 8px;
     height: 8px;
     background: rgba(255, 255, 255, 0.45);
     opacity: 1;
     transition: all 0.35s ease;
 }

 #home_banner .swiper-pagination-bullet-active {
     background: #fff;
     width: 28px;
     border-radius: 4px;
 }

 /* ─── Nav arrows ─── */
 #home_banner .swiper-button-next,
 #home_banner .swiper-button-prev {
     color: #fff;
     width: 46px;
     height: 46px;
     background: rgba(255, 255, 255, 0.12);
     border-radius: 50%;
     backdrop-filter: blur(6px);
     transition: background 0.3s;
 }

 #home_banner .swiper-button-next:hover,
 #home_banner .swiper-button-prev:hover {
     background: rgba(75, 15, 227, 0.7);
 }

 #home_banner .swiper-button-next::after,
 #home_banner .swiper-button-prev::after {
     font-size: 15px;
     font-weight: 900;
 }

 .d-flex-box {
     display: grid;
     grid-template-columns: minmax(0, 1fr) auto;
     gap: 12px;
     align-items: start;
 }

 /* ─── Responsive ─── */
 @media (min-width: 993px) and (max-width: 1122px) {

     #home_banner.home_banner {
         height: 640px;
     }

     #home_banner .swiper {
         height: 640px;
     }

     #home_banner .swiper-slide {
         height: 640px;
     }

     #home_banner .slide-title {
         font-size: clamp(1.2rem, 7vw, 10.5rem);
     }

     #home_banner .slide-cta {
         padding: 20px 30px;
         font-size: 30px;
     }

     #home_banner .slide-content {
         height: 180px;
     }

     #home_banner .slide-content {
         text-align: end;
     }

     .slide-card {
         grid-template-columns: 332px 408px 132px !important;
     }

     .d-flex-footer {
         align-items: center;
     }

 }

 @media (max-width: 991.98px) {
     #home_banner .slide-content {
         text-align: center;
         padding: 0 20px;
         max-width: 100%;
         display: flex;
         flex-direction: column;
         align-items: center;
     }

     #home_banner .swiper-slide {
         justify-content: center;
         align-items: flex-end;
         padding-bottom: 14%;
     }

     .d-flex-footer {
         display: flex;
         flex-direction: column;
         align-items: center;
     }

     .fd-prev,
     .fd-next {
         height: 50px !important;
         width: 50px !important;
     }

     .card-arrow {
         width: 50px !important;
         height: 50px !important;
     }

     .pm-text h2 {
         margin-top: 20px;
     }

     .em-left p {
         margin-bottom: 20px;
     }

     .em-left-top {
         align-items: center;
     }
 }

 @media (max-width: 575.98px) {
     #home_banner .swiper {
         min-height: 420px;
     }

     #home_banner .swiper-button-next,
     #home_banner .swiper-button-prev {
         display: none;
     }

     #home_banner .slide-title {
         font-size: clamp(5.2rem, 16vw, 16.5rem);
     }

     #home_banner .slide-bg {
         background-position: inherit;
     }

     #home_banner .slide-content {
         text-align: center;
         padding: 0 0px;
         padding-right: 50px;
     }


 }

 @media (min-width: 600px) and (max-width: 992px) {
     #home_banner .slide-bg {
         background-position: left;
     }

     #home_banner .slide-title {
         font-size: clamp(2.2rem, 17vw, 10.5rem);
     }

     .em-left p {
         max-width: 100% !important;
     }

     #home_banner .swiper-slide {
         display: inline-block;
     }

     #home_banner .slide-content {
         height: 400px;
     }

     .travel-section .hero-bg-text {
         font-size: 110px;
     }

     .hero-img-col {
         max-height: 450px;
     }

     .text-center-mob {
         text-align: center;
         display: flex;
         align-items: center;
     }

     .footer-subscribe .btn-subscribe {
         max-width: max-content;
     }

     .stats-section {
         padding: 50px 50px !important;
     }

     .d-flex-footer-3 {
         display: flex;
         flex-direction: column;
         align-items: center;
     }

     .hero-wordmark {
         line-height: 1.5 !important;
     }

     .travel-section .hero-bg-text {
         font-size: 90px !important;
     }

     .travel-section .hero-bg-text {
         top: 12% !important;
     }

 }

 @media (min-width: 992px) and (max-width: 1024px) {
     #home_banner .slide-bg {
         background-position: left;
     }

     #home_banner .slide-title {
         font-size: clamp(2.2rem, 17vw, 12.5rem);
     }

     #home_banner .swiper-slide {
         display: inline-block;
     }

     .slide-card {
         grid-template-columns: 320px 1fr 201px;
     }

     #best-selling {
         padding: 60px 31px;
     }

     .travel-section .hero-bg-text {
         font-size: 150px;
     }
 }

 @media (min-width: 1120px) and (max-width: 1378px) {
     #home_banner .slide-bg {
         background-position: left;
     }

     #home_banner .slide-title {
         font-size: clamp(2.2rem, 17vw, 10.5rem);
     }

     #home_banner .swiper-slide {
         display: inline-block;
     }

     #home_banner .slide-content {
         height: 400px;
     }

     .slide-card {
         grid-template-columns: 320px 1fr 201px;
     }

     #best-selling {
         padding: 60px 31px;
     }

     .travel-section .hero-bg-text {
         font-size: 150px;
     }
 }

 @media (min-width: 343px) and (max-width: 560px) {
     .travel-section .marquee-track .marquee-dot {
         font-size: 0.65rem !important;
     }

     .section-title {
         font-size: 2.75rem !important;
     }

     #home_banner.home_banner {
         height: 240px;
     }

     #home_banner .swiper {
         height: 240px;
     }

     #home_banner .swiper-slide {
         height: 240px;
     }

     #home_banner .slide-title {
         font-size: clamp(1.2rem, 7vw, 10.5rem);
     }

     #home_banner .slide-cta {
         padding: 5px 10px;
         font-size: 5px;
     }

     .bags-wrapper {
         padding-top: 20px;
         padding-bottom: 0px;
     }

     .btn-explore {
         background: #002AC4 !important;
         color: #fff !important;
         border: none !important;
         border-radius: 40px !important;
         font-size: 9.91px !important;
         font-weight: 500 !important;
         padding: 9px 20px !important;
         max-width: 124px !important;
         height: 43.88px !important;
     }

     .sale-arrow {
         width: 50px !important;
         height: 50px !important;
     }

     .hero-text-col {
         align-items: center !important;
     }

     .hero-title {
         text-align: center;
     }

     .featuredSwiper {
         height: 1086px;
     }

     .fs-wrap {
         height: 1086px;
     }

     .pm-section {
         padding: 48px 20px 0px !important;
     }



     .em-btn {
         max-width: max-content !important;
     }



     .bs-prev,
     .bs-next {
         height: 40px !important;
         width: 40px !important;
     }

     .slide-nav {
         right: unset !important;
     }

     .bs-img-wrap img {
         height: auto;
         object-fit: cover;
     }

     .bsp-title {
         font-size: 15px !important;
     }

     .bsp-header {
         margin-bottom: 10px;
     }



     .card-label {
         padding: 10px 32px 10px;
     }

     .card-title {
         font-size: 2.4rem;
     }

     #best-selling {
         padding: 0px 0;
     }

     .feat-desc {
         font-size: 1.3rem !important;
     }

     .bags-wrapper {
         padding-top: 13px !important;
         padding-bottom: 0px;
     }

     .bsp-title {
         font-size: 16px !important;
     }

     .bsp-tabs {
         margin-bottom: 20px !important;
     }

     .card-footer-row {
         justify-content: center !important;
     }

     .bs-title {
         font-size: 15px !important;
     }

     .card-label {
         padding: 5px 16px 5px !important;
     }
 
     .vbtn.on { 
    display: none;
}
 }


 .pt-50 {
     padding: 50px;
 }