/*** Spinner Start ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}
/*** Spinner End ***/

.back-to-top {
    position: fixed;
    right: 30px;
    bottom: 30px;
    transition: 0.5s;
    z-index: 99;
}


/*** Button Start ***/
.btn {
    font-weight: 600;
    transition: .5s;
}

.btn-square {
    width: 32px;
    height: 32px;
}

.btn-sm-square {
    width: 34px;
    height: 34px;
}

.btn-md-square {
    width: 44px;
    height: 44px;
}

.btn-lg-square {
    width: 56px;
    height: 56px;
}

.btn-xl-square {
    width: 66px;
    height: 66px;
}

.btn-square,
.btn-sm-square,
.btn-md-square,
.btn-lg-square,
.btn-xl-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
}

.btn.btn-primary {
    color: var(--bs-white);
    border: none;
}

.btn.btn-primary:hover {
    background: var(--bs-dark);
    color: var(--bs-white);
}

.btn.btn-light {
    color: var(--bs-primary);
    border: none;
}

.btn.btn-light:hover {
    color: var(--bs-white);
    background: var(--bs-dark);
}

.btn.btn-dark {
    color: var(--bs-white);
    border: none;
}

.btn.btn-dark:hover {
    color: var(--bs-primary);
    background: var(--bs-light);
}


/*** Topbar Start ***/ 
.topbar .dropdown-toggle::after {
    border: none;
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    vertical-align: middle;
    margin-left: 8px;
    color: var(--bs-primary);
}

.topbar .dropdown .dropdown-menu a:hover {
    background: var(--bs-primary);
    color: var(--bs-white);
}

.topbar .dropdown .dropdown-menu {
    transform: rotateX(0deg);
    visibility: visible;
    background: var(--bs-light);
    padding-top: 10px;
    border: 0;
    transition: .5s;
    opacity: 1;
}
/*** Topbar End ***/


/*** Navbar Start ***/
.nav-bar {
    background: var(--bs-white);
    transition: 1s;
}

.navbar-light .navbar-brand img {
    max-height: 60px;
    transition: .5s;
}

.nav-bar .navbar-light .navbar-brand img {
    max-height: 50px;
}

.navbar .navbar-nav .nav-item .nav-link {
    padding: 0;
}

.navbar .navbar-nav .nav-item {
    display: flex;
    align-items: center;
    padding: 15px;
}

.navbar-light .navbar-nav .nav-item:hover,
.navbar-light .navbar-nav .nav-item.active,
.navbar-light .navbar-nav .nav-item:hover .nav-link,
.navbar-light .navbar-nav .nav-item.active .nav-link {
    color: var(--bs-primary);
}

@media (max-width: 991px) {
    .navbar {
        padding: 20px 0;
    }

    .navbar .navbar-nav .nav-link {
        padding: 0;
    }

    .navbar .navbar-nav .nav-item {
        display: flex;
        padding: 20px;
        flex-direction: column;
        justify-content: start;
        align-items: start;
    }

    .navbar .navbar-nav .nav-btn {
        display: flex;
        justify-content: start;
    }

    .navbar .navbar-nav {
        width: 100%;
        display: flex;
        margin-top: 20px;
        padding-bottom: 20px;
        background: var(--bs-light);
        border-radius: 10px;
    }

    .navbar.navbar-expand-lg .navbar-toggler {
        padding: 8px 15px;
        border: 1px solid var(--bs-primary);
        color: var(--bs-primary);
    }
}

.navbar .dropdown-toggle::after {
    border: none;
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    vertical-align: middle;
    margin-left: 8px;
}

.dropdown .dropdown-menu .dropdown-item:hover {
    background: var(--bs-primary);
    color: var(--bs-white);
}

@media (min-width: 992px) {
    .navbar {
        padding: 20px 0;
    }

    .navbar .nav-btn {
        display: flex;
        align-items: center;
        justify-content: end;
    }

    .navbar .navbar-nav {
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        background: var(--bs-light);
        border-radius: 10px;
    }

    .navbar .navbar-nav .nav-btn {
        width: 100%;
        display: flex;
        margin-left: auto;
    }

    .navbar .nav-item .dropdown-menu {
        display: block;
        visibility: hidden;
        top: 100%;
        transform: rotateX(-75deg);
        transform-origin: 0% 0%;
        border: 0;
        border-radius: 10px;
        transition: .5s;
        opacity: 0;
    }

    .navbar .nav-item:hover .dropdown-menu {
        transform: rotateX(0deg);
        visibility: visible;
        margin-top: 20px;
        background: var(--bs-light);
        transition: .5s;
        opacity: 1;
    }
}
/*** Navbar End ***/


/*** Carousel Hero Header Start ***/
.header-carousel .header-carousel-item {
    height: 700px;
}

.header-carousel .owl-nav .owl-prev,
.header-carousel .owl-nav .owl-next {
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 60px;
    background: var(--bs-light);
    color: var(--bs-primary);
    font-size: 26px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
}

.header-carousel .owl-nav .owl-prev {
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    margin-left: 30px;
}
.header-carousel .owl-nav .owl-next {
    bottom: 30px;
    right: 50%;
    transform: translateX(-50%);
    margin-right: 30px;
}

.header-carousel .owl-nav .owl-prev:hover,
.header-carousel .owl-nav .owl-next:hover {
    box-shadow: inset 0 0 100px 0 var(--bs-secondary);
    color: var(--bs-white);
}

.header-carousel .header-carousel-item .carousel-caption {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .2);
    display: flex;
    align-items: center;
}

@media (max-width: 991px) {
    .header-carousel .header-carousel-item .carousel-caption {
        padding-top: 45px;
    }

    .header-carousel .header-carousel-item {
        height: 1300px;
    }
}

@media (max-width: 767px) {
    .header-carousel .header-carousel-item {
        height: 950px;
    }

    .header-carousel .owl-nav .owl-prev {
        bottom: -30px;
        left: 50%;
        transform: translateX(-50%);
        margin-left: -45px;
    }

    .header-carousel .owl-nav .owl-next {
        bottom: -30px;
        left: 50%;
        transform: translateX(-50%);
        margin-left: 45px;
    }
}
/*** Carousel Hero Header End ***/


/*** Single Page Hero Header Start ***/
.bg-breadcrumb {
    position: relative;
    overflow: hidden;
    background: linear-gradient(rgba(1, 95, 201, 0.9), rgba(0, 0, 0, 0.2)), url(../img/bg-breadcrumb.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 0 60px 0;
    transition: 0.5s;
}

.bg-breadcrumb .breadcrumb {
    position: relative;
}

.bg-breadcrumb .breadcrumb .breadcrumb-item a {
    color: var(--bs-white);
}
/*** Single Page Hero Header End ***/


/*** Service Start ***/
.service .service-item {
    border-radius: 10px;
}
.service .service-item .service-img {
    position: relative;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.service .service-item .service-img img {
    transition: 0.5s;
}

.service .service-item:hover .service-img img {
    transform: scale(1.1);
}

.service .service-item .service-img::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0;
    top: 0;
    left: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: rgba(1, 95, 201, .2);
    transition: 0.5s;
    z-index: 1;
}

.service .service-item:hover .service-img::after {
    height: 100%;
}

.service .service-item .service-img .service-icon {
    position: absolute;
    width: 70px;
    bottom: 0;
    right: 25px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: var(--bs-light);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
    z-index: 9;
}

.service .service-item .service-img .service-icon i {
    color: var(--bs-primary);
    transition: 0.5s;
}

.service .service-item:hover .service-img .service-icon i {
    transform: rotateX(360deg);
    color: var(--bs-white);
}

.service .service-item:hover .service-img .service-icon {
    bottom: 0;
    color: var(--bs-white);
    background: var(--bs-primary);
}

.service .service-content {
    position: relative;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: var(--bs-light);
}

.service .service-item .service-content .service-content-inner {
    position: relative;
    z-index: 9;
}

.service .service-item .service-content .service-content-inner .h4,
.service .service-item .service-content .service-content-inner p {
    transition: 0.5s;
}

.service .service-item:hover .service-content .service-content-inner .h4,
.service .service-item:hover .service-content .service-content-inner p {
    color: var(--bs-white);
}

.service .service-item:hover .service-content .service-content-inner .btn.btn-primary {
    color: var(--bs-primary);
    background: var(--bs-white);
}

.service .service-item:hover .service-content .service-content-inner .btn.btn-primary:hover {
    color: var(--bs-white);
    background: var(--bs-dark);
}

.service .service-item:hover .service-content .service-content-inner .h4:hover {
    color: var(--bs-dark);
}

.service .service-item .service-content::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0;
    bottom: 0;
    left: 0;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: var(--bs-primary);
    transition: 0.5s;
    z-index: 1;
}

.service .service-item:hover .service-content::after {
    height: 100%;
}
/*** Service End ***/


/*** Blog Start ***/
.blog .blog-item {
    border-radius: 10px;
    transition: 0.5s;
}

.blog .blog-item:hover {
    box-shadow: 0 0 45px rgba(0, 0, 0, .1);
}

.blog .blog-item:hover .blog-content {
    background: var(--bs-light);
}

.blog .blog-item .blog-img {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: relative;
    overflow: hidden;
}

.blog .blog-item .blog-img img {
    transition: 0.5s;
}

.blog .blog-item:hover .blog-img img {
    transform: scale(1.2);
}

.blog .blog-item .blog-img::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0;
    top: 0;
    left: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    background: rgba(1, 95, 201, .2);
    transition: 0.5s;
    z-index: 1;
}

.blog .blog-item:hover .blog-img::after {
    height: 100%;
}

.blog .blog-item .blog-img .blog-categiry {
    position: absolute;
    bottom: 0;
    right: 0;
    border-top-left-radius: 10px;
    display: inline-flex;
    color: var(--bs-white);
    background: var(--bs-primary);
    z-index: 9;
}

.blog .blog-item .blog-content {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: var(--bs-white);
}

.blog .blog-item .blog-content a.btn {
    color: var(--bs-dark);
}

.blog .blog-item:hover .blog-content a.btn:hover {
    color: var(--bs-primary);
}
/*** Blog End ***/


/*** Team Start ***/
.team .team-item .team-img {
    position: relative;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
} 

.team .team-item .team-img img {
    transition: 0.5s;
}

.team .team-item:hover .team-img img {
    transform: scale(1.1);
}

.team .team-item .team-img::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0;
    top: 0;
    left: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    transition: 0.5s;
}

.team .team-item:hover .team-img::after {
    height: 100%;
    background: rgba(255, 255, 255, 0.3);
}

.team .team-item .team-img .team-icon {
    position: absolute;
    bottom: 20px;
    right: 20px;
    margin-bottom: -100%;
    transition: 0.5s;
    z-index: 9;
}

.team .team-item:hover .team-img .team-icon {
    margin-bottom: 0;
}

.team .team-item .team-title {
    color: var(--bs-white);
    background: var(--bs-primary);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    transition: 0.5s;
}

.team .team-item .team-title h4 {
    color: var(--bs-white);
}

.team .team-item:hover .team-title {
    background: var(--bs-dark);
}
/*** Team End ***/


/*** Footer Start ***/
.footer {
    background: var(--bs-dark);
}

.footer .footer-item {
    display: flex;
    flex-direction: column;
}

.footer .footer-item a {
    line-height: 35px;
    color: var(--bs-body);
    transition: 0.5s;
}

.footer .footer-item p {
    line-height: 35px;
}

.footer .footer-item a:hover {
    color: var(--bs-primary);
}

.footer .footer-item .footer-btn a,
.footer .footer-item .footer-btn a i {
    transition: 0.5s;
}

.footer .footer-item .footer-btn a:hover {
    background: var(--bs-white);
}

.footer .footer-item .footer-btn a:hover i {
    color: var(--bs-primary);
}


.footer .footer-item .footer-instagram {
    position: relative;
    overflow: hidden;
}

.footer .footer-item .footer-instagram img {
    transition: 0.5s;
}

.footer .footer-item .footer-instagram:hover img {
    transform: scale(1.2);
}

.footer .footer-item .footer-instagram .footer-search-icon {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.5s;
    opacity: 0;
}

.footer .footer-item .footer-instagram:hover .footer-search-icon {
    opacity: 1;
    background: rgba(0, 0, 0, .6);
}

.footer .footer-item .footer-btn a {
    background: var(--bs-light);
    color: var(--bs-primary);
}

.footer .footer-item .footer-btn a:hover {
    background: var(--bs-primary);
}

.footer .footer-item .footer-btn a:hover i {
    color: var(--bs-white);
}
/*** Footer End ***/


/*** copyright Start ***/
.copyright {
    background: var(--bs-dark);
    border-top: 1px solid rgba(255, 255, 255, .08);
}
/*** copyright end ***/


/*  ============================================  */




/*  ============================================  */




/* ===== ABOUT SERVICE SECTION ===== */
.about-service {
    background: #FFFFFF;
    padding: 80px 0;
}

.about-img {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(11, 43, 74, 0.12);
}

.about-img img {
    transition: transform 0.5s ease;
}

.about-img:hover img {
    transform: scale(1.03);
}

/* Experience Badge */
.about-experience {
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% {
        transform: scale(1);
        box-shadow: 0 10px 30px rgba(11, 43, 74, 0.15);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 15px 40px rgba(11, 43, 74, 0.25);
    }
    100% {
        transform: scale(1);
        box-shadow: 0 10px 30px rgba(11, 43, 74, 0.15);
    }
}

/* Icon Box Hover */
.icon-box {
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.icon-box:hover {
    transform: scale(1.1);
    background: #0D6EFD !important;
}

.icon-box i {
    font-size: 16px;
}

/* Buttons Hover */
.btn-primary:hover {
    background: #0B2B4A !important;
    border-color: #0B2B4A !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(13, 110, 253, 0.3);
}

.btn-outline-primary:hover {
    background: #0D6EFD !important;
    border-color: #0D6EFD !important;
    color: #FFFFFF !important;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(13, 110, 253, 0.2);
}

/* Responsive */
@media (max-width: 991px) {
    .about-service {
        padding: 50px 0;
    }
    
    .about-experience {
        bottom: -20px !important;
        right: 20px !important;
        width: 120px !important;
        height: 120px !important;
    }
    
    .about-experience h2 {
        font-size: 2rem !important;
    }
}

@media (max-width: 576px) {
    .about-img img {
        height: 300px !important;
    }
    
    .about-experience {
        width: 100px !important;
        height: 100px !important;
        bottom: -15px !important;
        right: 15px !important;
    }
    
    .about-experience h2 {
        font-size: 1.5rem !important;
    }
    
    .about-experience p {
        font-size: 0.65rem !important;
    }
}

/*===================*/


/* ===== WHY CHOOSE US SECTION ===== */
.why-choose-us {
    background: #F8FAFE;
    padding: 80px 0;
}

.choose-card {
    transition: all 0.3s ease;
    border-bottom: 4px solid #0D6EFD;
}

.choose-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(11, 43, 74, 0.15) !important;
}

.choose-icon {
    transition: all 0.3s ease;
}

.choose-card:hover .choose-icon {
    background: #0D6EFD !important;
    transform: scale(1.1);
}

.choose-icon i {
    transition: all 0.3s ease;
}

.choose-card:hover .choose-icon i {
    transform: scale(1.1);
}

@media (max-width: 991px) {
    .why-choose-us {
        padding: 50px 0;
    }
}

/*==================*/

/* ===== PROCESS SECTION ===== */
.process-section {
    background: #FFFFFF;
    padding: 80px 0;
}

.process-card {
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.process-card:hover {
    transform: translateY(-10px);
    border-color: #0D6EFD !important;
    box-shadow: 0 15px 40px rgba(11, 43, 74, 0.12);
}

.process-card .step-number {
    transition: all 0.3s ease;
    font-family: 'Arial', sans-serif;
}

.process-card:hover .step-number {
    background: #0D6EFD !important;
    transform: scale(1.1);
}

.process-card .step-icon {
    transition: all 0.3s ease;
}

.process-card:hover .step-icon {
    transform: scale(1.1);
}

.step-arrow {
    color: #0D6EFD;
    opacity: 0.5;
}

.process-card:hover .step-arrow {
    opacity: 1;
}

@media (max-width: 991px) {
    .process-section {
        padding: 50px 0;
    }
    
    .step-arrow {
        display: none !important;
    }
}

@media (max-width: 576px) {
    .process-card {
        padding: 20px !important;
    }
}

/*===================*/

/* ===== PRICING SECTION ===== */
.pricing-section {
    background: #F8FAFE;
    padding: 80px 0;
}

.pricing-card {
    transition: all 0.4s ease;
    position: relative;
}

.pricing-card:hover {
    transform: translateY(-10px) !important;
    box-shadow: 0 20px 50px rgba(11, 43, 74, 0.15) !important;
}

.pricing-card .featured-badge {
    z-index: 1;
}

.pricing-card ul li {
    padding: 5px 0;
    font-size: 15px;
}

.pricing-card ul li i {
    font-size: 16px;
    width: 20px;
}

.pricing-card .btn {
    font-size: 16px;
    letter-spacing: 0.5px;
}

.pricing-card .btn-primary:hover {
    background: #0B2B4A !important;
    border-color: #0B2B4A !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(13, 110, 253, 0.3);
}

.pricing-card .btn-outline-primary:hover {
    background: #0D6EFD !important;
    border-color: #0D6EFD !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(13, 110, 253, 0.2);
}

/* Responsive */
@media (max-width: 1199px) {
    .pricing-card {
        transform: scale(1) !important;
    }
}

@media (max-width: 991px) {
    .pricing-section {
        padding: 50px 0;
    }
    
    .pricing-card {
        max-width: 450px;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .pricing-card {
        max-width: 100%;
        padding: 30px 20px !important;
    }
    
    .pricing-card .display-4 {
        font-size: 2.5rem !important;
    }
    
    .pricing-card ul li {
        font-size: 14px;
    }
    
    .pricing-card .btn {
        font-size: 14px;
        padding: 10px 20px !important;
    }
}

@media (max-width: 576px) {
    .pricing-section {
        padding: 40px 0;
    }
    
    .pricing-card {
        padding: 25px 15px !important;
    }
    
    .pricing-card .display-4 {
        font-size: 2rem !important;
    }
    
    .pricing-card h3 {
        font-size: 1.5rem !important;
    }
    
    .pricing-card ul li {
        font-size: 13px;
        padding: 4px 0;
    }
    
    .pricing-card .btn {
        font-size: 13px;
        padding: 8px 15px !important;
    }
    
    .package-badge {
        font-size: 10px !important;
        padding: 4px 30px !important;
        top: 15px !important;
        right: -30px !important;
    }
    
    .featured-badge {
        font-size: 11px !important;
        padding: 6px 0 !important;
    }
}

/* ===================== */

/* ===== GALLERY SECTION ===== */
.gallery-section {
    background: #FFFFFF;
    padding: 80px 0;
}

/* Gallery Card */
.gallery-card {
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(11, 43, 74, 0.08);
    transition: all 0.4s ease;
}

.gallery-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(11, 43, 74, 0.15);
}

.gallery-card img {
    transition: transform 0.5s ease;
}

.gallery-card:hover img {
    transform: scale(1.08);
}

/* Gallery Overlay */
.gallery-overlay {
    opacity: 0;
    transition: all 0.4s ease;
}

.gallery-card:hover .gallery-overlay {
    opacity: 1;
}

.gallery-overlay i {
    animation: none;
    transition: all 0.4s ease;
}

.gallery-card:hover .gallery-overlay i {
    animation: zoomIn 0.6s ease;
}

@keyframes zoomIn {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

/* Filter Buttons */
.filter-btn {
    font-size: 15px;
    padding: 10px 28px !important;
    transition: all 0.3s ease;
}

.filter-btn.active {
    background: #0D6EFD !important;
    border-color: #0D6EFD !important;
    color: #FFFFFF !important;
}

.filter-btn:not(.active):hover {
    background: #0D6EFD !important;
    border-color: #0D6EFD !important;
    color: #FFFFFF !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(13, 110, 253, 0.2);
}

/* Gallery Item Animation */
.gallery-item {
    transition: all 0.4s ease;
}

.gallery-item.hidden {
    display: none;
}

.gallery-item.show {
    display: block;
    animation: fadeInUp 0.6s ease;
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive */
@media (max-width: 991px) {
    .gallery-section {
        padding: 50px 0;
    }
    
    .filter-btn {
        font-size: 13px;
        padding: 8px 18px !important;
    }
}

@media (max-width: 768px) {
    .gallery-section {
        padding: 40px 0;
    }
    
    .gallery-card img {
        height: 250px !important;
    }
    
    .filter-btn {
        font-size: 12px;
        padding: 6px 14px !important;
    }
    
    .gallery-overlay h5 {
        font-size: 16px;
    }
    
    .gallery-overlay p {
        font-size: 12px;
    }
}

@media (max-width: 576px) {
    .gallery-section {
        padding: 30px 0;
    }
    
    .gallery-card img {
        height: 200px !important;
    }
    
    .filter-btn {
        font-size: 11px;
        padding: 5px 12px !important;
        margin: 2px;
    }
    
    .btn-group {
        flex-wrap: wrap;
        justify-content: center;
    }
    
    .gallery-overlay h5 {
        font-size: 14px;
    }
    
    .gallery-overlay p {
        font-size: 11px;
    }
    
    .gallery-overlay i {
        font-size: 24px !important;
    }
}

/*================*/

/* ===== VENUES & VENDOR SECTION ===== */
.venues-section {
    background: #F8FAFE;
    padding: 80px 0;
}

.venue-card {
    transition: all 0.4s ease;
    position: relative;
    overflow: hidden;
}

.venue-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 45px rgba(11, 43, 74, 0.15) !important;
}

.venue-card .venue-icon {
    transition: all 0.3s ease;
}

.venue-card:hover .venue-icon {
    background: #0D6EFD !important;
    transform: scale(1.05);
}

.venue-card .badge {
    font-size: 12px;
    border-radius: 20px;
    transition: all 0.3s ease;
}

.venue-card:hover .badge {
    background: #0D6EFD !important;
    color: #FFFFFF !important;
}

/* Responsive */
@media (max-width: 991px) {
    .venues-section {
        padding: 50px 0;
    }
}

@media (max-width: 768px) {
    .venues-section {
        padding: 40px 0;
    }
    
    .venue-card {
        padding: 25px !important;
    }
    
    .venue-card .venue-icon {
        width: 45px !important;
        height: 45px !important;
    }
    
    .venue-card .venue-icon i {
        font-size: 1.2rem !important;
    }
    
    .venue-card h5 {
        font-size: 16px !important;
    }
    
    .venue-card p {
        font-size: 13px !important;
    }
    
    .venue-card .badge {
        font-size: 11px !important;
        padding: 4px 10px !important;
    }
}

@media (max-width: 576px) {
    .venues-section {
        padding: 30px 0;
    }
    
    .venue-card {
        padding: 20px !important;
    }
    
    .venue-card .venue-icon {
        width: 40px !important;
        height: 40px !important;
    }
    
    .venue-card .venue-icon i {
        font-size: 1rem !important;
    }
    
    .venue-card h5 {
        font-size: 15px !important;
    }
    
    .venue-card p {
        font-size: 12px !important;
    }
    
    .venue-card .badge {
        font-size: 10px !important;
        padding: 3px 8px !important;
    }
}


/* =========================================================
   EVENT PLANNER KARACHI - INDUSTRY SECTION
   BLUE / WHITE / DARK BLUE COLOR SCHEME
   Unique namespace: epk-industry-
   ========================================================= */

.epk-industry-section {
    width: 100%;
    padding: 95px 20px 100px;
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 20%, rgba(37, 99, 235, 0.055), transparent 24%),
        radial-gradient(circle at 94% 78%, rgba(30, 58, 138, 0.045), transparent 25%),
        #ffffff;
    box-sizing: border-box;
}

.epk-industry-section *,
.epk-industry-section *::before,
.epk-industry-section *::after {
    box-sizing: border-box;
}

.epk-industry-container {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

/* =========================
   SECTION HEADING
   ========================= */

.epk-industry-heading {
    max-width: 850px;
    margin: 0 auto 38px;
    text-align: center;
}

.epk-industry-eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 14px;
    color: #2563eb;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
    line-height: 1.5;
}

.epk-industry-eyebrow i {
    width: 46px;
    height: 1px;
    display: block;
    background: #93c5fd;
}

.epk-industry-heading h2 {
    margin: 0;
    color: #0f172a;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 5vw, 62px);
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1.08;
}

.epk-industry-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin: 18px auto 15px;
}

.epk-industry-divider span {
    width: 90px;
    height: 1px;
    background: #bfdbfe;
}

.epk-industry-divider b {
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2563eb;
    font-size: 10px;
    font-weight: 400;
}

.epk-industry-heading p {
    max-width: 720px;
    margin: 0 auto;
    color: #475569;
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 1.75;
}

/* =========================
   CARDS GRID
   ========================= */

.epk-industry-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
}

/* =========================
   CARD
   ========================= */

.epk-industry-card {
    min-height: 136px;
    padding: 20px;
    display: flex;
    align-items: flex-start;
    gap: 17px;
    position: relative;
    overflow: hidden;
    isolation: isolate;
    text-decoration: none;
    border: 1px solid #dbeafe;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 8px 25px rgba(15, 23, 42, 0.045);
    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.epk-industry-card::after {
    content: "";
    width: 58px;
    height: 58px;
    position: absolute;
    right: -22px;
    bottom: -22px;
    z-index: -1;
    border-radius: 50%;
    background: #eff6ff;
    transition: transform 0.35s ease;
}

.epk-industry-card:hover {
    transform: translateY(-5px);
    border-color: #60a5fa;
    background: #ffffff;
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.11);
}

.epk-industry-card:hover::after {
    transform: scale(2.2);
}

/* =========================
   FEATURED CARD
   ========================= */

.epk-industry-card.epk-industry-featured {
    border-color: #60a5fa;
    background: linear-gradient(
        135deg,
        #ffffff 0%,
        #f8fbff 100%
    );
    box-shadow: 0 12px 32px rgba(37, 99, 235, 0.10);
}

/* =========================
   ICON
   ========================= */

.epk-industry-icon {
    width: 54px;
    min-width: 54px;
    height: 54px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #bfdbfe;
    border-radius: 50%;
    color: #2563eb;
    background: #eff6ff;
    box-shadow: inset 0 0 0 6px rgba(255, 255, 255, 0.75);
    font-size: 20px;
    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease,
        border-color 0.3s ease;
}

.epk-industry-card:hover .epk-industry-icon {
    color: #ffffff;
    background: #2563eb;
    border-color: #2563eb;
    transform: scale(1.06);
}

.epk-industry-featured .epk-industry-icon {
    color: #ffffff;
    background: #1e3a8a;
    border-color: #1e3a8a;
}

/* =========================
   CARD CONTENT
   ========================= */

.epk-industry-content {
    min-width: 0;
    padding-top: 1px;
}

.epk-industry-content h3 {
    margin: 0;
    color: #0f172a;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.epk-industry-content > span {
    width: 25px;
    height: 2px;
    display: block;
    margin: 9px 0 9px;
    background: #2563eb;
    transition: width 0.3s ease;
}

.epk-industry-card:hover .epk-industry-content > span {
    width: 40px;
}

.epk-industry-content p {
    margin: 0;
    color: #475569;
    font-family: Arial, sans-serif;
    font-size: 12px;
    line-height: 1.55;
}

/* =========================
   CTA BUTTON
   ========================= */

.epk-industry-action {
    display: flex;
    justify-content: center;
    margin-top: 28px;
}

.epk-industry-button {
    min-width: 270px;
    min-height: 50px;
    padding: 0 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    color: #ffffff;
    background: linear-gradient(
        135deg,
        #1e3a8a,
        #2563eb
    );
    border: 1px solid #2563eb;
    border-radius: 8px;
    box-shadow: 0 9px 22px rgba(37, 99, 235, 0.22);
    text-decoration: none;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.epk-industry-button i {
    font-size: 13px;
    transition: transform 0.3s ease;
}

.epk-industry-button:hover {
    color: #ffffff;
    transform: translateY(-3px);
    background: linear-gradient(
        135deg,
        #172554,
        #1d4ed8
    );
    box-shadow: 0 13px 28px rgba(37, 99, 235, 0.30);
}

.epk-industry-button:hover i {
    transform: translateX(5px);
}

/* =========================
   TABLET
   ========================= */

@media (max-width: 1100px) {

    .epk-industry-section {
        padding: 80px 20px 85px;
    }

    .epk-industry-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .epk-industry-card {
        min-height: 145px;
    }
}

/* =========================
   MOBILE
   ========================= */

@media (max-width: 600px) {

    .epk-industry-section {
        padding: 65px 15px 70px;
    }

    .epk-industry-heading {
        margin-bottom: 30px;
    }

    .epk-industry-eyebrow {
        gap: 10px;
        font-size: 9px;
        letter-spacing: 2.5px;
    }

    .epk-industry-eyebrow i {
        width: 28px;
    }

    .epk-industry-heading h2 {
        font-size: 34px;
        line-height: 1.12;
    }

    .epk-industry-divider span {
        width: 55px;
    }

    .epk-industry-heading p {
        font-size: 13px;
        line-height: 1.7;
    }

    .epk-industry-grid {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .epk-industry-card {
        min-height: auto;
        padding: 18px;
        gap: 15px;
        border-radius: 13px;
    }

    .epk-industry-icon {
        width: 50px;
        min-width: 50px;
        height: 50px;
        font-size: 18px;
    }

    .epk-industry-content h3 {
        font-size: 14px;
    }

    .epk-industry-content p {
        font-size: 12px;
    }

    .epk-industry-button {
        width: 100%;
        min-width: 0;
        min-height: 52px;
    }
}

/* =========================
   SMALL MOBILE
   ========================= */

@media (max-width: 380px) {

    .epk-industry-section {
        padding-left: 12px;
        padding-right: 12px;
    }

    .epk-industry-heading h2 {
        font-size: 29px;
    }

    .epk-industry-card {
        padding: 15px;
    }

    .epk-industry-icon {
        width: 46px;
        min-width: 46px;
        height: 46px;
    }

    .epk-industry-content p {
        font-size: 11px;
    }
}

/* =========================================================
   EVENT PLANNER TESTIMONIAL SLIDER
   UNIQUE PREFIX: epx-tstl-
   COLOR: BLUE / WHITE / DARK BLUE
========================================================= */

.epx-tstl-section {
    --epx-tstl-dark-blue: #08264a;
    --epx-tstl-blue: #1769d2;
    --epx-tstl-light-blue: #eaf3ff;
    --epx-tstl-border: #d9e5f2;
    --epx-tstl-text: #17324f;
    --epx-tstl-muted: #708197;
    --epx-tstl-white: #ffffff;

    width: 100%;
    padding: 95px 20px 85px;
    background:
        radial-gradient(
            circle at 50% 0%,
            rgba(23, 105, 210, .08),
            transparent 42%
        ),
        #ffffff;
    overflow: hidden;
}

.epx-tstl-section *,
.epx-tstl-section *::before,
.epx-tstl-section *::after {
    box-sizing: border-box;
}


/* =========================
   CONTAINER
========================= */

.epx-tstl-container {
    width: min(1120px, 100%);
    margin: 0 auto;
}


/* =========================
   HEADING
========================= */

.epx-tstl-heading-wrap {
    max-width: 760px;
    margin: 0 auto 42px;
    text-align: center;
}

.epx-tstl-eyebrow {
    display: inline-block;
    margin-bottom: 13px;
    color: var(--epx-tstl-blue);
    font-family: Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.epx-tstl-heading {
    margin: 0;
    color: var(--epx-tstl-dark-blue);
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 5vw, 58px);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -1.5px;
}

.epx-tstl-heading-line {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin: 18px auto;
}

.epx-tstl-heading-line span {
    width: 68px;
    height: 1px;
    background: #b7cde5;
}

.epx-tstl-heading-line i {
    width: 8px;
    height: 8px;
    border: 1.5px solid var(--epx-tstl-blue);
    border-radius: 50%;
    background: #fff;
}

.epx-tstl-subheading {
    max-width: 650px;
    margin: 0 auto;
    color: var(--epx-tstl-muted);
    font-family: Arial, sans-serif;
    font-size: 15px;
    line-height: 1.8;
}


/* =========================
   TRUST BAR
========================= */

.epx-tstl-trustbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 112px;
    margin-bottom: 28px;
    padding: 22px 28px;
    border: 1px solid var(--epx-tstl-border);
    border-radius: 19px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 12px 35px rgba(8,38,74,.055);
}

.epx-tstl-rating-box {
    min-width: 330px;
}

.epx-tstl-google-mark {
    margin-bottom: 3px;
    color: #3d4c60;
    font-family: Arial, sans-serif;
    font-size: 17px;
}

.epx-tstl-google-mark strong {
    color: var(--epx-tstl-dark-blue);
}

.epx-tstl-google-g {
    color: #4285f4;
}

.epx-tstl-rating-row {
    display: flex;
    align-items: center;
    gap: 14px;
}

.epx-tstl-rating-number {
    color: var(--epx-tstl-dark-blue);
    font-family: Arial, sans-serif;
    font-size: 38px;
    font-weight: 800;
}

.epx-tstl-rating-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.epx-tstl-stars,
.epx-tstl-card-stars {
    color: #f5a800;
    font-family: Arial, sans-serif;
    letter-spacing: 2px;
}

.epx-tstl-stars {
    font-size: 18px;
}

.epx-tstl-rating-details span {
    color: var(--epx-tstl-muted);
    font-family: Arial, sans-serif;
    font-size: 11px;
}

.epx-tstl-trust-divider {
    width: 1px;
    height: 45px;
    margin: 0 30px;
    background: var(--epx-tstl-border);
}

.epx-tstl-client-trust {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 315px;
}

.epx-tstl-shield {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 45px;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: var(--epx-tstl-light-blue);
}

.epx-tstl-shield svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: var(--epx-tstl-blue);
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.epx-tstl-trust-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.epx-tstl-trust-copy strong {
    color: var(--epx-tstl-dark-blue);
    font-family: Arial, sans-serif;
    font-size: 13px;
}

.epx-tstl-trust-copy span {
    color: var(--epx-tstl-muted);
    font-family: Arial, sans-serif;
    font-size: 11px;
}


/* =========================
   SLIDER
========================= */

.epx-tstl-slider {
    position: relative;
    width: 100%;
}

.epx-tstl-viewport {
    width: 100%;
    overflow: hidden;
    padding: 5px 1px 10px;
}

.epx-tstl-track {
    display: flex;
    gap: 19px;
    transition: transform .55s cubic-bezier(.4,0,.2,1);
    will-change: transform;
    touch-action: pan-y;
}


/* =========================
   CARD
========================= */

.epx-tstl-card {
    position: relative;
    flex: 0 0 calc((100% - 38px) / 3);
    min-height: 297px;
    padding: 26px 23px 50px;
    border: 1px solid var(--epx-tstl-border);
    border-radius: 17px;
    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #ffffff 70%,
        #f5f9ff 100%
    );
    box-shadow: 0 7px 25px rgba(8,38,74,.025);
    transition: .3s ease;
}

.epx-tstl-card:hover {
    transform: translateY(-5px);
    border-color: #b8d1ee;
    box-shadow: 0 18px 38px rgba(8,38,74,.09);
}


/* =========================
   PROFILE
========================= */

.epx-tstl-profile {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
}

.epx-tstl-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 47px;
    width: 47px;
    height: 47px;
    border: 3px solid #fff;
    border-radius: 50%;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 13px;
    font-weight: 700;
    box-shadow: 0 5px 15px rgba(8,38,74,.15);
}

.epx-tstl-avatar-01 { background:#123e6d; }
.epx-tstl-avatar-02 { background:#1769d2; }
.epx-tstl-avatar-03 { background:#315a88; }
.epx-tstl-avatar-04 { background:#0b3159; }
.epx-tstl-avatar-05 { background:#2879d4; }
.epx-tstl-avatar-06 { background:#214b75; }
.epx-tstl-avatar-07 { background:#0e5db4; }
.epx-tstl-avatar-08 { background:#163d67; }

.epx-tstl-profile-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.epx-tstl-profile-info h3 {
    margin: 0;
    color: var(--epx-tstl-dark-blue);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 17px;
    font-weight: 600;
}

.epx-tstl-profile-info span {
    color: var(--epx-tstl-muted);
    font-family: Arial, sans-serif;
    font-size: 11px;
}


/* =========================
   REVIEW
========================= */

.epx-tstl-card-stars {
    margin-bottom: 12px;
    font-size: 16px;
}

.epx-tstl-review {
    margin: 0;
    color: var(--epx-tstl-text);
    font-family: Arial, sans-serif;
    font-size: 13px;
    line-height: 1.75;
}


/* =========================
   QUOTE
========================= */

.epx-tstl-quote {
    position: absolute;
    right: 19px;
    bottom: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background: var(--epx-tstl-light-blue);
    color: var(--epx-tstl-blue);
    font-family: Georgia, serif;
    font-size: 29px;
    font-weight: 700;
    transform: rotate(180deg);
}


/* =========================
   ARROWS
========================= */

.epx-tstl-arrow {
    position: absolute;
    top: 50%;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--epx-tstl-border);
    border-radius: 50%;
    background: #ffffff;
    color: var(--epx-tstl-dark-blue);
    box-shadow: 0 8px 25px rgba(8,38,74,.12);
    cursor: pointer;
    transform: translateY(-50%);
    transition: all .25s ease;
}

.epx-tstl-arrow span {
    display: block;
    margin-top: -3px;
    font-family: Arial, sans-serif;
    font-size: 30px;
    font-weight: 300;
    line-height: 1;
}

.epx-tstl-prev {
    left: -22px;
}

.epx-tstl-next {
    right: -22px;
}

.epx-tstl-arrow:hover {
    border-color: var(--epx-tstl-blue);
    background: var(--epx-tstl-blue);
    color: #ffffff;
    box-shadow: 0 10px 28px rgba(23,105,210,.25);
}

.epx-tstl-arrow:disabled {
    opacity: .4;
    cursor: not-allowed;
}


/* =========================
   DOTS
========================= */

.epx-tstl-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin-top: 22px;
}

.epx-tstl-dot {
    width: 6px;
    height: 6px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #c9d8e8;
    cursor: pointer;
    transition: all .3s ease;
}

.epx-tstl-dot-active {
    width: 9px;
    height: 9px;
    background: var(--epx-tstl-blue);
    box-shadow: 0 0 0 3px rgba(23,105,210,.12);
}


/* =========================
   TABLET
========================= */

@media (max-width: 900px) {

    .epx-tstl-section {
        padding: 75px 18px 70px;
    }

    .epx-tstl-trustbar {
        gap: 20px;
    }

    .epx-tstl-rating-box,
    .epx-tstl-client-trust {
        min-width: 0;
        flex: 1;
    }

    .epx-tstl-trust-divider {
        margin: 0 5px;
    }

    .epx-tstl-card {
        flex-basis: calc((100% - 19px) / 2);
    }

    .epx-tstl-prev {
        left: -12px;
    }

    .epx-tstl-next {
        right: -12px;
    }
}


/* =========================
   MOBILE
========================= */

@media (max-width: 620px) {

    .epx-tstl-section {
        padding: 65px 15px 60px;
    }

    .epx-tstl-heading-wrap {
        margin-bottom: 32px;
    }

    .epx-tstl-heading {
        font-size: 36px;
    }

    .epx-tstl-subheading {
        font-size: 13px;
    }

    .epx-tstl-trustbar {
        flex-direction: column;
        align-items: stretch;
        padding: 22px 20px;
    }

    .epx-tstl-trust-divider {
        width: 100%;
        height: 1px;
        margin: 0;
    }

    .epx-tstl-client-trust {
        width: 100%;
    }

    .epx-tstl-card {
        flex-basis: 100%;
        min-height: 275px;
    }

    .epx-tstl-card:hover {
        transform: none;
    }

    .epx-tstl-arrow {
        width: 38px;
        height: 38px;
    }

    .epx-tstl-arrow span {
        font-size: 26px;
    }

    .epx-tstl-prev {
        left: 5px;
    }

    .epx-tstl-next {
        right: 5px;
    }
}


/* =========================
   SMALL MOBILE
========================= */

@media (max-width: 390px) {

    .epx-tstl-heading {
        font-size: 32px;
    }

    .epx-tstl-card {
        padding: 23px 20px 48px;
    }

    .epx-tstl-rating-number {
        font-size: 34px;
    }

}


/* =========================================
   PREMIUM EVENT PLANNER FAQ
   Color Scheme: Blue + White + Dark Blue
========================================= */

.premium-faq-section {
  width: 100%;
  padding: 100px 20px;
  background: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
  box-sizing: border-box;
}

.premium-faq-section *,
.premium-faq-section *::before,
.premium-faq-section *::after {
  box-sizing: border-box;
}

.faq-container {
  width: 100%;
  max-width: 1120px;
  margin: 0 auto;
}


/* =========================================
   HEADING
========================================= */

.faq-heading {
  max-width: 760px;
  margin: 0 auto 55px;
  text-align: center;
}

.faq-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 18px;
  margin-bottom: 18px;
  border-radius: 50px;
  background: #eaf3ff;
  color: #1261c9;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.faq-heading h2 {
  margin: 0;
  color: #071d49;
  font-size: clamp(34px, 5vw, 56px);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -1.8px;
}

.faq-heading h2 span {
  color: #1469d8;
}

.faq-heading p {
  max-width: 680px;
  margin: 20px auto 0;
  color: #68778f;
  font-size: 16px;
  line-height: 1.8;
}


/* =========================================
   FAQ LIST
========================================= */

.faq-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.faq-item {
  width: 100%;
  background: #ffffff;
  border: 1px solid #dfe8f3;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 22px rgba(7, 29, 73, 0.045);
  transition:
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    transform 0.3s ease;
}

.faq-item:hover {
  border-color: #aac9ee;
  box-shadow: 0 12px 30px rgba(7, 29, 73, 0.09);
  transform: translateY(-2px);
}

.faq-item.active {
  border-color: #1469d8;
  box-shadow: 0 15px 35px rgba(20, 105, 216, 0.12);
}


/* =========================================
   QUESTION
========================================= */

.faq-question {
  width: 100%;
  min-height: 78px;
  padding: 14px 20px;
  border: 0;
  outline: none;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 17px;
  cursor: pointer;
  color: #071d49;
  text-align: left;
  font-family: inherit;
}

.faq-number {
  width: 43px;
  min-width: 43px;
  height: 43px;
  border-radius: 12px;
  background: #edf5ff;
  color: #1469d8;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  transition: 0.3s ease;
}

.faq-item.active .faq-number {
  background: #1469d8;
  color: #ffffff;
}

.faq-text {
  flex: 1;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 700;
}

.faq-icon {
  width: 39px;
  min-width: 39px;
  height: 39px;
  border-radius: 50%;
  background: #071d49;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 300;
  line-height: 1;
  transition:
    background 0.3s ease,
    transform 0.35s ease;
}

.faq-item.active .faq-icon {
  background: #1469d8;
  transform: rotate(45deg);
}


/* =========================================
   ANSWER
========================================= */

.faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.4s ease;
}

.faq-answer-inner {
  min-height: 0;
}

.faq-answer p {
  min-height: 0;
  overflow: hidden;
  margin: 0;
  padding: 0 78px 0 80px;
  color: #68778f;
  font-size: 15px;
  line-height: 1.85;
  opacity: 0;
  transition:
    opacity 0.25s ease,
    padding 0.4s ease;
}

.faq-item.active .faq-answer {
  grid-template-rows: 1fr;
}

.faq-item.active .faq-answer p {
  padding-bottom: 25px;
  opacity: 1;
}


/* =========================================
   CTA
========================================= */

.faq-cta {
  margin-top: 45px;
  padding: 30px 34px;
  border-radius: 20px;
  background: #071d49;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  box-shadow: 0 18px 45px rgba(7, 29, 73, 0.16);
}

.faq-cta-content > span {
  display: block;
  margin-bottom: 6px;
  color: #70aaf7;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.3px;
}

.faq-cta h3 {
  margin: 0 0 7px;
  color: #ffffff;
  font-size: 24px;
  font-weight: 800;
}

.faq-cta p {
  margin: 0;
  max-width: 580px;
  color: #b9c8dc;
  font-size: 14px;
  line-height: 1.7;
}

.faq-cta-btn {
  flex-shrink: 0;
  min-width: 145px;
  padding: 15px 22px;
  border-radius: 10px;
  background: #1469d8;
  color: #ffffff;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 700;
  transition: 0.3s ease;
}

.faq-cta-btn span {
  font-size: 19px;
  transition: transform 0.3s ease;
}

.faq-cta-btn:hover {
  background: #ffffff;
  color: #071d49;
  transform: translateY(-2px);
}

.faq-cta-btn:hover span {
  transform: translateX(4px);
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 768px) {

  .premium-faq-section {
    padding: 75px 16px;
  }

  .faq-heading {
    margin-bottom: 40px;
  }

  .faq-question {
    min-height: 70px;
    padding: 14px 16px;
    gap: 12px;
  }

  .faq-number {
    width: 38px;
    min-width: 38px;
    height: 38px;
  }

  .faq-text {
    font-size: 15px;
  }

  .faq-icon {
    width: 35px;
    min-width: 35px;
    height: 35px;
    font-size: 21px;
  }

  .faq-answer p {
    padding-left: 66px;
    padding-right: 45px;
    font-size: 14px;
  }

  .faq-item.active .faq-answer p {
    padding-bottom: 22px;
  }

  .faq-cta {
    flex-direction: column;
    align-items: flex-start;
  }

  .faq-cta-btn {
    width: 100%;
  }
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 480px) {

  .premium-faq-section {
    padding: 60px 12px;
  }

  .faq-heading {
    margin-bottom: 32px;
  }

  .faq-heading h2 {
    font-size: 32px;
    letter-spacing: -1px;
  }

  .faq-heading p {
    margin-top: 15px;
    font-size: 14px;
    line-height: 1.7;
  }

  .faq-list {
    gap: 10px;
  }

  .faq-item {
    border-radius: 13px;
  }

  .faq-question {
    min-height: 66px;
    padding: 12px;
    gap: 9px;
  }

  .faq-number {
    width: 33px;
    min-width: 33px;
    height: 33px;
    border-radius: 9px;
    font-size: 10px;
  }

  .faq-text {
    font-size: 13.5px;
    line-height: 1.45;
  }

  .faq-icon {
    width: 30px;
    min-width: 30px;
    height: 30px;
    font-size: 18px;
  }

  .faq-answer p {
    padding-left: 54px;
    padding-right: 15px;
    font-size: 13px;
    line-height: 1.75;
  }

  .faq-item.active .faq-answer p {
    padding-bottom: 18px;
  }

  .faq-cta {
    margin-top: 30px;
    padding: 22px 18px;
    border-radius: 15px;
  }

  .faq-cta h3 {
    font-size: 20px;
  }

  .faq-cta p {
    font-size: 13px;
  }

  .faq-cta-btn {
    padding: 14px 18px;
  }
}

/* =========================================================
   EVENT PLANNER — ISOLATED / CONFLICT-SAFE STYLES
   Prefix: eplx-
========================================================= */

.eplx-stats-section,
.eplx-philosophy-section {
    --eplx-dark-blue: #071d35;
    --eplx-deep-blue: #0b2948;
    --eplx-blue: #1769aa;
    --eplx-bright-blue: #2587d7;
    --eplx-soft-blue: #edf5fb;
    --eplx-border: #dce7f0;
    --eplx-text: #132238;
    --eplx-muted: #68788a;
    --eplx-white: #ffffff;

    box-sizing: border-box;
}

.eplx-stats-section *,
.eplx-philosophy-section * {
    box-sizing: border-box;
}


/* =========================================================
   STATS SECTION
========================================================= */

.eplx-stats-section {
    width: 100%;
    background:
        radial-gradient(
            circle at 15% 50%,
            rgba(37, 135, 215, 0.14),
            transparent 30%
        ),
        linear-gradient(
            110deg,
            #061a2e 0%,
            #0a2947 48%,
            #0e355a 100%
        );

    padding: 58px 24px;
    overflow: hidden;
}

.eplx-stats-wrap {
    width: min(1120px, 100%);
    margin: 0 auto;

    display: grid;
    grid-template-columns:
        1fr auto
        1fr auto
        1fr auto
        1fr;

    align-items: center;
}

.eplx-stat-item {
    min-width: 0;
    text-align: center;
    padding: 0 25px;
}

.eplx-stat-number {
    display: block;

    color: var(--eplx-white);
    font-family: Georgia, "Times New Roman", serif;

    font-size: clamp(30px, 3vw, 42px);
    font-weight: 600;
    line-height: 1;

    letter-spacing: -1.2px;

    margin-bottom: 10px;
}

.eplx-stat-label {
    display: block;

    color: rgba(255, 255, 255, 0.62);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1.25px;
    line-height: 1.4;

    text-transform: uppercase;
}

.eplx-stat-divider {
    width: 1px;
    height: 84px;

    background: rgba(255, 255, 255, 0.16);
}


/* =========================================================
   PHILOSOPHY SECTION
========================================================= */

.eplx-philosophy-section {
    width: 100%;
    background: var(--eplx-white);

    padding: 92px 24px 100px;
}

.eplx-philosophy-container {
    width: min(790px, 100%);
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.eplx-philosophy-heading {
    text-align: center;
    margin-bottom: 48px;
}

.eplx-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    color: var(--eplx-blue);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 10px;
    font-weight: 800;

    letter-spacing: 2px;
    line-height: 1;

    text-transform: uppercase;

    margin-bottom: 18px;
}

.eplx-eyebrow-icon {
    width: 12px;
    height: 12px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: var(--eplx-bright-blue);
}

.eplx-eyebrow-icon svg {
    width: 100%;
    height: 100%;
    fill: currentColor;
}


.eplx-philosophy-title {
    margin: 0;

    color: var(--eplx-text);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: clamp(34px, 4vw, 48px);
    font-weight: 500;

    letter-spacing: -1.7px;
    line-height: 1.08;
}

.eplx-philosophy-title span {
    color: var(--eplx-blue);
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-weight: 700;
    letter-spacing: -1.8px;
}


.eplx-philosophy-intro {
    width: min(610px, 100%);
    margin: 18px auto 0;

    color: var(--eplx-muted);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 14px;
    font-weight: 400;
    line-height: 1.75;
}


/* =========================================================
   VALUES LIST
========================================================= */

.eplx-values-list {
    border-top: 1px solid var(--eplx-border);
}

.eplx-value-row {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    column-gap: 22px;

    align-items: center;

    min-height: 142px;

    border-bottom: 1px solid var(--eplx-border);

    transition:
        background-color 0.3s ease,
        padding-left 0.3s ease;
}

.eplx-value-row:hover {
    background: linear-gradient(
        90deg,
        rgba(23, 105, 170, 0.035),
        transparent
    );

    padding-left: 7px;
}


/* =========================================================
   NUMBER
========================================================= */

.eplx-value-number {
    color: var(--eplx-blue);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 28px;
    font-weight: 600;

    line-height: 1;
    letter-spacing: -0.8px;
}


/* =========================================================
   VALUE CONTENT
========================================================= */

.eplx-value-content {
    padding: 25px 0;
}

.eplx-value-title-wrap {
    display: flex;
    align-items: center;
    gap: 13px;

    margin-bottom: 9px;
}

.eplx-value-icon {
    width: 34px;
    height: 34px;

    flex: 0 0 34px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    background: var(--eplx-soft-blue);
    color: var(--eplx-blue);

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.eplx-value-icon svg {
    width: 17px;
    height: 17px;

    fill: currentColor;
}

.eplx-value-row:hover .eplx-value-icon {
    background: var(--eplx-blue);
    color: var(--eplx-white);

    transform: translateY(-2px);
}


.eplx-value-content h3 {
    margin: 0;

    color: var(--eplx-text);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 18px;
    font-weight: 500;

    line-height: 1.2;
}


.eplx-value-content p {
    max-width: 570px;

    margin: 0;

    color: var(--eplx-muted);

    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;

    font-size: 12px;
    font-weight: 400;

    line-height: 1.75;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .eplx-stats-section {
        padding: 45px 18px;
    }

    .eplx-stats-wrap {
        grid-template-columns: repeat(2, 1fr);
        row-gap: 30px;
    }

    .eplx-stat-divider {
        display: none;
    }

    .eplx-stat-item {
        padding: 0 12px;
    }

    .eplx-stat-item:nth-of-type(1),
    .eplx-stat-item:nth-of-type(3) {
        border-right: 1px solid rgba(255, 255, 255, 0.14);
    }

    .eplx-philosophy-section {
        padding: 70px 20px 80px;
    }

    .eplx-philosophy-heading {
        margin-bottom: 38px;
    }

    .eplx-value-row {
        grid-template-columns: 60px minmax(0, 1fr);
        column-gap: 16px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 540px) {

    .eplx-stats-section {
        padding: 38px 14px;
    }

    .eplx-stat-number {
        font-size: 28px;
        margin-bottom: 8px;
    }

    .eplx-stat-label {
        font-size: 8px;
        letter-spacing: 1px;
    }

    .eplx-philosophy-section {
        padding: 60px 18px 70px;
    }

    .eplx-philosophy-heading {
        margin-bottom: 34px;
    }

    .eplx-eyebrow {
        font-size: 9px;
        letter-spacing: 1.7px;
        margin-bottom: 15px;
    }

    .eplx-philosophy-title {
        font-size: 33px;
        letter-spacing: -1.2px;
    }

    .eplx-philosophy-title span {
        letter-spacing: -1.2px;
    }

    .eplx-philosophy-intro {
        font-size: 13px;
        line-height: 1.7;
    }

    .eplx-value-row {
        grid-template-columns: 1fr;
        gap: 0;

        min-height: auto;

        padding: 25px 0;
    }

    .eplx-value-row:hover {
        padding-left: 0;
    }

    .eplx-value-number {
        margin-bottom: 14px;

        font-size: 24px;
    }

    .eplx-value-content {
        padding: 0;
    }

    .eplx-value-title-wrap {
        gap: 11px;
        margin-bottom: 10px;
    }

    .eplx-value-icon {
        width: 32px;
        height: 32px;
        flex-basis: 32px;
    }

    .eplx-value-content h3 {
        font-size: 18px;
    }

    .eplx-value-content p {
        font-size: 12px;
        line-height: 1.7;
    }

}


/* =========================================================
   VERY SMALL DEVICES
========================================================= */

@media (max-width: 360px) {

    .eplx-stats-wrap {
        grid-template-columns: 1fr;
        row-gap: 24px;
    }

    .eplx-stat-item:nth-of-type(1),
    .eplx-stat-item:nth-of-type(3) {
        border-right: 0;
    }

    .eplx-philosophy-title {
        font-size: 29px;
    }

}

/* =========================================================
   EPLX EVENT SERVICES SECTION
   Unique namespace: eplx-
   ========================================================= */

.eplx-services-section {
    position: relative;
    width: 100%;
    padding: 95px 20px 105px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}

.eplx-services-section::before {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    top: -250px;
    left: -250px;
    background: rgba(19, 78, 125, 0.045);
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
}

.eplx-services-section::after {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    right: -220px;
    bottom: -220px;
    background: rgba(29, 111, 174, 0.055);
    border-radius: 50%;
    pointer-events: none;
    z-index: -1;
}


/* Main Container */

.eplx-services-container {
    width: min(1080px, 100%);
    margin: 0 auto;
}


/* =========================================================
   HEADING
   ========================================================= */

.eplx-services-heading {
    max-width: 760px;
    margin: 0 auto 58px;
    text-align: center;
}

.eplx-services-label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 15px;
    color: #1d6fae;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.eplx-services-label i {
    font-size: 11px;
}

.eplx-services-heading h2 {
    margin: 0;
    color: #102a43;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(38px, 5vw, 54px);
    font-weight: 500;
    line-height: 1.12;
    letter-spacing: -1.7px;
}

.eplx-services-heading h2 span {
    color: #1d6fae;
    font-family: Arial, sans-serif;
    font-weight: 700;
    letter-spacing: -2px;
}

.eplx-services-heading p {
    max-width: 650px;
    margin: 18px auto 0;
    color: #64748b;
    font-family: Arial, sans-serif;
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   SERVICES GRID
   ========================================================= */

.eplx-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}


/* =========================================================
   SERVICE CARD
   ========================================================= */

.eplx-service-card {
    position: relative;
    min-height: 205px;
    padding: 23px 23px 25px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #dbe5ee;
    border-radius: 17px;
    overflow: hidden;
    transition:
        transform 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease;
}

.eplx-service-card::before {
    content: "";
    position: absolute;
    width: 180px;
    height: 180px;
    top: -105px;
    right: -85px;
    border-radius: 50%;
    background: rgba(29, 111, 174, 0.045);
    transition: transform 0.45s ease;
}

.eplx-service-card:hover {
    transform: translateY(-6px);
    border-color: rgba(29, 111, 174, 0.35);
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(16, 42, 67, 0.10);
}

.eplx-service-card:hover::before {
    transform: scale(1.7);
}


/* Featured Card */

.eplx-service-featured {
    grid-column: span 2;
    min-height: 205px;
    background: linear-gradient(
        135deg,
        #f1f7fb 0%,
        #ffffff 68%
    );
    border-color: #d5e3ed;
}

.eplx-service-featured::after {
    content: "";
    position: absolute;
    width: 5px;
    height: 55px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    background: #1d6fae;
    border-radius: 0 8px 8px 0;
}


/* =========================================================
   CARD TOP
   ========================================================= */

.eplx-service-top {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 22px;
}


/* Icon */

.eplx-service-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 43px;
    height: 43px;
    border-radius: 12px;
    background: #edf5fa;
    color: #1d6fae;
    font-size: 17px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.eplx-service-card:hover .eplx-service-icon {
    background: #1d6fae;
    color: #ffffff;
    transform: scale(1.06) rotate(-3deg);
}


/* Arrow */

.eplx-service-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #f3f7fa;
    color: #1d6fae;
    font-size: 11px;
    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}

.eplx-service-card:hover .eplx-service-arrow {
    background: #1d6fae;
    color: #ffffff;
    transform: translateX(3px);
}


/* =========================================================
   CARD CONTENT
   ========================================================= */

.eplx-service-content {
    position: relative;
    z-index: 2;
}

.eplx-service-content h3 {
    margin: 0 0 11px;
    color: #102a43;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 19px;
    font-weight: 500;
    line-height: 1.35;
}

.eplx-service-content p {
    margin: 0;
    color: #667789;
    font-family: Arial, sans-serif;
    font-size: 13px;
    line-height: 1.75;
}


/* =========================================================
   FEATURED CARD CONTENT
   ========================================================= */

.eplx-service-featured .eplx-service-content {
    max-width: 650px;
}

.eplx-service-featured .eplx-service-content h3 {
    font-size: 20px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

    .eplx-services-section {
        padding: 80px 20px 90px;
    }

    .eplx-services-heading {
        margin-bottom: 45px;
    }

    .eplx-services-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    .eplx-service-featured {
        grid-column: span 2;
    }

    .eplx-service-card {
        min-height: 220px;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

    .eplx-services-section {
        padding: 65px 16px 75px;
    }

    .eplx-services-heading {
        margin-bottom: 35px;
    }

    .eplx-services-label {
        font-size: 10px;
        letter-spacing: 2.4px;
    }

    .eplx-services-heading h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .eplx-services-heading h2 span {
        letter-spacing: -1.2px;
    }

    .eplx-services-heading p {
        margin-top: 15px;
        font-size: 14px;
        line-height: 1.7;
    }

    .eplx-services-grid {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .eplx-service-featured {
        grid-column: span 1;
    }

    .eplx-service-card {
        min-height: auto;
        padding: 22px 20px 24px;
        border-radius: 15px;
    }

    .eplx-service-featured {
        min-height: auto;
    }

    .eplx-service-top {
        margin-bottom: 20px;
    }

    .eplx-service-content h3 {
        font-size: 19px;
    }

    .eplx-service-content p {
        font-size: 13px;
        line-height: 1.7;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .eplx-services-section {
        padding-left: 13px;
        padding-right: 13px;
    }

    .eplx-services-heading h2 {
        font-size: 32px;
    }

    .eplx-service-card {
        padding: 20px 18px 22px;
    }
}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .eplx-service-card,
    .eplx-service-card::before,
    .eplx-service-icon,
    .eplx-service-arrow {
        transition: none;
    }
}

/* =========================================================
   EPLXW - EVENT PLANNER HOW WE WORK SECTION
   Unique CSS Namespace: eplxw-
   ========================================================= */

.eplxw-process-section {
    position: relative;
    width: 100%;
    padding: 105px 20px 115px;
    background: #ffffff;
    overflow: hidden;
    isolation: isolate;
}


/* Soft Background Details */

.eplxw-process-section::before {
    content: "";
    position: absolute;
    width: 420px;
    height: 420px;
    left: -240px;
    top: -220px;
    border-radius: 50%;
    background: rgba(29, 111, 174, 0.045);
    pointer-events: none;
    z-index: -1;
}

.eplxw-process-section::after {
    content: "";
    position: absolute;
    width: 360px;
    height: 360px;
    right: -200px;
    bottom: -210px;
    border-radius: 50%;
    background: rgba(16, 42, 67, 0.035);
    pointer-events: none;
    z-index: -1;
}


/* =========================================================
   MAIN CONTAINER
   ========================================================= */

.eplxw-process-container {
    width: min(1160px, 100%);
    margin: 0 auto;
}


/* =========================================================
   HEADING
   ========================================================= */

.eplxw-process-heading {
    max-width: 760px;
    margin: 0 auto 78px;
    text-align: center;
}

.eplxw-process-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: #1d6fae;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.eplxw-process-eyebrow i {
    font-size: 11px;
}

.eplxw-process-heading h2 {
    margin: 0;
    color: #102a43;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(40px, 5vw, 56px);
    font-weight: 500;
    line-height: 1.12;
    letter-spacing: -1.8px;
}

.eplxw-process-heading h2 span {
    color: #1d6fae;
    font-family: Arial, sans-serif;
    font-weight: 700;
    letter-spacing: -2.3px;
}

.eplxw-process-heading p {
    max-width: 690px;
    margin: 20px auto 0;
    color: #667789;
    font-family: Arial, sans-serif;
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   PROCESS LIST
   ========================================================= */

.eplxw-process-list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: 55px;
}


/* Connecting Line */

.eplxw-process-list::before {
    content: "";
    position: absolute;
    top: 27px;
    left: 7%;
    right: 7%;
    height: 1px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        #c8dce9 10%,
        #c8dce9 90%,
        transparent 100%
    );
    z-index: 0;
}


/* =========================================================
   PROCESS ITEM
   ========================================================= */

.eplxw-process-item {
    position: relative;
    z-index: 2;
    min-width: 0;
}


/* Staggered Design */

.eplxw-process-item-one,
.eplxw-process-item-three {
    padding-top: 0;
}

.eplxw-process-item-two,
.eplxw-process-item-four {
    padding-top: 64px;
}


/* =========================================================
   NUMBER CIRCLE
   ========================================================= */

.eplxw-process-number {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 24px;
    border-radius: 50%;
    background: #1d6fae;
    box-shadow:
        0 0 0 9px rgba(29, 111, 174, 0.07),
        0 12px 28px rgba(16, 42, 67, 0.13);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease;
}

.eplxw-process-number::before {
    content: "";
    position: absolute;
    inset: -8px;
    border: 1px solid rgba(29, 111, 174, 0.13);
    border-radius: 50%;
}

.eplxw-process-number span {
    color: #ffffff;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    font-weight: 700;
}


/* =========================================================
   CONTENT
   ========================================================= */

.eplxw-process-content {
    max-width: 245px;
}

.eplxw-process-content h3 {
    margin: 0 0 13px;
    color: #102a43;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.3;
}

.eplxw-process-content p {
    margin: 0;
    color: #687989;
    font-family: Arial, sans-serif;
    font-size: 13.5px;
    line-height: 1.8;
}


/* =========================================================
   HOVER EFFECT
   ========================================================= */

.eplxw-process-item:hover .eplxw-process-number {
    background: #102a43;
    transform: translateY(-5px);
    box-shadow:
        0 0 0 10px rgba(16, 42, 67, 0.07),
        0 16px 32px rgba(16, 42, 67, 0.18);
}

.eplxw-process-item:hover .eplxw-process-content h3 {
    color: #1d6fae;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

    .eplxw-process-section {
        padding: 85px 25px 95px;
    }

    .eplxw-process-heading {
        margin-bottom: 60px;
    }

    .eplxw-process-list {
        column-gap: 28px;
    }

    .eplxw-process-item-two,
    .eplxw-process-item-four {
        padding-top: 45px;
    }

    .eplxw-process-content {
        max-width: 100%;
    }

    .eplxw-process-content h3 {
        font-size: 18px;
    }

    .eplxw-process-content p {
        font-size: 13px;
    }
}


/* =========================================================
   MOBILE / TABLET VERTICAL TIMELINE
   ========================================================= */

@media (max-width: 700px) {

    .eplxw-process-section {
        padding: 70px 20px 80px;
    }

    .eplxw-process-heading {
        margin-bottom: 48px;
    }

    .eplxw-process-eyebrow {
        font-size: 10px;
        letter-spacing: 2.4px;
    }

    .eplxw-process-heading h2 {
        font-size: 36px;
        letter-spacing: -1px;
    }

    .eplxw-process-heading h2 span {
        letter-spacing: -1.2px;
    }

    .eplxw-process-heading p {
        margin-top: 16px;
        font-size: 14px;
        line-height: 1.7;
    }


    /* Vertical Timeline */

    .eplxw-process-list {
        display: flex;
        flex-direction: column;
        gap: 0;
        padding-left: 2px;
    }

    .eplxw-process-list::before {
        top: 27px;
        bottom: 27px;
        left: 28px;
        right: auto;
        width: 1px;
        height: auto;
        background: linear-gradient(
            180deg,
            #c8dce9 0%,
            #c8dce9 90%,
            transparent 100%
        );
    }


    /* Reset Stagger */

    .eplxw-process-item,
    .eplxw-process-item-one,
    .eplxw-process-item-two,
    .eplxw-process-item-three,
    .eplxw-process-item-four {
        display: grid;
        grid-template-columns: 56px 1fr;
        column-gap: 22px;
        padding-top: 0;
        padding-bottom: 42px;
    }

    .eplxw-process-item:last-child {
        padding-bottom: 0;
    }


    /* Number */

    .eplxw-process-number {
        grid-column: 1;
        grid-row: 1;
        width: 54px;
        height: 54px;
        margin: 0;
    }


    /* Content */

    .eplxw-process-content {
        grid-column: 2;
        grid-row: 1;
        max-width: none;
        padding-top: 2px;
    }

    .eplxw-process-content h3 {
        font-size: 20px;
        margin-bottom: 9px;
    }

    .eplxw-process-content p {
        font-size: 13.5px;
        line-height: 1.75;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 400px) {

    .eplxw-process-section {
        padding: 60px 16px 70px;
    }

    .eplxw-process-heading h2 {
        font-size: 32px;
    }

    .eplxw-process-item,
    .eplxw-process-item-one,
    .eplxw-process-item-two,
    .eplxw-process-item-three,
    .eplxw-process-item-four {
        grid-template-columns: 50px 1fr;
        column-gap: 17px;
    }

    .eplxw-process-number {
        width: 48px;
        height: 48px;
    }

    .eplxw-process-number span {
        font-size: 13px;
    }

    .eplxw-process-list::before {
        left: 25px;
    }

    .eplxw-process-content h3 {
        font-size: 18px;
    }

    .eplxw-process-content p {
        font-size: 13px;
    }
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .eplxw-process-number,
    .eplxw-process-content h3 {
        transition: none;
    }
}

/* ================================
   Event Planner Karachi
   Service Details Section
================================ */

.epk-service-details {
    width: 100%;
    padding: 50px 20px;
    background: #f4f8fc;
    font-family: inherit;
}

.epk-service-container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.epk-service-heading {
    max-width: 800px;
    margin: 0 auto 55px;
    text-align: center;
}

.epk-service-tag {
    display: inline-block;
    margin-bottom: 14px;
    padding: 8px 18px;
    border-radius: 30px;
    background: #e6f0ff;
    color: #0756b8;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.epk-service-heading h2 {
    margin: 0 0 18px;
    color: #062b5c;
    font-size: 42px;
    line-height: 1.2;
    font-weight: 800;
}

.epk-service-heading p {
    margin: 0;
    color: #5f7085;
    font-size: 16px;
    line-height: 1.8;
}

.epk-service-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.epk-service-card {
    position: relative;
    overflow: hidden;
    padding: 35px 30px 32px;
    background: #ffffff;
    border: 1px solid #e4edf7;
    border-radius: 18px;
    box-shadow: 0 8px 30px rgba(6, 43, 92, 0.06);
    transition: all 0.35s ease;
}

.epk-service-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #0756b8;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s ease;
}

.epk-service-card:hover {
    transform: translateY(-8px);
    border-color: #bcd5f2;
    box-shadow: 0 18px 45px rgba(6, 43, 92, 0.12);
}

.epk-service-card:hover::before {
    transform: scaleX(1);
}

.epk-service-featured {
    background: #062b5c;
    border-color: #062b5c;
}

.epk-service-icon {
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 25px;
    border-radius: 15px;
    background: #e8f2ff;
    color: #0756b8;
    font-size: 25px;
}

.epk-service-featured .epk-service-icon {
    background: #ffffff;
    color: #0756b8;
}

.epk-service-number {
    position: absolute;
    top: 28px;
    right: 28px;
    color: #d9e7f7;
    font-size: 35px;
    line-height: 1;
    font-weight: 800;
}

.epk-service-featured .epk-service-number {
    color: rgba(255, 255, 255, 0.15);
}

.epk-service-card h3 {
    margin: 0 0 13px;
    color: #062b5c;
    font-size: 22px;
    line-height: 1.35;
    font-weight: 750;
}

.epk-service-featured h3 {
    color: #ffffff;
}

.epk-service-card p {
    min-height: 105px;
    margin: 0 0 22px;
    color: #64768b;
    font-size: 15px;
    line-height: 1.75;
}

.epk-service-featured p {
    color: #d5e2f2;
}

.epk-service-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #0756b8;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    transition: gap 0.25s ease;
}

.epk-service-featured .epk-service-link {
    color: #ffffff;
}

.epk-service-link:hover {
    gap: 14px;
}

.epk-service-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 40px;
    padding: 25px 30px;
    background: #062b5c;
    border-radius: 16px;
}

.epk-service-bottom strong {
    display: block;
    margin-bottom: 5px;
    color: #ffffff;
    font-size: 18px;
}

.epk-service-bottom span {
    color: #d4e1ef;
    font-size: 14px;
}

.epk-service-btn {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 24px;
    border-radius: 50px;
    background: #ffffff;
    color: #062b5c;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.epk-service-btn:hover {
    background: #e8f2ff;
    color: #0756b8;
    transform: translateY(-2px);
}

@media (max-width: 991px) {

    .epk-service-details {
        padding: 70px 20px;
    }

    .epk-service-heading h2 {
        font-size: 36px;
    }

    .epk-service-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .epk-service-bottom {
        align-items: flex-start;
        flex-direction: column;
    }

}

@media (max-width: 575px) {

    .epk-service-details {
        padding: 55px 15px;
    }

    .epk-service-heading {
        margin-bottom: 35px;
    }

    .epk-service-heading h2 {
        font-size: 29px;
    }

    .epk-service-heading p {
        font-size: 15px;
    }

    .epk-service-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .epk-service-card {
        padding: 30px 24px;
    }

    .epk-service-card p {
        min-height: auto;
    }

    .epk-service-bottom {
        padding: 25px 22px;
    }

    .epk-service-btn {
        width: 100%;
        justify-content: center;
    }

}



















/* =====================================================
   OUR SIGNATURE EVENTS
   Scoped Prefix: ose-
   ===================================================== */

.ose-signature-events {
  width: 100%;
  padding: 0 20px 60px;
  background: #ffffff;
}

.ose-signature-events *,
.ose-signature-events *::before,
.ose-signature-events *::after {
  box-sizing: border-box;
}


/* =====================================================
   CONTAINER
   ===================================================== */

.ose-container {
  width: 100%;
  max-width: 1210px;
  margin: 0 auto;
}


/* =====================================================
   SECTION HEADING
   ===================================================== */

.ose-heading {
  margin-bottom: 29px;
  text-align: center;
}

.ose-eyebrow {
  display: block;
  margin-bottom: 3px;

  color: #bca98d;

  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.2px;
}

.ose-heading h2 {
  margin: 0;

  color: #080808;

  font-family: Arial, sans-serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.2px;
}


/* =====================================================
   EVENTS GRID
   ===================================================== */

.ose-grid {
  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 12px;
}


/* =====================================================
   EVENT CARD
   ===================================================== */

.ose-card {
  position: relative;

  display: flex;
  align-items: center;
  justify-content: center;

  width: 100%;
  min-height: 271px;

  overflow: hidden;

  border-radius: 9px;

  background: #29231f;

  isolation: isolate;

  text-decoration: none;

  cursor: pointer;
}


/* =====================================================
   CARD IMAGE
   ===================================================== */

.ose-card-image {
  position: absolute;
  inset: 0;

  z-index: -2;

  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;

  transition:
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.5s ease;
}


/* =====================================================
   DARK OVERLAY
   ===================================================== */

.ose-card-overlay {
  position: absolute;
  inset: 0;

  z-index: -1;

  background:
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.20) 0%,
      rgba(0, 0, 0, 0.28) 45%,
      rgba(0, 0, 0, 0.40) 100%
    );

  transition:
    background 0.5s ease;
}


/* =====================================================
   CARD CONTENT
   ===================================================== */

.ose-card-content {
  position: relative;
  z-index: 2;

  width: 100%;

  padding: 25px;

  text-align: center;
}


/* =====================================================
   CARD HEADING
   Hidden Before Hover
   ===================================================== */

.ose-card-content h3 {
  margin: 0 0 16px;

  color: #ffffff;

  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;

  text-shadow:
    0 2px 10px rgba(0, 0, 0, 0.45);

  opacity: 0;

  transform: translateY(20px);

  transition:
    opacity 0.45s ease,
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}


/* =====================================================
   BUTTON
   Hidden Before Hover
   ===================================================== */

.ose-card-button {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  gap: 9px;

  padding: 11px 20px;

  border: 1px solid rgba(255, 255, 255, 0.75);

  border-radius: 50px;

  color: #ffffff;

  background: rgba(255, 255, 255, 0.10);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;

  white-space: nowrap;

  opacity: 0;

  transform: translateY(20px);

  transition:
    opacity 0.45s ease 0.08s,
    transform 0.45s cubic-bezier(0.22, 1, 0.36, 1) 0.08s,
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}


/* =====================================================
   ARROW
   ===================================================== */

.ose-card-arrow {
  display: inline-block;

  font-size: 17px;
  line-height: 1;

  transition:
    transform 0.3s ease;
}


/* =====================================================
   HOVER EFFECT
   ===================================================== */

.ose-card:hover .ose-card-image {
  transform: scale(1.08);

  filter: brightness(0.88);
}


.ose-card:hover .ose-card-overlay {
  background:
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.30) 0%,
      rgba(0, 0, 0, 0.48) 50%,
      rgba(0, 0, 0, 0.62) 100%
    );
}


/* Show Heading */

.ose-card:hover .ose-card-content h3 {
  opacity: 1;

  transform: translateY(0);
}


/* Show Button */

.ose-card:hover .ose-card-button {
  opacity: 1;

  transform: translateY(0);
}


/* Button Hover */

.ose-card:hover .ose-card-button:hover {
  color: #222222;

  background: #ffffff;

  border-color: #ffffff;
}


/* Arrow Animation */

.ose-card:hover .ose-card-arrow {
  transform: translateX(4px);
}


/* =====================================================
   CARD FOCUS
   ===================================================== */

.ose-card:focus-visible {
  outline: 3px solid #bca98d;
  outline-offset: 4px;
}


/* =====================================================
   TABLET
   ===================================================== */

@media (max-width: 768px) {

  .ose-signature-events {
    padding-right: 16px;
    padding-left: 16px;
  }

  .ose-heading {
    margin-bottom: 23px;
  }

  .ose-eyebrow {
    font-size: 16px;
  }

  .ose-heading h2 {
    font-size: 28px;
  }

  .ose-card {
    min-height: 220px;
  }

  .ose-card-content h3 {
    font-size: 21px;
  }

}


/* =====================================================
   MOBILE
   ===================================================== */

@media (max-width: 560px) {

  .ose-signature-events {
    padding-top: 5px;
    padding-bottom: 45px;
  }

  .ose-container {
    max-width: 100%;
  }

  .ose-heading {
    margin-bottom: 20px;
  }

  .ose-eyebrow {
    font-size: 15px;
  }

  .ose-heading h2 {
    font-size: 26px;
  }

  .ose-grid {
    grid-template-columns: 1fr;

    gap: 12px;
  }

  .ose-card {
    min-height: 210px;

    border-radius: 8px;
  }

  /*
     On mobile there is no mouse hover,
     so content remains visible.
  */

  .ose-card-content h3 {
    margin-bottom: 14px;

    font-size: 21px;

    opacity: 1;

    transform: translateY(0);
  }

  .ose-card-button {
    opacity: 1;

    transform: translateY(0);
  }

  .ose-card-overlay {
    background:
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.25) 0%,
        rgba(0, 0, 0, 0.42) 50%,
        rgba(0, 0, 0, 0.55) 100%
      );
  }

}


/* =====================================================
   SMALL MOBILE
   ===================================================== */

@media (max-width: 380px) {

  .ose-heading h2 {
    font-size: 23px;
  }

  .ose-card {
    min-height: 185px;
  }

  .ose-card-content {
    padding: 20px;
  }

  .ose-card-content h3 {
    font-size: 19px;
  }

  .ose-card-button {
    padding: 10px 17px;

    font-size: 13px;
  }

}


/* =====================================================
   REDUCED MOTION
   ===================================================== */

@media (prefers-reduced-motion: reduce) {

  .ose-card-image,
  .ose-card-overlay,
  .ose-card-content h3,
  .ose-card-button,
  .ose-card-arrow {
    transition: none;
  }

}

































/* =========================================================
   GOOGLE REVIEWS
   Scoped CSS Prefix: ogr-
   ========================================================= */

.ogr-reviews-section {
  width: 100%;
  padding: 20px 30px 30px;
  background: #000000;
  overflow: hidden;
}

.ogr-reviews-section *,
.ogr-reviews-section *::before,
.ogr-reviews-section *::after {
  box-sizing: border-box;
}

.ogr-reviews-wrap {
  position: relative;
  width: 100%;
  max-width: 1500px;
  margin: 0 auto;
}


/* =========================================================
   TOP RATING BAR
   ========================================================= */

.ogr-rating-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;

  min-height: 113px;
  padding: 20px 28px;

  background: #c65f76;
  border-radius: 9px;

  margin-bottom: 21px;
}


/* Google Title */

.ogr-google-title {
  display: flex;
  align-items: center;
  gap: 9px;

  color: #ffffff;

  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.2;
}

.ogr-google-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 23px;
  height: 23px;

  color: #4285f4;

  font-family: Arial, sans-serif;
  font-size: 22px;
  font-weight: 800;

  background: #ffffff;
  border-radius: 50%;
}


/* Rating Row */

.ogr-rating-row {
  display: flex;
  align-items: center;

  gap: 10px;

  margin-top: 5px;
}

.ogr-stars {
  color: #ffc52f;

  font-size: 27px;
  line-height: 1;

  letter-spacing: -3px;
}

.ogr-rating-number {
  color: #ffffff;

  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
}

.ogr-rating-text {
  color: #ffffff;

  font-family: Arial, sans-serif;
  font-size: 17px;
}


/* Google Button */

.ogr-google-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 220px;
  min-height: 41px;

  padding: 10px 23px;

  color: #ffffff;
  background: #050505;

  border-radius: 50px;

  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;

  text-decoration: none;

  transition:
    transform 0.25s ease,
    background 0.25s ease;
}

.ogr-google-button:hover {
  transform: translateY(-2px);
  background: #171717;
}


/* =========================================================
   CAROUSEL
   ========================================================= */

.ogr-carousel {
  position: relative;
  width: 100%;
  overflow: visible;
}

.ogr-review-track {
  display: flex;
  gap: 23px;

  width: 100%;

  overflow: hidden;

  scroll-behavior: smooth;
}


/* =========================================================
   REVIEW CARD
   ========================================================= */

.ogr-review-card {
  position: relative;

  flex: 0 0 calc((100% - 92px) / 5);

  min-width: 0;
  min-height: 302px;

  padding: 24px 26px 20px;

  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;

  background: #f8f8fa;

  border: 1px solid #c65f76;
  border-radius: 9px;

  overflow: hidden;
}


/* Stars */

.ogr-review-stars {
  color: #ffc52f;

  font-size: 25px;
  line-height: 1;

  letter-spacing: -3px;

  margin-bottom: 7px;
}


/* Review Text */

.ogr-review-text {
  width: 100%;
  max-width: 230px;

  margin: 0 auto;

  color: #25252b;

  font-family: Arial, sans-serif;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.35;

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}


/* Read More */

.ogr-read-more {
  display: inline-block;

  margin-top: 3px;

  color: #376cff;

  font-family: Arial, sans-serif;
  font-size: 18px;
  font-weight: 400;

  text-decoration: none;
}

.ogr-read-more:hover {
  text-decoration: underline;
}


/* =========================================================
   REVIEWER
   ========================================================= */

.ogr-reviewer {
  width: 100%;

  margin-top: auto;
  padding-top: 19px;

  display: flex;
  flex-direction: column;
  align-items: center;
}


/* Avatar */

.ogr-avatar {
  position: relative;

  width: 47px;
  height: 47px;

  margin-bottom: 7px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  overflow: visible;

  background: #8d9ca1;

  color: #ffffff;

  font-family: Arial, sans-serif;
  font-size: 21px;
}

.ogr-avatar-image {
  background: #dddddd;
}

.ogr-avatar img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;

  border-radius: 50%;
}

.ogr-avatar-brown {
  background: #937c70;
}


/* Small Google Logo */

.ogr-google-small {
  position: absolute;

  right: -3px;
  bottom: -3px;

  width: 22px;
  height: 22px;

  display: flex;
  align-items: center;
  justify-content: center;

  color: #4285f4;
  background: #ffffff;

  border-radius: 50%;

  font-family: Arial, sans-serif;
  font-size: 15px;
  font-weight: 800;

  box-shadow: 0 1px 3px rgba(0,0,0,.15);
}


/* Reviewer Name */

.ogr-reviewer-name {
  display: flex;
  flex-direction: column;
  align-items: center;

  max-width: 100%;
}

.ogr-reviewer-name strong {
  display: block;

  max-width: 190px;

  color: #171717;

  font-family: Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ogr-reviewer-name small {
  margin-top: 5px;

  color: #999999;

  font-family: Arial, sans-serif;
  font-size: 14px;
}


/* Verified Badge */

.ogr-verified {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 14px;
  height: 14px;

  margin-left: 3px;

  color: #ffffff;
  background: #4285f4;

  border-radius: 50%;

  font-size: 9px;
  line-height: 1;
  vertical-align: 2px;
}


/* =========================================================
   NEXT ARROW
   ========================================================= */

.ogr-next {
  position: absolute;

  top: 50%;
  right: -17px;

  transform: translateY(-50%);

  width: 36px;
  height: 36px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0;

  border: 0;
  border-radius: 50%;

  color: #ffffff;
  background: rgba(45, 45, 45, 0.82);

  cursor: pointer;

  z-index: 10;

  box-shadow: 0 3px 12px rgba(0,0,0,.25);

  transition:
    background 0.25s ease,
    transform 0.25s ease;
}

.ogr-next span {
  margin-top: -3px;

  font-family: Arial, sans-serif;
  font-size: 31px;
  font-weight: 300;
}

.ogr-next:hover {
  background: #555555;
  transform: translateY(-50%) scale(1.08);
}


/* =========================================================
   DOTS
   ========================================================= */

.ogr-dots {
  display: flex;
  align-items: center;
  justify-content: center;

  gap: 5px;

  margin-top: 24px;
}

.ogr-dot {
  width: 5px;
  height: 5px;

  padding: 0;

  border: 0;
  border-radius: 50%;

  background: #2b2b2b;

  cursor: pointer;
}

.ogr-dot-active {
  background: #202020;
  transform: scale(1.25);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1100px) {

  .ogr-review-card {
    flex: 0 0 calc((100% - 46px) / 3);
  }

  .ogr-rating-bar {
    padding: 18px 22px;
  }

}


/* =========================================================
   SMALL TABLET
   ========================================================= */

@media (max-width: 800px) {

  .ogr-reviews-section {
    padding-right: 20px;
    padding-left: 20px;
  }

  .ogr-rating-bar {
    min-height: auto;

    gap: 20px;
  }

  .ogr-google-title {
    font-size: 21px;
  }

  .ogr-rating-text {
    font-size: 15px;
  }

  .ogr-stars {
    font-size: 23px;
  }

  .ogr-google-button {
    min-width: 190px;
    font-size: 14px;
  }

  .ogr-review-card {
    flex: 0 0 calc((100% - 23px) / 2);
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

  .ogr-reviews-section {
    padding: 15px 15px 25px;
  }

  .ogr-rating-bar {
    flex-direction: column;
    align-items: flex-start;

    padding: 20px;

    border-radius: 8px;
  }

  .ogr-google-title {
    font-size: 20px;
  }

  .ogr-rating-row {
    flex-wrap: wrap;
  }

  .ogr-stars {
    font-size: 23px;
  }

  .ogr-rating-number,
  .ogr-rating-text {
    font-size: 14px;
  }

  .ogr-google-button {
    width: 100%;
    min-width: 0;
  }


  .ogr-review-track {
    gap: 12px;

    overflow-x: auto;
    overflow-y: hidden;

    scroll-snap-type: x mandatory;

    scrollbar-width: none;

    padding-right: 25px;
  }

  .ogr-review-track::-webkit-scrollbar {
    display: none;
  }


  .ogr-review-card {
    flex: 0 0 88%;

    min-height: 290px;

    scroll-snap-align: start;

    padding: 23px 20px 19px;
  }


  .ogr-next {
    right: -5px;

    width: 34px;
    height: 34px;
  }

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

  .ogr-google-title {
    font-size: 18px;
  }

  .ogr-rating-text {
    font-size: 13px;
  }

  .ogr-review-card {
    flex-basis: 92%;
  }

  .ogr-review-text {
    font-size: 18px;
  }

}

























/* =========================================================
   RESET / SCOPE
   ========================================================= */

.pe-aos-section {
  width: 100%;
  padding: clamp(45px, 6vw, 85px) 20px;
  background: #ffffff;
  overflow: hidden;
}

.pe-aos-section *,
.pe-aos-section *::before,
.pe-aos-section *::after {
  box-sizing: border-box;
}


/* =========================================================
   MAIN CONTAINER
   ========================================================= */

.pe-aos-container {
  width: min(100%, 1180px);
  margin: 0 auto;

  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.95fr);

  align-items: center;
  gap: clamp(45px, 7vw, 100px);
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.pe-aos-content {
  min-width: 0;
}


/* =========================================================
   EYEBROW
   ========================================================= */

.pe-aos-eyebrow {
  display: block;

  margin-bottom: 16px;

  color: #b85d73;

  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;

  line-height: 1;

  letter-spacing: 2.2px;
}


/* =========================================================
   TITLE
   ========================================================= */

.pe-aos-title {
  margin: 0 0 20px;

  color: #242326;

  font-family: Arial, sans-serif;
  font-size: clamp(34px, 3.3vw, 48px);
  font-weight: 700;

  line-height: 1.08;

  letter-spacing: -1.4px;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

.pe-aos-description {
  width: 100%;
  max-width: 590px;

  margin: 0 0 20px;

  color: #4c4a4d;

  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 400;

  line-height: 1.58;
}


/* =========================================================
   SERVICES
   ========================================================= */

.pe-aos-services {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));

  width: 100%;
  max-width: 560px;

  gap: 30px;

  margin-bottom: 22px;
}

.pe-aos-service-column {
  margin: 0;
  padding: 0;

  list-style: none;
}

.pe-aos-service-column li {
  display: flex;
  align-items: center;

  min-height: 27px;

  color: #555256;

  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1.4;
}

.pe-aos-check {
  flex: 0 0 auto;

  width: 18px;

  margin-right: 7px;

  color: #c26076;

  font-size: 19px;
  font-weight: 700;

  line-height: 1;
}


/* =========================================================
   TESTIMONIAL
   ========================================================= */

.pe-aos-testimonial {
  display: flex;

  width: min(100%, 590px);

  padding: 18px 22px;

  background: #050505;

  border-radius: 20px;

  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.06);
}

.pe-aos-testimonial-line {
  flex: 0 0 3px;

  width: 3px;

  margin-right: 15px;

  border-radius: 5px;

  background: #c35e75;
}

.pe-aos-testimonial-body {
  min-width: 0;
}

.pe-aos-testimonial-body p {
  margin: 0 0 9px;

  color: #eeeeee;

  font-family: Arial, sans-serif;
  font-size: 11.5px;

  line-height: 1.6;
}

.pe-aos-testimonial-body strong {
  display: block;

  color: #c45e75;

  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
}


/* =========================================================
   RIGHT VISUAL
   ========================================================= */

.pe-aos-visual {
  position: relative;

  width: 100%;
  height: clamp(390px, 42vw, 490px);

  min-width: 0;
}


/* =========================================================
   DECORATIVE DOT
   ========================================================= */

.pe-aos-dot {
  position: absolute;

  top: 0;
  left: 0;

  width: 25px;
  height: 25px;

  border-radius: 50%;

  background: #c45f76;

  z-index: 5;
}


/* =========================================================
   IMAGE COMMON
   ========================================================= */

.pe-aos-image {
  position: absolute;

  overflow: hidden;

  background: #eeeeee;

  border-radius: 25px;

  box-shadow:
    0 12px 30px rgba(0, 0, 0, 0.06);
}

.pe-aos-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition:
    transform 0.8s cubic-bezier(.22, 1, .36, 1);
}

.pe-aos-image:hover img {
  transform: scale(1.045);
}


/* =========================================================
   FIRST IMAGE
   ========================================================= */

.pe-aos-image-one {
  top: 0;
  left: 9%;

  width: 46%;
  height: 90%;

  border-radius: 24px;
}


/* =========================================================
   SECOND IMAGE
   ========================================================= */

.pe-aos-image-two {
  right: 1%;
  bottom: 0;

  width: 46%;
  height: 82%;

  border-radius: 24px;
}


/* =========================================================
   CENTER ICON
   ========================================================= */

.pe-aos-icon {
  position: absolute;

  top: 44%;
  left: 50%;

  width: 64px;
  height: 64px;

  display: flex;
  align-items: center;
  justify-content: center;

  transform: translate(-50%, -50%);

  color: #ffffff;

  background: #c45f76;

  border-radius: 20px;

  z-index: 10;

  box-shadow:
    0 12px 28px rgba(196, 95, 118, 0.28);

  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease;
}

.pe-aos-icon svg {
  width: 38px;
  height: 38px;
}

.pe-aos-icon:hover {
  transform: translate(-50%, -50%) rotate(-5deg) scale(1.06);

  box-shadow:
    0 16px 35px rgba(196, 95, 118, 0.38);
}


/* =========================================================
   LARGE TABLET
   ========================================================= */

@media (max-width: 1050px) {

  .pe-aos-container {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 0.85fr);

    gap: 45px;
  }

  .pe-aos-title {
    font-size: 38px;
  }

  .pe-aos-description {
    font-size: 13px;
  }

  .pe-aos-service-column li {
    font-size: 13px;
  }

  .pe-aos-visual {
    height: 420px;
  }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 820px) {

  .pe-aos-section {
    padding-top: 55px;
    padding-bottom: 55px;
  }

  .pe-aos-container {
    grid-template-columns: 1fr;

    gap: 55px;
  }

  .pe-aos-content {
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
  }

  .pe-aos-title {
    font-size: clamp(34px, 6vw, 43px);
  }

  .pe-aos-description {
    max-width: 680px;
  }

  .pe-aos-services {
    max-width: 620px;
  }

  .pe-aos-testimonial {
    max-width: 650px;
  }

  .pe-aos-visual {
    width: min(100%, 600px);
    height: 450px;
    margin: 0 auto;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

  .pe-aos-section {
    padding: 48px 18px 50px;
  }

  .pe-aos-container {
    gap: 42px;
  }

  .pe-aos-eyebrow {
    margin-bottom: 13px;

    font-size: 10px;

    letter-spacing: 2px;
  }

  .pe-aos-title {
    margin-bottom: 17px;

    font-size: clamp(30px, 9vw, 38px);

    line-height: 1.1;

    letter-spacing: -1px;
  }

  .pe-aos-desktop-break {
    display: none;
  }

  .pe-aos-description {
    margin-bottom: 21px;

    font-size: 13px;

    line-height: 1.6;
  }


  /* Services */

  .pe-aos-services {
    grid-template-columns: 1fr 1fr;

    gap: 8px 18px;

    margin-bottom: 23px;
  }

  .pe-aos-service-column li {
    min-height: 28px;

    font-size: 12.5px;
  }

  .pe-aos-check {
    width: 16px;

    margin-right: 5px;

    font-size: 17px;
  }


  /* Testimonial */

  .pe-aos-testimonial {
    padding: 17px 16px;

    border-radius: 17px;
  }

  .pe-aos-testimonial-line {
    margin-right: 11px;
  }

  .pe-aos-testimonial-body p {
    font-size: 10.5px;

    line-height: 1.58;
  }


  /* Gallery */

  .pe-aos-visual {
    width: 100%;
    height: 370px;
  }

  .pe-aos-dot {
    width: 20px;
    height: 20px;

    left: 1%;
  }

  .pe-aos-image-one {
    left: 5%;

    width: 46%;
    height: 86%;

    border-radius: 20px;
  }

  .pe-aos-image-two {
    right: 3%;

    width: 46%;
    height: 78%;

    border-radius: 20px;
  }

  .pe-aos-icon {
    width: 56px;
    height: 56px;

    border-radius: 17px;
  }

  .pe-aos-icon svg {
    width: 33px;
    height: 33px;
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 430px) {

  .pe-aos-section {
    padding-right: 15px;
    padding-left: 15px;
  }

  .pe-aos-container {
    gap: 38px;
  }

  .pe-aos-title {
    font-size: 29px;
  }

  .pe-aos-description {
    font-size: 12.5px;
  }

  .pe-aos-services {
    gap: 6px 10px;
  }

  .pe-aos-service-column li {
    font-size: 11.5px;
  }

  .pe-aos-check {
    width: 14px;
    margin-right: 4px;
  }

  .pe-aos-testimonial {
    padding: 15px 13px;

    border-radius: 15px;
  }

  .pe-aos-testimonial-body p {
    font-size: 9.5px;
  }

  .pe-aos-visual {
    height: 320px;
  }

  .pe-aos-image-one {
    height: 88%;
  }

  .pe-aos-image-two {
    height: 78%;
  }

}


/* =========================================================
   EXTRA SMALL MOBILE
   ========================================================= */

@media (max-width: 340px) {

  .pe-aos-title {
    font-size: 26px;
  }

  .pe-aos-services {
    grid-template-columns: 1fr;
  }

  .pe-aos-visual {
    height: 285px;
  }

  .pe-aos-icon {
    width: 50px;
    height: 50px;

    border-radius: 15px;
  }

  .pe-aos-icon svg {
    width: 29px;
    height: 29px;
  }

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

  .pe-aos-image img,
  .pe-aos-icon {
    transition: none;
  }

}

























/* =========================================================
   EVENT SERVICES
   Scoped Prefix: pes-
   ========================================================= */

.pes-section {
  width: 100%;
  padding: clamp(55px, 7vw, 90px) 20px;
  background: #ffffff;
  overflow: hidden;
}

.pes-section *,
.pes-section *::before,
.pes-section *::after {
  box-sizing: border-box;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.pes-container {
  width: min(100%, 1180px);
  margin: 0 auto;
}


/* =========================================================
   HEADING
   ========================================================= */

.pes-heading {
  max-width: 680px;
  margin: 0 auto clamp(35px, 5vw, 55px);
  text-align: center;
}

.pes-eyebrow {
  display: inline-block;

  margin-bottom: 12px;

  color: #4d8fd9;

  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;

  letter-spacing: 2.5px;
  text-transform: uppercase;
}

.pes-heading h2 {
  margin: 0 0 14px;

  color: #202024;

  font-family: Arial, sans-serif;
  font-size: clamp(32px, 4vw, 46px);
  font-weight: 700;

  line-height: 1.1;
  letter-spacing: -1px;
}

.pes-heading h2 span {
  color: #4d8fd9;
}

.pes-heading p {
  max-width: 600px;

  margin: 0 auto;

  color: #666268;

  font-family: Arial, sans-serif;
  font-size: 14px;
  line-height: 1.65;
}


/* =========================================================
   GRID
   ========================================================= */

.pes-grid {
  display: grid;

  grid-template-columns: repeat(4, minmax(0, 1fr));

  gap: 18px;
}


/* =========================================================
   CARD
   ========================================================= */

.pes-card {
  position: relative;

  min-width: 0;
  min-height: 300px;

  padding: 30px 25px 25px;

  display: flex;
  flex-direction: column;

  background: #ffffff;

  border: 1px solid #eee8e9;
  border-radius: 20px;

  overflow: hidden;

  transition:
    transform 0.4s cubic-bezier(.22,1,.36,1),
    border-color 0.35s ease,
    box-shadow 0.4s ease,
    background 0.4s ease;
}

.pes-card::before {
  content: "";

  position: absolute;

  left: 0;
  right: 0;
  bottom: 0;

  height: 3px;

  background: #4d8fd9;

  transform: scaleX(0);
  transform-origin: left;

  transition: transform 0.4s ease;
}

.pes-card:hover {
  transform: translateY(-8px);

  border-color: #e3c5cc;

  box-shadow:
    0 18px 45px rgba(76, 45, 54, 0.10);
}

.pes-card:hover::before {
  transform: scaleX(1);
}


/* =========================================================
   ICON
   ========================================================= */

.pes-icon {
  width: 65px;
  height: 65px;

  display: flex;
  align-items: center;
  justify-content: center;

  margin-bottom: 24px;

  color: #4d8fd9;

  background: #c9ddf3;

  border-radius: 18px;

  transition:
    color 0.35s ease,
    background 0.35s ease,
    transform 0.35s ease;
}

.pes-icon svg {
  width: 34px;
  height: 34px;

  display: block;
}

.pes-card:hover .pes-icon {
  color: #ffffff;

  background: #4d8fd9;

  transform: rotate(-4deg) scale(1.05);
}


/* =========================================================
   NUMBER
   ========================================================= */

.pes-number {
  display: block;

  margin-bottom: 5px;

  color: #c9c2c4;

  font-family: Arial, sans-serif;
  font-size: 10px;
  font-weight: 700;

  letter-spacing: 1.5px;
}


/* =========================================================
   CARD TITLE
   ========================================================= */

.pes-card h3 {
  margin: 0 0 11px;

  color: #252327;

  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 700;

  line-height: 1.2;

  transition: color 0.3s ease;
}

.pes-card:hover h3 {
  color: #4d8fd9;
}


/* =========================================================
   CARD DESCRIPTION
   ========================================================= */

.pes-card p {
  margin: 0;

  color: #69656a;

  font-family: Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;

  line-height: 1.6;
}


/* =========================================================
   LINK
   ========================================================= */

.pes-link {
  display: inline-flex;
  align-items: center;

  gap: 7px;

  margin-top: auto;
  padding-top: 22px;

  color: #4d8fd9;

  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;

  text-decoration: none;
}

.pes-link span {
  font-size: 18px;
  line-height: 0;

  transition: transform 0.3s ease;
}

.pes-link:hover span {
  transform: translateX(5px);
}


/* =========================================================
   LARGE TABLET
   ========================================================= */

@media (max-width: 1050px) {

  .pes-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
  }

  .pes-card {
    min-height: 275px;
  }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 700px) {

  .pes-section {
    padding: 55px 18px;
  }

  .pes-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 14px;
  }

  .pes-card {
    min-height: 285px;

    padding: 24px 20px 22px;

    border-radius: 17px;
  }

  .pes-icon {
    width: 58px;
    height: 58px;

    margin-bottom: 20px;

    border-radius: 16px;
  }

  .pes-icon svg {
    width: 30px;
    height: 30px;
  }

  .pes-card h3 {
    font-size: 18px;
  }

  .pes-card p {
    font-size: 12px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 520px) {

  .pes-section {
    padding: 45px 15px;
  }

  .pes-heading {
    margin-bottom: 30px;
  }

  .pes-eyebrow {
    font-size: 10px;
    letter-spacing: 2px;
  }

  .pes-heading h2 {
    font-size: 31px;

    letter-spacing: -0.7px;
  }

  .pes-heading p {
    font-size: 13px;
  }

  .pes-grid {
    grid-template-columns: 1fr;

    gap: 14px;
  }

  .pes-card {
    min-height: auto;

    padding: 24px;

    display: grid;

    grid-template-columns: 62px minmax(0, 1fr);

    column-gap: 18px;
  }

  .pes-icon {
    grid-row: 1 / span 4;

    width: 62px;
    height: 62px;

    margin: 0;
  }

  .pes-card-content {
    min-width: 0;
  }

  .pes-number {
    margin-bottom: 4px;
  }

  .pes-card h3 {
    margin-bottom: 8px;

    font-size: 19px;
  }

  .pes-card p {
    font-size: 12.5px;

    line-height: 1.55;
  }

  .pes-link {
    padding-top: 14px;
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 360px) {

  .pes-card {
    grid-template-columns: 52px minmax(0, 1fr);

    column-gap: 14px;

    padding: 20px;
  }

  .pes-icon {
    width: 52px;
    height: 52px;

    border-radius: 14px;
  }

  .pes-icon svg {
    width: 27px;
    height: 27px;
  }

  .pes-card h3 {
    font-size: 17px;
  }

  .pes-card p {
    font-size: 11.5px;
  }

}


/* =========================================================
   EVENT PLANNER - ABOUT SECTION
   All styles are scoped with ep-about-* to prevent conflicts
   ========================================================= */

.ep-about-section {
    width: 100%;
    padding: 70px 20px;
    background: #ffffff;
    overflow: hidden;
}

.ep-about-wrapper {
    width: min(1220px, 100%);
    margin: 0 auto;

    display: grid;
    grid-template-columns: minmax(0, 1.03fr) minmax(0, 0.97fr);
    align-items: center;
    gap: 52px;

    position: relative;
}


/* =========================
   IMAGE
   ========================= */

.ep-about-image-wrap {
    position: relative;
    width: 100%;
    height: 450px;
}

.ep-about-image {
    display: block;
    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    border-radius: 26px;

    box-shadow:
        0 18px 45px rgba(30, 30, 30, 0.12);
}


/* =========================
   CALL CARD
   ========================= */

.ep-about-call-card {
    position: absolute;
    right: 12px;
    bottom: 18px;

    min-width: 265px;
    min-height: 96px;

    padding: 17px 24px;

    display: flex;
    align-items: center;
    gap: 15px;

    background: #000000;
    color: #ffffff;

    border-radius: 28px;

    text-decoration: none;

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.ep-about-call-card:hover {
    color: #ffffff;
    text-decoration: none;

    transform: translateY(-5px);

    box-shadow:
        0 20px 40px rgba(0, 0, 0, 0.32);
}

.ep-about-call-icon {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.ep-about-call-icon svg {
    width: 37px;
    height: 37px;

    fill: none;
    stroke: #ffffff;
    stroke-width: 1.6;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.ep-about-call-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ep-about-call-content strong {
    font-size: 16px;
    line-height: 1.2;
    font-weight: 700;
}

.ep-about-call-content small {
    font-size: 14px;
    line-height: 1.2;
    font-weight: 400;
    color: #ffffff;
}


/* =========================
   CONTENT
   ========================= */

.ep-about-content {
    position: relative;
    z-index: 2;

    padding: 8px 0;
}

.ep-about-eyebrow {
    display: inline-block;

    margin-bottom: 19px;

    color: #1a6fce;

    font-size: 13px;
    line-height: 1;
    font-weight: 700;

    letter-spacing: 3px;
    text-transform: uppercase;
}

.ep-about-title {
    margin: 0 0 22px;

    color: #292929;

    font-size: clamp(36px, 3.2vw, 47px);
    line-height: 1.12;
    font-weight: 800;

    letter-spacing: -1.4px;
}

.ep-about-description {
    max-width: 610px;

    margin: 0 0 12px;

    color: #252525;

    font-size: 16px;
    line-height: 1.58;
    font-weight: 400;
}

.ep-about-description-last {
    margin-bottom: 29px;
}


/* =========================
   EXPERIENCE
   ========================= */

.ep-about-experience {
    display: inline-flex;
    align-items: center;
    gap: 15px;

    min-height: 70px;

    padding: 10px 25px 10px 16px;

    background: #1a6fce;
    color: #ffffff;

    border-radius: 27px;

    box-shadow:
        0 12px 25px rgba(209, 91, 114, 0.18);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}

.ep-about-experience:hover {
    transform: translateY(-3px);

    box-shadow:
        0 16px 30px rgba(209, 91, 114, 0.25);
}

.ep-about-calendar-icon {
    width: 43px;
    height: 43px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.ep-about-calendar-icon svg {
    width: 36px;
    height: 36px;

    fill: none;
    stroke: #ffffff;
    stroke-width: 1.5;

    stroke-linecap: round;
    stroke-linejoin: round;
}

.ep-about-experience strong {
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
    white-space: nowrap;
}


/* =========================
   DECORATIVE CIRCLE
   ========================= */

.ep-about-decoration {
    position: absolute;

    top: 0;
    right: -5px;

    width: 31px;
    height: 31px;

    background: #1a6fce;

    border-radius: 50%;

    z-index: 1;
}


/* =========================
   LARGE TABLETS
   ========================= */

@media (max-width: 1050px) {

    .ep-about-section {
        padding: 60px 25px;
    }

    .ep-about-wrapper {
        gap: 40px;
    }

    .ep-about-image-wrap {
        height: 420px;
    }

    .ep-about-title {
        font-size: 38px;
    }

    .ep-about-description {
        font-size: 15px;
        line-height: 1.55;
    }

    .ep-about-call-card {
        min-width: 245px;
        right: 10px;
    }
}


/* =========================
   TABLET
   ========================= */

@media (max-width: 800px) {

    .ep-about-section {
        padding: 55px 20px;
    }

    .ep-about-wrapper {
        grid-template-columns: 1fr;
        gap: 40px;
    }

    .ep-about-image-wrap {
        height: 430px;
    }

    .ep-about-content {
        padding: 0 5px;
    }

    .ep-about-title {
        font-size: 39px;
        letter-spacing: -1px;
    }

    .ep-about-description {
        max-width: 100%;
        font-size: 16px;
        line-height: 1.65;
    }

    .ep-about-decoration {
        display: none;
    }
}


/* =========================
   MOBILE
   ========================= */

@media (max-width: 575px) {

    .ep-about-section {
        padding: 42px 15px;
    }

    .ep-about-wrapper {
        gap: 34px;
    }

    .ep-about-image-wrap {
        height: 390px;
    }

    .ep-about-image {
        border-radius: 20px;
    }

    .ep-about-call-card {
        left: 15px;
        right: 15px;
        bottom: 15px;

        min-width: 0;
        min-height: 82px;

        justify-content: center;

        padding: 13px 18px;

        border-radius: 22px;
    }

    .ep-about-call-icon {
        width: 38px;
        height: 38px;
        flex-basis: 38px;
    }

    .ep-about-call-icon svg {
        width: 32px;
        height: 32px;
    }

    .ep-about-call-content strong {
        font-size: 15px;
    }

    .ep-about-call-content small {
        font-size: 13px;
    }

    .ep-about-eyebrow {
        margin-bottom: 15px;

        font-size: 11px;
        letter-spacing: 2.5px;
    }

    .ep-about-title {
        margin-bottom: 18px;

        font-size: 32px;
        line-height: 1.15;
        letter-spacing: -0.7px;
    }

    .ep-about-desktop-break {
        display: none;
    }

    .ep-about-description {
        font-size: 15px;
        line-height: 1.65;
    }

    .ep-about-description-last {
        margin-bottom: 25px;
    }

    .ep-about-experience {
        width: 100%;
        min-height: 64px;

        justify-content: center;

        padding: 9px 18px;

        border-radius: 22px;
    }

    .ep-about-experience strong {
        font-size: 16px;
    }

    .ep-about-calendar-icon {
        width: 39px;
        height: 39px;
    }

    .ep-about-calendar-icon svg {
        width: 32px;
        height: 32px;
    }
}


/* =========================
   SMALL MOBILE
   ========================= */

@media (max-width: 380px) {

    .ep-about-image-wrap {
        height: 350px;
    }

    .ep-about-title {
        font-size: 29px;
    }

    .ep-about-description {
        font-size: 14px;
    }

    .ep-about-call-card {
        left: 10px;
        right: 10px;
    }

    .ep-about-experience strong {
        font-size: 15px;
    }
}

/* ==========================================================
   MODERN FULL IMAGE HERO
   Everything is scoped with epx-
   ========================================================== */

.epx-hero {
    --pink: #1a6fce;
    --pink-dark: #b9445e;

    position: relative;
    width: 100%;
    height: 720px;

    overflow: hidden;

    background: #19191c;
}


/* ================= SLIDES ================= */

.epx-slide {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    opacity: 0;
    visibility: hidden;

    transform: scale(1.03);

    transition:
        opacity .8s ease,
        visibility .8s ease,
        transform 1.2s ease;
}

.epx-slide-active {
    opacity: 1;
    visibility: visible;

    transform: scale(1);
}


/* ================= BACKGROUND IMAGE ================= */

.epx-slide::before {
    content: "";

    position: absolute;

    inset: 0;

    background-image: var(--epx-bg);

    background-size: cover;
    background-position: center;

    transform: scale(1.02);
}


/* ================= DARK OVERLAY ================= */

.epx-overlay {
    position: absolute;

    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(13,13,17,.94) 0%,
            rgba(20,18,22,.82) 38%,
            rgba(20,18,22,.47) 70%,
            rgba(20,18,22,.30) 100%
        );

}


/* Pink ambient glow */

.epx-slide::after {
    content: "";

    position: absolute;

    width: 550px;
    height: 550px;

    right: -150px;
    top: -170px;

    background: rgba(209,91,114,.28);

    filter: blur(100px);

    border-radius: 50%;

    z-index: 2;

    pointer-events: none;
}


/* ================= CONTAINER ================= */

.epx-container {
    position: relative;

    z-index: 5;

    width: min(1240px, calc(100% - 50px));

    height: 100%;

    margin: auto;

    display: grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(390px, .82fr);

    align-items: center;

    gap: 70px;
}


/* ================= CONTENT ================= */

.epx-content {
    max-width: 650px;

    padding-bottom: 35px;
}

.epx-kicker {
    display: inline-flex;

    align-items: center;

    gap: 11px;

    margin-bottom: 21px;

    color: #8ea9ce;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2.5px;
}

.epx-kicker span {
    width: 32px;
    height: 2px;

    background: var(--pink);
}


.epx-content h1,
.epx-content h2 {
    margin: 0 0 23px;

    color: #fff;

    font-size: clamp(43px, 5vw, 70px);

    line-height: 1.03;

    font-weight: 800;

    letter-spacing: -2.5px;
}

.epx-content h1 em,
.epx-content h2 em {
    display: block;

    color: #8ea9ce;

    font-style: normal;
}


.epx-content p {
    max-width: 600px;

    margin: 0 0 30px;

    color: rgba(255,255,255,.72);

    font-size: 16px;

    line-height: 1.72;
}


/* ================= BUTTONS ================= */

.epx-actions {
    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-bottom: 37px;
}

.epx-btn {
    min-height: 55px;

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    padding: 0 23px;

    border-radius: 100px;

    text-decoration: none;

    font-size: 13px;

    font-weight: 700;

    transition: .3s ease;
}

.epx-btn-primary {
    color: #fff;

    background: var(--pink);

    box-shadow:
        0 13px 30px rgba(209,91,114,.32);
}

.epx-btn-primary:hover {
    color: #fff;

    background: var(--pink-dark);

    transform: translateY(-3px);

    box-shadow:
        0 18px 35px rgba(209,91,114,.4);
}

.epx-btn-primary span {
    width: 27px;
    height: 27px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: rgba(255,255,255,.18);

    border-radius: 50%;
}

.epx-btn-glass {
    color: #fff;

    background: rgba(255,255,255,.09);

    border: 1px solid rgba(255,255,255,.28);

    backdrop-filter: blur(10px);
}

.epx-btn-glass:hover {
    color: #222;

    background: #fff;

    transform: translateY(-3px);
}


/* ================= STATS ================= */

.epx-stats {
    display: flex;

    align-items: center;

    gap: 22px;
}

.epx-stats div {
    display: flex;

    flex-direction: column;

    gap: 4px;
}

.epx-stats strong {
    color: #fff;

    font-size: 22px;

    line-height: 1;

    font-weight: 800;
}

.epx-stats span {
    color: rgba(255,255,255,.52);

    font-size: 9px;

    text-transform: uppercase;

    letter-spacing: .8px;
}

.epx-stats i {
    width: 1px;
    height: 34px;

    background: rgba(255,255,255,.20);
}


/* ================= FEATURES ================= */

.epx-features {
    display: flex;

    flex-wrap: wrap;

    gap: 20px;
}

.epx-features span {
    display: flex;

    align-items: center;

    gap: 7px;

    color: rgba(255,255,255,.72);

    font-size: 11px;

    font-weight: 600;
}

.epx-features b {
    width: 21px;
    height: 21px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #fff;

    background: rgba(209,91,114,.35);

    border-radius: 50%;

    font-size: 10px;
}


/* ================= IMAGE ================= */

.epx-visual {
    position: relative;

    height: 550px;

    display: flex;

    align-items: center;
    justify-content: center;
}

.epx-photo {
    position: relative;

    width: 430px;
    height: 510px;

    padding: 9px;

    background: rgba(255,255,255,.94);

    border-radius: 35px;

    transform: rotate(2deg);

    box-shadow:
        0 30px 80px rgba(0,0,0,.40);

    transition: .5s ease;
}

.epx-photo:hover {
    transform: rotate(0deg) translateY(-5px);
}

.epx-photo img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    border-radius: 27px;
}


/* ================= FLOATING CARD ================= */

.epx-card {
    position: absolute;

    left: -10px;
    bottom: 42px;

    z-index: 10;

    display: flex;

    align-items: center;

    gap: 12px;

    min-width: 235px;

    padding: 14px 17px;

    background: rgba(255,255,255,.96);

    border-radius: 17px;

    box-shadow:
        0 18px 40px rgba(0,0,0,.25);

    backdrop-filter: blur(15px);
}

.epx-card-icon {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: var(--pink);

    background: #f9e8ec;

    border-radius: 12px;

    font-size: 18px;
}

.epx-card strong {
    display: block;

    color: #252529;

    font-size: 12px;

    font-weight: 800;
}

.epx-card small {
    display: block;

    margin-top: 3px;

    color: #888;

    font-size: 9px;
}


/* ================= NUMBER ================= */

.epx-index {
    position: absolute;

    right: -5px;
    top: 25px;

    color: rgba(255,255,255,.35);

    font-size: 65px;

    font-weight: 800;

    line-height: 1;
}


/* ================= CONTROLS ================= */

.epx-controls {
    position: absolute;

    z-index: 20;

    left: max(25px, calc((100% - 1240px) / 2));

    bottom: 35px;

    display: flex;

    align-items: center;

    gap: 10px;
}

.epx-arrow {
    width: 43px;
    height: 43px;

    padding: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #fff;

    background: rgba(255,255,255,.10);

    border: 1px solid rgba(255,255,255,.25);

    border-radius: 50%;

    cursor: pointer;

    font-size: 16px;

    backdrop-filter: blur(10px);

    transition: .3s ease;
}

.epx-arrow:hover {
    color: #fff;

    background: var(--pink);

    border-color: var(--pink);
}

.epx-dots {
    display: flex;

    align-items: center;

    gap: 5px;
}

.epx-dot {
    width: 7px;
    height: 7px;

    padding: 0;

    border: 0;

    background: rgba(255,255,255,.35);

    border-radius: 10px;

    cursor: pointer;

    transition: .3s ease;
}

.epx-dot-active {
    width: 27px;

    background: var(--pink);
}


/* ==========================================================
   TABLET
   ========================================================== */

@media (max-width: 1000px) {

    .epx-hero {
        height: 680px;
    }

    .epx-container {
        width: calc(100% - 40px);

        gap: 35px;
    }

    .epx-content h1,
    .epx-content h2 {
        font-size: 48px;
    }

    .epx-content p {
        font-size: 14px;
    }

    .epx-photo {
        width: 350px;
        height: 440px;
    }

    .epx-visual {
        height: 480px;
    }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 760px) {

    .epx-hero {
        position: relative;
        width: 100%;
        height: auto;
        min-height: 760px;
        background: #17151b;
        overflow: hidden;
    }

    .epx-slide {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        min-height: 760px;
        opacity: 0;
        visibility: hidden;
        z-index: 1;
        transform: none !important;
        transition: opacity .5s ease, visibility .5s ease;
        box-sizing: border-box;
    }

    .epx-slide-active {
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 3;
        transform: none !important;
    }

    /* Disable heavy 100px GPU blur glow on mobile to prevent GPU layer crash / black screen */
    .epx-slide::after {
        display: none !important;
    }

    .epx-slide::before {
        transform: none !important;
        background-color: #201f24;
    }

    .epx-container {
        position: relative;
        z-index: 5;
        width: calc(100% - 30px);
        min-height: 760px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 25px;
        padding: 35px 0 85px;
        box-sizing: border-box;
    }

    .epx-content {
        width: 100%;
        max-width: 600px;
        text-align: center;
        order: 2;
        padding: 0;
    }

    .epx-visual {
        width: 100%;
        height: 320px;
        order: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .epx-overlay {
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background:
            linear-gradient(
                180deg,
                rgba(13,13,17,.72),
                rgba(13,13,17,.90)
            );
    }

    .epx-kicker {
        justify-content: center;
        font-size: 9px;
        letter-spacing: 1.6px;
    }

    .epx-kicker span {
        width: 20px;
    }

    .epx-content h1,
    .epx-content h2 {
        margin-bottom: 15px;
        font-size: 34px;
        letter-spacing: -1px;
    }

    .epx-content p {
        margin-left: auto;
        margin-right: auto;
        font-size: 13px;
        line-height: 1.65;
        margin-bottom: 22px;
    }

    .epx-actions {
        flex-direction: column;
        align-items: stretch;
        margin-bottom: 22px;
    }

    .epx-btn {
        width: 100%;
        min-height: 50px;
    }

    .epx-stats {
        justify-content: center;
        gap: 12px;
    }

    .epx-stats strong {
        font-size: 17px;
    }

    .epx-stats span {
        font-size: 7px;
    }

    .epx-stats i {
        height: 27px;
    }

    .epx-photo {
        width: 270px;
        height: 310px;
        border-radius: 25px;
        transform: rotate(2deg);
    }

    .epx-photo img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 18px;
    }

    .epx-card {
        left: 50%;
        bottom: 3px;
        min-width: 205px;
        padding: 10px 12px;
        transform: translateX(-50%);
    }

    .epx-card-icon {
        width: 34px;
        height: 34px;
        flex-basis: 34px;
    }

    .epx-card strong {
        font-size: 10px;
    }

    .epx-card small {
        font-size: 8px;
    }

    .epx-index {
        top: 0;
        right: 4%;
        font-size: 42px;
    }

    .epx-features {
        justify-content: center;
        gap: 9px 15px;
    }

    .epx-features span {
        font-size: 9px;
    }

    .epx-controls {
        left: 50%;
        bottom: 17px;
        transform: translateX(-50%);
        z-index: 20;
    }

    .epx-arrow {
        width: 38px;
        height: 38px;
    }

}


/* ==========================================================
   SMALL MOBILE
   ========================================================== */

@media (max-width: 400px) {

    .epx-hero,
    .epx-slide,
    .epx-container {
        min-height: 740px;
    }

    .epx-container {
        padding-top: 25px;
    }

    .epx-visual {
        height: 290px;
    }

    .epx-photo {
        width: 245px;
        height: 280px;
    }

    .epx-content h1,
    .epx-content h2 {
        font-size: 30px;
    }

    .epx-content p {
        font-size: 12px;
    }

}



/* ==========================================
   EVENT PLANNER KARACHI
   MODERN SERVICES DESIGN
   BLUE + WHITE + DARK NAVY + PINK
========================================== */

.epk-modern-services {
    position: relative;
    padding: 105px 20px;
    background: #f8f9fc;
    overflow: hidden;
}

.epk-modern-services::before {
    content: "";
    position: absolute;
    width: 350px;
    height: 350px;
    border-radius: 50%;
    top: -180px;
    left: -130px;
    background: rgba(207, 92, 120, 0.08);
}

.epk-modern-services::after {
    content: "";
    position: absolute;
    width: 300px;
    height: 300px;
    border-radius: 50%;
    right: -140px;
    bottom: -150px;
    background: rgba(7, 26, 51, 0.06);
}

.epk-modern-services-wrap {
    position: relative;
    z-index: 2;
    max-width: 1320px;
    margin: auto;
}


/* ==========================================
   HEADER
========================================== */

.epk-modern-services-head {
    max-width: 850px;
    margin: 0 auto 65px;
    text-align: center;
}

.epk-modern-services-label {
    display: inline-block;
    margin-bottom: 14px;
    color: #015fc9;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 3px;
}

.epk-modern-services-head h2 {
    margin: 0 0 20px;
    color: #071a33;
    font-size: clamp(35px, 4vw, 55px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.epk-modern-services-head p {
    max-width: 780px;
    margin: auto;
    color: #667085;
    font-size: 16px;
    line-height: 1.8;
}


/* ==========================================
   GRID
========================================== */

.epk-modern-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}


/* ==========================================
   CARD
========================================== */

.epk-modern-service {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(7, 26, 51, 0.08);
    border-radius: 20px;
    box-shadow: 0 12px 35px rgba(7, 26, 51, 0.07);
    transition: all 0.4s ease;
}

.epk-modern-service:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 55px rgba(7, 26, 51, 0.16);
}


/* ==========================================
   IMAGE
========================================== */

.epk-modern-service-photo {
    position: relative;
    height: 250px;
    overflow: hidden;
    background: #071a33;
}

.epk-modern-service-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.65s ease;
}

.epk-modern-service:hover
.epk-modern-service-photo img {
    transform: scale(1.09);
}

.epk-modern-service-photo::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(7, 26, 51, 0.02) 25%,
        rgba(7, 26, 51, 0.68) 100%
    );
}


/* ==========================================
   NUMBER
========================================== */

.epk-modern-service-no {
    position: absolute;
    z-index: 3;
    right: 17px;
    top: 17px;

    width: 48px;
    height: 48px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #015fc9;
    color: #ffffff;

    font-size: 13px;
    font-weight: 800;

    box-shadow: 0 8px 22px rgba(207, 92, 120, 0.4);
}


/* ==========================================
   CONTENT
========================================== */

.epk-modern-service-body {
    position: relative;
    padding: 30px 27px 31px;
}

.epk-modern-service-icon {
    position: relative;
    width: 57px;
    height: 57px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: -60px;
    margin-bottom: 21px;

    border-radius: 16px;

    background: #015fc9;
    color: #ffffff;

    font-size: 21px;

    box-shadow: 0 10px 25px rgba(63, 105, 168, 0.3);

    transition: all 0.35s ease;
}

.epk-modern-service:hover
.epk-modern-service-icon {
    background: #071a33;
    transform: rotate(-5deg);
}


/* ==========================================
   TITLE
========================================== */

.epk-modern-service-body h3 {
    margin: 0 0 13px;
    color: #071a33;
    font-size: 21px;
    line-height: 1.35;
    font-weight: 800;
}


/* ==========================================
   TEXT
========================================== */

.epk-modern-service-body p {
    min-height: 108px;
    margin: 0 0 23px;

    color: #687180;

    font-size: 14.5px;
    line-height: 1.75;
}


/* ==========================================
   LINK
========================================== */

.epk-modern-service-body a {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    padding: 12px 19px;

    border-radius: 50px;

    background: #071a33;
    color: #ffffff !important;

    text-decoration: none !important;

    font-size: 13px;
    font-weight: 700;

    transition: all 0.3s ease;
}

.epk-modern-service-body a i {
    font-size: 11px;
    transition: transform 0.3s ease;
}

.epk-modern-service-body a:hover {
    background: #015fc9;
}

.epk-modern-service-body a:hover i {
    transform: translateX(5px);
}


/* ==========================================
   CTA
========================================== */

.epk-modern-services-cta {
    position: relative;
    margin-top: 72px;

    padding: 65px 30px;

    overflow: hidden;

    border-radius: 25px;

    background:
        linear-gradient(
            120deg,
            #071a33 0%,
            #0b2749 60%,
            #071a33 100%
        );

    box-shadow: 0 25px 55px rgba(7, 26, 51, 0.2);
}

.epk-modern-services-cta::before {
    content: "";
    position: absolute;

    width: 280px;
    height: 280px;

    top: -170px;
    left: -80px;

    border-radius: 50%;

    background: rgba(207, 92, 120, 0.22);
}

.epk-modern-services-cta::after {
    content: "";
    position: absolute;

    width: 230px;
    height: 230px;

    right: -100px;
    bottom: -150px;

    border-radius: 50%;

    background: rgba(255,255,255,0.07);
}

.epk-modern-cta-content {
    position: relative;
    z-index: 2;

    max-width: 750px;
    margin: auto;

    text-align: center;
}

.epk-modern-cta-content span {
    display: block;

    margin-bottom: 12px;

    color: #015fc9;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
}

.epk-modern-cta-content h3 {
    margin: 0 0 13px;

    color: #ffffff;

    font-size: clamp(27px, 3vw, 39px);
    line-height: 1.2;
    font-weight: 800;
}

.epk-modern-cta-content p {
    max-width: 650px;

    margin: 0 auto 28px;

    color: rgba(255,255,255,0.72);

    font-size: 15px;
    line-height: 1.75;
}

.epk-modern-cta-content a {
    display: inline-flex;
    align-items: center;
    gap: 11px;

    padding: 14px 26px;

    border-radius: 50px;

    background: #015fc9;
    color: #ffffff !important;

    text-decoration: none !important;

    font-size: 14px;
    font-weight: 800;

    box-shadow: 0 10px 25px rgba(79, 142, 194, 0.3);

    transition: all 0.3s ease;
}

.epk-modern-cta-content a:hover {
    background: #ffffff;
    color: #071a33 !important;
    transform: translateY(-3px);
}

.epk-modern-cta-content a i {
    transition: transform 0.3s ease;
}

.epk-modern-cta-content a:hover i {
    transform: translateX(5px);
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 991px) {

    .epk-modern-services {
        padding: 80px 18px;
    }

    .epk-modern-services-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 23px;
    }

    .epk-modern-service-photo {
        height: 235px;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .epk-modern-services {
        padding: 65px 14px;
    }

    .epk-modern-services-head {
        margin-bottom: 42px;
    }

    .epk-modern-services-head h2 {
        font-size: 31px;
        letter-spacing: -0.5px;
    }

    .epk-modern-services-head p {
        font-size: 14px;
        line-height: 1.7;
    }

    .epk-modern-services-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .epk-modern-service-photo {
        height: 250px;
    }

    .epk-modern-service-body {
        padding: 29px 23px 30px;
    }

    .epk-modern-service-body p {
        min-height: auto;
    }

    .epk-modern-services-cta {
        margin-top: 50px;
        padding: 45px 21px;
        border-radius: 20px;
    }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 420px) {

    .epk-modern-services {
        padding-left: 11px;
        padding-right: 11px;
    }

    .epk-modern-services-head h2 {
        font-size: 28px;
    }

    .epk-modern-service-photo {
        height: 220px;
    }

    .epk-modern-service-body h3 {
        font-size: 19px;
    }

    .epk-modern-service-body p {
        font-size: 14px;
    }

}

/* =========================================
   SIGNATURE EVENTS
   EVENT PLANNER KARACHI
   BLUE + NAVY + WHITE + PINK
========================================= */

.epk-signature-events {
    position: relative;
    padding: 105px 20px;
    background: #ffffff;
    overflow: hidden;
}


/* Decorative Background */

.epk-signature-events::before {
    content: "";
    position: absolute;

    width: 330px;
    height: 330px;

    top: -190px;
    left: -120px;

    border-radius: 50%;

    background: rgba(207, 92, 120, 0.08);
}

.epk-signature-events::after {
    content: "";
    position: absolute;

    width: 300px;
    height: 300px;

    right: -160px;
    bottom: -150px;

    border-radius: 50%;

    background: rgba(7, 26, 51, 0.055);
}


/* Container */

.epk-signature-container {
    position: relative;
    z-index: 2;

    max-width: 1320px;
    margin: 0 auto;
}


/* =========================================
   HEADING
========================================= */

.epk-signature-heading {
    max-width: 850px;

    margin: 0 auto 60px;

    text-align: center;
}

.epk-signature-eyebrow {
    display: inline-block;

    margin-bottom: 14px;

    color: #015fc9;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 3px;
    text-transform: uppercase;
}

.epk-signature-heading h2 {
    margin: 0 0 18px;

    color: #071a33;

    font-size: clamp(34px, 4vw, 53px);

    line-height: 1.12;

    font-weight: 800;

    letter-spacing: -1.3px;
}

.epk-signature-heading p {
    max-width: 760px;

    margin: 0 auto;

    color: #687180;

    font-size: 16px;

    line-height: 1.8;
}


/* =========================================
   GRID
========================================= */

.epk-signature-grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 24px;
}


/* =========================================
   CARD
========================================= */

.epk-signature-card {
    position: relative;

    min-height: 430px;

    display: flex;
    align-items: flex-end;

    overflow: hidden;

    border-radius: 22px;

    background: #071a33;

    text-decoration: none !important;

    box-shadow:
        0 15px 40px rgba(7, 26, 51, 0.12);

    transition:
        transform 0.45s ease,
        box-shadow 0.45s ease;
}

.epk-signature-card:hover {
    transform: translateY(-8px);

    box-shadow:
        0 25px 55px rgba(7, 26, 51, 0.22);
}


/* =========================================
   IMAGE
========================================= */

.epk-signature-image {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;

    transition:
        transform 0.7s ease;
}

.epk-signature-card:hover
.epk-signature-image {
    transform: scale(1.08);
}


/* =========================================
   OVERLAY
========================================= */

.epk-signature-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7, 26, 51, 0.03) 20%,
            rgba(7, 26, 51, 0.22) 42%,
            rgba(7, 26, 51, 0.94) 100%
        );

    transition:
        background 0.4s ease;
}

.epk-signature-card:hover
.epk-signature-overlay {
    background:
        linear-gradient(
            180deg,
            rgba(7, 26, 51, 0.08) 10%,
            rgba(7, 26, 51, 0.35) 40%,
            rgba(7, 26, 51, 0.97) 100%
        );
}


/* =========================================
   NUMBER
========================================= */

.epk-signature-number {
    position: absolute;

    top: 20px;
    right: 20px;

    z-index: 3;

    width: 50px;
    height: 50px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #015fc9;

    color: #ffffff;

    font-size: 13px;
    font-weight: 800;

    box-shadow:
        0 8px 25px rgba(207, 92, 120, 0.4);

    transition:
        transform 0.35s ease,
        background 0.35s ease;
}

.epk-signature-card:hover
.epk-signature-number {
    background: #ffffff;

    color: #071a33;

    transform: rotate(8deg);
}


/* =========================================
   CONTENT
========================================= */

.epk-signature-content {
    position: relative;

    z-index: 3;

    width: 100%;

    padding: 38px 38px 34px;

    color: #ffffff;
}


/* Category */

.epk-signature-category {
    display: inline-block;

    margin-bottom: 10px;

    color: #015fc9;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;
}


/* Heading */

.epk-signature-content h3 {
    max-width: 500px;

    margin: 0 0 10px;

    color: #ffffff;

    font-size: clamp(25px, 3vw, 34px);

    line-height: 1.2;

    font-weight: 800;
}


/* Description */

.epk-signature-content p {
    max-width: 560px;

    margin: 0 0 22px;

    color: rgba(255, 255, 255, 0.78);

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================
   BUTTON
========================================= */

.epk-signature-button {
    display: inline-flex;

    align-items: center;

    gap: 12px;

    padding: 11px 18px;

    border-radius: 50px;

    background: #ffffff;

    color: #071a33;

    font-size: 13px;

    font-weight: 800;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.epk-signature-arrow {
    width: 27px;
    height: 27px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #015fc9;

    color: #ffffff;

    transition:
        transform 0.3s ease;
}

.epk-signature-card:hover
.epk-signature-button {
    background: #015fc9;

    color: #ffffff;
}

.epk-signature-card:hover
.epk-signature-arrow {
    background: #071a33;

    transform: translateX(4px);
}


/* =========================================
   BOTTOM CTA
========================================= */

.epk-signature-bottom {
    position: relative;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 35px;

    margin-top: 28px;

    padding: 38px 42px;

    border-radius: 20px;

    background: #071a33;

    overflow: hidden;

    box-shadow:
        0 15px 40px rgba(7, 26, 51, 0.14);
}

.epk-signature-bottom::before {
    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    top: -110px;
    right: 30%;

    border-radius: 50%;

    background: rgba(207, 92, 120, 0.14);
}

.epk-signature-bottom-text {
    position: relative;
    z-index: 2;
}

.epk-signature-bottom-text span {
    display: block;

    margin-bottom: 8px;

    color: #015fc9;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2px;
}

.epk-signature-bottom-text h3 {
    margin: 0 0 7px;

    color: #ffffff;

    font-size: 27px;

    font-weight: 800;
}

.epk-signature-bottom-text p {
    margin: 0;

    color: rgba(255,255,255,0.7);

    font-size: 14px;

    line-height: 1.6;
}


/* CTA Button */

.epk-signature-cta {
    position: relative;
    z-index: 2;

    flex-shrink: 0;

    display: inline-flex;

    align-items: center;

    gap: 10px;

    padding: 14px 23px;

    border-radius: 50px;

    background: #015fc9;

    color: #ffffff !important;

    text-decoration: none !important;

    font-size: 13px;

    font-weight: 800;

    white-space: nowrap;

    transition:
        all 0.3s ease;
}

.epk-signature-cta:hover {
    background: #ffffff;

    color: #071a33 !important;

    transform: translateY(-3px);
}

.epk-signature-cta i {
    transition:
        transform 0.3s ease;
}

.epk-signature-cta:hover i {
    transform: translateX(5px);
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

    .epk-signature-events {
        padding: 80px 18px;
    }

    .epk-signature-grid {
        gap: 20px;
    }

    .epk-signature-card {
        min-height: 410px;
    }

    .epk-signature-content {
        padding: 32px 28px;
    }

    .epk-signature-bottom {
        padding: 32px;
    }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

    .epk-signature-events {
        padding: 65px 14px;
    }

    .epk-signature-heading {
        margin-bottom: 40px;
    }

    .epk-signature-heading h2 {
        font-size: 31px;

        letter-spacing: -0.5px;
    }

    .epk-signature-heading p {
        font-size: 14px;

        line-height: 1.7;
    }

    .epk-signature-grid {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .epk-signature-card {
        min-height: 420px;

        border-radius: 18px;
    }

    .epk-signature-content {
        padding: 30px 24px;
    }

    .epk-signature-content h3 {
        font-size: 27px;
    }

    .epk-signature-content p {
        font-size: 13.5px;
    }

    .epk-signature-bottom {
        flex-direction: column;

        align-items: flex-start;

        padding: 32px 24px;

        margin-top: 22px;
    }

    .epk-signature-bottom-text h3 {
        font-size: 24px;
    }

    .epk-signature-cta {
        width: 100%;

        justify-content: center;
    }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 420px) {

    .epk-signature-events {
        padding-left: 11px;
        padding-right: 11px;
    }

    .epk-signature-heading h2 {
        font-size: 28px;
    }

    .epk-signature-card {
        min-height: 400px;
    }

    .epk-signature-content {
        padding: 26px 21px;
    }

    .epk-signature-content h3 {
        font-size: 24px;
    }

    .epk-signature-number {
        width: 44px;
        height: 44px;

        top: 14px;
        right: 14px;
    }

}

/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM GOOGLE REVIEWS SECTION
========================================================= */

.epk-google-reviews {
    position: relative;
    width: 100%;
    padding: 110px 20px 90px;
    overflow: hidden;
    background: #071a33;
}


/* =========================================================
   BACKGROUND IMAGES
========================================================= */

.epk-review-bg {
    position: absolute;
    top: 0;
    width: 34%;
    height: 100%;
    z-index: 0;
    opacity: .30;
    pointer-events: none;
}

.epk-review-bg-left {
    left: 0;
}

.epk-review-bg-right {
    right: 0;
}

.epk-review-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}


/* Image Fade */

.epk-review-bg-left::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            90deg,
            rgba(7,26,51,.15),
            #071a33
        );
}

.epk-review-bg-right::after {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            270deg,
            rgba(7,26,51,.15),
            #071a33
        );
}


/* Main overlay */

.epk-review-bg-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(207,92,120,.16),
            transparent 35%
        );
}


/* =========================================================
   CONTAINER
========================================================= */

.epk-review-container {
    position: relative;
    z-index: 3;
    max-width: 1240px;
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.epk-review-heading {
    max-width: 760px;
    margin: 0 auto 50px;
    text-align: center;
}

.epk-review-label {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: #e28ba2;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.epk-review-label::before,
.epk-review-label::after {
    content: "";
    width: 25px;
    height: 1px;
    background: #015fc9;
}

.epk-review-heading h2 {
    margin: 0 0 18px;
    color: #ffffff;
    font-size: clamp(38px, 5vw, 58px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.epk-review-heading h2 span {
    color: #c9ddf3;
}

.epk-review-heading p {
    max-width: 690px;
    margin: 0 auto;
    color: rgba(255,255,255,.70);
    font-size: 15px;
    line-height: 1.8;
}


/* =========================================================
   GOOGLE RATING BAR
========================================================= */

.epk-google-rating {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 35px;
    margin-bottom: 35px;
    padding: 22px 25px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 20px;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    box-shadow: 0 20px 50px rgba(0,0,0,.16);
}


/* Left */

.epk-google-rating-left {
    display: flex;
    align-items: center;
    gap: 35px;
}

.epk-google-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.epk-google-g {
    width: 43px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    color: #4285f4;
    font-size: 22px;
    font-weight: 900;
    box-shadow: 0 6px 20px rgba(0,0,0,.15);
}

.epk-google-brand strong {
    display: block;
    color: #ffffff;
    font-size: 14px;
    font-weight: 800;
}

.epk-google-brand small {
    display: block;
    margin-top: 3px;
    color: rgba(255,255,255,.55);
    font-size: 11px;
}


/* Rating */

.epk-rating-details {
    display: flex;
    align-items: center;
    gap: 11px;
}

.epk-big-rating {
    color: #ffffff;
    font-size: 27px;
    font-weight: 800;
}

.epk-rating-stars {
    color: #f5b642;
    font-size: 17px;
    letter-spacing: 2px;
}

.epk-rating-caption {
    color: rgba(255,255,255,.55);
    font-size: 12px;
}


/* Right */

.epk-google-rating-right {
    display: flex;
    align-items: center;
    gap: 22px;
}

.epk-google-rating-right p {
    max-width: 290px;
    margin: 0;
    color: rgba(255,255,255,.60);
    font-size: 12px;
    line-height: 1.6;
}

.epk-google-review-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    padding: 13px 19px;
    border-radius: 50px;
    background: #015fc9;
    color: #ffffff !important;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 800;
    transition: all .3s ease;
}

.epk-google-review-btn:hover {
    background: #ffffff;
    color: #071a33 !important;
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(0,0,0,.18);
}

.epk-btn-arrow {
    font-size: 16px;
}


/* =========================================================
   SLIDER
========================================================= */

.epk-reviews-slider {
    position: relative;
}

.epk-reviews-viewport {
    width: 100%;
    overflow: hidden;
}

.epk-reviews-track {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    padding: 8px 4px 20px;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

.epk-reviews-track::-webkit-scrollbar {
    display: none;
}


/* =========================================================
   REVIEW CARD
========================================================= */

.epk-review-card {
    position: relative;
    flex: 0 0 calc((100% - 40px) / 3);
    min-height: 335px;
    display: flex;
    flex-direction: column;
    padding: 28px;
    border: 1px solid rgba(7,26,51,.08);
    border-radius: 22px;
    background: #ffffff;
    scroll-snap-align: start;
    overflow: hidden;
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
    transition: all .35s ease;
}

.epk-review-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #015fc9;
}

.epk-review-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 25px 55px rgba(0,0,0,.25);
}


/* Card Top */

.epk-review-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.epk-review-stars {
    color: #f5b642;
    font-size: 16px;
    letter-spacing: 2px;
}

.epk-review-google {
    width: 31px;
    height: 31px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f4f7fb;
    color: #4285f4;
    font-size: 15px;
    font-weight: 900;
}


/* Quote */

.epk-review-quote {
    margin-top: 10px;
    margin-bottom: -5px;
    color: #015fc9;
    font-family: Georgia, serif;
    font-size: 55px;
    line-height: .8;
}


/* Text */

.epk-review-text {
    flex-grow: 1;
    margin: 8px 0 22px;
    color: #536070;
    font-size: 14px;
    line-height: 1.8;
}


/* Client */

.epk-review-client {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 18px;
    border-top: 1px solid #edf0f4;
}

.epk-client-avatar {
    position: relative;
    flex-shrink: 0;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #071a33;
    color: #ffffff;
    font-size: 15px;
    font-weight: 800;
}

.epk-client-avatar span {
    position: absolute;
    right: -4px;
    bottom: -2px;
    width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: #ffffff;
    color: #4285f4;
    font-size: 9px;
    font-weight: 900;
}

.epk-client-info {
    min-width: 0;
    flex: 1;
}

.epk-client-info strong {
    display: block;
    overflow: hidden;
    color: #071a33;
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.epk-client-info small {
    display: block;
    margin-top: 4px;
    overflow: hidden;
    color: #89919c;
    font-size: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.epk-verified {
    width: 19px;
    height: 19px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #015fc9;
    color: #ffffff;
    font-size: 10px;
}


/* =========================================================
   SLIDER ARROWS
========================================================= */

.epk-slider-arrow {
    position: absolute;
    top: 50%;
    z-index: 10;
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid rgba(255,255,255,.20);
    border-radius: 50%;
    background: #071a33;
    color: #ffffff;
    font-size: 34px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
    transform: translateY(-50%);
    transition: all .3s ease;
}

.epk-slider-arrow:hover {
    border-color: #015fc9;
    background: #015fc9;
    transform: translateY(-50%) scale(1.08);
}

.epk-slider-prev {
    left: -25px;
}

.epk-slider-next {
    right: -25px;
}


/* =========================================================
   DOTS
========================================================= */

.epk-review-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 15px;
}

.epk-review-dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.30);
    cursor: pointer;
    transition: all .3s ease;
}

.epk-review-dot-active {
    width: 28px;
    border-radius: 20px;
    background: #015fc9;
}


/* =========================================================
   CTA
========================================================= */

.epk-review-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 48px;
    padding: 24px 27px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 18px;
    background: rgba(255,255,255,.06);
    backdrop-filter: blur(12px);
}

.epk-review-cta-text span {
    display: block;
    margin-bottom: 5px;
    color: #015fc9;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 2px;
}

.epk-review-cta-text h3 {
    margin: 0;
    color: #ffffff;
    font-size: 20px;
    font-weight: 800;
}

.epk-review-cta-actions {
    display: flex;
    gap: 10px;
}

.epk-review-call,
.epk-review-quote-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 19px;
    border-radius: 50px;
    text-decoration: none !important;
    font-size: 12px;
    font-weight: 800;
    transition: all .3s ease;
}

.epk-review-call {
    border: 1px solid rgba(255,255,255,.20);
    color: #ffffff !important;
    background: transparent;
}

.epk-review-call:hover {
    background: #ffffff;
    color: #071a33 !important;
}

.epk-review-quote-btn {
    background: #015fc9;
    color: #ffffff !important;
}

.epk-review-quote-btn:hover {
    background: #ffffff;
    color: #071a33 !important;
}

.epk-review-quote-btn span {
    font-size: 16px;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-review-card {
        flex: 0 0 calc((100% - 20px) / 2);
    }

    .epk-slider-prev {
        left: -12px;
    }

    .epk-slider-next {
        right: -12px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epk-google-reviews {
        padding: 75px 14px 65px;
    }

    .epk-review-bg {
        width: 100%;
        height: 35%;
        opacity: .18;
    }

    .epk-review-bg-left {
        top: 0;
        left: 0;
    }

    .epk-review-bg-right {
        top: auto;
        right: 0;
        bottom: 0;
    }

    .epk-review-heading {
        margin-bottom: 35px;
    }

    .epk-review-heading h2 {
        font-size: 34px;
    }

    .epk-review-heading p {
        font-size: 13px;
    }


    /* Rating */

    .epk-google-rating {
        flex-direction: column;
        align-items: stretch;
        gap: 20px;
        padding: 20px;
    }

    .epk-google-rating-left {
        justify-content: space-between;
        gap: 15px;
    }

    .epk-google-rating-right {
        flex-direction: column;
        align-items: stretch;
        gap: 13px;
    }

    .epk-google-rating-right p {
        max-width: none;
    }

    .epk-google-review-btn {
        width: 100%;
    }


    /* Cards */

    .epk-review-card {
        flex: 0 0 88%;
        min-height: 320px;
        padding: 24px;
    }


    /* Arrows */

    .epk-slider-arrow {
        display: none;
    }


    /* CTA */

    .epk-review-cta {
        flex-direction: column;
        align-items: flex-start;
    }

    .epk-review-cta-actions {
        width: 100%;
    }

    .epk-review-call,
    .epk-review-quote-btn {
        flex: 1;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 430px) {

    .epk-google-reviews {
        padding: 60px 11px;
    }

    .epk-review-heading h2 {
        font-size: 29px;
    }

    .epk-google-rating-left {
        flex-direction: column;
        align-items: flex-start;
    }

    .epk-rating-details {
        width: 100%;
    }

    .epk-review-card {
        flex: 0 0 92%;
    }

    .epk-review-cta {
        padding: 21px;
    }

    .epk-review-cta-actions {
        flex-direction: column;
    }

}

/* =========================================
   EVENT PLANNER KARACHI
   MODERN BACKGROUND SECTION
========================================= */

.pe-aos-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;

  background-image:
    linear-gradient(
      90deg,
      rgba(3, 20, 45, 0.92) 0%,
      rgba(5, 28, 60, 0.82) 45%,
      rgba(5, 28, 60, 0.68) 100%
    ),
    url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2200&q=90");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  padding: 100px 0;
}


/* =========================================
   EXTRA LIGHT EFFECT
========================================= */

.pe-aos-section::before {
  content: "";
  position: absolute;
  inset: 0;

  background:
    radial-gradient(
      circle at 85% 25%,
      rgba(43, 160, 255, 0.18),
      transparent 35%
    ),
    radial-gradient(
      circle at 10% 80%,
      rgba(255, 255, 255, 0.08),
      transparent 30%
    );

  z-index: -1;
  pointer-events: none;
}


/* =========================================
   CONTENT
========================================= */

.pe-aos-container {
  position: relative;
  z-index: 3;
}


/* =========================================
   EYEBROW
========================================= */

.pe-aos-eyebrow {
  display: inline-block;

  color: #69baff !important;

  font-size: 14px;
  font-weight: 800;
  letter-spacing: 2px;
  text-transform: uppercase;

  margin-bottom: 15px;

  text-shadow: 0 2px 10px rgba(0,0,0,0.35);
}


/* =========================================
   HEADING
========================================= */

.pe-aos-title {
  color: #ffffff !important;

  font-size: clamp(36px, 4vw, 58px);
  line-height: 1.12;
  font-weight: 800;

  margin-bottom: 24px;

  text-shadow:
    0 3px 18px rgba(0,0,0,0.45);
}


/* =========================================
   DESCRIPTION
========================================= */

.pe-aos-description {
  color: rgba(255,255,255,0.94) !important;

  font-size: 17px;
  line-height: 1.85;

  max-width: 720px;

  margin-bottom: 32px;

  text-shadow:
    0 2px 8px rgba(0,0,0,0.4);
}


/* =========================================
   SERVICES
========================================= */

.pe-aos-services {
  display: flex;
  gap: 55px;

  margin-bottom: 38px;
}


.pe-aos-service-column {
  list-style: none;
  padding: 0;
  margin: 0;
}


.pe-aos-service-column li {
  display: flex;
  align-items: center;
  gap: 12px;

  color: #ffffff !important;

  font-size: 16px;
  font-weight: 600;

  margin-bottom: 15px;

  text-shadow:
    0 2px 7px rgba(0,0,0,0.45);
}


/* =========================================
   CHECK ICON
========================================= */

.pe-aos-check {
  display: inline-flex;

  align-items: center;
  justify-content: center;

  width: 25px;
  height: 25px;

  flex: 0 0 25px;

  border-radius: 50%;

  background: #168cff;
  color: #ffffff !important;

  font-size: 14px;
  font-weight: 900;

  box-shadow:
    0 5px 15px rgba(0, 130, 255, 0.35);
}


/* =========================================
   TESTIMONIAL
========================================= */

.pe-aos-testimonial {
  display: flex;
  gap: 18px;

  max-width: 700px;

  padding: 22px 25px;

  border-radius: 15px;

  background: rgba(3, 22, 48, 0.55);

  border: 1px solid rgba(255,255,255,0.16);

  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);

  box-shadow:
    0 15px 45px rgba(0,0,0,0.2);
}


.pe-aos-testimonial-line {
  width: 4px;
  min-width: 4px;

  border-radius: 10px;

  background: #2196f3;
}


.pe-aos-testimonial-body p {
  color: rgba(255,255,255,0.92) !important;

  font-size: 15px;
  line-height: 1.75;

  margin: 0 0 10px;
}


.pe-aos-testimonial-body strong {
  color: #ffffff !important;

  font-size: 15px;
}


/* =========================================
   VISUAL IMAGE IMPROVEMENT
========================================= */

.pe-aos-image {
  overflow: hidden;

  border-radius: 20px;

  border: 4px solid rgba(255,255,255,0.9);

  box-shadow:
    0 20px 55px rgba(0,0,0,0.38);
}


.pe-aos-image img {
  width: 100%;
  height: 100%;

  object-fit: cover;

  display: block;

  transition: transform 0.6s ease;
}


.pe-aos-image:hover img {
  transform: scale(1.06);
}


/* =========================================
   CENTER ICON
========================================= */

.pe-aos-icon {
  background: #ffffff !important;

  color: #086bc1 !important;

  box-shadow:
    0 12px 35px rgba(0,0,0,0.3);
}


/* =========================================
   DOT
========================================= */

.pe-aos-dot {
  background: #38a9ff !important;

  box-shadow:
    0 0 0 8px rgba(56,169,255,0.15),
    0 0 30px rgba(56,169,255,0.5);
}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 767px) {

  .pe-aos-section {
    padding: 70px 0;

    background-image:
      linear-gradient(
        rgba(3, 22, 48, 0.90),
        rgba(3, 22, 48, 0.90)
      ),
      url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=1400&q=85");

    background-position: center;
  }


  .pe-aos-title {
    font-size: 34px !important;
    line-height: 1.2;
  }


  .pe-aos-description {
    font-size: 16px;
    line-height: 1.75;
  }


  .pe-aos-services {
    flex-direction: column;
    gap: 0;
  }


  .pe-aos-testimonial {
    padding: 18px;
  }


  .pe-aos-testimonial-body p {
    font-size: 14px;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 480px) {

  .pe-aos-section {
    padding: 55px 0;
  }


  .pe-aos-title {
    font-size: 30px !important;
  }


  .pe-aos-eyebrow {
    font-size: 12px;
    letter-spacing: 1.5px;
  }


  .pe-aos-service-column li {
    font-size: 15px;
  }

}


/* =========================================
   EVENT PLANNER KARACHI
   MODERN COMPACT SECTION
========================================= */

.pe-aos-section {
  position: relative;
  overflow: hidden;
  isolation: isolate;

  padding: 65px 20px;

  background:
    linear-gradient(
      90deg,
      rgba(3, 24, 52, 0.94) 0%,
      rgba(4, 31, 65, 0.86) 50%,
      rgba(4, 31, 65, 0.70) 100%
    ),
    url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85");

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}


/* BLUE LIGHT EFFECT */

.pe-aos-section::before {
  content: "";

  position: absolute;

  width: 450px;
  height: 450px;

  right: -180px;
  top: -180px;

  border-radius: 50%;

  background: rgba(20, 137, 236, 0.13);

  filter: blur(30px);

  z-index: -1;

  pointer-events: none;
}


/* CONTAINER */

.pe-aos-container {
  position: relative;
  z-index: 2;

  max-width: 1180px;

  margin: 0 auto;

  display: grid;

  grid-template-columns: 1.1fr 0.9fr;

  align-items: center;

  gap: 55px;
}


/* =========================================
   LEFT CONTENT
========================================= */

.pe-aos-content {
  max-width: 680px;
}


/* EYEBROW */

.pe-aos-eyebrow {
  display: inline-block;

  padding: 7px 14px;

  margin-bottom: 15px;

  border-radius: 50px;

  background: rgba(42, 157, 255, 0.15);

  border: 1px solid rgba(92, 186, 255, 0.35);

  color: #70c4ff !important;

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 1.6px;

  text-transform: uppercase;
}


/* TITLE */

.pe-aos-title {
  margin: 0 0 17px;

  color: #ffffff !important;

  font-size: clamp(32px, 4vw, 49px);

  line-height: 1.12;

  font-weight: 800;

  letter-spacing: -0.7px;

  text-shadow: 0 3px 18px rgba(0,0,0,0.35);
}


/* DESCRIPTION */

.pe-aos-description {
  max-width: 650px;

  margin: 0 0 22px;

  color: rgba(255,255,255,0.90) !important;

  font-size: 15px;

  line-height: 1.75;
}


/* =========================================
   SERVICES
========================================= */

.pe-aos-services {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 8px 35px;

  margin-bottom: 23px;
}


.pe-aos-service-column {
  list-style: none;

  margin: 0;
  padding: 0;
}


.pe-aos-service-column li {
  display: flex;

  align-items: center;

  gap: 9px;

  margin-bottom: 9px;

  color: #ffffff !important;

  font-size: 14px;

  font-weight: 600;
}


/* CHECK */

.pe-aos-check {
  width: 21px;
  height: 21px;

  flex: 0 0 21px;

  display: inline-flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #1595ee;

  color: #ffffff !important;

  font-size: 12px;

  font-weight: 900;

  box-shadow: 0 4px 12px rgba(21,149,238,0.35);
}


/* =========================================
   TESTIMONIAL
========================================= */

.pe-aos-testimonial {
  display: flex;

  gap: 13px;

  max-width: 610px;

  padding: 15px 17px;

  border-radius: 12px;

  background: rgba(0,15,35,0.45);

  border: 1px solid rgba(255,255,255,0.13);

  backdrop-filter: blur(7px);

  -webkit-backdrop-filter: blur(7px);
}


.pe-aos-testimonial-line {
  width: 3px;

  flex: 0 0 3px;

  border-radius: 10px;

  background: #2aa8ff;
}


.pe-aos-testimonial-body p {
  margin: 0 0 5px;

  color: rgba(255,255,255,0.88) !important;

  font-size: 13px;

  line-height: 1.6;
}


.pe-aos-testimonial-body strong {
  color: #ffffff !important;

  font-size: 13px;
}


/* =========================================
   RIGHT VISUAL
========================================= */

.pe-aos-visual {
  position: relative;

  min-height: 380px;

  width: 100%;
}


/* IMAGES */

.pe-aos-image {
  position: absolute;

  overflow: hidden;

  border-radius: 18px;

  border: 4px solid rgba(255,255,255,0.92);

  box-shadow:
    0 18px 45px rgba(0,0,0,0.38);
}


.pe-aos-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: cover;

  transition: transform 0.6s ease;
}


.pe-aos-image:hover img {
  transform: scale(1.07);
}


/* IMAGE ONE */

.pe-aos-image-one {
  width: 285px;
  height: 330px;

  left: 8px;
  top: 15px;

  transform: rotate(-3deg);

  z-index: 1;
}


/* IMAGE TWO */

.pe-aos-image-two {
  width: 245px;
  height: 275px;

  right: 5px;
  bottom: 8px;

  transform: rotate(4deg);

  z-index: 2;
}


/* =========================================
   CENTER ICON
========================================= */

.pe-aos-icon {
  position: absolute;

  left: 48%;
  top: 46%;

  transform: translate(-50%, -50%);

  width: 75px;
  height: 75px;

  display: flex;

  align-items: center;
  justify-content: center;

  border-radius: 50%;

  background: #ffffff;

  color: #0877d1;

  border: 5px solid rgba(255,255,255,0.5);

  box-shadow:
    0 12px 30px rgba(0,0,0,0.35);

  z-index: 5;
}


.pe-aos-icon svg {
  width: 42px;
  height: 42px;
}


/* =========================================
   DECORATIVE DOT
========================================= */

.pe-aos-dot {
  position: absolute;

  width: 11px;
  height: 11px;

  right: 12px;
  top: 25px;

  border-radius: 50%;

  background: #3eb5ff;

  box-shadow:
    0 0 0 7px rgba(62,181,255,0.14),
    0 0 20px rgba(62,181,255,0.5);

  z-index: 6;
}


/* =========================================
   TABLET
========================================= */

@media (max-width: 991px) {

  .pe-aos-section {
    padding: 55px 20px;
  }

  .pe-aos-container {
    grid-template-columns: 1fr;

    gap: 35px;
  }

  .pe-aos-content {
    max-width: 760px;

    margin: 0 auto;
  }

  .pe-aos-visual {
    width: 100%;

    max-width: 600px;

    min-height: 350px;

    margin: 0 auto;
  }

}


/* =========================================
   MOBILE
========================================= */

@media (max-width: 600px) {

  .pe-aos-section {
    padding: 45px 16px;

    background-position: center;
  }


  .pe-aos-container {
    gap: 28px;
  }


  .pe-aos-eyebrow {
    font-size: 10px;

    letter-spacing: 1.2px;

    padding: 6px 11px;
  }


  .pe-aos-title {
    font-size: 31px !important;

    line-height: 1.18;

    letter-spacing: -0.4px;
  }


  .pe-aos-desktop-break {
    display: none;
  }


  .pe-aos-description {
    font-size: 14px;

    line-height: 1.7;
  }


  .pe-aos-services {
    grid-template-columns: 1fr;

    gap: 0;

    margin-bottom: 18px;
  }


  .pe-aos-service-column li {
    margin-bottom: 8px;

    font-size: 14px;
  }


  .pe-aos-testimonial {
    padding: 13px;

    gap: 10px;
  }


  .pe-aos-testimonial-body p {
    font-size: 12px;

    line-height: 1.55;
  }


  .pe-aos-visual {
    min-height: 290px;

    max-width: 440px;
  }


  .pe-aos-image-one {
    width: 62%;

    height: 245px;

    left: 3%;

    top: 8px;
  }


  .pe-aos-image-two {
    width: 55%;

    height: 210px;

    right: 2%;

    bottom: 0;
  }


  .pe-aos-icon {
    width: 62px;
    height: 62px;

    border-width: 4px;
  }


  .pe-aos-icon svg {
    width: 34px;
    height: 34px;
  }

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width: 380px) {

  .pe-aos-section {
    padding: 40px 14px;
  }


  .pe-aos-title {
    font-size: 28px !important;
  }


  .pe-aos-visual {
    min-height: 260px;
  }


  .pe-aos-image-one {
    height: 215px;
  }


  .pe-aos-image-two {
    height: 185px;
  }

}




/* =========================================================
   EVENT PLANNER KARACHI
   MODERN PORTFOLIO / GALLERY
========================================================= */

/* =========================================================
   EVENT PLANNER KARACHI
   MODERN PORTFOLIO SECTION
========================================================= */

.epk-portfolio-section {
    position: relative;
    width: 100%;
    padding: 85px 20px;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(244, 91, 139, 0.16),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 80%,
            rgba(13, 110, 253, 0.14),
            transparent 30%
        ),
        #071f39;

    overflow: hidden;
}


/* DECORATIVE LIGHT */

.epk-portfolio-section::before {
    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    top: -280px;
    right: -180px;

    border-radius: 50%;

    background: rgba(244, 91, 139, 0.10);

    pointer-events: none;
}


.epk-portfolio-section::after {
    content: "";

    position: absolute;

    width: 350px;
    height: 350px;

    bottom: -220px;
    left: -180px;

    border-radius: 50%;

    background: rgba(13, 110, 253, 0.12);

    pointer-events: none;
}


/* CONTAINER */

.epk-portfolio-container {
    position: relative;

    z-index: 2;

    width: 100%;
    max-width: 1180px;

    margin: auto;
}


/* =========================================================
   HEADER
========================================================= */

.epk-portfolio-header {
    display: grid;

    grid-template-columns: 1.45fr 0.8fr;

    gap: 70px;

    align-items: center;

    margin-bottom: 35px;
}


/* LEFT */

.epk-portfolio-intro {
    max-width: 650px;
}


.epk-portfolio-eyebrow {
    position: relative;

    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 14px;

    color: #c9ddf3;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2.2px;
}


.epk-portfolio-eyebrow::before {
    content: "";

    width: 25px;
    height: 2px;

    border-radius: 10px;

    background: #c9ddf3;
}


.epk-portfolio-title {
    margin: 0 0 15px;

    color: #ffffff;

    font-size: clamp(38px, 5vw, 62px);

    line-height: 1.02;

    font-weight: 800;

    letter-spacing: -2px;
}


.epk-portfolio-title span {
    display: block;

    color: #c9ddf3;
}


.epk-portfolio-description {
    max-width: 610px;

    margin: 0;

    color: rgba(255,255,255,0.70);

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   FEATURES
========================================================= */

.epk-portfolio-features {
    display: flex;

    flex-direction: column;

    gap: 15px;
}


.epk-portfolio-feature {
    display: flex;

    align-items: flex-start;

    gap: 12px;
}


.epk-feature-icon {
    width: 31px;
    height: 31px;

    flex: 0 0 31px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: rgba(255,255,255,0.08);

    color: #c9ddf3;

    font-size: 12px;

    border: 1px solid rgba(255,255,255,0.09);
}


.epk-portfolio-feature h4 {
    margin: 0 0 3px;

    color: #ffffff;

    font-size: 12px;

    font-weight: 800;
}


.epk-portfolio-feature p {
    margin: 0;

    color: rgba(255,255,255,0.55);

    font-size: 10px;

    line-height: 1.5;
}


/* =========================================================
   GALLERY
========================================================= */

.epk-portfolio-gallery {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    grid-auto-rows: 175px;

    gap: 4px;

    overflow: hidden;

    border-radius: 3px;

    background: #c9ddf3;
}


/* ITEM */

.epk-portfolio-item {
    position: relative;

    overflow: hidden;

    min-width: 0;

    background: #0b2b4a;

    cursor: pointer;
}


.epk-portfolio-item img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform .65s cubic-bezier(.2,.7,.2,1),
        filter .4s ease;
}


.epk-portfolio-item:hover img {
    transform: scale(1.09);

    filter: brightness(.72);
}


/* FEATURED */

.epk-portfolio-large {
    grid-column: span 2;

    grid-row: span 2;
}


.epk-portfolio-tall {
    grid-row: span 2;
}


/* =========================================================
   OVERLAY
========================================================= */

.epk-portfolio-overlay {
    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;

    padding: 22px 18px 17px;

    background:
        linear-gradient(
            transparent,
            rgba(5,24,45,0.94)
        );

    transform: translateY(5px);

    transition: .35s ease;
}


.epk-portfolio-item:hover
.epk-portfolio-overlay {
    transform: translateY(0);
}


.epk-portfolio-overlay span {
    display: block;

    margin-bottom: 4px;

    color: #c9ddf3;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.4px;
}


.epk-portfolio-overlay h3 {
    margin: 0;

    color: #ffffff;

    font-size: 14px;

    line-height: 1.25;

    font-weight: 800;
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.epk-portfolio-bottom {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    margin-top: 25px;

    padding: 22px 25px;

    border: 1px solid rgba(255,255,255,0.08);

    border-radius: 13px;

    background: rgba(255,255,255,0.055);

    backdrop-filter: blur(8px);
}


.epk-bottom-label {
    display: block;

    margin-bottom: 5px;

    color: #72bfff;

    font-size: 8px;

    font-weight: 800;

    letter-spacing: 1.6px;
}


.epk-portfolio-bottom h3 {
    margin: 0;

    color: #ffffff;

    font-size: 20px;

    font-weight: 700;
}


.epk-portfolio-bottom h3 strong {
    color: #c9ddf3;
}


/* BUTTON */

.epk-portfolio-btn {
    display: inline-flex;

    align-items: center;

    gap: 11px;

    flex-shrink: 0;

    padding: 11px 19px;

    border-radius: 50px;

    background: #c9ddf3;

    color: #ffffff !important;

    text-decoration: none;

    font-size: 11px;

    font-weight: 800;

    box-shadow:
        0 8px 20px rgba(244,91,139,0.22);

    transition: all .3s ease;
}


.epk-portfolio-btn span {
    font-size: 16px;

    transition: transform .3s ease;
}


.epk-portfolio-btn:hover {
    background: #0d6efd;

    color: #ffffff !important;

    transform: translateY(-2px);
}


.epk-portfolio-btn:hover span {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .epk-portfolio-section {
        padding: 70px 20px;
    }


    .epk-portfolio-header {
        grid-template-columns: 1fr;

        gap: 30px;
    }


    .epk-portfolio-features {
        display: grid;

        grid-template-columns:
            repeat(3, 1fr);

        gap: 18px;
    }


    .epk-portfolio-gallery {
        grid-template-columns:
            repeat(3, 1fr);

        grid-auto-rows: 175px;
    }


    .epk-portfolio-large {
        grid-column: span 2;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 650px) {

    .epk-portfolio-section {
        padding: 55px 13px;
    }


    .epk-portfolio-header {
        gap: 25px;

        margin-bottom: 25px;
    }


    .epk-portfolio-title {
        font-size: 38px;

        letter-spacing: -1.3px;
    }


    .epk-portfolio-description {
        font-size: 13px;

        line-height: 1.7;
    }


    .epk-portfolio-features {
        display: flex;

        flex-direction: column;

        gap: 13px;
    }


    .epk-portfolio-feature {
        padding-bottom: 13px;

        border-bottom:
            1px solid rgba(255,255,255,0.07);
    }


    .epk-portfolio-gallery {
        grid-template-columns:
            repeat(2, 1fr);

        grid-auto-rows: 155px;

        gap: 3px;
    }


    .epk-portfolio-large {
        grid-column: span 2;

        grid-row: span 2;
    }


    .epk-portfolio-tall {
        grid-row: span 1;
    }


    .epk-portfolio-overlay {
        padding: 18px 12px 12px;
    }


    .epk-portfolio-overlay h3 {
        font-size: 12px;
    }


    .epk-portfolio-overlay span {
        font-size: 7px;
    }


    .epk-portfolio-bottom {
        align-items: flex-start;

        flex-direction: column;

        padding: 18px;

        margin-top: 18px;
    }


    .epk-portfolio-bottom h3 {
        font-size: 18px;
    }


    .epk-portfolio-btn {
        width: 100%;

        justify-content: center;

        padding: 12px;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-portfolio-title {
        font-size: 33px;
    }


    .epk-portfolio-gallery {
        grid-auto-rows: 135px;
    }


    .epk-portfolio-large {
        grid-row: span 2;
    }

}

/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM DARK EVENT SECTION
   Blue + White + Dark Blue Theme
========================================================= */

.epk-industry-section {
    position: relative;
    overflow: hidden;
    padding: 105px 20px;
    background:
        linear-gradient(
            135deg,
            rgba(4, 18, 48, 0.97),
            rgba(7, 35, 82, 0.96)
        ),
        url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85")
        center center / cover no-repeat;
    isolation: isolate;
}

/* Dark overlay for readability */
.epk-industry-section::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(37, 99, 235, 0.30),
            transparent 32%
        ),
        radial-gradient(
            circle at 85% 75%,
            rgba(14, 165, 233, 0.18),
            transparent 30%
        ),
        rgba(3, 15, 38, 0.55);
}

/* Decorative glow */
.epk-industry-section::after {
    content: "";
    position: absolute;
    width: 500px;
    height: 500px;
    top: -280px;
    right: -180px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow:
        0 0 0 70px rgba(255,255,255,0.025),
        0 0 0 140px rgba(255,255,255,0.015);
    z-index: -1;
}

.epk-industry-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.epk-industry-heading {
    max-width: 850px;
    margin: 0 auto 58px;
    text-align: center;
}

.epk-industry-eyebrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 18px;

    color: #60a5fa;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.epk-industry-eyebrow i {
    display: block;
    width: 34px;
    height: 2px;
    border-radius: 20px;
    background: #3b82f6;
    box-shadow: 0 0 10px rgba(59,130,246,0.7);
}

.epk-industry-heading h2 {
    margin: 0;

    color: #ffffff;
    font-size: clamp(32px, 4vw, 50px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1px;

    text-shadow:
        0 4px 25px rgba(0,0,0,0.35);
}

.epk-industry-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 13px;

    max-width: 260px;
    margin: 23px auto 21px;
}

.epk-industry-divider span {
    flex: 1;
    height: 1px;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(96,165,250,0.7)
    );
}

.epk-industry-divider span:last-child {
    background: linear-gradient(
        90deg,
        rgba(96,165,250,0.7),
        transparent
    );
}

.epk-industry-divider b {
    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #ffffff;
    background: linear-gradient(
        135deg,
        #2563eb,
        #0ea5e9
    );

    font-size: 15px;

    box-shadow:
        0 8px 25px rgba(37,99,235,0.45);
}

.epk-industry-heading p {
    max-width: 760px;
    margin: 0 auto;

    color: rgba(255,255,255,0.78);

    font-size: 16px;
    line-height: 1.85;
}


/* =========================================================
   GRID
========================================================= */

.epk-industry-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}


/* =========================================================
   CARD
========================================================= */

.epk-industry-card {
    position: relative;

    min-height: 275px;

    display: flex;
    flex-direction: column;
    align-items: flex-start;

    padding: 30px 27px;

    overflow: hidden;

    text-decoration: none !important;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.98),
            rgba(246,250,255,0.96)
        );

    border: 1px solid rgba(255,255,255,0.25);

    border-radius: 22px;

    box-shadow:
        0 18px 45px rgba(0,0,0,0.22);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


/* Top animated line */

.epk-industry-card::before {
    content: "";

    position: absolute;
    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background: linear-gradient(
        90deg,
        #1d4ed8,
        #38bdf8
    );

    transform: scaleX(0);
    transform-origin: left;

    transition: transform 0.4s ease;
}


/* Background decorative circle */

.epk-industry-card::after {
    content: "";

    position: absolute;

    width: 170px;
    height: 170px;

    top: -85px;
    right: -75px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37,99,235,0.13),
            rgba(37,99,235,0.02) 65%,
            transparent 70%
        );

    transition:
        transform 0.5s ease,
        opacity 0.4s ease;
}


/* Hover */

.epk-industry-card:hover {
    transform: translateY(-10px);

    border-color: rgba(96,165,250,0.7);

    box-shadow:
        0 25px 55px rgba(0,0,0,0.30);
}

.epk-industry-card:hover::before {
    transform: scaleX(1);
}

.epk-industry-card:hover::after {
    transform: scale(1.5);
}


/* =========================================================
   ICON
========================================================= */

.epk-industry-icon {
    position: relative;
    z-index: 2;

    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-bottom: 22px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #1d4ed8,
            #2563eb,
            #0ea5e9
        );

    border-radius: 17px;

    box-shadow:
        0 12px 28px rgba(37,99,235,0.30);

    transition:
        transform 0.35s ease,
        border-radius 0.35s ease,
        box-shadow 0.35s ease;
}

.epk-industry-icon i {
    font-size: 25px;
}

.epk-industry-card:hover .epk-industry-icon {
    transform: rotate(-5deg) scale(1.08);

    border-radius: 21px;

    box-shadow:
        0 15px 32px rgba(37,99,235,0.40);
}


/* =========================================================
   CONTENT
========================================================= */

.epk-industry-content {
    position: relative;
    z-index: 3;
}

.epk-industry-content h3 {
    margin: 0 0 12px;

    color: #0b1f44;

    font-size: 20px;
    line-height: 1.3;
    font-weight: 800;

    transition: color 0.3s ease;
}

.epk-industry-card:hover .epk-industry-content h3 {
    color: #2563eb;
}

.epk-industry-content > span {
    display: block;

    width: 38px;
    height: 3px;

    margin-bottom: 14px;

    border-radius: 20px;

    background:
        linear-gradient(
            90deg,
            #2563eb,
            #38bdf8
        );

    transition: width 0.35s ease;
}

.epk-industry-card:hover .epk-industry-content > span {
    width: 70px;
}

.epk-industry-content p {
    margin: 0;

    color: #52657f;

    font-size: 14px;
    line-height: 1.75;
}


/* =========================================================
   CTA
========================================================= */

.epk-industry-action {
    display: flex;
    justify-content: center;

    margin-top: 55px;
}

.epk-industry-button {
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 15px;

    padding: 16px 25px 16px 29px;

    overflow: hidden;

    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #1d4ed8
        );

    border: 1px solid rgba(255,255,255,0.18);

    border-radius: 50px;

    text-decoration: none !important;

    font-size: 13px;
    font-weight: 800;

    letter-spacing: 0.8px;

    box-shadow:
        0 15px 35px rgba(0,0,0,0.28);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


/* Shine effect */

.epk-industry-button::before {
    content: "";

    position: absolute;

    top: 0;
    left: -120%;

    width: 90%;
    height: 100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,0.25),
            transparent
        );

    transform: skewX(-20deg);

    transition: left 0.65s ease;
}

.epk-industry-button:hover::before {
    left: 130%;
}

.epk-industry-button:hover {
    transform: translateY(-4px);

    box-shadow:
        0 20px 40px rgba(0,0,0,0.38);
}

.epk-industry-button i {
    width: 37px;
    height: 37px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: rgba(255,255,255,0.16);

    font-size: 13px;

    transition: transform 0.3s ease;
}

.epk-industry-button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-industry-section {
        padding: 90px 20px;
    }

    .epk-industry-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
    }

    .epk-industry-card {
        min-height: 260px;
    }
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 800px) {

    .epk-industry-section {
        padding: 75px 18px;
    }

    .epk-industry-heading {
        margin-bottom: 42px;
    }

    .epk-industry-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 17px;
    }

    .epk-industry-card {
        min-height: 250px;
        padding: 25px 22px;
        border-radius: 19px;
    }

    .epk-industry-icon {
        width: 58px;
        height: 58px;
        margin-bottom: 18px;
    }

    .epk-industry-icon i {
        font-size: 23px;
    }

    .epk-industry-content h3 {
        font-size: 18px;
    }

    .epk-industry-heading p {
        font-size: 15px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-industry-section {
        padding: 65px 15px;

        background-position: center;
    }

    .epk-industry-heading {
        margin-bottom: 35px;
    }

    .epk-industry-eyebrow {
        gap: 8px;

        font-size: 10px;
        letter-spacing: 1.8px;
    }

    .epk-industry-eyebrow i {
        width: 22px;
    }

    .epk-industry-heading h2 {
        font-size: 29px;
        line-height: 1.2;
    }

    .epk-industry-divider {
        margin: 19px auto;
    }

    .epk-industry-divider b {
        width: 34px;
        height: 34px;
    }

    .epk-industry-heading p {
        font-size: 14px;
        line-height: 1.75;
    }

    .epk-industry-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .epk-industry-card {
        min-height: auto;

        padding: 26px 24px;

        border-radius: 19px;
    }

    .epk-industry-icon {
        width: 60px;
        height: 60px;
    }

    .epk-industry-content h3 {
        font-size: 19px;
    }

    .epk-industry-content p {
        font-size: 14px;
        line-height: 1.75;
    }

    .epk-industry-action {
        margin-top: 38px;
    }

    .epk-industry-button {
        width: 100%;

        padding: 14px 16px 14px 20px;

        font-size: 11px;
    }

    .epk-industry-button i {
        width: 34px;
        height: 34px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-industry-section {
        padding: 55px 13px;
    }

    .epk-industry-heading h2 {
        font-size: 25px;
    }

    .epk-industry-card {
        padding: 23px 20px;
    }

    .epk-industry-button {
        gap: 9px;
        font-size: 10px;
        letter-spacing: 0.5px;
    }
}


/* =========================================================
   EVENT PLANNER KARACHI
   WHY CHOOSE US - PREMIUM MODERN SECTION
========================================================= */

.epk-why-section {
    position: relative;
    overflow: hidden;

    padding: 105px 20px;

    background:
        linear-gradient(
            135deg,
            rgba(4, 17, 43, 0.97),
            rgba(7, 38, 82, 0.94)
        ),
        url("https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=2200&q=85")
        center center / cover no-repeat;

    isolation: isolate;
}


/* =========================================================
   BACKGROUND EFFECTS
========================================================= */

.epk-why-section::before {
    content: "";

    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at 12% 15%,
            rgba(37, 99, 235, 0.28),
            transparent 30%
        ),
        radial-gradient(
            circle at 88% 80%,
            rgba(14, 165, 233, 0.18),
            transparent 30%
        ),
        rgba(3, 14, 35, 0.45);

    z-index: -1;
}


.epk-why-section::after {
    content: "";

    position: absolute;

    width: 500px;
    height: 500px;

    right: -250px;
    top: -250px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,0.08);

    box-shadow:
        0 0 0 65px rgba(255,255,255,0.025),
        0 0 0 130px rgba(255,255,255,0.015);

    z-index: -1;
}


/* =========================================================
   CONTAINER
========================================================= */

.epk-why-container {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1240px;

    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.epk-why-heading {
    max-width: 850px;

    margin: 0 auto 58px;

    text-align: center;
}


.epk-why-eyebrow {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 18px;

    color: #60a5fa;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 3px;

    text-transform: uppercase;
}


.epk-why-eyebrow i {
    display: block;

    width: 32px;
    height: 2px;

    border-radius: 20px;

    background: #3b82f6;

    box-shadow:
        0 0 12px rgba(59,130,246,0.7);
}


.epk-why-heading h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(32px, 4vw, 50px);

    line-height: 1.13;

    font-weight: 800;

    letter-spacing: -1px;

    text-shadow:
        0 5px 25px rgba(0,0,0,0.35);
}


/* =========================================================
   DIVIDER
========================================================= */

.epk-why-divider {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 13px;

    max-width: 260px;

    margin: 22px auto;
}


.epk-why-divider span {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(96,165,250,0.7)
        );
}


.epk-why-divider span:last-child {
    background:
        linear-gradient(
            90deg,
            rgba(96,165,250,0.7),
            transparent
        );
}


.epk-why-divider b {
    width: 37px;
    height: 37px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    font-size: 14px;

    box-shadow:
        0 9px 25px rgba(37,99,235,0.4);
}


.epk-why-heading > p {
    max-width: 760px;

    margin: 0 auto;

    color: rgba(255,255,255,0.78);

    font-size: 16px;

    line-height: 1.85;
}


/* =========================================================
   GRID
========================================================= */

.epk-why-grid {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 22px;
}


/* =========================================================
   CARD
========================================================= */

.epk-why-card {
    position: relative;

    min-height: 315px;

    padding: 32px 28px;

    overflow: hidden;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,0.98),
            rgba(244,248,255,0.96)
        );

    border: 1px solid rgba(255,255,255,0.25);

    border-radius: 22px;

    box-shadow:
        0 18px 45px rgba(0,0,0,0.22);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


/* Top blue line */

.epk-why-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 4px;

    background:
        linear-gradient(
            90deg,
            #1d4ed8,
            #38bdf8
        );

    transform: scaleX(0);

    transform-origin: left;

    transition: transform 0.4s ease;
}


/* Background decoration */

.epk-why-card::after {
    content: "";

    position: absolute;

    width: 180px;
    height: 180px;

    top: -90px;
    right: -90px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37,99,235,0.14),
            transparent 68%
        );

    transition:
        transform 0.5s ease;
}


.epk-why-card:hover {
    transform: translateY(-10px);

    border-color:
        rgba(96,165,250,0.6);

    box-shadow:
        0 28px 60px rgba(0,0,0,0.30);
}


.epk-why-card:hover::before {
    transform: scaleX(1);
}


.epk-why-card:hover::after {
    transform: scale(1.7);
}


/* =========================================================
   NUMBER
========================================================= */

.epk-why-number {
    position: absolute;

    top: 22px;
    right: 25px;

    color: rgba(37,99,235,0.12);

    font-size: 38px;

    line-height: 1;

    font-weight: 900;

    z-index: 1;
}


/* =========================================================
   ICON
========================================================= */

.epk-why-icon {
    position: relative;

    z-index: 3;

    width: 68px;
    height: 68px;

    display: flex;

    align-items: center;
    justify-content: center;

    margin-bottom: 23px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #0b2b4a,
            #174b87
        );

    border-radius: 18px;

    box-shadow:
        0 13px 28px rgba(11,43,74,0.25);

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        border-radius 0.35s ease;
}


.epk-why-icon i {
    font-size: 25px;
}


.epk-why-card:hover .epk-why-icon {
    transform:
        rotate(-5deg)
        scale(1.08);

    border-radius: 21px;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    box-shadow:
        0 17px 35px rgba(37,99,235,0.35);
}


/* =========================================================
   CONTENT
========================================================= */

.epk-why-content {
    position: relative;

    z-index: 3;
}


.epk-why-content h3 {
    margin: 0 0 12px;

    color: #0b2b4a;

    font-size: 21px;

    line-height: 1.3;

    font-weight: 800;

    transition:
        color 0.3s ease;
}


.epk-why-card:hover .epk-why-content h3 {
    color: #2563eb;
}


.epk-why-content p {
    margin: 0;

    color: #52657f;

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   CARD ARROW
========================================================= */

.epk-why-arrow {
    position: absolute;

    right: 25px;
    bottom: 24px;

    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #2563eb;

    background: rgba(37,99,235,0.08);

    font-size: 12px;

    opacity: 0;

    transform: translateX(-8px);

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}


.epk-why-card:hover .epk-why-arrow {
    opacity: 1;

    transform: translateX(0);
}


/* =========================================================
   TRUST BAR
========================================================= */

.epk-why-trust {
    display: flex;

    align-items: center;
    justify-content: space-between;

    margin-top: 35px;

    padding: 22px 28px;

    background:
        rgba(255,255,255,0.08);

    border:
        1px solid rgba(255,255,255,0.12);

    border-radius: 18px;

    backdrop-filter: blur(10px);

    -webkit-backdrop-filter: blur(10px);
}


.epk-why-trust-item {
    display: flex;

    align-items: center;

    gap: 14px;

    color: #ffffff;
}


.epk-why-trust-icon {
    width: 45px;
    height: 45px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #ffffff;

    background:
        rgba(37,99,235,0.75);

    border-radius: 13px;

    font-size: 16px;
}


.epk-why-trust-item strong {
    display: block;

    color: #ffffff;

    font-size: 13px;

    font-weight: 800;

    margin-bottom: 3px;
}


.epk-why-trust-item span {
    display: block;

    color: rgba(255,255,255,0.58);

    font-size: 11px;
}


.epk-why-trust-line {
    width: 1px;

    height: 40px;

    background:
        rgba(255,255,255,0.12);
}


/* =========================================================
   CTA
========================================================= */

.epk-why-cta {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;

    margin-top: 30px;

    padding: 30px 34px;

    background:
        linear-gradient(
            135deg,
            #0b2b4a,
            #174b87
        );

    border:
        1px solid rgba(96,165,250,0.25);

    border-radius: 22px;

    box-shadow:
        0 20px 45px rgba(0,0,0,0.22);
}


.epk-why-cta-content > span {
    display: block;

    margin-bottom: 7px;

    color: #60a5fa;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;
}


.epk-why-cta-content h3 {
    margin: 0 0 6px;

    color: #ffffff;

    font-size: 25px;

    font-weight: 800;
}


.epk-why-cta-content p {
    margin: 0;

    color: rgba(255,255,255,0.68);

    font-size: 14px;

    line-height: 1.6;
}


.epk-why-cta-button {
    position: relative;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 13px;

    flex-shrink: 0;

    padding: 14px 16px 14px 23px;

    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 50px;

    text-decoration: none !important;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 0.8px;

    box-shadow:
        0 12px 28px rgba(0,0,0,0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.epk-why-cta-button:hover {
    color: #ffffff !important;

    transform: translateY(-3px);

    box-shadow:
        0 17px 35px rgba(0,0,0,0.35);
}


.epk-why-cta-button i {
    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        rgba(255,255,255,0.17);

    transition:
        transform 0.3s ease;
}


.epk-why-cta-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1050px) {

    .epk-why-section {
        padding: 50px 20px;
    }

    .epk-why-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .epk-why-trust {
        gap: 20px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-why-section {
        padding: 75px 18px;
    }

    .epk-why-heading {
        margin-bottom: 42px;
    }

    .epk-why-heading h2 {
        font-size: 36px;
    }

    .epk-why-heading > p {
        font-size: 15px;
    }

    .epk-why-card {
        min-height: 290px;

        padding: 28px 23px;
    }

    .epk-why-trust {
        flex-direction: column;

        align-items: stretch;

        gap: 18px;

        padding: 22px;
    }

    .epk-why-trust-line {
        width: 100%;
        height: 1px;
    }

    .epk-why-cta {
        align-items: flex-start;

        flex-direction: column;

        padding: 28px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-why-section {
        padding: 65px 15px;

        background-position: center center;
    }

    .epk-why-heading {
        margin-bottom: 35px;
    }

    .epk-why-eyebrow {
        gap: 8px;

        font-size: 10px;

        letter-spacing: 1.8px;
    }

    .epk-why-eyebrow i {
        width: 22px;
    }

    .epk-why-heading h2 {
        font-size: 29px;

        line-height: 1.2;
    }

    .epk-why-divider {
        margin: 18px auto;
    }

    .epk-why-divider b {
        width: 34px;
        height: 34px;
    }

    .epk-why-heading > p {
        font-size: 14px;

        line-height: 1.75;
    }

    .epk-why-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }

    .epk-why-card {
        min-height: auto;

        padding: 27px 23px;

        border-radius: 19px;
    }

    .epk-why-number {
        top: 20px;
        right: 20px;

        font-size: 32px;
    }

    .epk-why-icon {
        width: 62px;
        height: 62px;

        margin-bottom: 19px;

        border-radius: 17px;
    }

    .epk-why-icon i {
        font-size: 23px;
    }

    .epk-why-content h3 {
        font-size: 19px;
    }

    .epk-why-content p {
        font-size: 14px;

        line-height: 1.75;
    }

    .epk-why-arrow {
        display: none;
    }

    .epk-why-trust {
        margin-top: 25px;

        padding: 19px;

        border-radius: 17px;
    }

    .epk-why-trust-item {
        gap: 12px;
    }

    .epk-why-trust-icon {
        width: 42px;
        height: 42px;

        border-radius: 11px;
    }

    .epk-why-cta {
        margin-top: 20px;

        padding: 25px 22px;

        border-radius: 19px;

        gap: 22px;
    }

    .epk-why-cta-content h3 {
        font-size: 22px;
    }

    .epk-why-cta-content p {
        font-size: 13px;
    }

    .epk-why-cta-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-why-section {
        padding: 55px 13px;
    }

    .epk-why-heading h2 {
        font-size: 25px;
    }

    .epk-why-card {
        padding: 24px 20px;
    }

    .epk-why-cta-content h3 {
        font-size: 20px;
    }

}


/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM FAQ SECTION
   Dark Blue + Blue + White Theme
========================================================= */

.premium-faq-section {
    position: relative;
    overflow: hidden;

    padding: 55px 20px;

    background:
        linear-gradient(
            135deg,
            rgba(4, 17, 43, 0.97),
            rgba(7, 38, 82, 0.95)
        ),
        url("https://images.unsplash.com/photo-1507504031003-b417219a0fde?auto=format&fit=crop&w=2200&q=85")
        center center / cover no-repeat;

    isolation: isolate;
}


/* =========================================================
   BACKGROUND EFFECTS
========================================================= */

.premium-faq-section::before {
    content: "";

    position: absolute;
    inset: 0;

    background:
        radial-gradient(
            circle at 10% 15%,
            rgba(37, 99, 235, 0.30),
            transparent 30%
        ),
        radial-gradient(
            circle at 90% 80%,
            rgba(14, 165, 233, 0.20),
            transparent 30%
        ),
        rgba(2, 13, 34, 0.50);

    z-index: -1;
}


.premium-faq-section::after {
    content: "";

    position: absolute;

    width: 480px;
    height: 480px;

    right: -240px;
    bottom: -250px;

    border-radius: 50%;

    border: 1px solid rgba(255,255,255,0.08);

    box-shadow:
        0 0 0 60px rgba(255,255,255,0.025),
        0 0 0 120px rgba(255,255,255,0.015);

    pointer-events: none;

    z-index: -1;
}


/* =========================================================
   CONTAINER
========================================================= */

.faq-container {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1050px;

    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.faq-heading {
    max-width: 800px;

    margin: 0 auto 55px;

    text-align: center;
}


.faq-badge {
    position: relative;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 11px;

    margin-bottom: 18px;

    color: #60a5fa;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 2.5px;

    text-transform: uppercase;
}


.faq-badge::before,
.faq-badge::after {
    content: "";

    width: 28px;
    height: 2px;

    border-radius: 20px;

    background: #3b82f6;

    box-shadow:
        0 0 10px rgba(59,130,246,0.6);
}


.faq-heading h2 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(34px, 4.5vw, 52px);

    line-height: 1.12;

    font-weight: 800;

    letter-spacing: -1px;

    text-shadow:
        0 5px 25px rgba(0,0,0,0.35);
}


.faq-heading h2 span {
    color: #60a5fa;
}


.faq-heading p {
    max-width: 720px;

    margin: 20px auto 0;

    color: rgba(255,255,255,0.76);

    font-size: 16px;

    line-height: 1.85;
}


/* =========================================================
   FAQ LIST
========================================================= */

.faq-list {
    display: flex;

    flex-direction: column;

    gap: 13px;
}


/* =========================================================
   FAQ ITEM
========================================================= */

.faq-item {
    position: relative;

    overflow: hidden;

    background:
        rgba(255,255,255,0.96);

    border: 1px solid rgba(255,255,255,0.20);

    border-radius: 17px;

    box-shadow:
        0 12px 35px rgba(0,0,0,0.17);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease;
}


.faq-item:hover {
    transform: translateY(-2px);

    border-color:
        rgba(96,165,250,0.55);

    box-shadow:
        0 17px 40px rgba(0,0,0,0.22);
}


/* =========================================================
   QUESTION BUTTON
========================================================= */

.faq-question {
    position: relative;

    width: 100%;

    display: grid;

    grid-template-columns: 52px 1fr 44px;

    align-items: center;

    gap: 16px;

    padding: 20px 22px;

    border: 0;

    outline: none;

    cursor: pointer;

    text-align: left;

    color: #0b2b4a;

    background: transparent;

    font-family: inherit;
}


/* Number */

.faq-number {
    width: 42px;
    height: 42px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #2563eb;

    background:
        rgba(37,99,235,0.08);

    border:
        1px solid rgba(37,99,235,0.12);

    border-radius: 12px;

    font-size: 12px;

    font-weight: 800;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        transform 0.3s ease;
}


/* Question */

.faq-text {
    color: #0b2b4a;

    font-size: 15px;

    line-height: 1.55;

    font-weight: 750;

    transition:
        color 0.3s ease;
}


/* Plus icon */

.faq-icon {
    width: 38px;
    height: 38px;

    display: flex;

    align-items: center;
    justify-content: center;

    justify-self: end;

    color: #2563eb;

    background:
        rgba(37,99,235,0.08);

    border-radius: 50%;

    font-size: 23px;

    font-weight: 400;

    line-height: 1;

    transition:
        transform 0.35s ease,
        background 0.3s ease,
        color 0.3s ease;
}


/* =========================================================
   ANSWER
========================================================= */

.faq-answer {
    display: grid;

    grid-template-rows: 0fr;

    opacity: 0;

    transition:
        grid-template-rows 0.4s ease,
        opacity 0.3s ease;
}


.faq-answer p {
    min-height: 0;

    overflow: hidden;

    margin: 0;

    padding: 0 22px 0 90px;

    color: #5a6b82;

    font-size: 14px;

    line-height: 1.85;

    transition:
        padding 0.4s ease;
}


/* =========================================================
   ACTIVE FAQ
========================================================= */

.faq-item.active {
    border-color:
        rgba(37,99,235,0.28);

    box-shadow:
        0 18px 45px rgba(11,43,74,0.18);
}


.faq-item.active .faq-number {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-color: transparent;

    transform: scale(1.04);
}


.faq-item.active .faq-text {
    color: #2563eb;
}


.faq-item.active .faq-icon {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    transform: rotate(45deg);
}


.faq-item.active .faq-answer {
    grid-template-rows: 1fr;

    opacity: 1;
}


.faq-item.active .faq-answer p {
    padding-top: 0;

    padding-bottom: 23px;
}


/* =========================================================
   CTA
========================================================= */

.faq-cta {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 30px;

    margin-top: 35px;

    padding: 30px 32px;

    background:
        linear-gradient(
            135deg,
            rgba(11,43,74,0.98),
            rgba(23,75,135,0.96)
        );

    border:
        1px solid rgba(96,165,250,0.25);

    border-radius: 20px;

    box-shadow:
        0 20px 45px rgba(0,0,0,0.23);
}


.faq-cta-content > span {
    display: block;

    margin-bottom: 7px;

    color: #60a5fa;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.faq-cta-content h3 {
    margin: 0 0 6px;

    color: #ffffff;

    font-size: 24px;

    line-height: 1.3;

    font-weight: 800;
}


.faq-cta-content p {
    margin: 0;

    color: rgba(255,255,255,0.68);

    font-size: 13px;

    line-height: 1.7;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.faq-cta-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    flex-shrink: 0;

    padding: 13px 15px 13px 22px;

    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 50px;

    text-decoration: none !important;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 0.7px;

    box-shadow:
        0 12px 28px rgba(0,0,0,0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.faq-cta-btn span {
    width: 34px;
    height: 34px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        rgba(255,255,255,0.16);

    font-size: 18px;

    transition:
        transform 0.3s ease;
}


.faq-cta-btn:hover {
    color: #ffffff !important;

    transform: translateY(-3px);

    box-shadow:
        0 17px 35px rgba(0,0,0,0.35);
}


.faq-cta-btn:hover span {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .premium-faq-section {
        padding: 80px 18px;
    }

    .faq-heading {
        margin-bottom: 42px;
    }

    .faq-heading h2 {
        font-size: 38px;
    }

    .faq-heading p {
        font-size: 15px;
    }

    .faq-question {
        grid-template-columns: 48px 1fr 40px;

        gap: 13px;

        padding: 18px;
    }

    .faq-number {
        width: 40px;
        height: 40px;
    }

    .faq-answer p {
        padding-left: 79px;
        padding-right: 20px;
    }

    .faq-cta {
        padding: 27px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .premium-faq-section {
        padding: 65px 15px;

        background-position: center center;
    }

    .faq-heading {
        margin-bottom: 35px;
    }

    .faq-badge {
        gap: 8px;

        font-size: 10px;

        letter-spacing: 1.7px;
    }

    .faq-badge::before,
    .faq-badge::after {
        width: 20px;
    }

    .faq-heading h2 {
        font-size: 29px;

        line-height: 1.2;
    }

    .faq-heading p {
        margin-top: 15px;

        font-size: 14px;

        line-height: 1.75;
    }

    .faq-list {
        gap: 10px;
    }

    .faq-item {
        border-radius: 15px;
    }

    .faq-question {
        grid-template-columns: 39px 1fr 35px;

        gap: 10px;

        padding: 16px 14px;
    }

    .faq-number {
        width: 36px;
        height: 36px;

        border-radius: 10px;

        font-size: 10px;
    }

    .faq-text {
        font-size: 13px;

        line-height: 1.5;
    }

    .faq-icon {
        width: 32px;
        height: 32px;

        font-size: 20px;
    }

    .faq-answer p {
        padding-left: 63px;
        padding-right: 18px;

        font-size: 13px;

        line-height: 1.75;
    }

    .faq-item.active .faq-answer p {
        padding-bottom: 18px;
    }

    .faq-cta {
        flex-direction: column;

        align-items: flex-start;

        gap: 20px;

        margin-top: 25px;

        padding: 24px 20px;

        border-radius: 17px;
    }

    .faq-cta-content h3 {
        font-size: 21px;
    }

    .faq-cta-content p {
        font-size: 13px;
    }

    .faq-cta-btn {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .premium-faq-section {
        padding: 55px 12px;
    }

    .faq-heading h2 {
        font-size: 25px;
    }

    .faq-question {
        grid-template-columns: 35px 1fr 32px;

        gap: 8px;

        padding: 14px 11px;
    }

    .faq-number {
        width: 33px;
        height: 33px;
    }

    .faq-text {
        font-size: 12px;
    }

    .faq-icon {
        width: 29px;
        height: 29px;

        font-size: 18px;
    }

    .faq-answer p {
        padding-left: 54px;
        padding-right: 14px;

        font-size: 12px;
    }

}

/* =========================================================
   EVENT PLANNER KARACHI
   ABOUT PAGE BREADCRUMB
========================================================= */

.epk-about-breadcrumb {
    position: relative;

    background:
        linear-gradient(
            rgba(5, 25, 55, 0.72),
            rgba(5, 25, 55, 0.72)
        ),
        url("https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=2000&q=85")
        center center / cover no-repeat;

    min-height: 300px;

    display: flex;

    align-items: center;

    overflow: hidden;
}


/* Soft blue overlay */

.epk-about-breadcrumb::before {
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(7, 35, 75, 0.55),
            rgba(13, 110, 253, 0.18)
        );

    pointer-events: none;
}


/* Keep content above overlay */

.epk-about-breadcrumb > .container {
    position: relative;

    z-index: 2;
}


/* Heading */

.epk-about-breadcrumb h4 {
    margin-bottom: 18px !important;

    font-weight: 800;

    letter-spacing: 0.5px;

    text-shadow:
        0 4px 18px rgba(0, 0, 0, 0.45);
}


/* Breadcrumb */

.epk-about-breadcrumb .breadcrumb {
    padding: 0;

    margin: 0;

    background: transparent;
}


/* Breadcrumb links */

.epk-about-breadcrumb .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.88);

    text-decoration: none;

    font-weight: 500;

    transition:
        color 0.3s ease;
}


.epk-about-breadcrumb .breadcrumb-item a:hover {
    color: #60a5fa;
}


/* Current page */

.epk-about-breadcrumb .breadcrumb-item.active {
    color: #60a5fa !important;

    font-weight: 700;
}


/* Breadcrumb separator */

.epk-about-breadcrumb
.breadcrumb-item
+ .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.55);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-about-breadcrumb {
        min-height: 270px;

        background-position: center center;
    }

    .epk-about-breadcrumb h4 {
        font-size: 42px !important;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-about-breadcrumb {
        min-height: 235px;

        padding: 20px 12px;

        background:
            linear-gradient(
                rgba(5, 25, 55, 0.78),
                rgba(5, 25, 55, 0.78)
            ),
            url("https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=1200&q=85")
            center center / cover no-repeat;
    }

    .epk-about-breadcrumb h4 {
        font-size: 32px !important;

        margin-bottom: 14px !important;
    }

    .epk-about-breadcrumb .breadcrumb {
        font-size: 13px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-about-breadcrumb {
        min-height: 215px;
    }

    .epk-about-breadcrumb h4 {
        font-size: 28px !important;
    }

    .epk-about-breadcrumb .breadcrumb {
        font-size: 12px;
    }

}


/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM TEAM SECTION
   COLOR SCHEME:
   BLUE + WHITE + DARK BLUE
========================================================= */

.epk-team-section {
    position: relative;
    overflow: hidden;
    padding: 105px 20px;

    background:
        linear-gradient(
            135deg,
            #f4f8ff 0%,
            #ffffff 48%,
            #edf6ff 100%
        );

    isolation: isolate;
}


/* =========================================================
   BACKGROUND DECORATIVE EFFECTS
========================================================= */

.epk-team-section::before {
    content: "";

    position: absolute;

    width: 520px;
    height: 520px;

    top: -280px;
    left: -260px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37, 99, 235, 0.13),
            transparent 68%
        );

    pointer-events: none;

    z-index: -1;
}


.epk-team-section::after {
    content: "";

    position: absolute;

    width: 450px;
    height: 450px;

    right: -220px;
    bottom: -240px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(14, 165, 233, 0.12),
            transparent 68%
        );

    pointer-events: none;

    z-index: -1;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.epk-team-container {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1240px;

    margin: 0 auto;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.epk-team-heading {
    max-width: 850px;

    margin: 0 auto 55px;

    text-align: center;
}


.epk-team-eyebrow {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 11px;

    margin-bottom: 17px;

    color: #2563eb;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 2.8px;

    text-transform: uppercase;
}


.epk-team-eyebrow i {
    display: block;

    width: 30px;
    height: 2px;

    border-radius: 20px;

    background:
        linear-gradient(
            90deg,
            #2563eb,
            #38bdf8
        );
}


.epk-team-heading h2 {
    margin: 0;

    color: #0b2b4a;

    font-size: clamp(34px, 4vw, 50px);

    line-height: 1.13;

    font-weight: 850;

    letter-spacing: -1px;
}


.epk-team-heading h2 span {
    color: #2563eb;
}


/* =========================================================
   DIVIDER
========================================================= */

.epk-team-divider {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    max-width: 260px;

    margin: 20px auto;
}


.epk-team-divider span {
    flex: 1;

    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(37, 99, 235, 0.45)
        );
}


.epk-team-divider span:last-child {
    background:
        linear-gradient(
            90deg,
            rgba(37, 99, 235, 0.45),
            transparent
        );
}


.epk-team-divider b {
    width: 36px;
    height: 36px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #0b2b4a,
            #2563eb
        );

    font-size: 13px;

    box-shadow:
        0 9px 24px rgba(37, 99, 235, 0.22);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-team-heading > p {
    margin: 0 auto;

    max-width: 780px;

    color: #5a6b82;

    font-size: 15px;

    line-height: 1.85;
}


/* =========================================================
   TEAM GRID
========================================================= */

.epk-team-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 22px;
}


/* =========================================================
   TEAM CARD
========================================================= */

.epk-team-card {
    position: relative;

    overflow: hidden;

    background: #ffffff;

    border:
        1px solid rgba(11, 43, 74, 0.08);

    border-radius: 22px;

    box-shadow:
        0 12px 35px rgba(11, 43, 74, 0.09);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


.epk-team-card:hover {
    transform: translateY(-10px);

    border-color:
        rgba(37, 99, 235, 0.25);

    box-shadow:
        0 25px 55px rgba(11, 43, 74, 0.17);
}


/* =========================================================
   IMAGE AREA
========================================================= */

.epk-team-image {
    position: relative;

    height: 340px;

    overflow: hidden;

    background: #dceaff;
}


.epk-team-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transition:
        transform 0.6s ease;
}


.epk-team-card:hover
.epk-team-image img {
    transform: scale(1.08);
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.epk-team-image-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(5, 24, 52, 0.86) 0%,
            rgba(5, 24, 52, 0.20) 48%,
            rgba(5, 24, 52, 0) 72%
        );

    pointer-events: none;
}


/* =========================================================
   ROLE TAG
========================================================= */

.epk-team-role-tag {
    position: absolute;

    left: 16px;
    bottom: 16px;

    display: inline-flex;

    align-items: center;

    padding: 7px 12px;

    color: #ffffff;

    background:
        rgba(11, 43, 74, 0.82);

    border:
        1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    backdrop-filter: blur(8px);

    -webkit-backdrop-filter: blur(8px);

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 0.5px;

    text-transform: uppercase;
}


/* =========================================================
   SOCIAL BUTTONS
========================================================= */

.epk-team-social {
    position: absolute;

    top: 18px;
    right: 17px;

    display: flex;

    flex-direction: column;

    gap: 8px;

    opacity: 0;

    transform: translateX(15px);

    transition:
        opacity 0.35s ease,
        transform 0.35s ease;
}


.epk-team-card:hover
.epk-team-social {
    opacity: 1;

    transform: translateX(0);
}


.epk-team-social a {
    width: 36px;
    height: 36px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff !important;

    background:
        rgba(11, 43, 74, 0.78);

    border:
        1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50%;

    text-decoration: none !important;

    backdrop-filter: blur(8px);

    -webkit-backdrop-filter: blur(8px);

    font-size: 13px;

    transition:
        background 0.25s ease,
        transform 0.25s ease;
}


.epk-team-social a:hover {
    color: #ffffff !important;

    background: #2563eb;

    transform: scale(1.08);
}


/* =========================================================
   TEAM INFORMATION
========================================================= */

.epk-team-info {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 15px;

    min-height: 105px;

    padding: 20px 19px;
}


.epk-team-info h3 {
    margin: 0 0 6px;

    color: #0b2b4a;

    font-size: 17px;

    line-height: 1.35;

    font-weight: 800;
}


.epk-team-info p {
    margin: 0;

    color: #64748b;

    font-size: 12px;

    font-weight: 600;
}


/* =========================================================
   ARROW
========================================================= */

.epk-team-arrow {
    width: 37px;
    height: 37px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #2563eb;

    background:
        rgba(37, 99, 235, 0.08);

    border-radius: 50%;

    font-size: 12px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}


.epk-team-card:hover
.epk-team-arrow {
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    transform: translateX(4px);
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.epk-team-bottom {
    display: flex;

    align-items: center;

    gap: 22px;

    margin-top: 32px;

    padding: 25px 28px;

    background:
        linear-gradient(
            135deg,
            #0b2b4a,
            #174b87
        );

    border-radius: 21px;

    box-shadow:
        0 18px 45px rgba(11, 43, 74, 0.18);
}


/* CTA ICON */

.epk-team-bottom-icon {
    width: 55px;
    height: 55px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #ffffff;

    background:
        rgba(37, 99, 235, 0.85);

    border-radius: 16px;

    font-size: 21px;
}


/* CTA CONTENT */

.epk-team-bottom-content {
    flex: 1;
}


.epk-team-bottom-content > span {
    display: block;

    margin-bottom: 4px;

    color: #60a5fa;

    font-size: 9px;

    font-weight: 900;

    letter-spacing: 2px;
}


.epk-team-bottom-content h3 {
    margin: 0 0 4px;

    color: #ffffff;

    font-size: 22px;

    font-weight: 800;
}


.epk-team-bottom-content p {
    margin: 0;

    color: rgba(255, 255, 255, 0.68);

    font-size: 13px;

    line-height: 1.65;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.epk-team-button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    flex-shrink: 0;

    padding: 12px 14px 12px 20px;

    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 50px;

    text-decoration: none !important;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 0.7px;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.20);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.epk-team-button i {
    width: 31px;
    height: 31px;

    display: flex;

    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background:
        rgba(255, 255, 255, 0.16);

    transition:
        transform 0.3s ease;
}


.epk-team-button:hover {
    color: #ffffff !important;

    transform: translateY(-3px);

    box-shadow:
        0 16px 32px rgba(0, 0, 0, 0.28);
}


.epk-team-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-team-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

    .epk-team-image {
        height: 360px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-team-section {
        padding: 80px 18px;
    }

    .epk-team-heading {
        margin-bottom: 42px;
    }

    .epk-team-heading h2 {
        font-size: 37px;
    }

    .epk-team-heading > p {
        font-size: 14px;
    }

    .epk-team-image {
        height: 380px;
    }

    /*
       Social icons stay visible on touch devices
       because hover is not reliable on mobile.
    */

    .epk-team-social {
        opacity: 1;

        transform: translateX(0);
    }

    .epk-team-bottom {
        flex-wrap: wrap;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-team-section {
        padding: 65px 15px;
    }

    .epk-team-heading {
        margin-bottom: 35px;
    }

    .epk-team-eyebrow {
        gap: 8px;

        font-size: 10px;

        letter-spacing: 1.8px;
    }

    .epk-team-eyebrow i {
        width: 22px;
    }

    .epk-team-heading h2 {
        font-size: 29px;

        line-height: 1.2;
    }

    .epk-team-heading > p {
        font-size: 13px;

        line-height: 1.75;
    }

    .epk-team-grid {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .epk-team-card {
        border-radius: 19px;
    }

    .epk-team-image {
        height: 350px;
    }

    .epk-team-info {
        min-height: 95px;

        padding: 18px;
    }

    .epk-team-info h3 {
        font-size: 16px;
    }

    .epk-team-bottom {
        flex-direction: column;

        align-items: flex-start;

        gap: 17px;

        padding: 23px 20px;

        border-radius: 18px;
    }

    .epk-team-bottom-content h3 {
        font-size: 21px;
    }

    .epk-team-bottom-content p {
        font-size: 12px;
    }

    .epk-team-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-team-section {
        padding: 55px 12px;
    }

    .epk-team-heading h2 {
        font-size: 25px;
    }

    .epk-team-image {
        height: 320px;
    }

    .epk-team-info {
        padding: 16px;
    }

    .epk-team-info h3 {
        font-size: 15px;
    }

}

/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM STATS SECTION
   BLUE + WHITE + DARK BLUE
========================================================= */

.eplx-stats-section {
    position: relative;

    width: 100%;

    padding: 55px 20px;

    overflow: hidden;

    background:
        linear-gradient(
            135deg,
            rgba(5, 24, 52, 0.96),
            rgba(8, 48, 91, 0.94)
        ),
        url("https://images.unsplash.com/photo-1507504031003-b417219a0fde?auto=format&fit=crop&w=2000&q=85")
        center center / cover no-repeat;

    isolation: isolate;
}


/* =========================================================
   BLUE LIGHT EFFECT
========================================================= */

.eplx-stats-section::before {
    content: "";

    position: absolute;

    width: 430px;
    height: 430px;

    top: -280px;
    left: 5%;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37, 99, 235, 0.38),
            transparent 68%
        );

    pointer-events: none;
}


.eplx-stats-section::after {
    content: "";

    position: absolute;

    width: 400px;
    height: 400px;

    right: -220px;
    bottom: -260px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(14, 165, 233, 0.24),
            transparent 68%
        );

    pointer-events: none;
}


/* =========================================================
   IMAGE OVERLAY
========================================================= */

.eplx-stats-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(4, 24, 51, 0.92),
            rgba(8, 48, 91, 0.82),
            rgba(4, 24, 51, 0.92)
        );

    z-index: -1;
}


/* =========================================================
   MAIN WRAPPER
========================================================= */

.eplx-stats-wrap {
    position: relative;

    z-index: 2;

    width: 100%;

    max-width: 1200px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        1fr auto 1fr auto 1fr auto 1fr;

    align-items: center;

    gap: 20px;
}


/* =========================================================
   STAT ITEM
========================================================= */

.eplx-stat-item {
    display: flex;

    align-items: center;

    gap: 16px;

    min-width: 0;
}


/* =========================================================
   ICON
========================================================= */

.eplx-stat-icon {
    width: 55px;
    height: 55px;

    display: flex;

    align-items: center;
    justify-content: center;

    flex-shrink: 0;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border:
        1px solid rgba(255, 255, 255, 0.15);

    border-radius: 16px;

    box-shadow:
        0 10px 25px rgba(0, 0, 0, 0.20);

    font-size: 19px;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.eplx-stat-item:hover
.eplx-stat-icon {
    transform: translateY(-5px) rotate(-3deg);

    box-shadow:
        0 15px 32px rgba(37, 99, 235, 0.35);
}


/* =========================================================
   CONTENT
========================================================= */

.eplx-stat-content {
    min-width: 0;

    display: flex;

    flex-direction: column;
}


/* =========================================================
   NUMBER
========================================================= */

.eplx-stat-number {
    display: block;

    margin-bottom: 2px;

    color: #ffffff;

    font-size: 31px;

    line-height: 1;

    font-weight: 900;

    letter-spacing: -0.7px;
}


/* =========================================================
   LABEL
========================================================= */

.eplx-stat-label {
    display: block;

    color: #ffffff;

    font-size: 13px;

    line-height: 1.4;

    font-weight: 750;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.eplx-stat-description {
    display: block;

    margin-top: 3px;

    color: rgba(255, 255, 255, 0.54);

    font-size: 9px;

    line-height: 1.4;

    font-weight: 500;
}


/* =========================================================
   DIVIDER
========================================================= */

.eplx-stat-divider {
    width: 1px;

    height: 65px;

    display: flex;

    align-items: center;

    justify-content: center;
}


.eplx-stat-divider span {
    display: block;

    width: 1px;

    height: 100%;

    background:
        linear-gradient(
            to bottom,
            transparent,
            rgba(255, 255, 255, 0.22),
            transparent
        );
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1050px) {

    .eplx-stats-section {
        padding: 48px 25px;
    }

    .eplx-stats-wrap {
        grid-template-columns:
            1fr 1fr;

        gap: 28px 35px;
    }

    .eplx-stat-divider {
        display: none;
    }

    .eplx-stat-item {
        padding: 5px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .eplx-stats-section {
        padding: 45px 20px;
    }

    .eplx-stats-wrap {
        grid-template-columns:
            1fr 1fr;

        gap: 25px 20px;
    }

    .eplx-stat-icon {
        width: 50px;
        height: 50px;

        border-radius: 14px;

        font-size: 17px;
    }

    .eplx-stat-number {
        font-size: 28px;
    }

    .eplx-stat-label {
        font-size: 12px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .eplx-stats-section {
        padding: 42px 18px;
    }

    .eplx-stats-wrap {
        grid-template-columns: 1fr;

        gap: 18px;
    }

    .eplx-stat-item {
        width: 100%;

        padding: 16px;

        background:
            rgba(255, 255, 255, 0.06);

        border:
            1px solid rgba(255, 255, 255, 0.09);

        border-radius: 16px;

        backdrop-filter: blur(8px);

        -webkit-backdrop-filter: blur(8px);
    }

    .eplx-stat-icon {
        width: 48px;
        height: 48px;

        border-radius: 13px;
    }

    .eplx-stat-number {
        font-size: 27px;
    }

    .eplx-stat-label {
        font-size: 12px;
    }

    .eplx-stat-description {
        font-size: 9px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .eplx-stats-section {
        padding: 35px 12px;
    }

    .eplx-stat-item {
        padding: 14px;
    }

    .eplx-stat-icon {
        width: 44px;
        height: 44px;

        font-size: 15px;
    }

    .eplx-stat-number {
        font-size: 24px;
    }

}

/* =========================================================
   EVENT PLANNER KARACHI
   PREMIUM PHILOSOPHY SECTION
   COLOR: DARK BLUE + BLUE + WHITE
========================================================= */

.eplx-philosophy-section {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    overflow: hidden;
    isolation: isolate;
    background: #061b35;
}


/* =========================================================
   BACKGROUND IMAGE
========================================================= */

.eplx-philosophy-bg {
    position: absolute;
    inset: 0;
    z-index: -3;

    background-image:
        url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    transform: scale(1.03);
}


/* =========================================================
   DARK OVERLAY
========================================================= */

.eplx-philosophy-overlay {
    position: absolute;
    inset: 0;
    z-index: -2;

    background:
        linear-gradient(
            110deg,
            rgba(4, 20, 42, 0.98) 0%,
            rgba(5, 29, 58, 0.95) 42%,
            rgba(8, 45, 84, 0.88) 100%
        );
}


/* =========================================================
   DECORATIVE GLOW
========================================================= */

.eplx-philosophy-section::before {
    content: "";
    position: absolute;

    width: 500px;
    height: 500px;

    top: -260px;
    right: -150px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37, 99, 235, 0.30),
            transparent 68%
        );

    pointer-events: none;
    z-index: -1;
}


.eplx-philosophy-section::after {
    content: "";
    position: absolute;

    width: 350px;
    height: 350px;

    bottom: -230px;
    left: -150px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(14, 165, 233, 0.18),
            transparent 70%
        );

    pointer-events: none;
    z-index: -1;
}


/* =========================================================
   CONTAINER
========================================================= */

.eplx-philosophy-container {
    width: 100%;
    max-width: 1180px;

    margin: 0 auto;

    display: grid;

    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(0, 1.1fr);

    gap: 70px;

    align-items: center;
}


/* =========================================================
   LEFT HEADING
========================================================= */

.eplx-philosophy-heading {
    max-width: 530px;
}


/* =========================================================
   BADGE
========================================================= */

.eplx-philosophy-badge {
    display: inline-flex;

    align-items: center;
    gap: 10px;

    padding: 9px 16px;

    margin-bottom: 24px;

    color: #ffffff;

    font-size: 11px;
    font-weight: 800;

    letter-spacing: 2px;

    text-transform: uppercase;

    background:
        rgba(37, 99, 235, 0.15);

    border:
        1px solid rgba(96, 165, 250, 0.35);

    border-radius: 50px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


.eplx-badge-dot {
    width: 8px;
    height: 8px;

    border-radius: 50%;

    background: #38bdf8;

    box-shadow:
        0 0 0 5px rgba(56, 189, 248, 0.12);
}


/* =========================================================
   MAIN TITLE
========================================================= */

.eplx-philosophy-title {
    margin: 0 0 22px;

    color: #ffffff;

    font-size: clamp(36px, 4vw, 57px);

    line-height: 1.08;

    font-weight: 800;

    letter-spacing: -1.5px;
}


.eplx-philosophy-title span {
    display: block;

    background:
        linear-gradient(
            90deg,
            #60a5fa,
            #38bdf8
        );

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    background-clip: text;
}


/* =========================================================
   INTRO
========================================================= */

.eplx-philosophy-intro {
    margin: 0;

    max-width: 510px;

    color:
        rgba(255, 255, 255, 0.70);

    font-size: 15px;

    line-height: 1.85;

    font-weight: 400;
}


/* =========================================================
   HIGHLIGHT BOX
========================================================= */

.eplx-philosophy-highlight {
    display: flex;

    align-items: center;

    gap: 15px;

    margin-top: 30px;

    padding: 17px 20px;

    max-width: 480px;

    background:
        rgba(255, 255, 255, 0.07);

    border:
        1px solid rgba(255, 255, 255, 0.11);

    border-left:
        3px solid #3b82f6;

    border-radius: 14px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}


.eplx-highlight-icon {
    width: 42px;
    height: 42px;

    flex-shrink: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 12px;

    font-size: 14px;
}


.eplx-philosophy-highlight strong {
    display: block;

    margin-bottom: 3px;

    color: #ffffff;

    font-size: 14px;

    font-weight: 750;
}


.eplx-philosophy-highlight p {
    margin: 0;

    color:
        rgba(255, 255, 255, 0.55);

    font-size: 12px;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.eplx-philosophy-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 14px;

    margin-top: 30px;

    padding: 14px 22px;

    color: #ffffff;

    text-decoration: none;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 1px;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 10px;

    box-shadow:
        0 12px 30px rgba(37, 99, 235, 0.25);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.eplx-philosophy-btn i {
    transition: transform 0.3s ease;
}


.eplx-philosophy-btn:hover {
    color: #ffffff;

    transform: translateY(-3px);

    box-shadow:
        0 18px 38px rgba(37, 99, 235, 0.35);
}


.eplx-philosophy-btn:hover i {
    transform: translateX(5px);
}


/* =========================================================
   VALUES LIST
========================================================= */

.eplx-values-list {
    display: flex;

    flex-direction: column;

    gap: 18px;
}


/* =========================================================
   VALUE CARD
========================================================= */

.eplx-value-card {
    position: relative;

    padding: 26px 28px;

    overflow: hidden;

    background:
        rgba(255, 255, 255, 0.075);

    border:
        1px solid rgba(255, 255, 255, 0.12);

    border-radius: 20px;

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        border-color 0.35s ease,
        box-shadow 0.35s ease;
}


.eplx-value-card::before {
    content: "";

    position: absolute;

    width: 150px;
    height: 150px;

    top: -90px;
    right: -60px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(37, 99, 235, 0.22),
            transparent 70%
        );

    transition:
        transform 0.4s ease;
}


.eplx-value-card:hover {
    transform: translateX(7px);

    background:
        rgba(255, 255, 255, 0.105);

    border-color:
        rgba(96, 165, 250, 0.30);

    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.20);
}


.eplx-value-card:hover::before {
    transform: scale(1.5);
}


/* =========================================================
   VALUE TOP
========================================================= */

.eplx-value-top {
    display: flex;

    align-items: center;

    justify-content: space-between;

    margin-bottom: 20px;
}


/* =========================================================
   NUMBER
========================================================= */

.eplx-value-number {
    color:
        rgba(255, 255, 255, 0.35);

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 2px;
}


/* =========================================================
   VALUE ICON
========================================================= */

.eplx-value-icon {
    width: 48px;
    height: 48px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #2563eb,
            #0ea5e9
        );

    border-radius: 14px;

    font-size: 17px;

    box-shadow:
        0 8px 20px rgba(37, 99, 235, 0.22);

    transition:
        transform 0.3s ease;
}


.eplx-value-card:hover .eplx-value-icon {
    transform:
        rotate(-5deg) scale(1.05);
}


/* =========================================================
   VALUE CONTENT
========================================================= */

.eplx-value-content {
    position: relative;
    z-index: 2;
}


.eplx-value-content h3 {
    margin: 0 0 9px;

    color: #ffffff;

    font-size: 22px;

    font-weight: 750;
}


.eplx-value-content p {
    margin: 0;

    color:
        rgba(255, 255, 255, 0.62);

    font-size: 13px;

    line-height: 1.75;
}


/* =========================================================
   BOTTOM LINE
========================================================= */

.eplx-value-line {
    display: block;

    width: 45px;
    height: 2px;

    margin-top: 20px;

    background:
        linear-gradient(
            90deg,
            #2563eb,
            #38bdf8
        );

    border-radius: 20px;

    transition:
        width 0.3s ease;
}


.eplx-value-card:hover .eplx-value-line {
    width: 85px;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1000px) {

    .eplx-philosophy-section {
        padding: 80px 25px;
    }

    .eplx-philosophy-container {
        grid-template-columns: 1fr;

        gap: 50px;

        max-width: 760px;
    }

    .eplx-philosophy-heading {
        max-width: 700px;
    }

    .eplx-philosophy-intro {
        max-width: 650px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .eplx-philosophy-section {
        padding: 70px 20px;
    }

    .eplx-philosophy-container {
        gap: 40px;
    }

    .eplx-philosophy-title {
        font-size: 40px;

        letter-spacing: -1px;
    }

    .eplx-philosophy-intro {
        font-size: 14px;

        line-height: 1.75;
    }

    .eplx-value-card {
        padding: 23px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .eplx-philosophy-section {
        padding: 58px 16px;
    }

    .eplx-philosophy-title {
        font-size: 34px;

        line-height: 1.12;

        margin-bottom: 18px;
    }

    .eplx-philosophy-badge {
        padding: 8px 13px;

        font-size: 9px;

        letter-spacing: 1.6px;

        margin-bottom: 19px;
    }

    .eplx-philosophy-intro {
        font-size: 13px;

        line-height: 1.75;
    }

    .eplx-philosophy-highlight {
        align-items: flex-start;

        padding: 15px;

        margin-top: 24px;
    }

    .eplx-highlight-icon {
        width: 38px;
        height: 38px;

        border-radius: 10px;
    }

    .eplx-philosophy-highlight strong {
        font-size: 13px;
    }

    .eplx-philosophy-highlight p {
        font-size: 11px;
    }

    .eplx-philosophy-btn {
        width: 100%;

        margin-top: 23px;

        padding: 14px 18px;
    }

    .eplx-values-list {
        gap: 14px;
    }

    .eplx-value-card {
        padding: 20px;

        border-radius: 17px;
    }

    .eplx-value-top {
        margin-bottom: 16px;
    }

    .eplx-value-icon {
        width: 44px;
        height: 44px;

        border-radius: 12px;

        font-size: 15px;
    }

    .eplx-value-content h3 {
        font-size: 20px;
    }

    .eplx-value-content p {
        font-size: 12px;

        line-height: 1.7;
    }

    .eplx-value-line {
        margin-top: 16px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .eplx-philosophy-section {
        padding: 50px 13px;
    }

    .eplx-philosophy-title {
        font-size: 30px;
    }

    .eplx-value-card {
        padding: 17px;
    }

    .eplx-value-content h3 {
        font-size: 18px;
    }

    .eplx-value-content p {
        font-size: 11.5px;
    }

}

/* =========================================================
   EPK PREMIUM SERVICES
   MODERN BLUE / DARK BLUE DESIGN
========================================================= */

.eplx-services-section {
    position: relative;
    width: 100%;
    padding: 95px 20px;
    overflow: hidden;
    background: #071d38;
}


/* =========================================================
   BACKGROUND IMAGE
========================================================= */

.eplx-services-bg {
    position: absolute;
    inset: 0;

    background-image:
        linear-gradient(
            90deg,
            rgba(5, 24, 48, 0.97),
            rgba(7, 31, 61, 0.94)
        ),
        url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;

    opacity: 0.95;

    pointer-events: none;
}


/* =========================================================
   DECORATIVE LIGHT
========================================================= */

.eplx-services-section::before {
    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -230px;
    right: -170px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(30, 117, 255, 0.22),
            transparent 70%
        );

    pointer-events: none;
}


.eplx-services-section::after {
    content: "";

    position: absolute;

    width: 300px;
    height: 300px;

    bottom: -180px;
    left: -130px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(14, 165, 233, 0.15),
            transparent 70%
        );

    pointer-events: none;
}


/* =========================================================
   CONTAINER
========================================================= */

.eplx-services-container {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1180px;

    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.eplx-services-heading {
    max-width: 760px;

    margin: 0 auto 55px;

    text-align: center;
}


/* =========================================================
   EYEBROW
========================================================= */

.eplx-services-eyebrow {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-bottom: 18px;

    color: #60a5fa;

    font-size: 11px;

    font-weight: 800;

    letter-spacing: 2.5px;
}


.eplx-services-eyebrow span {
    width: 28px;
    height: 2px;

    display: block;

    background: #3b82f6;

    border-radius: 10px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.eplx-services-heading h2 {
    margin: 0 0 20px;

    color: #ffffff;

    font-size: clamp(36px, 5vw, 56px);

    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -1.5px;
}


.eplx-services-heading h2 strong {
    display: block;

    color: #4da3ff;

    font-weight: 800;
}


/* =========================================================
   INTRO
========================================================= */

.eplx-services-heading p {
    max-width: 680px;

    margin: 0 auto;

    color: rgba(255, 255, 255, 0.70);

    font-size: 14px;

    line-height: 1.85;
}


/* =========================================================
   SERVICES GRID
========================================================= */

.eplx-services-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 20px;
}


/* =========================================================
   CARD
========================================================= */

.eplx-service-card {
    position: relative;

    min-height: 365px;

    display: flex;
    flex-direction: column;

    padding: 27px;

    background: #ffffff;

    border-radius: 18px;

    overflow: hidden;

    border: 1px solid rgba(255,255,255,0.15);

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.14);

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease;
}


.eplx-service-card:hover {
    transform: translateY(-7px);

    box-shadow:
        0 24px 50px rgba(0, 0, 0, 0.25);
}


/* =========================================================
   FEATURED CARD
========================================================= */

.eplx-service-card-main {
    background:
        linear-gradient(
            145deg,
            #0d6efd,
            #084298
        );
}


.eplx-service-card-main .eplx-service-tag,
.eplx-service-card-main h3,
.eplx-service-card-main p,
.eplx-service-card-main .eplx-service-number,
.eplx-service-card-main .eplx-service-link {
    color: #ffffff;
}


.eplx-service-card-main .eplx-service-icon {
    background: rgba(255,255,255,0.16);

    color: #ffffff;

    border-color:
        rgba(255,255,255,0.25);
}


/* =========================================================
   CARD TOP
========================================================= */

.eplx-service-card-head {
    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    margin-bottom: 27px;
}


/* =========================================================
   ICON
========================================================= */

.eplx-service-icon {
    width: 58px;
    height: 58px;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #0b2b4a,
            #0d6efd
        );

    border-radius: 15px;

    font-size: 20px;

    box-shadow:
        0 9px 22px rgba(13, 110, 253, 0.20);

    transition:
        transform 0.3s ease;
}


.eplx-service-card:hover .eplx-service-icon {
    transform:
        rotate(-5deg) scale(1.05);
}


/* =========================================================
   NUMBER
========================================================= */

.eplx-service-number {
    color: #9caec2;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


/* =========================================================
   CARD BODY
========================================================= */

.eplx-service-card-body {
    flex: 1;
}


/* =========================================================
   TAG
========================================================= */

.eplx-service-tag {
    display: block;

    margin-bottom: 9px;

    color: #0d6efd;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


/* =========================================================
   TITLE
========================================================= */

.eplx-service-card h3 {
    margin: 0 0 13px;

    color: #0b2b4a;

    font-size: 21px;

    line-height: 1.3;

    font-weight: 800;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.eplx-service-card p {
    margin: 0;

    color: #5d6b7b;

    font-size: 13px;

    line-height: 1.75;
}


/* =========================================================
   LINK
========================================================= */

.eplx-service-link {
    display: inline-flex;

    align-items: center;

    gap: 9px;

    width: fit-content;

    margin-top: 25px;

    color: #0b2b4a;

    text-decoration: none;

    font-size: 11px;

    font-weight: 800;

    transition:
        color 0.3s ease;
}


.eplx-service-link i {
    font-size: 10px;

    transition:
        transform 0.3s ease;
}


.eplx-service-link:hover {
    color: #0d6efd;
}


.eplx-service-link:hover i {
    transform: translateX(5px);
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.eplx-services-bottom {
    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 25px;

    margin-top: 25px;

    padding: 22px 25px;

    background:
        rgba(255,255,255,0.08);

    border:
        1px solid rgba(255,255,255,0.13);

    border-radius: 17px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


/* =========================================================
   CTA CONTENT
========================================================= */

.eplx-services-bottom-content {
    display: flex;

    align-items: center;

    gap: 15px;
}


.eplx-services-bottom-icon {
    width: 45px;
    height: 45px;

    flex-shrink: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    color: #ffffff;

    background: #0d6efd;

    border-radius: 12px;
}


.eplx-services-bottom-content span {
    display: block;

    margin-bottom: 3px;

    color: #60a5fa;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.eplx-services-bottom-content h3 {
    margin: 0;

    color: #ffffff;

    font-size: 19px;

    font-weight: 750;
}


/* =========================================================
   CTA BUTTON
========================================================= */

.eplx-services-button {
    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    padding: 13px 20px;

    flex-shrink: 0;

    color: #ffffff;

    background:
        #0d6efd;

    border-radius: 9px;

    text-decoration: none;

    font-size: 11px;

    font-weight: 800;

    transition:
        transform 0.3s ease,
        background 0.3s ease;
}


.eplx-services-button:hover {
    color: #ffffff;

    background: #0b5ed7;

    transform: translateY(-2px);
}


.eplx-services-button i {
    transition:
        transform 0.3s ease;
}


.eplx-services-button:hover i {
    transform: translateX(5px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1000px) {

    .eplx-services-section {
        padding: 80px 25px;
    }

    .eplx-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   TABLET / SMALL SCREEN
========================================================= */

@media (max-width: 768px) {

    .eplx-services-section {
        padding: 70px 20px;
    }

    .eplx-services-heading {
        margin-bottom: 40px;
    }

    .eplx-services-heading h2 {
        font-size: 40px;
    }

    .eplx-services-grid {
        gap: 16px;
    }

    .eplx-service-card {
        min-height: 350px;

        padding: 23px;
    }

    .eplx-services-bottom {
        align-items: flex-start;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .eplx-services-section {
        padding: 58px 15px;
    }

    .eplx-services-heading {
        margin-bottom: 32px;
    }

    .eplx-services-eyebrow {
        font-size: 9px;

        letter-spacing: 2px;
    }

    .eplx-services-heading h2 {
        font-size: 32px;

        line-height: 1.15;

        letter-spacing: -0.7px;
    }

    .eplx-services-heading p {
        font-size: 12.5px;

        line-height: 1.75;
    }

    .eplx-services-grid {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .eplx-service-card {
        min-height: auto;

        padding: 21px;

        border-radius: 16px;
    }

    .eplx-service-card-head {
        margin-bottom: 22px;
    }

    .eplx-service-icon {
        width: 52px;
        height: 52px;

        border-radius: 13px;

        font-size: 18px;
    }

    .eplx-service-card h3 {
        font-size: 20px;
    }

    .eplx-service-card p {
        font-size: 12px;

        line-height: 1.7;
    }

    .eplx-service-link {
        margin-top: 21px;
    }

    .eplx-services-bottom {
        flex-direction: column;

        align-items: stretch;

        gap: 18px;

        padding: 19px;

        margin-top: 18px;
    }

    .eplx-services-bottom-content {
        align-items: flex-start;
    }

    .eplx-services-bottom-content h3 {
        font-size: 17px;

        line-height: 1.35;
    }

    .eplx-services-button {
        width: 100%;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .eplx-services-section {
        padding: 50px 12px;
    }

    .eplx-services-heading h2 {
        font-size: 29px;
    }

    .eplx-service-card {
        padding: 18px;
    }

    .eplx-service-card h3 {
        font-size: 18px;
    }

    .eplx-service-card p {
        font-size: 11.5px;
    }

}


/* =========================================================
   EPK CONTACT HERO SECTION
   Color Scheme: Blue / White / Dark Blue
========================================================= */

.epk-contact-hero {
    position: relative;
    width: 100%;
    min-height: 420px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 80px 20px;

    overflow: hidden;

    background-color: #071d38;

    background-image: url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
}


/* =========================================================
   DARK IMAGE OVERLAY
========================================================= */

.epk-contact-overlay {
    position: absolute;

    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    background:
        linear-gradient(
            135deg,
            rgba(4, 20, 40, 0.96) 0%,
            rgba(6, 38, 73, 0.92) 50%,
            rgba(13, 91, 170, 0.72) 100%
        );

    z-index: 1;
}


/* =========================================================
   DECORATIVE BLUE GLOW
========================================================= */

.epk-contact-hero::before {
    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -250px;
    right: -120px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(72, 163, 255, 0.25),
            transparent 70%
        );

    z-index: 2;

    pointer-events: none;
}


.epk-contact-hero::after {
    content: "";

    position: absolute;

    width: 320px;
    height: 320px;

    bottom: -230px;
    left: -120px;

    border-radius: 50%;

    background:
        radial-gradient(
            circle,
            rgba(13, 110, 253, 0.20),
            transparent 70%
        );

    z-index: 2;

    pointer-events: none;
}


/* =========================================================
   CONTENT WRAPPER
========================================================= */

.epk-contact-content {
    position: relative;

    z-index: 3;

    width: 100%;
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   TOP LABEL
========================================================= */

.epk-contact-label {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 8px 16px;

    color: #ffffff;

    background: rgba(13, 110, 253, 0.20);

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 2px;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}


.epk-contact-label i {
    color: #59adff;

    font-size: 11px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.epk-contact-title {
    margin: 0 0 16px;

    color: #ffffff;

    font-size: clamp(42px, 6vw, 68px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -1.5px;

    text-shadow:
        0 5px 25px rgba(0, 0, 0, 0.30);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-contact-description {
    max-width: 650px;

    margin: 0 auto 27px;

    color: rgba(255, 255, 255, 0.84);

    font-size: 14px;

    line-height: 1.8;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.epk-contact-breadcrumb {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 12px;

    margin: 0;

    padding: 11px 18px;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.17);

    border-radius: 50px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}


/* =========================================================
   HOME LINK
========================================================= */

.epk-contact-breadcrumb a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #ffffff;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition: color 0.25s ease;
}


.epk-contact-breadcrumb a:hover {
    color: #62b0ff;
}


.epk-contact-breadcrumb a i {
    color: #58aaff;

    font-size: 11px;
}


/* =========================================================
   BREADCRUMB ARROW
========================================================= */

.epk-contact-separator {
    display: inline-flex;

    color: rgba(255, 255, 255, 0.40);

    font-size: 8px;
}


/* =========================================================
   CURRENT PAGE
========================================================= */

.epk-contact-current {
    color: #60b0ff;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-contact-hero {
        min-height: 380px;

        padding: 70px 20px;
    }

    .epk-contact-title {
        font-size: 48px;
    }

    .epk-contact-description {
        max-width: 580px;

        font-size: 13px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-contact-hero {
        min-height: 350px;

        padding: 60px 15px;

        background-position: center center;
    }

    .epk-contact-label {
        margin-bottom: 14px;

        padding: 7px 13px;

        font-size: 8px;

        letter-spacing: 1.5px;
    }

    .epk-contact-title {
        margin-bottom: 13px;

        font-size: 40px;

        letter-spacing: -0.8px;
    }

    .epk-contact-description {
        margin-bottom: 22px;

        font-size: 12px;

        line-height: 1.7;
    }

    .epk-contact-breadcrumb {
        gap: 9px;

        padding: 9px 14px;
    }

    .epk-contact-breadcrumb a,
    .epk-contact-current {
        font-size: 10px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-contact-hero {
        min-height: 330px;

        padding: 52px 12px;
    }

    .epk-contact-title {
        font-size: 34px;
    }

    .epk-contact-description {
        font-size: 11px;
    }

}

/* =========================================================
   EPK ABOUT HERO SECTION
   Color Scheme:
   Blue + White + Dark Blue
========================================================= */

.epk-about-hero {
    position: relative;

    width: 100%;
    min-height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 80px 20px;

    overflow: hidden;

    background-color: #071d38;

    /*
       Event / celebration background image
    */
    background-image: url("https://images.unsplash.com/photo-1519167758481-83f550bb49b3?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* =========================================================
   DARK OVERLAY
   Makes text clearly visible
========================================================= */

.epk-about-hero-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(4, 18, 38, 0.96) 0%,
            rgba(5, 31, 60, 0.92) 45%,
            rgba(8, 67, 125, 0.82) 100%
        );

    z-index: 1;
}


/* =========================================================
   DECORATIVE BLUE GLOWS
========================================================= */

.epk-about-hero-glow {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    z-index: 2;
}


.epk-about-hero-glow-one {
    width: 430px;
    height: 430px;

    top: -280px;
    right: -100px;

    background:
        radial-gradient(
            circle,
            rgba(55, 161, 255, 0.28) 0%,
            rgba(55, 161, 255, 0) 70%
        );
}


.epk-about-hero-glow-two {
    width: 350px;
    height: 350px;

    bottom: -250px;
    left: -130px;

    background:
        radial-gradient(
            circle,
            rgba(13, 110, 253, 0.25) 0%,
            rgba(13, 110, 253, 0) 70%
        );
}


/* =========================================================
   CONTENT
========================================================= */

.epk-about-hero-content {
    position: relative;

    z-index: 3;

    width: 100%;
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   SMALL TOP LABEL
========================================================= */

.epk-about-hero-label {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 17px;

    color: #ffffff;

    background: rgba(13, 110, 253, 0.18);

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.8px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.15);
}


.epk-about-hero-label i {
    color: #5db0ff;

    font-size: 11px;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.epk-about-hero-title {
    margin: 0 0 17px;

    color: #ffffff;

    font-size: clamp(44px, 6vw, 70px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -1.5px;

    text-shadow:
        0 5px 25px rgba(0, 0, 0, 0.35);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-about-hero-description {
    max-width: 680px;

    margin: 0 auto 28px;

    color: rgba(255, 255, 255, 0.84);

    font-size: 14px;

    line-height: 1.8;

    font-weight: 400;
}


/* =========================================================
   BREADCRUMB PILL
========================================================= */

.epk-about-hero-breadcrumb {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 12px;

    margin: 0;

    padding: 11px 18px;

    list-style: none;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   HOME LINK
========================================================= */

.epk-about-hero-breadcrumb a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #ffffff;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.epk-about-hero-breadcrumb a:hover {
    color: #5eb0ff;

    transform: translateY(-1px);
}


.epk-about-hero-breadcrumb a i {
    color: #5eb0ff;

    font-size: 11px;
}


/* =========================================================
   SEPARATOR
========================================================= */

.epk-about-hero-separator {
    display: inline-flex;

    align-items: center;

    color: rgba(255, 255, 255, 0.38);

    font-size: 8px;
}


/* =========================================================
   CURRENT PAGE
========================================================= */

.epk-about-hero-page {
    color: #60b1ff;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-about-hero {
        min-height: 390px;

        padding: 70px 20px;

        background-position: center;
    }


    .epk-about-hero-title {
        font-size: 50px;
    }


    .epk-about-hero-description {
        max-width: 590px;

        font-size: 13px;

        line-height: 1.75;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-about-hero {
        min-height: 360px;

        padding: 60px 15px;

        background-position: center center;
    }


    .epk-about-hero-label {
        margin-bottom: 14px;

        padding: 7px 13px;

        font-size: 8px;

        letter-spacing: 1.3px;
    }


    .epk-about-hero-title {
        margin-bottom: 13px;

        font-size: 40px;

        letter-spacing: -0.8px;
    }


    .epk-about-hero-description {
        margin-bottom: 22px;

        font-size: 12px;

        line-height: 1.7;
    }


    .epk-about-hero-breadcrumb {
        gap: 9px;

        padding: 9px 14px;
    }


    .epk-about-hero-breadcrumb a,
    .epk-about-hero-page {
        font-size: 10px;
    }


    .epk-about-hero-breadcrumb a i {
        font-size: 9px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-about-hero {
        min-height: 335px;

        padding: 52px 12px;
    }


    .epk-about-hero-title {
        font-size: 35px;
    }


    .epk-about-hero-description {
        font-size: 11px;

        line-height: 1.65;
    }


    .epk-about-hero-label {
        font-size: 7px;

        letter-spacing: 1px;
    }

}

/* =========================================================
   EPK SERVICES HERO SECTION
   Color Scheme:
   Blue + White + Dark Blue
========================================================= */

.epk-services-hero {
    position: relative;

    width: 100%;
    min-height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 80px 20px;

    overflow: hidden;

    background-color: #071d38;

    /* Event Planning Background */
    background-image: url("https://images.unsplash.com/photo-1492684223066-81342ee5ff30?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* =========================================================
   DARK BLUE OVERLAY
========================================================= */

.epk-services-hero-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(3, 18, 38, 0.96) 0%,
            rgba(5, 32, 62, 0.93) 48%,
            rgba(8, 75, 140, 0.80) 100%
        );

    z-index: 1;
}


/* =========================================================
   DECORATIVE GLOW EFFECTS
========================================================= */

.epk-services-glow {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    z-index: 2;
}


.epk-services-glow-one {
    width: 450px;
    height: 450px;

    top: -280px;
    right: -100px;

    background:
        radial-gradient(
            circle,
            rgba(48, 158, 255, 0.28) 0%,
            rgba(48, 158, 255, 0) 70%
        );
}


.epk-services-glow-two {
    width: 360px;
    height: 360px;

    bottom: -250px;
    left: -130px;

    background:
        radial-gradient(
            circle,
            rgba(13, 110, 253, 0.24) 0%,
            rgba(13, 110, 253, 0) 70%
        );
}


/* =========================================================
   MAIN CONTENT
========================================================= */

.epk-services-hero-content {
    position: relative;

    z-index: 3;

    width: 100%;
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   TOP LABEL
========================================================= */

.epk-services-hero-label {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 17px;

    color: #ffffff;

    background: rgba(13, 110, 253, 0.18);

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.7px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.16);
}


.epk-services-hero-label i {
    color: #5db1ff;

    font-size: 11px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.epk-services-hero-title {
    margin: 0 0 17px;

    color: #ffffff;

    font-size: clamp(44px, 6vw, 70px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -1.5px;

    text-shadow:
        0 5px 25px rgba(0, 0, 0, 0.35);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-services-hero-description {
    max-width: 690px;

    margin: 0 auto 28px;

    color: rgba(255, 255, 255, 0.85);

    font-size: 14px;

    line-height: 1.8;

    font-weight: 400;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.epk-services-hero-breadcrumb {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 12px;

    margin: 0;

    padding: 11px 18px;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   HOME LINK
========================================================= */

.epk-services-hero-breadcrumb a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #ffffff;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.epk-services-hero-breadcrumb a:hover {
    color: #61b1ff;

    transform: translateY(-1px);
}


.epk-services-hero-breadcrumb a i {
    color: #59adff;

    font-size: 11px;
}


/* =========================================================
   SEPARATOR
========================================================= */

.epk-services-hero-separator {
    display: inline-flex;

    align-items: center;

    color: rgba(255, 255, 255, 0.38);

    font-size: 8px;
}


/* =========================================================
   CURRENT PAGE
========================================================= */

.epk-services-hero-page {
    color: #60b2ff;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-services-hero {
        min-height: 390px;

        padding: 70px 20px;

        background-position: center;
    }


    .epk-services-hero-title {
        font-size: 50px;
    }


    .epk-services-hero-description {
        max-width: 590px;

        font-size: 13px;

        line-height: 1.75;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-services-hero {
        min-height: 360px;

        padding: 60px 15px;

        background-position: center center;
    }


    .epk-services-hero-label {
        margin-bottom: 14px;

        padding: 7px 13px;

        font-size: 8px;

        letter-spacing: 1.2px;
    }


    .epk-services-hero-title {
        margin-bottom: 13px;

        font-size: 40px;

        letter-spacing: -0.8px;
    }


    .epk-services-hero-description {
        margin-bottom: 22px;

        font-size: 12px;

        line-height: 1.7;
    }


    .epk-services-hero-breadcrumb {
        gap: 9px;

        padding: 9px 14px;
    }


    .epk-services-hero-breadcrumb a,
    .epk-services-hero-page {
        font-size: 10px;
    }


    .epk-services-hero-breadcrumb a i {
        font-size: 9px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-services-hero {
        min-height: 335px;

        padding: 52px 12px;
    }


    .epk-services-hero-title {
        font-size: 35px;
    }


    .epk-services-hero-description {
        font-size: 11px;

        line-height: 1.65;
    }


    .epk-services-hero-label {
        font-size: 7px;

        letter-spacing: 0.9px;
    }

}



/* =========================================================
   EPK BLOG HERO SECTION
   Blue + White + Dark Blue Theme
========================================================= */

.epk-blog-hero {
    position: relative;

    width: 100%;
    min-height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 80px 20px;

    overflow: hidden;

    background-color: #071d38;

    /* Event Planning / Blog Background */
    background-image: url("https://images.unsplash.com/photo-1505236858219-8359eb29e329?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* =========================================================
   DARK BLUE OVERLAY
========================================================= */

.epk-blog-hero-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(3, 17, 36, 0.97) 0%,
            rgba(5, 31, 61, 0.93) 48%,
            rgba(8, 72, 135, 0.80) 100%
        );

    z-index: 1;
}


/* =========================================================
   DECORATIVE BLUE GLOWS
========================================================= */

.epk-blog-hero-glow {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    z-index: 2;
}


.epk-blog-glow-one {
    width: 450px;
    height: 450px;

    top: -290px;
    right: -110px;

    background:
        radial-gradient(
            circle,
            rgba(50, 161, 255, 0.28) 0%,
            rgba(50, 161, 255, 0) 70%
        );
}


.epk-blog-glow-two {
    width: 370px;
    height: 370px;

    bottom: -260px;
    left: -140px;

    background:
        radial-gradient(
            circle,
            rgba(13, 110, 253, 0.25) 0%,
            rgba(13, 110, 253, 0) 70%
        );
}


/* =========================================================
   CONTENT WRAPPER
========================================================= */

.epk-blog-hero-content {
    position: relative;

    z-index: 3;

    width: 100%;
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   TOP LABEL
========================================================= */

.epk-blog-hero-label {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 17px;

    color: #ffffff;

    background: rgba(13, 110, 253, 0.18);

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.7px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.16);
}


.epk-blog-hero-label i {
    color: #5db1ff;

    font-size: 11px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.epk-blog-hero-title {
    margin: 0 0 17px;

    color: #ffffff;

    font-size: clamp(44px, 6vw, 70px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -1.5px;

    text-shadow:
        0 5px 25px rgba(0, 0, 0, 0.35);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-blog-hero-description {
    max-width: 690px;

    margin: 0 auto 28px;

    color: rgba(255, 255, 255, 0.86);

    font-size: 14px;

    line-height: 1.8;

    font-weight: 400;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.epk-blog-hero-breadcrumb {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 11px;

    margin: 0;

    padding: 11px 18px;

    list-style: none;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   BREADCRUMB LINKS
========================================================= */

.epk-blog-hero-breadcrumb a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #ffffff;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.epk-blog-hero-breadcrumb a:hover {
    color: #61b1ff;

    transform: translateY(-1px);
}


/* Home + Pages Icons */

.epk-blog-hero-breadcrumb a i {
    color: #59adff;

    font-size: 10px;
}


/* =========================================================
   SEPARATOR
========================================================= */

.epk-blog-hero-separator {
    display: inline-flex;

    align-items: center;

    color: rgba(255, 255, 255, 0.38);

    font-size: 8px;
}


/* =========================================================
   CURRENT PAGE
========================================================= */

.epk-blog-hero-current {
    color: #60b2ff;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-blog-hero {
        min-height: 390px;

        padding: 70px 20px;

        background-position: center;
    }


    .epk-blog-hero-title {
        font-size: 50px;
    }


    .epk-blog-hero-description {
        max-width: 590px;

        font-size: 13px;

        line-height: 1.75;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-blog-hero {
        min-height: 360px;

        padding: 60px 15px;

        background-position: center center;
    }


    .epk-blog-hero-label {
        margin-bottom: 14px;

        padding: 7px 13px;

        font-size: 8px;

        letter-spacing: 1.2px;
    }


    .epk-blog-hero-title {
        margin-bottom: 13px;

        font-size: 40px;

        letter-spacing: -0.8px;
    }


    .epk-blog-hero-description {
        margin-bottom: 22px;

        font-size: 12px;

        line-height: 1.7;
    }


    .epk-blog-hero-breadcrumb {
        gap: 8px;

        padding: 9px 13px;
    }


    .epk-blog-hero-breadcrumb a,
    .epk-blog-hero-current {
        font-size: 10px;
    }


    .epk-blog-hero-breadcrumb a i {
        font-size: 8px;
    }


    .epk-blog-hero-separator {
        font-size: 7px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-blog-hero {
        min-height: 335px;

        padding: 52px 12px;
    }


    .epk-blog-hero-title {
        font-size: 35px;
    }


    .epk-blog-hero-description {
        font-size: 11px;

        line-height: 1.65;
    }


    .epk-blog-hero-label {
        font-size: 7px;

        letter-spacing: 0.9px;
    }


    .epk-blog-hero-breadcrumb {
        padding: 8px 11px;
    }

}


/* =========================================================
   EPK TEAM HERO SECTION
   Blue + White + Dark Blue Theme
========================================================= */

.epk-team-hero {
    position: relative;

    width: 100%;
    min-height: 430px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 80px 20px;

    overflow: hidden;

    background-color: #071d38;

    /*
       Professional Event Team Background
    */
    background-image: url("https://images.unsplash.com/photo-1521737711867-e3b97375f902?auto=format&fit=crop&w=2000&q=85");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


/* =========================================================
   DARK BLUE OVERLAY
========================================================= */

.epk-team-hero-overlay {
    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            135deg,
            rgba(3, 17, 36, 0.97) 0%,
            rgba(5, 31, 61, 0.94) 48%,
            rgba(8, 72, 135, 0.80) 100%
        );

    z-index: 1;
}


/* =========================================================
   DECORATIVE BLUE GLOWS
========================================================= */

.epk-team-hero-glow {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    z-index: 2;
}


.epk-team-glow-one {
    width: 450px;
    height: 450px;

    top: -290px;
    right: -110px;

    background:
        radial-gradient(
            circle,
            rgba(50, 161, 255, 0.28) 0%,
            rgba(50, 161, 255, 0) 70%
        );
}


.epk-team-glow-two {
    width: 370px;
    height: 370px;

    bottom: -260px;
    left: -140px;

    background:
        radial-gradient(
            circle,
            rgba(13, 110, 253, 0.25) 0%,
            rgba(13, 110, 253, 0) 70%
        );
}


/* =========================================================
   CONTENT
========================================================= */

.epk-team-hero-content {
    position: relative;

    z-index: 3;

    width: 100%;
    max-width: 850px;

    margin: 0 auto;

    text-align: center;
}


/* =========================================================
   TOP LABEL
========================================================= */

.epk-team-hero-label {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 9px;

    margin-bottom: 18px;

    padding: 9px 17px;

    color: #ffffff;

    background: rgba(13, 110, 253, 0.18);

    border: 1px solid rgba(255, 255, 255, 0.20);

    border-radius: 50px;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.7px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    box-shadow:
        0 8px 25px rgba(0, 0, 0, 0.16);
}


.epk-team-hero-label i {
    color: #5db1ff;

    font-size: 11px;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.epk-team-hero-title {
    margin: 0 0 17px;

    color: #ffffff;

    font-size: clamp(44px, 6vw, 70px);

    line-height: 1.05;

    font-weight: 800;

    letter-spacing: -1.5px;

    text-shadow:
        0 5px 25px rgba(0, 0, 0, 0.35);
}


/* =========================================================
   DESCRIPTION
========================================================= */

.epk-team-hero-description {
    max-width: 690px;

    margin: 0 auto 28px;

    color: rgba(255, 255, 255, 0.86);

    font-size: 14px;

    line-height: 1.8;

    font-weight: 400;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.epk-team-hero-breadcrumb {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    flex-wrap: wrap;

    gap: 11px;

    margin: 0;

    padding: 11px 18px;

    list-style: none;

    background: rgba(255, 255, 255, 0.10);

    border: 1px solid rgba(255, 255, 255, 0.18);

    border-radius: 50px;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.15);
}


/* =========================================================
   BREADCRUMB LINKS
========================================================= */

.epk-team-hero-breadcrumb a {
    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: #ffffff;

    text-decoration: none;

    font-size: 12px;

    font-weight: 700;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.epk-team-hero-breadcrumb a:hover {
    color: #61b1ff;

    transform: translateY(-1px);
}


/* Icons */

.epk-team-hero-breadcrumb a i {
    color: #59adff;

    font-size: 10px;
}


/* =========================================================
   SEPARATOR
========================================================= */

.epk-team-hero-separator {
    display: inline-flex;

    align-items: center;

    color: rgba(255, 255, 255, 0.38);

    font-size: 8px;
}


/* =========================================================
   CURRENT PAGE
========================================================= */

.epk-team-hero-current {
    color: #60b2ff;

    font-size: 12px;

    font-weight: 800;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 768px) {

    .epk-team-hero {
        min-height: 390px;

        padding: 70px 20px;

        background-position: center;
    }


    .epk-team-hero-title {
        font-size: 50px;
    }


    .epk-team-hero-description {
        max-width: 590px;

        font-size: 13px;

        line-height: 1.75;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .epk-team-hero {
        min-height: 360px;

        padding: 60px 15px;

        background-position: center center;
    }


    .epk-team-hero-label {
        margin-bottom: 14px;

        padding: 7px 13px;

        font-size: 8px;

        letter-spacing: 1.2px;
    }


    .epk-team-hero-title {
        margin-bottom: 13px;

        font-size: 40px;

        letter-spacing: -0.8px;
    }


    .epk-team-hero-description {
        margin-bottom: 22px;

        font-size: 12px;

        line-height: 1.7;
    }


    .epk-team-hero-breadcrumb {
        gap: 8px;

        padding: 9px 13px;
    }


    .epk-team-hero-breadcrumb a,
    .epk-team-hero-current {
        font-size: 10px;
    }


    .epk-team-hero-breadcrumb a i {
        font-size: 8px;
    }


    .epk-team-hero-separator {
        font-size: 7px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 380px) {

    .epk-team-hero {
        min-height: 335px;

        padding: 52px 12px;
    }


    .epk-team-hero-title {
        font-size: 35px;
    }


    .epk-team-hero-description {
        font-size: 11px;

        line-height: 1.65;
    }


    .epk-team-hero-label {
        font-size: 7px;

        letter-spacing: 0.9px;
    }


    .epk-team-hero-breadcrumb {
        padding: 8px 11px;
    }

}


/* =========================================================
   EPK MODERN CONTACT SECTION
   COLOR THEME:
   Dark Blue #071D38
   Blue #0D6EFD
   Light Blue #EAF4FF
   White #FFFFFF
========================================================= */


.epk-contact-section {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    overflow: hidden;
    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(13, 110, 253, 0.08),
            transparent 28%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(13, 110, 253, 0.07),
            transparent 30%
        ),
        #f6f9fd;
}


.epk-contact-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}


/* =========================================================
   SECTION HEADING
========================================================= */

.epk-contact-heading {
    max-width: 780px;
    margin: 0 auto 55px;
    text-align: center;
}


.epk-contact-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    padding: 8px 16px;

    border-radius: 50px;

    color: #0d6efd;

    background: #eaf4ff;

    border: 1px solid rgba(13, 110, 253, 0.12);

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.6px;
}


.epk-contact-eyebrow i {
    font-size: 11px;
}


.epk-contact-heading h2 {
    margin: 18px 0 15px;

    color: #071d38;

    font-size: clamp(34px, 4.5vw, 54px);

    line-height: 1.12;

    font-weight: 800;

    letter-spacing: -1.3px;
}


.epk-contact-heading h2 span {
    display: inline-block;
    color: #0d6efd;
}


.epk-contact-heading p {
    max-width: 700px;
    margin: 0 auto;

    color: #637083;

    font-size: 15px;

    line-height: 1.8;
}


/* =========================================================
   MAIN CONTACT BOX
========================================================= */

.epk-contact-main {
    display: grid;

    grid-template-columns:
        minmax(0, 0.95fr)
        minmax(0, 1.05fr);

    min-height: 650px;

    overflow: hidden;

    background: #ffffff;

    border-radius: 28px;

    box-shadow:
        0 25px 70px rgba(7, 29, 56, 0.12);

    border: 1px solid rgba(7, 29, 56, 0.06);
}


/* =========================================================
   LEFT IMAGE
========================================================= */

.epk-contact-visual {
    position: relative;
    min-height: 650px;
}


.epk-contact-image {
    position: relative;

    width: 100%;
    height: 100%;

    min-height: 650px;

    overflow: hidden;

    background: #071d38;
}


.epk-contact-image img {
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;

    transition: transform 0.8s ease;
}


.epk-contact-main:hover .epk-contact-image img {
    transform: scale(1.04);
}


.epk-contact-image-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7, 29, 56, 0.15) 0%,
            rgba(7, 29, 56, 0.30) 35%,
            rgba(4, 22, 45, 0.94) 100%
        );
}


/* =========================================================
   IMAGE CONTENT
========================================================= */

.epk-contact-image-content {
    position: absolute;

    left: 45px;
    right: 45px;
    bottom: 42px;

    color: #ffffff;

    z-index: 3;
}


.epk-contact-image-content > span {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 15px;

    color: #ffffff;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
}


.epk-contact-image-content > span i {
    color: #58adff;
}


.epk-contact-image-content h3 {
    max-width: 450px;

    margin: 0 0 13px;

    color: #ffffff;

    font-size: clamp(32px, 3vw, 46px);

    line-height: 1.1;

    font-weight: 700;
}


.epk-contact-image-content h3 strong {
    color: #58adff;
}


.epk-contact-image-content p {
    max-width: 420px;

    margin: 0;

    color: rgba(255, 255, 255, 0.78);

    font-size: 14px;

    line-height: 1.7;
}


/* =========================================================
   FLOATING CARD
========================================================= */

.epk-contact-floating-card {
    position: absolute;

    top: 35px;
    right: 30px;

    z-index: 5;

    display: flex;
    align-items: center;

    gap: 12px;

    padding: 13px 17px;

    border-radius: 14px;

    background: rgba(255, 255, 255, 0.95);

    box-shadow:
        0 15px 35px rgba(0, 0, 0, 0.18);

    backdrop-filter: blur(10px);
}


.epk-contact-floating-icon {
    width: 40px;
    height: 40px;

    flex: 0 0 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    color: #ffffff;

    background: #0d6efd;

    font-size: 16px;
}


.epk-contact-floating-card strong {
    display: block;

    margin-bottom: 3px;

    color: #071d38;

    font-size: 12px;

    font-weight: 800;
}


.epk-contact-floating-card span {
    display: block;

    color: #718096;

    font-size: 10px;
}


/* =========================================================
   FORM WRAPPER
========================================================= */

.epk-contact-form-wrap {
    padding: 55px 50px;

    background: #ffffff;
}


.epk-contact-form-header {
    margin-bottom: 28px;
}


.epk-form-mini-label {
    color: #0d6efd;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: 1.5px;
}


.epk-contact-form-header h3 {
    margin: 7px 0 8px;

    color: #071d38;

    font-size: 28px;

    font-weight: 800;
}


.epk-contact-form-header p {
    margin: 0;

    color: #788496;

    font-size: 13px;

    line-height: 1.7;
}


/* =========================================================
   FORM GRID
========================================================= */

.epk-form-grid {
    display: grid;

    grid-template-columns: repeat(2, minmax(0, 1fr));

    gap: 18px;
}


.epk-form-full {
    grid-column: 1 / -1;
}


/* =========================================================
   FORM FIELD
========================================================= */

.epk-form-field label {
    display: block;

    margin-bottom: 7px;

    color: #23364f;

    font-size: 11px;

    font-weight: 800;
}


.epk-input-wrap,
.epk-textarea-wrap {
    position: relative;
}


.epk-input-wrap > i,
.epk-textarea-wrap > i {
    position: absolute;

    top: 50%;
    left: 16px;

    transform: translateY(-50%);

    color: #0d6efd;

    font-size: 13px;

    z-index: 2;
}


.epk-textarea-wrap > i {
    top: 18px;

    transform: none;
}


.epk-input-wrap input,
.epk-input-wrap select,
.epk-textarea-wrap textarea {
    width: 100%;

    border: 1px solid #e3eaf2;

    outline: none;

    border-radius: 11px;

    background: #f8fafd;

    color: #23364f;

    font-family: inherit;

    font-size: 12px;

    transition:
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;
}


.epk-input-wrap input,
.epk-input-wrap select {
    height: 51px;

    padding: 0 14px 0 44px;
}


.epk-textarea-wrap textarea {
    min-height: 120px;

    padding: 15px 15px 15px 44px;

    resize: vertical;

    line-height: 1.6;
}


.epk-input-wrap input::placeholder,
.epk-textarea-wrap textarea::placeholder {
    color: #a1adbb;
}


.epk-input-wrap input:focus,
.epk-input-wrap select:focus,
.epk-textarea-wrap textarea:focus {
    border-color: #0d6efd;

    background: #ffffff;

    box-shadow:
        0 0 0 4px rgba(13, 110, 253, 0.09);
}


/* =========================================================
   SUBMIT BUTTON
========================================================= */

.epk-contact-submit {
    position: relative;

    width: 100%;

    min-height: 54px;

    display: flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-top: 2px;

    border: 0;

    border-radius: 12px;

    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #0d6efd,
            #0757c9
        );

    font-family: inherit;

    font-size: 13px;

    font-weight: 800;

    cursor: pointer;

    overflow: hidden;

    box-shadow:
        0 12px 25px rgba(13, 110, 253, 0.22);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


.epk-contact-submit::before {
    content: "";

    position: absolute;

    top: 0;
    left: -100%;

    width: 70%;
    height: 100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,0.20),
            transparent
        );

    transform: skewX(-20deg);

    transition: left 0.6s ease;
}


.epk-contact-submit:hover::before {
    left: 130%;
}


.epk-contact-submit:hover {
    transform: translateY(-2px);

    box-shadow:
        0 16px 32px rgba(13, 110, 253, 0.30);
}


.epk-contact-submit i {
    font-size: 12px;

    transition: transform 0.25s ease;
}


.epk-contact-submit:hover i {
    transform: translateX(4px);
}


/* =========================================================
   CONTACT INFORMATION GRID
========================================================= */

.epk-contact-info-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 16px;

    margin-top: 24px;
}


.epk-contact-info-card {
    position: relative;

    min-height: 150px;

    display: flex;

    align-items: flex-start;

    gap: 14px;

    padding: 23px 20px;

    text-decoration: none;

    background: #ffffff;

    border: 1px solid #e7edf4;

    border-radius: 17px;

    overflow: hidden;

    transition:
        transform 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


.epk-contact-info-card::before {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 3px;

    background: #0d6efd;

    transform: scaleX(0);

    transform-origin: left;

    transition: transform 0.3s ease;
}


.epk-contact-info-card:hover {
    transform: translateY(-5px);

    border-color: rgba(13, 110, 253, 0.25);

    box-shadow:
        0 16px 35px rgba(7, 29, 56, 0.09);
}


.epk-contact-info-card:hover::before {
    transform: scaleX(1);
}


/* Info icon */

.epk-info-icon {
    width: 43px;
    height: 43px;

    flex: 0 0 43px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 12px;

    color: #0d6efd;

    background: #eaf4ff;

    font-size: 15px;
}


.epk-info-content {
    min-width: 0;
}


.epk-info-content > span {
    display: block;

    margin-bottom: 4px;

    color: #0d6efd;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.2px;
}


.epk-info-content h4 {
    margin: 0 0 6px;

    color: #071d38;

    font-size: 14px;

    font-weight: 800;

    line-height: 1.4;

    overflow-wrap: anywhere;
}


.epk-info-content p {
    margin: 0;

    color: #7a8797;

    font-size: 11px;

    line-height: 1.55;
}


.epk-info-arrow {
    position: absolute;

    right: 16px;
    bottom: 17px;

    color: #c0cad6;

    font-size: 10px;

    transition:
        color 0.25s ease,
        transform 0.25s ease;
}


.epk-contact-info-card:hover .epk-info-arrow {
    color: #0d6efd;

    transform: translateX(3px);
}


/* =========================================================
   MAP
========================================================= */

.epk-contact-map {
    margin-top: 25px;

    overflow: hidden;

    border-radius: 22px;

    background: #ffffff;

    border: 1px solid #e5ebf2;

    box-shadow:
        0 15px 45px rgba(7, 29, 56, 0.07);
}


.epk-map-header {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 20px;

    padding: 22px 25px;

    background: #071d38;
}


.epk-map-header span {
    display: block;

    margin-bottom: 5px;

    color: #58adff;

    font-size: 9px;

    font-weight: 800;

    letter-spacing: 1.2px;
}


.epk-map-header h3 {
    margin: 0;

    color: #ffffff;

    font-size: 19px;

    font-weight: 700;
}


.epk-map-header a {
    display: inline-flex;

    align-items: center;

    gap: 8px;

    flex-shrink: 0;

    padding: 10px 15px;

    color: #ffffff;

    background: #0d6efd;

    border-radius: 9px;

    text-decoration: none;

    font-size: 10px;

    font-weight: 700;

    transition:
        background 0.25s ease,
        transform 0.25s ease;
}


.epk-map-header a:hover {
    background: #0b5ed7;

    transform: translateY(-2px);
}


.epk-map-header a i {
    font-size: 9px;
}


.epk-map-frame {
    width: 100%;

    height: 390px;
}


.epk-map-frame iframe {
    display: block;

    width: 100%;
    height: 100%;

    border: 0;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-contact-section {
        padding: 80px 20px;
    }


    .epk-contact-main {
        grid-template-columns: 1fr 1fr;
    }


    .epk-contact-form-wrap {
        padding: 42px 35px;
    }


    .epk-contact-image-content {
        left: 30px;
        right: 30px;
        bottom: 32px;
    }


    .epk-contact-floating-card {
        right: 20px;
    }


    .epk-contact-info-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   MOBILE / TABLET
========================================================= */

@media (max-width: 767px) {

    .epk-contact-section {
        padding: 65px 15px;
    }


    .epk-contact-heading {
        margin-bottom: 35px;
    }


    .epk-contact-heading h2 {
        font-size: 36px;

        letter-spacing: -0.8px;
    }


    .epk-contact-heading p {
        font-size: 13px;

        line-height: 1.7;
    }


    .epk-contact-main {
        display: block;

        min-height: auto;

        border-radius: 22px;
    }


    .epk-contact-visual {
        min-height: 440px;
    }


    .epk-contact-image {
        min-height: 440px;
    }


    .epk-contact-image-content {
        left: 25px;
        right: 25px;
        bottom: 28px;
    }


    .epk-contact-image-content h3 {
        font-size: 34px;
    }


    .epk-contact-floating-card {
        top: 20px;
        right: 20px;
    }


    .epk-contact-form-wrap {
        padding: 35px 24px 30px;
    }


    .epk-form-grid {
        grid-template-columns: 1fr;

        gap: 16px;
    }


    .epk-form-full {
        grid-column: auto;
    }


    .epk-contact-info-grid {
        grid-template-columns: 1fr;

        gap: 13px;
    }


    .epk-contact-info-card {
        min-height: 125px;
    }


    .epk-map-header {
        align-items: flex-start;

        flex-direction: column;

        padding: 20px;
    }


    .epk-map-header a {
        width: 100%;

        justify-content: center;
    }


    .epk-map-frame {
        height: 330px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .epk-contact-section {
        padding: 55px 12px;
    }


    .epk-contact-eyebrow {
        padding: 7px 12px;

        font-size: 9px;

        letter-spacing: 1.2px;
    }


    .epk-contact-heading h2 {
        font-size: 31px;

        line-height: 1.15;
    }


    .epk-contact-heading p {
        font-size: 12px;
    }


    .epk-contact-visual,
    .epk-contact-image {
        min-height: 400px;
    }


    .epk-contact-floating-card {
        top: 15px;
        right: 15px;

        gap: 9px;

        padding: 9px 12px;
    }


    .epk-contact-floating-icon {
        width: 34px;
        height: 34px;

        flex-basis: 34px;

        font-size: 13px;
    }


    .epk-contact-floating-card strong {
        font-size: 10px;
    }


    .epk-contact-floating-card span {
        font-size: 8px;
    }


    .epk-contact-image-content {
        left: 20px;
        right: 20px;
        bottom: 23px;
    }


    .epk-contact-image-content h3 {
        font-size: 29px;
    }


    .epk-contact-image-content p {
        font-size: 11px;
    }


    .epk-contact-form-wrap {
        padding: 30px 17px 25px;
    }


    .epk-contact-form-header h3 {
        font-size: 23px;
    }


    .epk-contact-form-header p {
        font-size: 11px;
    }


    .epk-input-wrap input,
    .epk-input-wrap select {
        height: 48px;

        font-size: 11px;
    }


    .epk-textarea-wrap textarea {
        font-size: 11px;
    }


    .epk-contact-submit {
        min-height: 50px;

        font-size: 11px;
    }


    .epk-contact-info-card {
        padding: 18px 16px;
    }


    .epk-info-icon {
        width: 39px;
        height: 39px;

        flex-basis: 39px;
    }


    .epk-info-content h4 {
        font-size: 12px;
    }


    .epk-info-content p {
        font-size: 10px;
    }


    .epk-map-header h3 {
        font-size: 16px;
    }


    .epk-map-frame {
        height: 280px;
    }

}


/* =========================================================
   ACCESSIBILITY / REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .epk-contact-image img,
    .epk-contact-info-card,
    .epk-contact-submit,
    .epk-contact-submit::before,
    .epk-contact-submit i,
    .epk-info-arrow {
        transition: none;
    }

}


/* =========================================================
   EPK - WHAT HAPPENS NEXT SECTION
   Unique Classes | Blue / White / Dark Blue
========================================================= */

.epk-nextstep-section {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    background:
        radial-gradient(circle at 10% 10%, rgba(13, 110, 253, 0.10), transparent 30%),
        radial-gradient(circle at 90% 90%, rgba(13, 110, 253, 0.08), transparent 30%),
        #f5f9ff;
    overflow: hidden;
}


/* Decorative Background */
.epk-nextstep-section::before {
    content: "";
    position: absolute;
    width: 380px;
    height: 380px;
    top: -180px;
    right: -150px;
    background: rgba(13, 110, 253, 0.07);
    border-radius: 50%;
    pointer-events: none;
}

.epk-nextstep-section::after {
    content: "";
    position: absolute;
    width: 280px;
    height: 280px;
    bottom: -150px;
    left: -120px;
    background: rgba(11, 43, 74, 0.05);
    border-radius: 50%;
    pointer-events: none;
}


/* Main Container */
.epk-nextstep-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1250px;
    margin: 0 auto;
}


/* =========================================================
   HEADING
========================================================= */

.epk-nextstep-heading {
    max-width: 850px;
    margin: 0 auto 65px;
    text-align: center;
}

.epk-nextstep-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 17px;
    margin-bottom: 20px;
    border-radius: 50px;
    background: rgba(13, 110, 253, 0.10);
    color: #0D6EFD;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.epk-nextstep-badge i {
    font-size: 13px;
}


.epk-nextstep-heading h2 {
    margin: 0 0 20px;
    color: #0B2B4A;
    font-size: clamp(34px, 4vw, 52px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -1px;
}

.epk-nextstep-heading h2 span {
    color: #0D6EFD;
}


.epk-nextstep-heading p {
    max-width: 760px;
    margin: 0 auto;
    color: #5c6b7a;
    font-size: 17px;
    line-height: 1.8;
}


/* =========================================================
   PROCESS GRID
========================================================= */

.epk-nextstep-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}


/* Connecting Line */
.epk-nextstep-grid::before {
    content: "";
    position: absolute;
    top: 58px;
    left: 11%;
    right: 11%;
    height: 2px;
    background: linear-gradient(
        90deg,
        rgba(13, 110, 253, 0.15),
        #0D6EFD,
        rgba(13, 110, 253, 0.15)
    );
    z-index: 0;
}


/* =========================================================
   CARDS
========================================================= */

.epk-nextstep-card {
    position: relative;
    z-index: 1;
    min-height: 340px;
    padding: 35px 28px 32px;
    background: #ffffff;
    border: 1px solid rgba(13, 110, 253, 0.10);
    border-radius: 22px;
    box-shadow: 0 15px 45px rgba(11, 43, 74, 0.08);
    text-align: center;
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


.epk-nextstep-card:hover {
    transform: translateY(-10px);
    border-color: rgba(13, 110, 253, 0.30);
    box-shadow: 0 25px 60px rgba(11, 43, 74, 0.14);
}


/* =========================================================
   NUMBER / ICON
========================================================= */

.epk-nextstep-number {
    position: relative;
    width: 88px;
    height: 88px;
    margin: 0 auto 28px;
    border-radius: 50%;
    background: #0B2B4A;
    border: 7px solid #ffffff;
    outline: 2px solid rgba(13, 110, 253, 0.20);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    box-shadow: 0 10px 30px rgba(11, 43, 74, 0.18);
    transition: all 0.35s ease;
}


.epk-nextstep-card:hover .epk-nextstep-number {
    background: #0D6EFD;
    transform: scale(1.08);
}


.epk-nextstep-number span {
    position: absolute;
    top: -13px;
    right: -13px;
    width: 31px;
    height: 31px;
    border-radius: 50%;
    background: #0D6EFD;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 800;
    border: 3px solid #ffffff;
}


.epk-nextstep-number i {
    font-size: 27px;
}


/* =========================================================
   CARD CONTENT
========================================================= */

.epk-nextstep-card-content {
    padding-top: 2px;
}


.epk-nextstep-small-title {
    display: block;
    margin-bottom: 9px;
    color: #0D6EFD;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}


.epk-nextstep-card h3 {
    margin: 0 0 14px;
    color: #0B2B4A;
    font-size: 23px;
    line-height: 1.3;
    font-weight: 750;
}


.epk-nextstep-card p {
    margin: 0;
    color: #647484;
    font-size: 14.5px;
    line-height: 1.75;
}


/* =========================================================
   CTA
========================================================= */

.epk-nextstep-cta {
    display: flex;
    align-items: center;
    gap: 22px;
    margin-top: 55px;
    padding: 25px 28px;
    background: #0B2B4A;
    border-radius: 20px;
    box-shadow: 0 18px 45px rgba(11, 43, 74, 0.18);
}


.epk-nextstep-cta-icon {
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 15px;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
}


.epk-nextstep-cta-content {
    flex: 1;
}


.epk-nextstep-cta-content span {
    display: block;
    margin-bottom: 5px;
    color: #72adff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}


.epk-nextstep-cta-content h3 {
    margin: 0;
    color: #ffffff;
    font-size: 22px;
    font-weight: 700;
}


.epk-nextstep-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 52px;
    padding: 0 24px;
    border-radius: 12px;
    background: #0D6EFD;
    color: #ffffff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
    transition: all 0.3s ease;
}


.epk-nextstep-cta-button:hover {
    background: #ffffff;
    color: #0B2B4A;
    transform: translateX(4px);
}


.epk-nextstep-cta-button i {
    transition: transform 0.3s ease;
}


.epk-nextstep-cta-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .epk-nextstep-section {
        padding: 80px 20px;
    }

    .epk-nextstep-heading {
        margin-bottom: 50px;
    }

    .epk-nextstep-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .epk-nextstep-grid::before {
        display: none;
    }

    .epk-nextstep-card {
        min-height: 320px;
    }

    .epk-nextstep-cta {
        margin-top: 45px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epk-nextstep-section {
        padding: 65px 16px;
    }

    .epk-nextstep-heading {
        margin-bottom: 38px;
    }

    .epk-nextstep-badge {
        font-size: 11px;
        padding: 8px 14px;
        letter-spacing: 1px;
    }

    .epk-nextstep-heading h2 {
        font-size: 34px;
        letter-spacing: -0.5px;
    }

    .epk-nextstep-heading p {
        font-size: 15px;
        line-height: 1.7;
    }

    .epk-nextstep-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .epk-nextstep-card {
        min-height: auto;
        padding: 30px 24px;
        border-radius: 18px;
    }

    .epk-nextstep-number {
        width: 78px;
        height: 78px;
        margin-bottom: 23px;
    }

    .epk-nextstep-number i {
        font-size: 24px;
    }

    .epk-nextstep-card h3 {
        font-size: 21px;
    }

    .epk-nextstep-card p {
        font-size: 14px;
    }

    .epk-nextstep-cta {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        padding: 28px 22px;
        gap: 17px;
        border-radius: 18px;
    }

    .epk-nextstep-cta-icon {
        margin: 0 auto;
    }

    .epk-nextstep-cta-content h3 {
        font-size: 20px;
        line-height: 1.4;
    }

    .epk-nextstep-cta-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .epk-nextstep-section {
        padding: 55px 13px;
    }

    .epk-nextstep-heading h2 {
        font-size: 29px;
    }

    .epk-nextstep-card {
        padding: 27px 20px;
    }

    .epk-nextstep-number {
        width: 72px;
        height: 72px;
    }

    .epk-nextstep-number span {
        width: 28px;
        height: 28px;
        font-size: 9px;
    }

    .epk-nextstep-card h3 {
        font-size: 20px;
    }

}



/* =========================================================
   EPK MODERN BLOG SECTION
   Color Scheme: Blue / White / Dark Blue
========================================================= */

.epk-modern-blog {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    background:
        radial-gradient(circle at 10% 10%, rgba(13, 110, 253, 0.08), transparent 30%),
        radial-gradient(circle at 90% 90%, rgba(11, 43, 74, 0.07), transparent 30%),
        #f7faff;
    overflow: hidden;
}

.epk-blog-container {
    width: 100%;
    max-width: 1250px;
    margin: 0 auto;
}


/* =========================
   HEADING
========================= */

.epk-blog-heading {
    max-width: 850px;
    margin: 0 auto 60px;
    text-align: center;
}

.epk-blog-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 17px;
    margin-bottom: 18px;
    border-radius: 50px;
    background: rgba(13, 110, 253, 0.09);
    border: 1px solid rgba(13, 110, 253, 0.15);
    color: #0d6efd;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.epk-blog-eyebrow i {
    font-size: 13px;
}

.epk-blog-heading h2 {
    margin: 0 0 18px;
    color: #0b2b4a;
    font-size: clamp(32px, 4vw, 52px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1px;
}

.epk-blog-heading h2 span {
    display: block;
    color: #0d6efd;
}

.epk-blog-heading p {
    max-width: 760px;
    margin: 0 auto;
    color: #5e6c7b;
    font-size: 16px;
    line-height: 1.8;
}


/* =========================
   BLOG GRID
========================= */

.epk-blog-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}


/* =========================
   BLOG CARD
========================= */

.epk-blog-card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid rgba(11, 43, 74, 0.08);
    border-radius: 22px;
    box-shadow: 0 12px 35px rgba(11, 43, 74, 0.07);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.epk-blog-card:hover {
    transform: translateY(-9px);
    border-color: rgba(13, 110, 253, 0.22);
    box-shadow: 0 22px 55px rgba(11, 43, 74, 0.14);
}


/* =========================
   IMAGE
========================= */

.epk-blog-image {
    position: relative;
    height: 245px;
    overflow: hidden;
    background: #dfeeff;
}

.epk-blog-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.epk-blog-card:hover .epk-blog-image img {
    transform: scale(1.08);
}


/* Image overlay */

.epk-blog-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(11, 43, 74, 0.42),
        transparent 55%
    );
    pointer-events: none;
}


/* Category */

.epk-blog-category {
    position: absolute;
    left: 18px;
    bottom: 17px;
    z-index: 2;
    padding: 8px 14px;
    border-radius: 50px;
    background: #0d6efd;
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.3px;
    box-shadow: 0 7px 20px rgba(13, 110, 253, 0.3);
}


/* =========================
   CONTENT
========================= */

.epk-blog-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 25px;
}

.epk-blog-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 15px;
    color: #718096;
    font-size: 12px;
}

.epk-blog-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.epk-blog-meta i {
    color: #0d6efd;
}


.epk-blog-body h3 {
    margin: 0 0 13px;
    color: #0b2b4a;
    font-size: 21px;
    line-height: 1.4;
    font-weight: 750;
    transition: color 0.3s ease;
}

.epk-blog-card:hover .epk-blog-body h3 {
    color: #0d6efd;
}

.epk-blog-body p {
    margin: 0 0 22px;
    color: #667586;
    font-size: 14px;
    line-height: 1.75;
}


/* Read Article */

.epk-blog-read {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: auto;
    color: #0d6efd;
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
}

.epk-blog-read i {
    transition: transform 0.3s ease;
}

.epk-blog-read:hover {
    color: #0b2b4a;
}

.epk-blog-read:hover i {
    transform: translateX(5px);
}

/* =========================
   TABLET
========================= */

@media (max-width: 1100px) {

    .epk-blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .epk-blog-image {
        height: 235px;
    }

}


/* =========================
   MOBILE
========================= */

@media (max-width: 700px) {

    .epk-modern-blog {
        padding: 70px 15px;
    }

    .epk-blog-heading {
        margin-bottom: 40px;
    }

    .epk-blog-heading h2 {
        font-size: 34px;
    }

    .epk-blog-heading h2 span {
        display: inline;
    }

    .epk-blog-heading p {
        font-size: 14px;
        line-height: 1.7;
    }

    .epk-blog-grid {
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .epk-blog-image {
        height: 225px;
    }

    .epk-blog-body {
        padding: 22px;
    }

    .epk-blog-body h3 {
        font-size: 20px;
    }

    .epk-blog-cta {
        align-items: flex-start;
        flex-direction: column;
        margin-top: 45px;
        padding: 30px 24px;
    }

    .epk-blog-cta h3 {
        font-size: 25px;
    }

    .epk-blog-cta-btn {
        width: 100%;
        justify-content: center;
    }

}


/* =========================
   SMALL MOBILE
========================= */

@media (max-width: 420px) {

    .epk-blog-eyebrow {
        font-size: 11px;
        padding: 8px 13px;
    }

    .epk-blog-heading h2 {
        font-size: 29px;
    }

    .epk-blog-image {
        height: 205px;
    }

    .epk-blog-meta {
        align-items: flex-start;
        flex-direction: column;
    }

    .epk-blog-cta h3 {
        font-size: 22px;
    }

}



/* ==========================================
   EPK LEADERSHIP / FOUNDER SECTION
   Blue • White • Dark Blue
   Modern • Responsive • User Friendly
========================================== */

.epk-founder-section {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 10% 10%,
            rgba(13, 110, 253, 0.10),
            transparent 32%
        ),
        radial-gradient(
            circle at 90% 85%,
            rgba(13, 110, 253, 0.08),
            transparent 30%
        ),
        #f6f9fd;
}


/* Decorative Background */

.epk-founder-section::before {
    content: "";
    position: absolute;

    width: 420px;
    height: 420px;

    top: -220px;
    right: -180px;

    border-radius: 50%;

    border: 1px solid rgba(13, 110, 253, 0.10);

    pointer-events: none;
}

.epk-founder-section::after {
    content: "";
    position: absolute;

    width: 300px;
    height: 300px;

    bottom: -180px;
    left: -130px;

    border-radius: 50%;

    background: rgba(13, 110, 253, 0.045);

    pointer-events: none;
}


/* ==========================================
   CONTAINER
========================================== */

.epk-founder-container {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}


/* ==========================================
   HEADING
========================================== */

.epk-founder-heading {
    max-width: 760px;
    margin: 0 auto 55px;
    text-align: center;
}

.epk-founder-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 9px 17px;

    border-radius: 50px;

    color: #0d6efd;
    background: rgba(13, 110, 253, 0.08);

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 1.4px;
}

.epk-founder-eyebrow i {
    font-size: 13px;
}


.epk-founder-heading h2 {
    margin: 18px 0 16px;

    color: #0b2b4a;

    font-size: clamp(36px, 4vw, 52px);
    line-height: 1.12;
    font-weight: 800;

    letter-spacing: -1.3px;
}

.epk-founder-heading h2 span {
    color: #0d6efd;
}


.epk-founder-heading p {
    margin: 0 auto;

    max-width: 680px;

    color: #617083;

    font-size: 16px;
    line-height: 1.8;
}


/* ==========================================
   FOUNDER CARD
========================================== */

.epk-founder-card {
    display: grid;
    grid-template-columns: 43% 57%;

    background: #ffffff;

    border: 1px solid #e7edf5;
    border-radius: 28px;

    overflow: hidden;

    box-shadow:
        0 25px 70px rgba(11, 43, 74, 0.11);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}

.epk-founder-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 32px 80px rgba(11, 43, 74, 0.15);
}


/* ==========================================
   IMAGE
========================================== */

.epk-founder-image-wrap {
    min-height: 560px;
    background: #0b2b4a;
}


.epk-founder-image {
    position: relative;

    width: 100%;
    height: 100%;
    min-height: 560px;

    overflow: hidden;
}


.epk-founder-image img {
    width: 100%;
    height: 100%;

    min-height: 560px;

    display: block;

    object-fit: cover;
    object-position: center;

    transition: transform 0.6s ease;
}


.epk-founder-card:hover .epk-founder-image img {
    transform: scale(1.04);
}


/* Image Overlay */

.epk-founder-image-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            180deg,
            rgba(7, 32, 61, 0.05) 35%,
            rgba(7, 32, 61, 0.78) 100%
        );

    pointer-events: none;
}


/* ==========================================
   EXPERIENCE BADGE
========================================== */

.epk-founder-experience {
    position: absolute;

    left: 25px;
    bottom: 25px;

    display: flex;
    align-items: center;
    gap: 13px;

    padding: 13px 18px;

    background: rgba(7, 32, 61, 0.88);

    border: 1px solid rgba(255, 255, 255, 0.18);

    border-radius: 14px;

    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);

    color: #ffffff;
}

.epk-founder-experience strong {
    color: #4da3ff;

    font-size: 27px;
    line-height: 1;

    font-weight: 800;
}

.epk-founder-experience span {
    color: rgba(255, 255, 255, 0.82);

    font-size: 11px;
    line-height: 1.4;

    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.6px;
}


/* ==========================================
   CONTENT
========================================== */

.epk-founder-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 58px 58px;
}


.epk-founder-role {
    display: inline-block;

    margin-bottom: 10px;

    color: #0d6efd;

    font-size: 13px;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 1px;
}


.epk-founder-content h3 {
    margin: 0;

    color: #0b2b4a;

    font-size: clamp(36px, 4vw, 48px);
    line-height: 1.1;

    font-weight: 800;

    letter-spacing: -1px;
}


.epk-founder-line {
    width: 58px;
    height: 4px;

    margin: 20px 0 22px;

    border-radius: 10px;

    background: #0d6efd;
}


.epk-founder-bio {
    margin: 0 0 15px;

    color: #5f6d7c;

    font-size: 15px;
    line-height: 1.85;
}


/* ==========================================
   HIGHLIGHTS
========================================== */

.epk-founder-highlights {
    display: grid;
    grid-template-columns: repeat(2, 1fr);

    gap: 14px;

    margin-top: 18px;
}


.epk-founder-highlight {
    display: flex;
    align-items: center;
    gap: 12px;

    padding: 14px;

    background: #f5f8fc;

    border: 1px solid #e8eef6;

    border-radius: 13px;
}


.epk-founder-highlight-icon {
    width: 42px;
    height: 42px;

    flex: 0 0 42px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    color: #ffffff;
    background: #0b2b4a;

    font-size: 15px;
}


.epk-founder-highlight div:last-child {
    display: flex;
    flex-direction: column;
    gap: 3px;
}


.epk-founder-highlight strong {
    color: #0b2b4a;

    font-size: 15px;
    font-weight: 800;
}


.epk-founder-highlight span {
    color: #7a8795;

    font-size: 10px;
    font-weight: 700;

    text-transform: uppercase;
    letter-spacing: 0.4px;
}


/* ==========================================
   BOTTOM
========================================== */

.epk-founder-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 20px;

    margin-top: 30px;
}


/* CTA Button */

.epk-founder-button {
    min-height: 51px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 10px;

    padding: 0 22px;

    border-radius: 9px;

    color: #ffffff;
    background: #0d6efd;

    text-decoration: none;

    font-size: 13px;
    font-weight: 800;

    box-shadow: 0 10px 22px rgba(13, 110, 253, 0.20);

    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}

.epk-founder-button:hover {
    color: #ffffff;

    background: #095dcc;

    transform: translateY(-2px);

    box-shadow: 0 14px 28px rgba(13, 110, 253, 0.28);
}

.epk-founder-button i {
    transition: transform 0.3s ease;
}

.epk-founder-button:hover i {
    transform: translateX(4px);
}


/* ==========================================
   SOCIAL LINKS
========================================== */

.epk-founder-social {
    display: flex;
    align-items: center;
    gap: 8px;
}


.epk-founder-social a {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    color: #0b2b4a;
    background: #f2f6fb;

    border: 1px solid #e2eaf3;

    text-decoration: none;

    font-size: 14px;

    transition:
        color 0.3s ease,
        background 0.3s ease,
        transform 0.3s ease;
}

.epk-founder-social a:hover {
    color: #ffffff;
    background: #0d6efd;

    transform: translateY(-3px);
}


/* ==========================================
   TABLET
========================================== */

@media (max-width: 991px) {

    .epk-founder-section {
        padding: 80px 20px;
    }

    .epk-founder-card {
        grid-template-columns: 1fr;
    }

    .epk-founder-image-wrap,
    .epk-founder-image {
        min-height: 500px;
    }

    .epk-founder-image img {
        min-height: 500px;
    }

    .epk-founder-content {
        padding: 45px 40px;
    }

}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 767px) {

    .epk-founder-section {
        padding: 65px 15px;
    }

    .epk-founder-heading {
        margin-bottom: 35px;
    }

    .epk-founder-eyebrow {
        font-size: 10px;
        letter-spacing: 1px;
        padding: 8px 13px;
    }

    .epk-founder-heading h2 {
        font-size: 35px;
        letter-spacing: -0.8px;
    }

    .epk-founder-heading p {
        font-size: 14px;
        line-height: 1.7;
    }


    .epk-founder-card {
        border-radius: 20px;
    }


    .epk-founder-image-wrap,
    .epk-founder-image {
        min-height: 430px;
    }

    .epk-founder-image img {
        min-height: 430px;
    }


    .epk-founder-experience {
        left: 16px;
        bottom: 16px;

        padding: 11px 14px;
    }

    .epk-founder-experience strong {
        font-size: 23px;
    }

    .epk-founder-experience span {
        font-size: 9px;
    }


    .epk-founder-content {
        padding: 35px 22px;
    }

    .epk-founder-role {
        font-size: 10px;
    }

    .epk-founder-content h3 {
        font-size: 34px;
    }

    .epk-founder-bio {
        font-size: 14px;
        line-height: 1.75;
    }


    .epk-founder-highlights {
        grid-template-columns: 1fr;
        gap: 10px;
    }


    .epk-founder-bottom {
        flex-direction: column;
        align-items: stretch;

        margin-top: 24px;
    }

    .epk-founder-button {
        width: 100%;
    }


    .epk-founder-social {
        justify-content: center;
        padding-top: 4px;
    }

}


/* ==========================================
   SMALL MOBILE
========================================== */

@media (max-width: 420px) {

    .epk-founder-section {
        padding-left: 12px;
        padding-right: 12px;
    }

    .epk-founder-heading h2 {
        font-size: 31px;
    }

    .epk-founder-image-wrap,
    .epk-founder-image {
        min-height: 390px;
    }

    .epk-founder-image img {
        min-height: 390px;
    }

    .epk-founder-content {
        padding: 30px 18px;
    }

}



/* =========================================================
   EPK - MODERN OUR TEAM MEMBERS SECTION
   Color Scheme: Blue / White / Dark Blue
========================================================= */

.epk-team-members-section {
    position: relative;
    padding: 100px 20px;
    background:
        radial-gradient(circle at 10% 10%, rgba(13, 110, 253, 0.08), transparent 30%),
        radial-gradient(circle at 90% 90%, rgba(11, 43, 74, 0.08), transparent 30%),
        #f6f9fd;
    overflow: hidden;
}

.epk-team-members-section::before {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    top: -160px;
    right: -120px;
    background: rgba(13, 110, 253, 0.07);
    border-radius: 50%;
    pointer-events: none;
}

.epk-team-members-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}


/* =========================
   SECTION HEADING
========================= */

.epk-team-members-heading {
    max-width: 820px;
    margin: 0 auto 60px;
    text-align: center;
}

.epk-team-members-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 17px;
    margin-bottom: 18px;
    border-radius: 50px;
    background: rgba(13, 110, 253, 0.09);
    color: #0d6efd;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.epk-team-members-eyebrow i {
    font-size: 13px;
}

.epk-team-members-heading h2 {
    margin: 0 0 18px;
    color: #0b2b4a;
    font-size: clamp(34px, 4vw, 54px);
    line-height: 1.12;
    font-weight: 800;
    letter-spacing: -1.5px;
}

.epk-team-members-heading h2 span {
    color: #0d6efd;
}

.epk-team-members-heading p {
    margin: 0 auto;
    max-width: 760px;
    color: #5f6f80;
    font-size: 16px;
    line-height: 1.8;
}


/* =========================
   TEAM GRID
========================= */

.epk-team-members-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 26px;
}


/* =========================
   TEAM CARD
========================= */

.epk-team-member-card {
    position: relative;
    background: #ffffff;
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(11, 43, 74, 0.08);
    box-shadow: 0 12px 35px rgba(11, 43, 74, 0.08);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.epk-team-member-card:hover {
    transform: translateY(-10px);
    border-color: rgba(13, 110, 253, 0.25);
    box-shadow: 0 22px 55px rgba(11, 43, 74, 0.15);
}


/* =========================
   IMAGE
========================= */

.epk-team-member-image {
    position: relative;
    height: 310px;
    overflow: hidden;
    background: #0b2b4a;
}

.epk-team-member-image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform 0.55s ease;
}

.epk-team-member-card:hover .epk-team-member-image img {
    transform: scale(1.07);
}


/* =========================
   IMAGE OVERLAY
========================= */

.epk-team-member-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 25px;
    background: linear-gradient(
        to top,
        rgba(5, 28, 51, 0.82),
        rgba(5, 28, 51, 0.05) 60%
    );
    opacity: 0;
    transition: opacity 0.35s ease;
}

.epk-team-member-card:hover .epk-team-member-overlay {
    opacity: 1;
}


/* =========================
   SOCIAL ICONS
========================= */

.epk-team-socials {
    display: flex;
    align-items: center;
    gap: 9px;
}

.epk-team-socials a {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ffffff;
    color: #0b2b4a;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.25s ease;
}

.epk-team-socials a:hover {
    background: #0d6efd;
    color: #ffffff;
    transform: translateY(-3px);
}


/* =========================
   NUMBER
========================= */

.epk-team-member-number {
    position: absolute;
    top: 16px;
    right: 16px;
    min-width: 43px;
    height: 43px;
    padding: 0 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    background: rgba(255, 255, 255, 0.95);
    color: #0b2b4a;
    font-size: 12px;
    font-weight: 800;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.12);
}


/* =========================
   CARD CONTENT
========================= */

.epk-team-member-info {
    padding: 25px 23px 27px;
}

.epk-team-member-info h3 {
    margin: 0 0 7px;
    color: #0b2b4a;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 800;
}

.epk-team-member-role {
    display: inline-block;
    margin-bottom: 13px;
    color: #0d6efd;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.2px;
}

.epk-team-member-info p {
    margin: 0 0 20px;
    color: #687789;
    font-size: 14px;
    line-height: 1.7;
}


/* =========================
   VIEW PROFILE
========================= */

.epk-team-profile-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    color: #0b2b4a;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    transition: all 0.25s ease;
}

.epk-team-profile-btn i {
    color: #0d6efd;
    font-size: 12px;
    transition: transform 0.25s ease;
}

.epk-team-profile-btn:hover {
    color: #0d6efd;
}

.epk-team-profile-btn:hover i {
    transform: translateX(5px);
}


/* =========================
   BOTTOM CTA
========================= */

.epk-team-members-cta {
    margin-top: 60px;
    padding: 30px 34px;
    display: flex;
    align-items: center;
    gap: 24px;
    border-radius: 22px;
    background:
        linear-gradient(
            135deg,
            #0b2b4a 0%,
            #0d4778 55%,
            #0d6efd 100%
        );
    box-shadow: 0 20px 50px rgba(11, 43, 74, 0.18);
    overflow: hidden;
    position: relative;
}

.epk-team-members-cta::after {
    content: "";
    position: absolute;
    width: 240px;
    height: 240px;
    right: -70px;
    top: -120px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.15);
    pointer-events: none;
}

.epk-team-cta-icon {
    flex: 0 0 62px;
    width: 62px;
    height: 62px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    font-size: 24px;
}

.epk-team-cta-content {
    flex: 1;
    position: relative;
    z-index: 2;
}

.epk-team-cta-content span {
    display: block;
    margin-bottom: 5px;
    color: #9ed0ff;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.5px;
}

.epk-team-cta-content h3 {
    margin: 0 0 5px;
    color: #ffffff;
    font-size: 23px;
    font-weight: 800;
}

.epk-team-cta-content p {
    margin: 0;
    color: rgba(255, 255, 255, 0.78);
    font-size: 14px;
    line-height: 1.6;
}

.epk-team-cta-button {
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 21px;
    border-radius: 12px;
    background: #ffffff;
    color: #0b2b4a;
    text-decoration: none;
    font-size: 13px;
    font-weight: 800;
    transition: all 0.3s ease;
}

.epk-team-cta-button i {
    color: #0d6efd;
    transition: transform 0.25s ease;
}

.epk-team-cta-button:hover {
    color: #0d6efd;
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
}

.epk-team-cta-button:hover i {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-team-members-section {
        padding: 80px 20px;
    }

    .epk-team-members-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }

    .epk-team-member-image {
        height: 330px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epk-team-members-section {
        padding: 65px 16px;
    }

    .epk-team-members-heading {
        margin-bottom: 40px;
    }

    .epk-team-members-eyebrow {
        font-size: 10px;
        padding: 8px 13px;
        letter-spacing: 1.2px;
    }

    .epk-team-members-heading h2 {
        font-size: 34px;
        line-height: 1.18;
        letter-spacing: -0.8px;
    }

    .epk-team-members-heading p {
        font-size: 14px;
        line-height: 1.7;
    }

    .epk-team-members-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        max-width: 500px;
        margin: 0 auto;
    }

    .epk-team-member-image {
        height: 360px;
    }

    .epk-team-member-overlay {
        opacity: 1;
        padding-bottom: 20px;
        background: linear-gradient(
            to top,
            rgba(5, 28, 51, 0.75),
            rgba(5, 28, 51, 0.02) 55%
        );
    }

    .epk-team-member-info {
        padding: 23px 21px 25px;
    }

    .epk-team-members-cta {
        margin-top: 40px;
        padding: 26px 22px;
        flex-direction: column;
        align-items: flex-start;
        gap: 17px;
        text-align: left;
    }

    .epk-team-cta-icon {
        width: 55px;
        height: 55px;
        flex-basis: 55px;
        border-radius: 15px;
    }

    .epk-team-cta-content h3 {
        font-size: 21px;
    }

    .epk-team-cta-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .epk-team-members-section {
        padding: 55px 13px;
    }

    .epk-team-members-heading h2 {
        font-size: 29px;
    }

    .epk-team-member-image {
        height: 320px;
    }

    .epk-team-member-info h3 {
        font-size: 20px;
    }

    .epk-team-member-info p {
        font-size: 13px;
    }

    .epk-team-members-cta {
        border-radius: 18px;
    }

}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.epk-team-profile-btn:focus-visible,
.epk-team-socials a:focus-visible,
.epk-team-cta-button:focus-visible {
    outline: 3px solid rgba(13, 110, 253, 0.35);
    outline-offset: 3px;
}


/* =========================================================
   EVENT PLANNER KARACHI
   MODERN SERVICES SECTION
   Stable + Equal Height + Fully Responsive
   ========================================================= */

.service {
    position: relative;
    background: #f5f9ff !important;
    overflow: hidden;
}

/* ---------- Section Container ---------- */

.service > .container {
    position: relative;
    z-index: 2;
}

/* ---------- Heading ---------- */

.service > .container > .text-center {
    max-width: 850px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.service > .container > .text-center h4 {
    color: #0d6efd !important;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.8px;
    margin-bottom: 12px;
}

.service > .container > .text-center h1 {
    color: #092b5f;
    font-size: 44px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 18px;
}

.service > .container > .text-center p {
    color: #667085;
    font-size: 16px;
    line-height: 1.8;
}


/* =========================================================
   SERVICE GRID
   IMPORTANT: Equal & Stable Cards
   ========================================================= */

#serviceContainer {
    display: grid !important;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 28px !important;

    align-items: stretch !important;
}


/* Remove Bootstrap column width behavior */

#serviceContainer > .service-item-box {
    width: 100% !important;
    max-width: none !important;

    padding: 0 !important;
    margin: 0 !important;

    display: block !important;
}


/* More Services button should occupy full row */

#serviceContainer > .col-12 {
    grid-column: 1 / -1;
    width: 100% !important;
    padding: 0 !important;
}


/* =========================================================
   SERVICE CARD
   ========================================================= */

#serviceContainer .service-item {
    width: 100% !important;

    height: 100% !important;
    min-height: 515px !important;
    max-height: 515px !important;

    display: flex !important;
    flex-direction: column !important;

    background: #ffffff !important;

    border: 1px solid #e6edf7 !important;
    border-radius: 22px !important;

    overflow: hidden !important;

    box-shadow:
        0 8px 25px rgba(9, 43, 95, 0.07) !important;

    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        border-color 0.3s ease !important;
}


/* Card hover */

#serviceContainer .service-item:hover {
    transform: translateY(-8px);

    border-color: rgba(13, 110, 253, 0.25) !important;

    box-shadow:
        0 18px 45px rgba(9, 43, 95, 0.14) !important;
}


/* =========================================================
   IMAGE AREA
   ========================================================= */

#serviceContainer .service-img {
    position: relative !important;

    width: 100% !important;

    height: 220px !important;
    min-height: 220px !important;
    max-height: 220px !important;

    flex-shrink: 0 !important;

    overflow: hidden !important;

    background: #eaf2ff;
}


/* Image */

#serviceContainer .service-img img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    min-height: 220px !important;
    max-height: 220px !important;

    object-fit: cover !important;

    object-position: center !important;

    border-radius: 0 !important;

    transition: transform 0.5s ease !important;
}


/* Image zoom */

#serviceContainer .service-item:hover .service-img img {
    transform: scale(1.06);
}


/* Dark image overlay */

#serviceContainer .service-img::after {
    content: "";

    position: absolute;

    left: 0;
    right: 0;
    bottom: 0;
    top: 0;

    background:
        linear-gradient(
            180deg,
            rgba(4, 25, 55, 0.02) 30%,
            rgba(4, 25, 55, 0.30) 100%
        );

    pointer-events: none;

    z-index: 1;
}


/* =========================================================
   SERVICE ICON
   ========================================================= */

#serviceContainer .service-icon {
    position: absolute !important;

    left: 20px !important;
    bottom: 18px !important;

    width: 58px !important;
    height: 58px !important;

    padding: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #ffffff !important;

    border-radius: 16px !important;

    border: 3px solid rgba(255,255,255,0.85) !important;

    box-shadow:
        0 7px 22px rgba(0, 0, 0, 0.18) !important;

    z-index: 5;

    transition: all 0.3s ease !important;
}


#serviceContainer .service-icon i {
    color: #0d6efd !important;

    font-size: 22px !important;

    line-height: 1 !important;
}


/* Icon hover */

#serviceContainer .service-item:hover .service-icon {
    background: #0d6efd !important;

    transform: translateY(-4px);
}

#serviceContainer .service-item:hover .service-icon i {
    color: #ffffff !important;
}


/* =========================================================
   CONTENT
   ========================================================= */

#serviceContainer .service-content {
    width: 100% !important;

    flex: 1 1 auto !important;

    display: flex !important;

    padding: 25px 23px 23px !important;

    background: #ffffff !important;
}


/* Inner */

#serviceContainer .service-content-inner {
    width: 100% !important;

    height: 100% !important;

    display: flex !important;

    flex-direction: column !important;
}


/* =========================================================
   TITLE
   ========================================================= */

#serviceContainer .service-content-inner > a.h4 {
    display: block !important;

    min-height: 58px !important;
    max-height: 58px !important;

    margin: 0 0 12px 0 !important;

    color: #092b5f !important;

    font-size: 20px !important;
    font-weight: 750 !important;

    line-height: 1.4 !important;

    text-decoration: none !important;

    overflow: hidden !important;

    transition: color 0.25s ease !important;
}


#serviceContainer .service-content-inner > a.h4:hover {
    color: #0d6efd !important;
}


/* =========================================================
   DESCRIPTION
   ========================================================= */

#serviceContainer .service-desc {
    display: -webkit-box !important;

    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;

    overflow: hidden !important;

    min-height: 75px !important;
    max-height: 75px !important;

    margin: 0 0 18px 0 !important;

    color: #667085 !important;

    font-size: 14px !important;

    line-height: 1.75 !important;
}


/* =========================================================
   READ MORE BUTTON
   ========================================================= */

#serviceContainer .read-more-btn {
    width: fit-content !important;

    min-width: 125px !important;

    min-height: 43px !important;

    margin-top: auto !important;

    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    padding: 9px 20px !important;

    background: #0d6efd !important;

    border: 2px solid #0d6efd !important;

    color: #ffffff !important;

    font-size: 14px !important;
    font-weight: 700 !important;

    border-radius: 50px !important;

    text-decoration: none !important;

    transition: all 0.3s ease !important;
}


#serviceContainer .read-more-btn:hover {
    background: #092b5f !important;

    border-color: #092b5f !important;

    transform: translateY(-2px);
}


/* =========================================================
   MORE SERVICES
   ========================================================= */

#serviceContainer #moreServicesBtn {
    min-width: 190px !important;

    min-height: 52px !important;

    padding: 12px 28px !important;

    background: #092b5f !important;

    border: 2px solid #092b5f !important;

    color: #ffffff !important;

    font-size: 15px !important;

    font-weight: 700 !important;

    border-radius: 50px !important;

    box-shadow:
        0 8px 22px rgba(9, 43, 95, 0.18);

    transition: all 0.3s ease !important;
}


#serviceContainer #moreServicesBtn:hover {
    background: #0d6efd !important;

    border-color: #0d6efd !important;

    transform: translateY(-3px);

    box-shadow:
        0 12px 28px rgba(13, 110, 253, 0.23);
}


/* =========================================================
   LARGE TABLET
   ========================================================= */

@media (max-width: 1199px) {

    #serviceContainer {
        grid-template-columns: repeat(3, minmax(0, 1fr));

        gap: 24px !important;
    }

    #serviceContainer .service-item {
        min-height: 510px !important;
        max-height: 510px !important;
    }

    #serviceContainer .service-img {
        height: 215px !important;
        min-height: 215px !important;
        max-height: 215px !important;
    }

    #serviceContainer .service-img img {
        min-height: 215px !important;
        max-height: 215px !important;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 991px) {

    #serviceContainer {
        grid-template-columns: repeat(2, minmax(0, 1fr));

        gap: 24px !important;
    }

    .service > .container > .text-center h1 {
        font-size: 38px;
    }

    #serviceContainer .service-item {
        min-height: 505px !important;
        max-height: 505px !important;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    .service {
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }

    .service > .container > .text-center {
        padding-left: 10px;
        padding-right: 10px;
    }

    .service > .container > .text-center h4 {
        font-size: 14px;
    }

    .service > .container > .text-center h1 {
        font-size: 31px;
        line-height: 1.25;
    }

    .service > .container > .text-center p {
        font-size: 14px;
        line-height: 1.7;
    }

    #serviceContainer {
        grid-template-columns: 1fr;

        gap: 22px !important;
    }

    #serviceContainer .service-item-box {
        width: 100% !important;
    }

    #serviceContainer .service-item {
        min-height: 495px !important;
        max-height: none !important;

        height: auto !important;
    }

    #serviceContainer .service-img {
        height: 230px !important;
        min-height: 230px !important;
        max-height: 230px !important;
    }

    #serviceContainer .service-img img {
        height: 230px !important;
        min-height: 230px !important;
        max-height: 230px !important;
    }

    #serviceContainer .service-content {
        min-height: 265px !important;

        padding: 24px 20px !important;
    }

    #serviceContainer .service-content-inner > a.h4 {
        min-height: auto !important;
        max-height: none !important;

        font-size: 20px !important;
    }

    #serviceContainer .service-desc {
        min-height: auto !important;
        max-height: none !important;

        -webkit-line-clamp: 4 !important;

        font-size: 14px !important;
    }

    #serviceContainer .read-more-btn {
        width: 100% !important;
    }

    #serviceContainer #moreServicesBtn {
        width: 100% !important;
        max-width: 300px !important;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .service > .container > .text-center h1 {
        font-size: 27px;
    }

    #serviceContainer {
        gap: 18px !important;
    }

    #serviceContainer .service-item {
        border-radius: 18px !important;
    }

    #serviceContainer .service-img {
        height: 215px !important;
        min-height: 215px !important;
        max-height: 215px !important;
    }

    #serviceContainer .service-img img {
        height: 215px !important;
        min-height: 215px !important;
        max-height: 215px !important;
    }

    #serviceContainer .service-icon {
        width: 54px !important;
        height: 54px !important;

        left: 16px !important;
        bottom: 16px !important;
    }

    #serviceContainer .service-content {
        padding: 22px 18px !important;
    }

    #serviceContainer .service-content-inner > a.h4 {
        font-size: 19px !important;
    }

}


/* =========================================================
   EXTRA SMALL
   ========================================================= */

@media (max-width: 360px) {

    .service > .container > .text-center h1 {
        font-size: 25px;
    }

    #serviceContainer .service-img {
        height: 200px !important;
        min-height: 200px !important;
        max-height: 200px !important;
    }

    #serviceContainer .service-img img {
        height: 200px !important;
        min-height: 200px !important;
        max-height: 200px !important;
    }

}



/* =========================================================
   EVENT PLANNER KARACHI
   WORK PROCESS SECTION
   UNIQUE PREFIX: epk-wprocess-
========================================================= */

.epk-wprocess-section {
    position: relative;
    width: 100%;
    padding: 105px 20px;
    overflow: hidden;
    background: #ffffff;
    isolation: isolate;
}

.epk-wprocess-container {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto;
}

.epk-wprocess-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: 75px;
    align-items: center;
}


/* =========================================================
   LEFT SIDE
========================================================= */

.epk-wprocess-left {
    position: relative;
    min-width: 0;
}

.epk-wprocess-label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    color: #c95472;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 3px;
    line-height: 1.4;
    text-transform: uppercase;
}

.epk-wprocess-label-line {
    display: inline-block;
    width: 38px;
    height: 3px;
    border-radius: 20px;
    background: #c95472;
}

.epk-wprocess-title {
    max-width: 650px;
    margin: 0 0 23px;
    color: #172554;
    font-size: clamp(38px, 4vw, 61px);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.8px;
}

.epk-wprocess-title span {
    color: #c95472;
}

.epk-wprocess-description {
    max-width: 650px;
    margin: 0;
    color: #5f6470;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.8;
}


/* =========================================================
   IMAGE / VISUAL
========================================================= */

.epk-wprocess-visual {
    position: relative;
    width: calc(100% - 35px);
    margin: 45px 0 10px 35px;
    padding: 0;
}

.epk-wprocess-image-bg {
    position: absolute;
    z-index: -1;
    left: -35px;
    bottom: -28px;
    width: 88%;
    height: 72%;
    border-radius: 30px;
    background: #c95472;
}

.epk-wprocess-image-wrap {
    position: relative;
    z-index: 2;
    width: 100%;
    height: 390px;
    overflow: hidden;
    border: 7px solid #172554;
    border-radius: 32px;
    background: #172554;
    box-shadow: 0 22px 50px rgba(23, 37, 84, 0.18);
}

.epk-wprocess-main-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.7s ease;
}

.epk-wprocess-image-wrap:hover .epk-wprocess-main-image {
    transform: scale(1.06);
}

.epk-wprocess-image-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(23, 37, 84, 0.02) 30%,
        rgba(23, 37, 84, 0.48) 100%
    );
    pointer-events: none;
}


/* =========================================================
   PLAY BUTTON
========================================================= */

.epk-wprocess-play {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 86px;
    height: 86px;
    border: 2px solid rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.13);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-decoration: none;
    transform: translate(-50%, -50%);
    transition:
        transform 0.3s ease,
        background 0.3s ease,
        box-shadow 0.3s ease;
}

.epk-wprocess-play:hover {
    background: #c95472;
    box-shadow: 0 0 0 12px rgba(201, 84, 114, 0.15);
    transform: translate(-50%, -50%) scale(1.08);
}

.epk-wprocess-play-icon {
    margin-left: 4px;
    color: #ffffff;
    font-size: 22px;
}


/* =========================================================
   DECORATIVE SHAPES
========================================================= */

.epk-wprocess-decoration {
    position: absolute;
    display: block;
    border-radius: 50%;
    pointer-events: none;
}

.epk-wprocess-decoration-one {
    top: -24px;
    right: -20px;
    width: 48px;
    height: 48px;
    background: #172554;
}

.epk-wprocess-decoration-two {
    left: -55px;
    bottom: -10px;
    width: 30px;
    height: 30px;
    background: #c95472;
}


/* =========================================================
   RIGHT SIDE
========================================================= */

.epk-wprocess-right {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 18px;
}


/* =========================================================
   PROCESS CARD
========================================================= */

.epk-wprocess-step {
    position: relative;
    display: grid;
    grid-template-columns: 82px minmax(0, 1fr);
    align-items: center;
    gap: 20px;
    min-height: 138px;
    padding: 25px 32px;
    overflow: hidden;
    border: 1px solid rgba(23, 37, 84, 0.06);
    border-radius: 25px;
    background: #ffffff;
    box-shadow: 0 13px 35px rgba(23, 37, 84, 0.10);
    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        background 0.35s ease;
}

.epk-wprocess-step:hover {
    transform: translateX(-7px);
    box-shadow: 0 20px 45px rgba(23, 37, 84, 0.15);
}


/* =========================================================
   NUMBER
========================================================= */

.epk-wprocess-step-number {
    color: #c95472;
    font-size: 42px;
    font-weight: 900;
    line-height: 1;
    letter-spacing: -1px;
}


/* =========================================================
   CONTENT
========================================================= */

.epk-wprocess-step-content {
    min-width: 0;
}

.epk-wprocess-step-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 7px;
}

.epk-wprocess-step-heading h3 {
    margin: 0;
    color: #172554;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.3;
}

.epk-wprocess-step-content p {
    max-width: 600px;
    margin: 0;
    color: #666b77;
    font-size: 15px;
    line-height: 1.7;
}


/* =========================================================
   STEP ICON
========================================================= */

.epk-wprocess-step-icon {
    display: flex;
    flex: 0 0 35px;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    border-radius: 10px;
    color: #c95472;
    background: rgba(201, 84, 114, 0.10);
    font-size: 15px;
    transition: 0.3s ease;
}

.epk-wprocess-step:hover .epk-wprocess-step-icon {
    color: #ffffff;
    background: #c95472;
}


/* =========================================================
   ACTIVE STEP
========================================================= */

.epk-wprocess-step-active {
    border-color: #c95472;
    background: linear-gradient(
        135deg,
        #c95472 0%,
        #d15d7a 100%
    );
    box-shadow: 0 18px 42px rgba(201, 84, 114, 0.27);
}

.epk-wprocess-step-active:hover {
    transform: translateX(-7px);
}

.epk-wprocess-step-active .epk-wprocess-step-number,
.epk-wprocess-step-active .epk-wprocess-step-heading h3,
.epk-wprocess-step-active .epk-wprocess-step-content p {
    color: #ffffff;
}

.epk-wprocess-step-active .epk-wprocess-step-icon {
    color: #c95472;
    background: #ffffff;
}

.epk-wprocess-step-active:hover .epk-wprocess-step-icon {
    color: #c95472;
    background: #ffffff;
}


/* =========================================================
   DECORATIVE DOT
========================================================= */

.epk-wprocess-step-dot {
    position: absolute;
    top: -24px;
    right: -24px;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: rgba(201, 84, 114, 0.08);
}

.epk-wprocess-step-active .epk-wprocess-step-dot {
    background: rgba(255, 255, 255, 0.10);
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.epk-wprocess-cta {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 5px;
    padding: 18px 20px;
    border: 1px solid rgba(23, 37, 84, 0.08);
    border-radius: 20px;
    background: #f7f8fc;
}

.epk-wprocess-cta-icon {
    display: flex;
    flex: 0 0 46px;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 13px;
    color: #ffffff;
    background: #172554;
    font-size: 17px;
}

.epk-wprocess-cta-text {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
    gap: 2px;
}

.epk-wprocess-cta-text strong {
    color: #172554;
    font-size: 15px;
    font-weight: 800;
}

.epk-wprocess-cta-text span {
    color: #737783;
    font-size: 13px;
    line-height: 1.5;
}

.epk-wprocess-cta-button {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: 9px;
    padding: 12px 19px;
    border-radius: 10px;
    color: #ffffff;
    background: #c95472;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: 0.3s ease;
}

.epk-wprocess-cta-button:hover {
    color: #ffffff;
    background: #172554;
    transform: translateY(-2px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .epk-wprocess-section {
        padding: 85px 20px;
    }

    .epk-wprocess-layout {
        grid-template-columns: 1fr;
        gap: 65px;
    }

    .epk-wprocess-left {
        max-width: 850px;
        margin: 0 auto;
        width: 100%;
    }

    .epk-wprocess-right {
        max-width: 850px;
        margin: 0 auto;
        width: 100%;
    }

    .epk-wprocess-title {
        max-width: 800px;
    }

    .epk-wprocess-description {
        max-width: 800px;
    }

    .epk-wprocess-visual {
        margin-top: 40px;
    }
}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epk-wprocess-section {
        padding: 65px 16px;
    }

    .epk-wprocess-layout {
        gap: 48px;
    }

    .epk-wprocess-label {
        font-size: 11px;
        letter-spacing: 2.2px;
    }

    .epk-wprocess-label-line {
        width: 25px;
    }

    .epk-wprocess-title {
        margin-bottom: 18px;
        font-size: 38px;
        line-height: 1.1;
        letter-spacing: -1px;
    }

    .epk-wprocess-description {
        font-size: 15px;
        line-height: 1.75;
    }

    .epk-wprocess-visual {
        width: calc(100% - 15px);
        margin: 35px 0 10px 15px;
    }

    .epk-wprocess-image-wrap {
        height: 290px;
        border-width: 5px;
        border-radius: 24px;
    }

    .epk-wprocess-image-bg {
        left: -15px;
        bottom: -18px;
        height: 65%;
        border-radius: 22px;
    }

    .epk-wprocess-decoration-one {
        top: -18px;
        right: -12px;
        width: 34px;
        height: 34px;
    }

    .epk-wprocess-decoration-two {
        left: -25px;
        bottom: -5px;
        width: 22px;
        height: 22px;
    }

    .epk-wprocess-play {
        width: 65px;
        height: 65px;
    }

    .epk-wprocess-play-icon {
        font-size: 17px;
    }

    .epk-wprocess-right {
        gap: 14px;
    }

    .epk-wprocess-step {
        grid-template-columns: 52px minmax(0, 1fr);
        gap: 13px;
        min-height: auto;
        padding: 21px 18px;
        border-radius: 19px;
    }

    .epk-wprocess-step:hover,
    .epk-wprocess-step-active:hover {
        transform: translateY(-3px);
    }

    .epk-wprocess-step-number {
        font-size: 30px;
    }

    .epk-wprocess-step-heading {
        gap: 9px;
    }

    .epk-wprocess-step-heading h3 {
        font-size: 17px;
    }

    .epk-wprocess-step-content p {
        font-size: 13px;
        line-height: 1.65;
    }

    .epk-wprocess-step-icon {
        flex-basis: 31px;
        width: 31px;
        height: 31px;
        border-radius: 8px;
        font-size: 13px;
    }

    .epk-wprocess-step-dot {
        width: 50px;
        height: 50px;
        top: -18px;
        right: -18px;
    }

    .epk-wprocess-cta {
        align-items: flex-start;
        flex-wrap: wrap;
        padding: 17px;
    }

    .epk-wprocess-cta-text {
        flex: 1 1 calc(100% - 65px);
    }

    .epk-wprocess-cta-button {
        width: 100%;
        justify-content: center;
        margin-top: 3px;
    }
}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .epk-wprocess-section {
        padding: 55px 13px;
    }

    .epk-wprocess-title {
        font-size: 33px;
    }

    .epk-wprocess-image-wrap {
        height: 245px;
    }

    .epk-wprocess-step {
        grid-template-columns: 45px minmax(0, 1fr);
        padding: 18px 15px;
    }

    .epk-wprocess-step-number {
        font-size: 27px;
    }

    .epk-wprocess-step-heading {
        align-items: flex-start;
    }

    .epk-wprocess-step-heading h3 {
        font-size: 16px;
    }

    .epk-wprocess-step-content p {
        font-size: 12.5px;
    }
}


/* =========================================================
   ACCESSIBILITY / REDUCED MOTION
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .epk-wprocess-main-image,
    .epk-wprocess-step,
    .epk-wprocess-play,
    .epk-wprocess-step-icon,
    .epk-wprocess-cta-button {
        transition: none;
    }
}




/* =========================================================
   EVENT PLANNER KARACHI
   SERVICE INTRODUCTION SECTION
========================================================= */

.epk-intro-section {
    position: relative;
    width: 100%;
    padding: 110px 20px;
    overflow: hidden;
    background:
        radial-gradient(circle at 8% 20%, rgba(255, 72, 137, 0.10), transparent 28%),
        radial-gradient(circle at 95% 85%, rgba(28, 91, 180, 0.15), transparent 30%),
        #071d35;
}


/* Decorative Background Circle */
.epk-intro-section::before {
    content: "";
    position: absolute;
    width: 430px;
    height: 430px;
    border-radius: 50%;
    top: -260px;
    right: -130px;
    background: rgba(255, 255, 255, 0.035);
    pointer-events: none;
}


/* Bottom Glow */
.epk-intro-section::after {
    content: "";
    position: absolute;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    bottom: -220px;
    left: -120px;
    background: rgba(255, 74, 139, 0.06);
    pointer-events: none;
}


/* Main Container */
.epk-intro-container {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}


/* Main Grid */
.epk-intro-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: center;
}


/* =========================================================
   IMAGE AREA
========================================================= */

.epk-intro-visual {
    position: relative;
    min-height: 570px;
    padding: 15px 45px 35px 0;
}


.epk-intro-main-image {
    position: relative;
    width: 90%;
    height: 500px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.35);
}


.epk-intro-main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}


.epk-intro-main-image:hover img {
    transform: scale(1.06);
}


/* Image Dark Overlay */
.epk-intro-image-overlay {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(
            to top,
            rgba(5, 18, 34, 0.82),
            rgba(5, 18, 34, 0.05) 55%
        );
}


/* Image Label */
.epk-intro-image-label {
    position: absolute;
    left: 25px;
    bottom: 25px;
    color: #ffffff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.8px;
    display: flex;
    align-items: center;
    gap: 10px;
}


.epk-intro-label-dot {
    width: 8px;
    height: 8px;
    background: #ff4f8b;
    border-radius: 50%;
    box-shadow: 0 0 15px rgba(255, 79, 139, 0.8);
}


/* Small Floating Image */
.epk-intro-small-image {
    position: absolute;
    right: 0;
    bottom: 10px;
    width: 235px;
    height: 180px;
    padding: 7px;
    background: #071d35;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.45);
    z-index: 3;
}


.epk-intro-small-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 4px;
    display: block;
}


/* Experience Badge */
.epk-intro-experience {
    position: absolute;
    top: 35px;
    right: 5px;
    width: 125px;
    height: 125px;
    border-radius: 50%;
    background: #ff4f8b;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    box-shadow: 0 15px 35px rgba(255, 79, 139, 0.25);
    border: 7px solid #071d35;
    z-index: 4;
}


.epk-intro-experience strong {
    font-size: 28px;
    line-height: 1;
    font-weight: 800;
}


.epk-intro-experience span {
    margin-top: 7px;
    font-size: 10px;
    line-height: 1.35;
    font-weight: 600;
    letter-spacing: 0.5px;
}


/* =========================================================
   CONTENT AREA
========================================================= */

.epk-intro-content {
    position: relative;
}


.epk-intro-eyebrow {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #ff4f8b;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 2px;
    margin-bottom: 20px;
}


.epk-intro-eyebrow span {
    display: inline-block;
    width: 24px;
    height: 2px;
    background: #ff4f8b;
}


.epk-intro-content h2 {
    margin: 0 0 25px;
    color: #ffffff;
    font-size: clamp(38px, 4vw, 58px);
    line-height: 1.06;
    font-weight: 800;
    letter-spacing: -1.8px;
}


.epk-intro-content h2 strong {
    display: block;
    color: #ff4f8b;
    font-weight: 800;
}


/* Paragraphs */
.epk-intro-lead {
    color: #ffffff;
    font-size: 18px;
    line-height: 1.75;
    margin: 0 0 15px;
}


.epk-intro-lead strong {
    color: #ff4f8b;
}


.epk-intro-description {
    color: #aebdcd;
    font-size: 15px;
    line-height: 1.8;
    margin: 0;
}


/* =========================================================
   FEATURES
========================================================= */

.epk-intro-features {
    margin-top: 30px;
    display: grid;
    gap: 18px;
}


.epk-intro-feature {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    padding: 16px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.035);
    border-radius: 7px;
    transition: all 0.3s ease;
}


.epk-intro-feature:hover {
    transform: translateX(5px);
    border-color: rgba(255, 79, 139, 0.4);
    background: rgba(255, 79, 139, 0.055);
}


.epk-intro-feature-icon {
    flex: 0 0 46px;
    width: 46px;
    height: 46px;
    border-radius: 6px;
    background: rgba(255, 79, 139, 0.12);
    border: 1px solid rgba(255, 79, 139, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ff4f8b;
    font-size: 18px;
}


.epk-intro-feature h4 {
    margin: 0 0 5px;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
}


.epk-intro-feature p {
    margin: 0;
    color: #91a5b9;
    font-size: 13px;
    line-height: 1.6;
}


/* =========================================================
   BUTTONS
========================================================= */

.epk-intro-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
    margin-top: 32px;
}


.epk-intro-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 50px;
    padding: 0 23px;
    border-radius: 5px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    transition: all 0.3s ease;
}


.epk-intro-btn-primary {
    color: #ffffff;
    background: #ff4f8b;
    border: 1px solid #ff4f8b;
    box-shadow: 0 10px 25px rgba(255, 79, 139, 0.18);
}


.epk-intro-btn-primary:hover {
    color: #ffffff;
    background: #e83e78;
    border-color: #e83e78;
    transform: translateY(-3px);
}


.epk-intro-btn-secondary {
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.04);
}


.epk-intro-btn-secondary:hover {
    color: #ffffff;
    border-color: #ff4f8b;
    background: rgba(255, 79, 139, 0.08);
    transform: translateY(-3px);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .epk-intro-section {
        padding: 85px 20px;
    }

    .epk-intro-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .epk-intro-visual {
        max-width: 680px;
        width: 100%;
        margin: 0 auto;
    }

    .epk-intro-content {
        max-width: 700px;
        margin: 0 auto;
    }

    .epk-intro-content h2 {
        font-size: 48px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epk-intro-section {
        padding: 70px 16px;
    }

    .epk-intro-grid {
        gap: 45px;
    }

    .epk-intro-visual {
        min-height: 430px;
        padding: 10px 25px 35px 0;
    }

    .epk-intro-main-image {
        width: 92%;
        height: 390px;
    }

    .epk-intro-small-image {
        width: 165px;
        height: 125px;
        bottom: 0;
    }

    .epk-intro-experience {
        width: 100px;
        height: 100px;
        top: 15px;
        right: 0;
        border-width: 5px;
    }

    .epk-intro-experience strong {
        font-size: 23px;
    }

    .epk-intro-experience span {
        font-size: 8px;
    }

    .epk-intro-image-label {
        left: 18px;
        bottom: 18px;
        font-size: 9px;
        letter-spacing: 1.2px;
    }

    .epk-intro-eyebrow {
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .epk-intro-content h2 {
        font-size: 38px;
        letter-spacing: -1px;
        margin-bottom: 20px;
    }

    .epk-intro-lead {
        font-size: 16px;
        line-height: 1.7;
    }

    .epk-intro-description {
        font-size: 14px;
    }

    .epk-intro-feature {
        padding: 13px;
    }

    .epk-intro-feature-icon {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
        font-size: 15px;
    }

    .epk-intro-feature h4 {
        font-size: 14px;
    }

    .epk-intro-feature p {
        font-size: 12px;
    }

    .epk-intro-actions {
        flex-direction: column;
    }

    .epk-intro-btn {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .epk-intro-section {
        padding: 60px 14px;
    }

    .epk-intro-visual {
        min-height: 370px;
    }

    .epk-intro-main-image {
        height: 335px;
    }

    .epk-intro-small-image {
        width: 145px;
        height: 110px;
    }

    .epk-intro-experience {
        width: 88px;
        height: 88px;
    }

    .epk-intro-experience strong {
        font-size: 20px;
    }

    .epk-intro-content h2 {
        font-size: 33px;
    }

}



/* =========================================================
   EPKGX VIP GALLERY
   ALL CLASS NAMES ARE UNIQUE
   PREFIX: epkgx-
========================================================= */

.epkgx-gallery-section {
    position: relative;
    width: 100%;
    padding: 100px 20px;
    background:
        radial-gradient(
            circle at 8% 12%,
            rgba(18, 104, 179, 0.08),
            transparent 30%
        ),
        radial-gradient(
            circle at 92% 88%,
            rgba(7, 43, 82, 0.08),
            transparent 30%
        ),
        #ffffff;
    overflow: hidden;
}

.epkgx-gallery-container {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}


/* =========================================================
   HEADER
========================================================= */

.epkgx-gallery-header {
    max-width: 760px;
    margin: 0 auto 55px;
    text-align: center;
}

.epkgx-gallery-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-bottom: 17px;
    color: #1268b3;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.epkgx-gallery-label-line {
    width: 28px;
    height: 2px;
    border-radius: 20px;
    background: #1268b3;
}

.epkgx-gallery-label i {
    font-size: 15px;
}

.epkgx-gallery-header h2 {
    margin: 0 0 16px;
    color: #082d55;
    font-size: clamp(34px, 4vw, 50px);
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: -1px;
}

.epkgx-gallery-header h2 span {
    color: #1268b3;
}

.epkgx-gallery-header p {
    max-width: 680px;
    margin: 0 auto;
    color: #66778b;
    font-size: 16px;
    line-height: 1.8;
}


/* =========================================================
   GRID
========================================================= */

.epkgx-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 22px;
}


/* =========================================================
   CARD
========================================================= */

.epkgx-gallery-item {
    position: relative;
    width: 100%;
    height: 315px;
    overflow: hidden;
    border-radius: 20px;
    background: #e9f2fb;
    box-shadow:
        0 15px 35px rgba(8, 45, 85, 0.10),
        0 2px 5px rgba(8, 45, 85, 0.05);
    cursor: pointer;
    isolation: isolate;
}

.epkgx-gallery-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition:
        transform 0.7s cubic-bezier(.2,.7,.2,1),
        filter 0.5s ease;
}

.epkgx-gallery-item:hover img {
    transform: scale(1.09);
    filter: saturate(1.1);
}


/* =========================================================
   DARK SHADE
========================================================= */

.epkgx-gallery-shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(
            to top,
            rgba(4, 25, 49, 0.95) 0%,
            rgba(4, 25, 49, 0.72) 25%,
            rgba(4, 25, 49, 0.15) 62%,
            rgba(4, 25, 49, 0) 100%
        );
    opacity: 0;
    transition: opacity 0.4s ease;
}

.epkgx-gallery-item:hover .epkgx-gallery-shade {
    opacity: 1;
}


/* =========================================================
   CARD CONTENT
========================================================= */

.epkgx-gallery-content {
    position: absolute;
    z-index: 3;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    padding: 24px;
    transform: translateY(12px);
    opacity: 0;
    transition:
        transform 0.4s ease,
        opacity 0.4s ease;
}

.epkgx-gallery-item:hover .epkgx-gallery-content {
    transform: translateY(0);
    opacity: 1;
}

.epkgx-gallery-content small {
    display: block;
    margin-bottom: 6px;
    color: #72c3ff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.epkgx-gallery-content h3 {
    margin: 0;
    color: #ffffff;
    font-size: 18px;
    line-height: 1.3;
    font-weight: 700;
}


/* =========================================================
   OPEN BUTTON
========================================================= */

.epkgx-gallery-open {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    padding: 0;
    border: 1px solid rgba(255,255,255,0.35);
    border-radius: 50%;
    background: rgba(255,255,255,0.14);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #ffffff;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.epkg-gallery-open:hover {
    background: #ffffff;
    color: #1268b3;
    transform: scale(1.08) rotate(8deg);
}


/* =========================================================
   BOTTOM CTA
========================================================= */

.epkgx-gallery-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin-top: 35px;
    padding: 23px 27px;
    border: 1px solid #dceaf7;
    border-radius: 18px;
    background: #f5faff;
}

.epkgx-gallery-bottom div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.epkgx-gallery-bottom strong {
    color: #092f59;
    font-size: 17px;
    font-weight: 800;
}

.epkgx-gallery-bottom span {
    color: #718197;
    font-size: 13px;
}

.epkgx-gallery-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 13px 21px;
    border-radius: 10px;
    background: #0b4f8a;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    white-space: nowrap;
    box-shadow: 0 8px 20px rgba(11,79,138,0.20);
    transition: all 0.3s ease;
}

.epkgx-gallery-cta:hover {
    background: #082d55;
    color: #ffffff !important;
    transform: translateY(-2px);
}


/* =========================================================
   LIGHTBOX
========================================================= */

.epkgx-lightbox {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px 80px;
    background: rgba(3, 18, 37, 0.96);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 0.3s ease,
        visibility 0.3s ease;
}

.epkgx-lightbox.epkgx-lightbox-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.epkgx-lightbox-inner {
    width: min(100%, 1050px);
    text-align: center;
}

.epkgx-lightbox-inner img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 76vh;
    margin: 0 auto;
    border-radius: 14px;
    object-fit: contain;
    box-shadow: 0 30px 90px rgba(0,0,0,0.45);
}

.epkgx-lightbox-title {
    padding-top: 16px;
}

.epkgx-lightbox-title span {
    color: #70c2ff;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.epkgx-lightbox-title h3 {
    margin: 5px 0 0;
    color: #ffffff;
    font-size: 20px;
    font-weight: 700;
}


/* =========================================================
   LIGHTBOX BUTTONS
========================================================= */

.epkgx-lightbox-close,
.epkgx-lightbox-prev,
.epkgx-lightbox-next {
    position: absolute;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,0.22);
    border-radius: 50%;
    background: rgba(255,255,255,0.10);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    color: #ffffff;
    cursor: pointer;
    transition: all 0.3s ease;
}

.epkgx-lightbox-close {
    top: 25px;
    right: 25px;
    width: 48px;
    height: 48px;
}

.epkgx-lightbox-prev,
.epkgx-lightbox-next {
    top: 50%;
    width: 52px;
    height: 52px;
    transform: translateY(-50%);
}

.epkgx-lightbox-prev {
    left: 22px;
}

.epkgx-lightbox-next {
    right: 22px;
}

.epkgx-lightbox-close:hover,
.epkgx-lightbox-prev:hover,
.epkgx-lightbox-next:hover {
    background: #ffffff;
    color: #0b4f8a;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .epkgx-gallery-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .epkgx-gallery-item {
        height: 300px;
    }

}


/* =========================================================
   TABLET / MOBILE
========================================================= */

@media (max-width: 800px) {

    .epkgx-gallery-section {
        padding: 75px 18px 80px;
    }

    .epkgx-gallery-header {
        margin-bottom: 38px;
    }

    .epkgx-gallery-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }

    .epkgx-gallery-item {
        height: 270px;
        border-radius: 16px;
    }

    .epkgx-gallery-shade {
        opacity: 1;
    }

    .epkgx-gallery-content {
        opacity: 1;
        transform: translateY(0);
        padding: 17px;
    }

    .epkgx-gallery-content h3 {
        font-size: 15px;
    }

    .epkgx-gallery-open {
        width: 42px;
        height: 42px;
    }

    .epkgx-gallery-bottom {
        align-items: flex-start;
        flex-direction: column;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 520px) {

    .epkgx-gallery-section {
        padding: 60px 14px 65px;
    }

    .epkgx-gallery-header {
        margin-bottom: 30px;
    }

    .epkgx-gallery-header h2 {
        font-size: 32px;
        letter-spacing: -0.5px;
    }

    .epkgx-gallery-header p {
        font-size: 14px;
        line-height: 1.7;
    }

    .epkgx-gallery-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .epkgx-gallery-item {
        height: 285px;
        border-radius: 15px;
    }

    .epkgx-gallery-content {
        padding: 18px;
    }

    .epkgx-gallery-content h3 {
        font-size: 16px;
    }

    .epkgx-gallery-bottom {
        padding: 20px;
        margin-top: 25px;
    }

    .epkgx-gallery-cta {
        width: 100%;
        justify-content: center;
    }

    .epkgx-lightbox {
        padding: 20px 14px;
    }

    .epkgx-lightbox-inner img {
        max-height: 68vh;
        border-radius: 10px;
    }

    .epkgx-lightbox-close {
        top: 14px;
        right: 14px;
        width: 42px;
        height: 42px;
    }

    .epkgx-lightbox-prev,
    .epkgx-lightbox-next {
        top: auto;
        bottom: 20px;
        width: 44px;
        height: 44px;
        transform: none;
    }

    .epkgx-lightbox-prev {
        left: calc(50% - 54px);
    }

    .epkgx-lightbox-next {
        right: calc(50% - 54px);
    }

    .epkgx-lightbox-title {
        padding-bottom: 65px;
    }

    .epkgx-lightbox-title h3 {
        font-size: 17px;
    }

}




/* =========================================================
   EPKDS EVENT SERVICES
   Fully scoped CSS
   Prefix: epkds-
   ========================================================= */

.epkds-services-section {
    --epkds-navy: #0c1528;
    --epkds-navy-2: #111d32;
    --epkds-card: #18263c;

    --epkds-white: #ffffff;
    --epkds-text: #dce5f1;
    --epkds-muted: #91a2ba;

    --epkds-accent: #ff6979;
    --epkds-accent-soft: #ff9aa5;

    --epkds-border: rgba(255,255,255,.10);

    width: 100%;
    padding: 100px 20px;

    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 82% 8%,
            rgba(255,105,121,.10),
            transparent 28%
        ),
        radial-gradient(
            circle at 8% 90%,
            rgba(74,105,160,.08),
            transparent 25%
        ),
        var(--epkds-navy);

    color: var(--epkds-white);

    box-sizing: border-box;
}


/* Scope everything */
.epkds-services-section *,
.epkds-services-section *::before,
.epkds-services-section *::after {
    box-sizing: border-box;
}


/* Container */
.epkds-services-container {
    width: min(1180px, 100%);
    margin: 0 auto;
}


/* =========================================================
   HEADING
   ========================================================= */

.epkds-services-heading {
    display: grid;
    grid-template-columns:
        minmax(0, 1.15fr)
        minmax(300px, .85fr);

    gap: 70px;

    align-items: end;

    margin-bottom: 55px;
}


.epkds-heading-content {
    max-width: 720px;
}


.epkds-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-bottom: 18px;

    color: var(--epkds-accent);

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 2px;
    line-height: 1;
}


.epkds-eyebrow::before {
    content: "";

    width: 28px;
    height: 1px;

    background: var(--epkds-accent);
}


.epkds-services-heading h2 {
    margin: 0;

    color: var(--epkds-white);

    font-size: clamp(40px, 5vw, 64px);
    font-weight: 800;

    line-height: .98;
    letter-spacing: -2.5px;
}


.epkds-services-heading h2 span {
    display: block;

    color: var(--epkds-accent-soft);
}


.epkds-heading-description {
    max-width: 440px;
}


.epkds-heading-description p {
    margin: 0 0 25px;

    color: var(--epkds-muted);

    font-size: 14px;
    line-height: 1.8;
}


/* =========================================================
   OUTLINE BUTTON
   ========================================================= */

.epkds-outline-btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;

    padding: 12px 20px;

    color: #fff;

    background: transparent;

    border: 1px solid rgba(255,105,121,.65);
    border-radius: 50px;

    font-size: 12px;
    font-weight: 800;
    text-decoration: none;

    transition:
        background .3s ease,
        border-color .3s ease,
        transform .3s ease;
}


.epkds-outline-btn svg {
    width: 18px;
    height: 18px;

    transition: transform .3s ease;
}


.epkds-outline-btn:hover {
    color: #fff;

    background: var(--epkds-accent);
    border-color: var(--epkds-accent);

    transform: translateY(-2px);
}


.epkds-outline-btn:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   FEATURED SERVICE
   ========================================================= */

.epkds-featured-service {
    display: grid;

    grid-template-columns:
        minmax(0, 1.08fr)
        minmax(0, .92fr);

    min-height: 510px;

    margin-bottom: 55px;

    overflow: hidden;

    background: var(--epkds-navy-2);

    border: 1px solid var(--epkds-border);
    border-radius: 22px;

    box-shadow:
        0 25px 70px rgba(0,0,0,.20);
}


/* Image */
.epkds-featured-image-wrap {
    position: relative;

    min-height: 510px;

    overflow: hidden;
}


.epkds-featured-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .8s cubic-bezier(.2,.7,.2,1);
}


.epkds-featured-service:hover
.epkds-featured-image {
    transform: scale(1.045);
}


.epkds-featured-image-wrap::after {
    content: "";

    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(7,13,27,.02),
            rgba(7,13,27,.18)
        );

    pointer-events: none;
}


/* Badge */
.epkds-image-badge {
    position: absolute;
    z-index: 3;

    left: 24px;
    bottom: 24px;

    display: inline-flex;
    align-items: center;
    gap: 9px;

    padding: 9px 14px;

    color: #fff;

    background: rgba(10,18,34,.82);

    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50px;

    backdrop-filter: blur(10px);

    font-size: 10px;
    font-weight: 700;
    letter-spacing: .5px;
}


.epkds-badge-dot {
    width: 7px;
    height: 7px;

    flex: 0 0 auto;

    border-radius: 50%;

    background: var(--epkds-accent);

    box-shadow:
        0 0 0 4px rgba(255,105,121,.13);
}


/* Featured content */
.epkds-featured-content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: 55px;
}


.epkds-service-topline {
    display: flex;
    align-items: center;
    gap: 14px;

    margin-bottom: 24px;
}


.epkds-service-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    color: var(--epkds-accent-soft);

    border: 1px solid rgba(255,105,121,.35);
    border-radius: 50%;

    font-size: 11px;
    font-weight: 800;
}


.epkds-service-category {
    color: var(--epkds-muted);

    font-size: 9px;
    font-weight: 800;

    letter-spacing: 1.8px;
}


.epkds-featured-content h3 {
    margin: 0 0 20px;

    color: #fff;

    font-size: clamp(30px, 3.2vw, 43px);
    font-weight: 800;

    line-height: 1.05;
    letter-spacing: -1.5px;
}


.epkds-featured-content h3 span {
    display: block;

    color: var(--epkds-accent-soft);
}


.epkds-featured-text {
    max-width: 510px;

    margin: 0 0 25px;

    color: var(--epkds-muted);

    font-size: 13px;
    line-height: 1.8;
}


/* Points */
.epkds-feature-points {
    display: grid;
    gap: 11px;

    margin-bottom: 30px;
}


.epkds-feature-point {
    display: flex;
    align-items: center;
    gap: 11px;

    color: var(--epkds-text);

    font-size: 12px;
}


.epkds-check-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 23px;
    height: 23px;

    flex: 0 0 auto;

    color: var(--epkds-accent-soft);

    background: rgba(255,105,121,.09);

    border-radius: 50%;
}


.epkds-check-icon svg {
    width: 13px;
    height: 13px;
}


/* Featured button */
.epkds-service-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;

    width: fit-content;

    padding: 13px 20px;

    color: #fff;

    background: var(--epkds-accent);

    border: 1px solid var(--epkds-accent);
    border-radius: 50px;

    font-size: 11px;
    font-weight: 800;

    text-decoration: none;

    box-shadow:
        0 10px 30px rgba(255,105,121,.16);

    transition:
        transform .3s ease,
        background .3s ease,
        box-shadow .3s ease;
}


.epkds-service-btn svg {
    width: 18px;
    height: 18px;

    transition: transform .3s ease;
}


.epkds-service-btn:hover {
    color: #fff;

    background: #ff5266;

    transform: translateY(-2px);

    box-shadow:
        0 14px 35px rgba(255,105,121,.25);
}


.epkds-service-btn:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   SERVICE CARDS
   ========================================================= */

.epkds-services-grid {
    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 16px;
}


.epkds-service-card {
    position: relative;

    overflow: hidden;

    background: var(--epkds-card);

    border: 1px solid var(--epkds-border);
    border-radius: 17px;

    transition:
        transform .35s ease,
        border-color .35s ease,
        box-shadow .35s ease;
}


.epkds-service-card:hover {
    transform: translateY(-7px);

    border-color:
        rgba(255,105,121,.30);

    box-shadow:
        0 20px 45px rgba(0,0,0,.22);
}


/* Card image */
.epkds-card-image-wrap {
    position: relative;

    width: 100%;
    height: 205px;

    overflow: hidden;

    background: #111d32;
}


.epkds-card-image {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform .6s cubic-bezier(.2,.7,.2,1);
}


.epkds-service-card:hover
.epkds-card-image {
    transform: scale(1.07);
}


/* Number */
.epkds-card-number {
    position: absolute;
    z-index: 3;

    top: 14px;
    right: 14px;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 37px;
    height: 37px;

    color: #fff;

    background: rgba(10,18,34,.78);

    border: 1px solid rgba(255,255,255,.14);
    border-radius: 50%;

    backdrop-filter: blur(8px);

    font-size: 10px;
    font-weight: 800;
}


/* Card content */
.epkds-card-content {
    padding: 24px 22px 23px;
}


.epkds-card-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 43px;
    height: 43px;

    margin-bottom: 17px;

    color: var(--epkds-accent-soft);

    background:
        rgba(255,105,121,.09);

    border: 1px solid
        rgba(255,105,121,.13);

    border-radius: 11px;

    transition:
        color .3s ease,
        background .3s ease,
        transform .3s ease;
}


.epkds-card-icon svg {
    width: 21px;
    height: 21px;
}


.epkds-service-card:hover
.epkds-card-icon {
    color: #fff;

    background: var(--epkds-accent);

    transform: rotate(-4deg);
}


.epkds-card-label {
    display: block;

    margin-bottom: 8px;

    color: var(--epkds-accent-soft);

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1.5px;
}


.epkds-card-content h3 {
    margin: 0 0 11px;

    color: #fff;

    font-size: 19px;
    font-weight: 800;

    line-height: 1.2;
}


.epkds-card-content p {
    min-height: 70px;

    margin: 0 0 19px;

    color: var(--epkds-muted);

    font-size: 11.5px;
    line-height: 1.7;
}


/* Card link */
.epkds-card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    color: #fff;

    font-size: 10px;
    font-weight: 800;

    text-decoration: none;

    transition: color .25s ease;
}


.epkds-card-link svg {
    width: 16px;
    height: 16px;

    transition: transform .25s ease;
}


.epkds-card-link:hover {
    color: var(--epkds-accent-soft);
}


.epkds-card-link:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   CTA
   ========================================================= */

.epkds-services-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 30px;

    margin-top: 55px;
    padding: 28px 32px;

    background:
        linear-gradient(
            100deg,
            rgba(255,105,121,.13),
            rgba(255,105,121,.025)
        );

    border: 1px solid
        rgba(255,105,121,.17);

    border-radius: 17px;
}


.epkds-cta-small {
    display: block;

    margin-bottom: 8px;

    color: var(--epkds-accent-soft);

    font-size: 8px;
    font-weight: 800;

    letter-spacing: 1.6px;
}


.epkds-cta-content h3 {
    margin: 0 0 5px;

    color: #fff;

    font-size: 23px;
    font-weight: 800;
}


.epkds-cta-content p {
    margin: 0;

    color: var(--epkds-muted);

    font-size: 11px;
}


.epkds-cta-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 11px;

    flex: 0 0 auto;

    padding: 13px 20px;

    color: #fff;

    background: var(--epkds-accent);

    border-radius: 50px;

    font-size: 11px;
    font-weight: 800;

    text-decoration: none;

    transition:
        transform .3s ease,
        background .3s ease;
}


.epkds-cta-button svg {
    width: 17px;
    height: 17px;

    transition: transform .3s ease;
}


.epkds-cta-button:hover {
    color: #fff;

    background: #ff5266;

    transform: translateY(-2px);
}


.epkds-cta-button:hover svg {
    transform: translateX(4px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

    .epkds-services-section {
        padding: 80px 20px;
    }


    .epkds-services-heading {
        grid-template-columns: 1fr;

        gap: 25px;

        margin-bottom: 40px;
    }


    .epkds-heading-description {
        max-width: 650px;
    }


    .epkds-featured-service {
        grid-template-columns: 1fr;
    }


    .epkds-featured-image-wrap {
        min-height: 420px;
    }


    .epkds-featured-content {
        padding: 40px;
    }


    .epkds-services-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 640px) {

    .epkds-services-section {
        padding: 65px 15px;
    }


    .epkds-services-heading {
        gap: 20px;

        margin-bottom: 32px;
    }


    .epkds-eyebrow {
        margin-bottom: 15px;

        font-size: 9px;

        letter-spacing: 1.5px;
    }


    .epkds-services-heading h2 {
        font-size:
            clamp(34px, 11vw, 48px);

        letter-spacing: -1.8px;
    }


    .epkds-heading-description p {
        font-size: 13px;

        line-height: 1.7;
    }


    .epkds-featured-service {
        display: block;

        margin-bottom: 35px;

        border-radius: 17px;
    }


    .epkds-featured-image-wrap {
        min-height: 280px;

        height: 280px;
    }


    .epkds-image-badge {
        left: 15px;
        bottom: 15px;

        padding: 8px 12px;

        font-size: 9px;
    }


    .epkds-featured-content {
        padding: 28px 22px 30px;
    }


    .epkds-service-topline {
        margin-bottom: 19px;
    }


    .epkds-featured-content h3 {
        margin-bottom: 17px;

        font-size: 29px;

        letter-spacing: -1px;
    }


    .epkds-featured-text {
        font-size: 13px;

        line-height: 1.7;
    }


    .epkds-feature-points {
        gap: 10px;

        margin-bottom: 25px;
    }


    .epkds-feature-point {
        font-size: 12px;
    }


    .epkds-service-btn {
        width: 100%;
    }


    .epkds-services-grid {
        grid-template-columns: 1fr;

        gap: 15px;
    }


    .epkds-card-image-wrap {
        height: 220px;
    }


    .epkds-card-content {
        padding: 22px 20px 23px;
    }


    .epkds-card-content p {
        min-height: auto;

        margin-bottom: 18px;
    }


    .epkds-services-cta {
        align-items: flex-start;

        flex-direction: column;

        gap: 20px;

        margin-top: 35px;

        padding: 24px 20px;
    }


    .epkds-cta-button {
        width: 100%;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 390px) {

    .epkds-services-section {
        padding-left: 12px;
        padding-right: 12px;
    }


    .epkds-featured-image-wrap {
        height: 245px;

        min-height: 245px;
    }


    .epkds-featured-content {
        padding: 24px 18px 27px;
    }


    .epkds-featured-content h3 {
        font-size: 27px;
    }


    .epkds-card-image-wrap {
        height: 200px;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    .epkds-services-section *,
    .epkds-services-section *::before,
    .epkds-services-section *::after {
        transition: none !important;
        animation: none !important;
        scroll-behavior: auto !important;
    }

}



/* =========================================================
   EPK SERVICE DETAIL HERO
   Unique Prefix: epks-
========================================================= */

.epks-service-hero {
    position: relative;
    width: 100%;
    min-height: 430px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #082d55;
}


/* =========================================================
   BACKGROUND IMAGE
========================================================= */

.epks-service-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.epks-service-hero-bg img {
    width: 100%;
    height: 100%;
    min-height: 430px;
    display: block;
    object-fit: cover;
    object-position: center;
    transform: scale(1.02);
}


/* =========================================================
   OVERLAY
========================================================= */

.epks-service-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

    background:
        linear-gradient(
            90deg,
            rgba(4, 28, 56, 0.94) 0%,
            rgba(5, 42, 80, 0.84) 42%,
            rgba(8, 61, 106, 0.62) 72%,
            rgba(7, 45, 80, 0.48) 100%
        );
}


/* =========================================================
   DECORATIVE GLOW
========================================================= */

.epks-service-hero-glow {
    position: absolute;
    z-index: 2;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(5px);
}

.epks-service-hero-glow-one {
    width: 280px;
    height: 280px;
    top: -170px;
    right: 8%;
    background: rgba(83, 181, 255, 0.14);
}

.epks-service-hero-glow-two {
    width: 220px;
    height: 220px;
    bottom: -150px;
    left: 5%;
    background: rgba(42, 131, 205, 0.13);
}


/* =========================================================
   CONTAINER
========================================================= */

.epks-service-hero-container {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 25vh;
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 25px 80px;
}


/* =========================================================
   BREADCRUMB
========================================================= */

.epks-service-breadcrumb {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 9px;

    width: fit-content;
    max-width: 100%;
    margin: 0 auto 30px;

    padding: 9px 15px;

    border: 1px solid rgba(255,255,255,0.16);
    border-radius: 50px;

    background: rgba(255,255,255,0.08);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);

    font-size: 13px;
    margin-top: 14px;
}


.epks-service-breadcrumb a {
    display: inline-flex;
    align-items: center;
    gap: 6px;

    color: rgba(255,255,255,0.82);
    text-decoration: none;

    transition: color 0.25s ease;
}


.epks-service-breadcrumb a:hover {
    color: #ffffff;
}


.epks-service-breadcrumb a i {
    font-size: 11px;
}


.epks-service-breadcrumb-arrow {
    display: inline-flex;
    align-items: center;
    color: rgba(255,255,255,0.42);
    font-size: 8px;
}


.epks-service-breadcrumb-current {
    color: #7bc7ff;
    font-weight: 700;
}


/* =========================================================
   HERO CONTENT
========================================================= */

.epks-service-hero-content {
    max-width: 850px;
    margin: 0 auto;
    text-align: center;
}


.epks-service-hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    margin-bottom: 18px;
    padding: 8px 15px;

    border: 1px solid rgba(126,201,255,0.28);
    border-radius: 50px;

    background: rgba(20,104,176,0.25);

    color: #91d2ff;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;

    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}


.epks-service-hero-tag i {
    font-size: 12px;
}


.epks-service-hero-content h1 {
    margin: 0;

    color: #ffffff;

    font-size: clamp(36px, 5vw, 62px);
    line-height: 1.12;
    font-weight: 800;

    letter-spacing: -1px;

    text-shadow:
        0 4px 20px rgba(0,0,0,0.22);
}


.epks-service-hero-content p {
    max-width: 700px;

    margin: 20px auto 0;

    color: rgba(255,255,255,0.84);

    font-size: 16px;
    line-height: 1.8;
}


.epks-service-hero-line {
    width: 55px;
    height: 3px;

    margin: 25px auto 0;

    border-radius: 50px;

    background: #66bfff;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 991px) {

    .epks-service-hero {
        min-height: 400px;
    }

    .epks-service-hero-bg img {
        min-height: 400px;
    }

    .epks-service-hero-container {
        padding: 75px 22px 70px;
    }

    .epks-service-hero-content h1 {
        font-size: clamp(34px, 6vw, 52px);
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

    .epks-service-hero {
        min-height: 390px;
    }

    .epks-service-hero-bg img {
        min-height: 390px;
        object-position: center;
    }

    .epks-service-hero-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(4, 28, 56, 0.82) 0%,
                rgba(4, 34, 65, 0.88) 55%,
                rgba(4, 25, 49, 0.95) 100%
            );
    }

    .epks-service-hero-container {
        padding: 65px 15px 60px;
    }

    .epks-service-breadcrumb {
        gap: 7px;
        margin-bottom: 25px;
        padding: 8px 12px;
        font-size: 11px;
        text-align: center;
    }

    .epks-service-hero-tag {
        margin-bottom: 14px;
        padding: 7px 12px;
        font-size: 9px;
    }

    .epks-service-hero-content h1 {
        font-size: 34px;
        line-height: 1.18;
        letter-spacing: -0.5px;
    }

    .epks-service-hero-content p {
        margin-top: 15px;
        font-size: 14px;
        line-height: 1.7;
    }

    .epks-service-hero-line {
        margin-top: 20px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media (max-width: 420px) {

    .epks-service-hero {
        min-height: 370px;
    }

    .epks-service-hero-bg img {
        min-height: 370px;
    }

    .epks-service-hero-container {
        padding: 58px 12px 52px;
    }

    .epks-service-breadcrumb {
        max-width: 95%;
        line-height: 1.5;
    }

    .epks-service-hero-content h1 {
        font-size: 30px;
    }

    .epks-service-hero-content p {
        font-size: 13px;
    }

}