/* ========================================
   Featured Cards Section - Swiper Container
======================================== */

.featured-cards-section {
    position: relative;
    padding: 0;
}

.featured-cards-swiper {
    padding: 30px 0;
    margin-bottom: 40px;
    overflow: hidden;
}

.featured-cards-swiper .swiper-wrapper {
    padding-left: 15px;
}

.featured-cards-swiper .swiper-slide {
    height: auto;
    display: flex;
    position: relative;
}

/* ========================================
   Section Borders
======================================== */

.featured-cards-section::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 1px;
    width: 100%;
    background: #dedede;
    z-index: -1;
}

.featured-cards-section::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 80px;
    height: 1px;
    width: 100%;
    background: #dedede;
}

/* Slide Dividers */
.featured-cards-swiper .swiper-slide:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -30px;
    top: -30px;
    width: 1px;
    height: calc(100% + 60px);
    background: #dedede;
}

/* Gradien Wrapper Slide Dividers */

.gradient-wrapper.featured-cards-section::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 1px;
    width: 100%;
    background: rgba(234, 234, 234, 0.20);
}

.gradient-wrapper .featured-cards-section::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 80px;
    height: 1px;
    width: 100%;
    background: rgba(234, 234, 234, 0.20);
}

.gradient-wrapper .featured-cards-swiper .swiper-slide:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -30px;
    top: -30px;
    width: 1px;
    height: calc(100% + 60px);
    background: rgba(234, 234, 234, 0.20);
}

.gradient-wrapper.featured-cards-swiper .swiper-slide:not(:last-child)::after {
    content: '';
    position: absolute;
    right: -30px;
    top: -30px;
    width: 1px;
    height: calc(100% + 60px);
    background: rgba(234, 234, 234, 0.20);
}

/* ========================================
   Swiper Controls Wrapper
======================================== */

.featured-cards-section .swiper-controls {
    margin-top: 80px;
}

.gradient-wrapper .featured-cards-swiper:not(:last-child) .swiper-pagination-bullet-active {
    background-color: var(--white);
}

/* ========================================
   Featured Card
======================================== */

.featured-card {
    color: var(--white);
    border-radius: 15px;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

/* ========================================
   Card Background Variations
======================================== */

.featured-cards-section .background-black {
    background-color: var(--black);
}

.featured-cards-section .background-glass {
    background: rgba(255, 255, 255, 0.06);
}

.featured-cards-section .background-purple {
    background: var(--Lavender-Gradient, linear-gradient(351deg, #8862FF 0%, #C1A7FF 100%));
}

.featured-cards-section .background-red {
    background: var(--Peach-Gradient, linear-gradient(352deg, #F9646A 0.97%, #F8868A 100%));
}

.featured-cards-section .background-blue {
    background: var(--Light-Blue-Gradient, linear-gradient(351deg, #21A2BC 0%, #C8E2E8 100%));
}

.featured-cards-section .background-glass .card-content::after {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 16px;
    padding: 3px;
    background: linear-gradient(45deg, rgb(157 129 242 / 53%) 0%, rgba(144, 130, 186, 0.4) 50%, rgb(162 145 213 / 60%) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    z-index: -1;
}

/* ========================================
   Card Content
======================================== */

.featured-cards-section .card-content {
    padding: 20px;
}

.featured-cards-section .card-content p {
    margin-bottom: 0;
}

.gradient-wrapper .featured-cards-section .card-content::before {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="27" height="23" viewBox="0 0 27 23" fill="none"><g clip-path="url(%23clip0_1979_5507)"><path d="M11.6686 0.0491043C12.6254 0.134145 13.5708 0.328981 14.4735 0.626797C15.9556 1.11574 17.3278 1.98482 18.3637 3.15642C19.5053 4.44739 19.9665 5.91555 20.2199 7.58714C20.2284 7.64302 20.2215 7.73583 20.2211 7.80448H15.4962C15.4962 7.80448 15.4251 7.47014 15.4152 7.42934C15.2035 6.55211 14.8363 5.72093 14.1641 5.10719C13.5295 4.52773 12.7373 4.12551 11.9007 3.9343C10.7355 3.66792 9.30566 3.74515 8.24277 4.32112C6.38015 5.33053 5.3901 7.07404 5.00233 9.10903C4.87606 9.77159 4.79292 10.4439 4.78054 11.1188C4.73591 13.5548 5.4739 16.6544 7.66836 18.0545C8.07614 18.3146 8.52446 18.5069 8.99055 18.6348C9.59239 18.7999 10.5691 18.8188 11.2209 18.7291C12.6415 18.5335 13.8393 17.7252 14.588 16.5086C14.9459 15.9269 15.2377 15.1363 15.3688 14.507C15.3954 14.3796 15.3909 14.1571 15.4163 14.0524C15.4204 14.0352 15.4569 14.0387 15.4611 14.0207C15.4726 13.9725 15.4409 13.9095 15.4962 13.8756H20.1866C20.2779 13.8756 20.1807 14.0703 20.1763 14.0953C19.935 15.4567 19.641 16.7281 18.9463 17.9533C18.3042 19.0856 17.4436 20.1139 16.3924 20.8874C15.4526 21.5789 14.3349 22.0216 13.1994 22.2656C11.1627 22.7031 8.87092 22.6962 6.87655 22.0608C4.28112 21.234 2.16295 19.3554 1.07665 16.8115C-0.0445844 14.1857 -0.302942 11.1212 0.36212 8.34392C0.570367 7.47432 0.793406 6.62904 1.15811 5.80805C2.10559 3.67521 3.76643 1.93885 5.89867 0.973516C7.6891 0.162909 9.70288 -0.125635 11.6686 0.0491043Z" fill="white"/><path d="M23.2171 22.5898C24.9112 22.5898 26.2846 21.2164 26.2846 19.5222C26.2846 17.828 24.9112 16.4547 23.2171 16.4547C21.5229 16.4547 20.1495 17.828 20.1495 19.5222C20.1495 21.2164 21.5229 22.5898 23.2171 22.5898Z" fill="white"/></g><defs><clipPath id="clip0_1979_5507"><rect width="26.2846" height="22.5896" fill="white"/></clipPath></defs></svg>');
    position: absolute;
    top: 10px;
    right: 10px;
    pointer-events: none;
}

/* ========================================
   Swiper Navigation Arrows
======================================== */

.featured-cards-swiper .swiper-button-next,
.featured-cards-swiper .swiper-button-prev {
    width: 44px;
    height: 44px;
    background-color: #ECE7F9;
    border-radius: 50%;
    transition: all 0.3s ease;
    top: auto;
    bottom: 0px;
}
.featured-cards-swiper .swiper-button-prev {
    left: 77px; 
}

.featured-cards-swiper .swiper-button-next {
    right: 77px; 
}
.featured-cards-swiper .swiper-button-next:hover,
.featured-cards-swiper .swiper-button-prev:hover {
    background-color: rgba(255, 255, 255, 0.4);
}

.featured-cards-swiper .swiper-button-disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.featured-cards-swiper .swiper-button-prev svg,
.featured-cards-swiper .swiper-button-next svg {
    width: 20px;
    height: 15px; 
}

.featured-cards-swiper .swiper-button-prev::after,
.featured-cards-swiper .swiper-button-next::after,
.featured-cards-swiper .swiper-button-prev::before,
.featured-cards-swiper .swiper-button-next::before {
    content: none;
}

/* ========================================
   Swiper Pagination
======================================== */

.featured-cards-swiper .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background-color: #ccc;
    border-radius: 50%;
    opacity: 0.5;
    transition: all 0.3s ease;
    position: relative;
}

.featured-cards-swiper .swiper-pagination-bullet-active {
    width: 24px;
    height: 8px;
    background-color: #2E1675;
    border-radius: 10px;
    transform: scale(1.1);
    opacity: 1;
}

.featured-cards-swiper .swiper-pagination-bullet-active-prev,
.featured-cards-swiper .swiper-pagination-bullet-active-next {
    transform: scale(0.85);
    opacity: 0.8;
}

.featured-cards-swiper .swiper-pagination-bullet-active::before {
    content: "";
    position: absolute;
    width: 28px;
    height: 12px;
    border-radius: 12px;
    background: radial-gradient(circle, rgba(46,22,117,0.25) 0%, transparent 70%);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: 0.6;
    transition: opacity 0.4s ease;
}

/* ========================================
   Media Queries
======================================== */

@media (max-width: 991px) {
    .featured-cards-swiper .swiper-button-next,
    .featured-cards-swiper .swiper-button-prev {
        display: none;
    }
    
    .featured-cards-swiper {
        margin-bottom: 0;
    }
}